From c1f5d7fbd3ccae99fe89ea51ded0c7539db62f80 Mon Sep 17 00:00:00 2001
From: shikong <919411476@qq.com>
Date: Thu, 17 Oct 2024 03:43:13 +0800
Subject: [PATCH] =?UTF-8?q?=E6=95=B4=E5=90=88=20crypto-js=20=E5=8A=A0?=
 =?UTF-8?q?=E8=A7=A3=E5=AF=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                        |  1 +
 pnpm-lock.yaml                      |  8 +++++
 src/App.vue                         |  3 ++
 src/pages.json                      |  6 ++++
 src/pages/my-info/my-info.vue       |  4 +++
 src/pages/test-page/test-crypto.vue | 51 +++++++++++++++++++++++++++++
 6 files changed, 73 insertions(+)
 create mode 100644 src/pages/test-page/test-crypto.vue

diff --git a/package.json b/package.json
index d3f82c2..0b3a7f4 100644
--- a/package.json
+++ b/package.json
@@ -58,6 +58,7 @@
     "@dcloudio/uni-mp-xhs": "3.0.0-4020920240930001",
     "@dcloudio/uni-quickapp-webview": "3.0.0-4020920240930001",
     "@dcloudio/uni-ui": "^1.5.6",
+    "crypto-js": "^3.3.0",
     "destr": "^2.0.3",
     "moment": "^2.30.1",
     "pinia": "^2.2.4",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f428384..f0fc720 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -56,6 +56,9 @@ importers:
       '@dcloudio/uni-ui':
         specifier: ^1.5.6
         version: 1.5.6
+      crypto-js:
+        specifier: ^3.3.0
+        version: 3.3.0
       destr:
         specifier: ^2.0.3
         version: 2.0.3
@@ -2018,6 +2021,9 @@ packages:
     resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
     engines: {node: '>= 8'}
 
+  crypto-js@3.3.0:
+    resolution: {integrity: sha512-DIT51nX0dCfKltpRiXV+/TVZq+Qq2NgF4644+K7Ttnla7zEzqc+kjJyiB96BHNyUTBxyjzRcZYpUdZa+QAqi6Q==}
+
   css-font-size-keywords@1.0.0:
     resolution: {integrity: sha512-Q+svMDbMlelgCfH/RVDKtTDaf5021O486ZThQPIpahnIjUkMUslC+WuOQSWTgGSrNCH08Y7tYNEmmy0hkfMI8Q==}
 
@@ -6796,6 +6802,8 @@ snapshots:
       shebang-command: 2.0.0
       which: 2.0.2
 
+  crypto-js@3.3.0: {}
+
   css-font-size-keywords@1.0.0: {}
 
   css-font-stretch-keywords@1.0.1: {}
diff --git a/src/App.vue b/src/App.vue
index b4d944e..4e1a63a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -19,4 +19,7 @@ button {
   margin: 2px
 }
 
+page {
+  background-color: #F8F8F8;
+}
 </style>
diff --git a/src/pages.json b/src/pages.json
index 02bafe8..d473080 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -37,6 +37,12 @@
 			"style": {
 				"navigationBarTitleText": "摄像头测试"
 			}
+		},
+		{
+			"path": "pages/test-page/test-crypto",
+			"style": {
+				"navigationBarTitleText": "加密测试"
+			}
 		}
 	],
 	"globalStyle": {
diff --git a/src/pages/my-info/my-info.vue b/src/pages/my-info/my-info.vue
index 2401b77..28f4935 100644
--- a/src/pages/my-info/my-info.vue
+++ b/src/pages/my-info/my-info.vue
@@ -6,6 +6,10 @@
     <button type="warn" @click="toTestPage">进入测试页面</button>
     <button class="button" type="primary" @click="getLocation">获取位置</button>
 
+    <navigator url="/pages/test-page/test-crypto">
+      <button>加解密测试页面</button>
+    </navigator>
+
     <navigator url="/pages/test-page/test-camera">
       <button>打开相机测试页面</button>
     </navigator>
diff --git a/src/pages/test-page/test-crypto.vue b/src/pages/test-page/test-crypto.vue
new file mode 100644
index 0000000..7fafa5e
--- /dev/null
+++ b/src/pages/test-page/test-crypto.vue
@@ -0,0 +1,51 @@
+<script setup>
+import {reactive} from 'vue'
+import CryptoJS from 'crypto-js'
+
+const ctx = reactive({
+  content: "Message",
+  passphrase: "Secret Passphrase",
+  encrypted: "",
+})
+
+function encrypt(){
+  let encrypted = CryptoJS.AES.encrypt(ctx.content, ctx.passphrase).toString()
+  console.log(encrypted)
+  ctx.encrypted = encrypted
+  let decrypted = CryptoJS.AES.decrypt(ctx.encrypted, ctx.passphrase)
+  let originalText = decrypted.toString(CryptoJS.enc.Utf8)
+  console.log(originalText)
+}
+
+encrypt()
+</script>
+
+<template>
+  <view style="text-align: center;">
+    <text>Test Crypto</text>
+  </view>
+
+  <view>
+    <view class="uni-common-mt">
+      <view style="text-align: center;font-size: 48rpx">
+        AES加密
+      </view>
+      <view style="text-align: center;">
+        <text>密钥</text>
+        <uni-easyinput type="text" placeholder="请输入密钥" v-model="ctx.passphrase" @change="encrypt"/>
+      </view>
+      <view style="text-align: center;">
+        <text>明文</text>
+        <uni-easyinput type="textarea" autoHeight  placeholder="请输入内容" v-model="ctx.content" @change="encrypt"/>
+      </view>
+      <view style="text-align: center;">
+        <text>密文</text>
+        <uni-easyinput type="textarea" autoHeight  placeholder="请输入密文" v-model="ctx.encrypted"/>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+
+</style>