diff --git a/api/agent.js b/api/agent.js
index 4dc7ad7..0dee233 100644
--- a/api/agent.js
+++ b/api/agent.js
@@ -6,13 +6,13 @@ module.exports = agent => {
   // 你还可以通过 messenger 对象发送消息给 App Worker。
   // 但是，需要等 App Worker 启动成功后才能发送，否则可能丢失消息。
   agent.messenger.on('egg-ready', () => {
-    let params = {
-      subType: "add",
-      name: "admin",
-      password: md5("admin"),
-      email: "admin@admin.com",
-      allowRegist: true,
-    }
-    agent.messenger.sendToApp('createAdmin', params);
+    // let params = {
+    //   subType: "add",
+    //   name: "admin",
+    //   password: md5("admin"),
+    //   email: "admin@admin.com",
+    //   allowRegist: true,
+    // }
+    // agent.messenger.sendToApp('createAdmin', params);
   });
 };
\ No newline at end of file
diff --git a/api/app.js b/api/app.js
index 3fa0166..e821a51 100644
--- a/api/app.js
+++ b/api/app.js
@@ -32,15 +32,15 @@ class AppBootHook {
   }
 
   async serverDidReady() {
-    // http/https 服务器已启动，开始接收外部请求
-    // 此时可以从 app.server 获取 server 实例
-    const ctx = await this.app.createAnonymousContext();
-    this.app.messenger.on('createAdmin', async params => {
-      let res = await ctx.model.User.find({ name: params.name });
-      if (!res.length) {
-        await ctx.service.user.index(params)
-      }
-    });
+    // // http/https 服务器已启动，开始接收外部请求
+    // // 此时可以从 app.server 获取 server 实例
+    // const ctx = await this.app.createAnonymousContext();
+    // this.app.messenger.on('createAdmin', async params => {
+    //   let res = await ctx.model.User.find({ name: params.name });
+    //   if (!res.length) {
+    //     await ctx.service.user.index(params)
+    //   }
+    // });
   }
 }
 
diff --git a/api/app/controller/user.js b/api/app/controller/user.js
index 0d87ec6..2a86a4a 100644
--- a/api/app/controller/user.js
+++ b/api/app/controller/user.js
@@ -3,14 +3,20 @@ const { Controller } = require('egg');
 class UserController extends Controller {
   async index() {
     const { ctx } = this;
-    console.log(777,ctx.request.body)
+    // console.log(777,ctx.request.body)
     ctx.body = await ctx.service.user.index(ctx.request.body)
   }
   async download() {
     const { ctx } = this;
-    console.log(777,ctx.request.body)
+    // console.log(777,ctx.request.body)
     ctx.body = await ctx.service.user.downloadPng(ctx.request.body)
   }
+  async getPng() {
+    const { ctx } = this;
+    console.log(777, ctx.request.url)
+    let id=ctx.request.url.split('?')[1].split('=')[1]
+    ctx.body = await ctx.service.user.getPng(id)
+  }
 }
 
 module.exports = UserController;
diff --git a/api/app/router.js b/api/app/router.js
index 654b690..8ec3f70 100644
--- a/api/app/router.js
+++ b/api/app/router.js
@@ -5,4 +5,5 @@ module.exports = app => {
   const { router, controller } = app;
   router.post('/api/upload', controller.user.index);
   router.post('/api/download', controller.user.download);
+  router.get('/api/getPng', controller.user.getPng);
 };
diff --git a/api/app/service/user.js b/api/app/service/user.js
index 10420c5..93b2faa 100644
--- a/api/app/service/user.js
+++ b/api/app/service/user.js
@@ -2,73 +2,111 @@
 
 const Service = require('egg').Service;
 const _ = require("lodash")
-const tencentcloud = require('tencentcloud-sdk-nodejs');
-// 导入对应产品模块的client models。
-const CvmClient = tencentcloud.iotexplorer.v20190423.Client
-
+const tencentcloud = require("tencentcloud-sdk-nodejs-ft");
+const { mongoose } = require('../../config/plugin');
+const FtClient = tencentcloud.ft.v20200304.Client;
 class UserService extends Service {
   async index(params) {
     let { ctx } = this
     let modelLocal = ctx.model.User
     let returnData = { hasError: false, msg: "数据错误", list: [] }
-    console.log(77777, params)
-    // 新增
-    paramsLocal["update_at"] = Date.now();
+    // 请求照片
+    let reqCount = 9
+    let pngList = []
+    for (let i = 1; i < reqCount; i++) {
+      let para = {
+        img: params.img,
+        age: i * 10
+      }
+      let pngRes = await this.createPng(para)
+      if (pngRes.haserror) {
+        pngList.push({
+          age: i * 10,
+          png: "",
+          ResultUrl: "",
+          RequestId: "",
+        })
+      } else {
+        pngList.push({
+          age: i * 10,
+          png: `data:image/png;base64,${pngRes.ResultImage}`,
+          ResultUrl: pngRes.ResultUrl,
+          RequestId: pngRes.RequestId,
+        })
+      }
+
+    }
     let paramsLocal = {
       name: params.name,
       age: params.age,
+      createImgList: pngList,
       imgbase64: params.img,
     }
-    let pngRes = await this.createPng(params)
-    // let res = await modelLocal.create(paramsLocal)
+    let res = await modelLocal.create(paramsLocal)
     returnData.hasError = false
     returnData.msg = "数据新增成功"
     returnData.list = res
     return returnData
   }
   async createPng(params) {
-    let { ctx } = this
-    let modelLocal = ctx.model.User
-    let returnData = { hasError: false, msg: "数据错误", list: [] }
-    console.log(77777, params)
-    const client = new CvmClient({
-      // 为了保护密钥安全，建议将密钥设置在环境变量中或者配置文件中，请参考本文凭证管理章节。
-      // 硬编码密钥到代码中有可能随代码泄露而暴露，有安全隐患，并不推荐。
+    let clientConfig = {
       credential: {
-        secretId: "AKIDLgwLkIcpoZ6PZht382oUMCC6wdFhMwZ8",
-        secretKey: "TmvwtkcYWTJ5qkEg3FIB2sokccepOsCO",
+        secretId: "AKIDLgwLkIcpoZ6PZht382oUMCC6wdFhMwZ8",//客户端身份标识
+        secretKey: "TmvwtkcYWTJ5qkEg3FIB2sokccepOsCO",//客户端身份密钥
       },
-      // 产品地域
       region: "ap-chengdu",
-      // 可选配置实例
       profile: {
-        signMethod: "TC3-HMAC-SHA256", // 签名方法
         httpProfile: {
-          reqMethod: "POST", // 请求方法
-          reqTimeout: 30, // 请求超时时间，默认60s
+          endpoint: "ft.tencentcloudapi.com",
         },
       },
-    }
-    );
-    const params = {
-      // 这里填写接口所需的参数，例如：
-      ImageUrl: params.img, // 图片URL
-      Age: params.age, // 想要改变的年龄，比如50表示变老50岁
-      // 其他参数根据接口文档填充
     };
-
-    let res = client.ChangeFaceAge(params)
-    console.log(777, res)
-    return returnData
+    // 实例化要请求产品的client对象,clientProfile是可选的
+    let client = new FtClient(clientConfig);
+    let paramsLocal = {
+      AgeInfos: [
+        { Age: params.age },
+      ],
+      Image: params.img
+    }
+    let resPng = {}
+    try {
+      console.log(9999, paramsLocal.AgeInfos[0].Age)
+      resPng = await client.ChangeAgePic(paramsLocal);
+      if (resPng.ResultImage) {
+        return resPng
+      } else {
+        return {
+          ResultImage: "",
+          ResultUrl: "",
+          RequestId: "",
+          haserror: true
+        }
+      }
+    } catch (e) {
+      return {
+        ResultImage: "",
+        ResultUrl: "",
+        RequestId: "",
+        haserror: true
+      }
+    }
   }
   async downloadPng(params) {
     let { ctx } = this
     let modelLocal = ctx.model.User
     let returnData = { hasError: false, msg: "数据错误", list: [] }
-    console.log(77777, params)
     //查询后下载8张图片
     return returnData
   }
+  async getPng(id) {
+    let { ctx } = this
+    let modelLocal = ctx.model.User
+    let res = await modelLocal.find({ _id: id })
+    //查询后下载8张图片
+    return res
+  }
+
 }
 
 module.exports = UserService;
diff --git a/api/config/config.default.js b/api/config/config.default.js
index 984a425..80b595d 100644
--- a/api/config/config.default.js
+++ b/api/config/config.default.js
@@ -28,6 +28,15 @@ module.exports = appInfo => {
       ignore: '/',
     },
   };
+  config.cors = {
+    // 任何地址都可以访问
+    origin: "*",
+    // 指定地址才可以访问
+    // origin: 'http://localhost:8080',
+    allowMethods: 'GET,PUT,POST,DELETE',
+    // cookie跨域配置
+    credentials: true
+  };
   config.bodyParser = {
     formLimit: "100mb",
     jsonLimit: "100mb",
diff --git a/api/package.json b/api/package.json
index b7c248f..f6de042 100644
--- a/api/package.json
+++ b/api/package.json
@@ -12,7 +12,7 @@
     "egg-scripts": "2",
     "lodash": "^4.17.21",
     "md5": "^2.3.0",
-    "tencentcloud-sdk-nodejs": "^4.0.852"
+    "tencentcloud-sdk-nodejs-ft": "^4.0.810"
   },
   "devDependencies": {
     "egg-bin": "6",
diff --git a/front/package-lock.json b/front/package-lock.json
index c511252..fa40bba 100644
--- a/front/package-lock.json
+++ b/front/package-lock.json
@@ -17,7 +17,9 @@
         "element-plus": "^2.7.1",
         "lodash": "^4.17.21",
         "pinia": "^2.1.7",
-        "pinia-plugin-persist": "^1.0.0"
+        "pinia-plugin-persist": "^1.0.0",
+        "qrcode": "^1.5.3",
+        "qrcode-vue3": "^1.6.8"
       },
       "devDependencies": {
         "@rushstack/eslint-patch": "^1.2.0",
@@ -1137,6 +1139,7 @@
       "version": "0.0.9",
       "resolved": "https://registry.npmmirror.com/@jiaminghi/bezier-curve/-/bezier-curve-0.0.9.tgz",
       "integrity": "sha512-u9xJPOEl6Dri2E9FfmJoGxYQY7vYJkURNX04Vj64tdi535tPrpkuf9Sm0lNr3QTKdHQh0DdNRsaa62FLQNQEEw==",
+      "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.5.5"
       }
@@ -1145,6 +1148,7 @@
       "version": "0.4.3",
       "resolved": "https://registry.npmmirror.com/@jiaminghi/c-render/-/c-render-0.4.3.tgz",
       "integrity": "sha512-FJfzj5hGj7MLqqqI2D7vEzHKbQ1Ynnn7PJKgzsjXaZpJzTqs2Yw5OSeZnm6l7Qj7jyPAP53lFvEQNH4o4j6s+Q==",
+      "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.5.5",
         "@jiaminghi/bezier-curve": "*",
@@ -1156,24 +1160,23 @@
       "version": "0.2.18",
       "resolved": "https://registry.npmmirror.com/@jiaminghi/charts/-/charts-0.2.18.tgz",
       "integrity": "sha512-K+HXaOOeWG9OOY1VG6M4mBreeeIAPhb9X+khG651AbnwEwL6G2UtcAQ8GWCq6GzhczcLwwhIhuaHqRygwHC0sA==",
+      "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.5.5",
         "@jiaminghi/c-render": "^0.4.3"
       }
     },
     "node_modules/@jiaminghi/color": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmmirror.com/@jiaminghi/color/-/color-0.1.1.tgz",
-      "integrity": "sha512-M09+Sb5HGqVim0zo+nG5gU1v+6gXT8ptr0BZR6dMGt83XmCJgnZtO8s7llTW4hLFFFM5co6geZvTekqLpSPAAQ==",
-      "license": "MIT",
-      "dependencies": {
-        "@babel/runtime": "^7.5.5"
-      }
+      "version": "1.1.3",
+      "resolved": "https://registry.npmmirror.com/@jiaminghi/color/-/color-1.1.3.tgz",
+      "integrity": "sha512-ZY3hdorgODk4OSTbxyXBPxAxHPIVf9rPlKJyK1C1db46a50J0reFKpAvfZG8zMG3lvM60IR7Qawgcu4ZDO3+Hg==",
+      "license": "MIT"
     },
     "node_modules/@jiaminghi/transition": {
       "version": "1.1.11",
       "resolved": "https://registry.npmmirror.com/@jiaminghi/transition/-/transition-1.1.11.tgz",
       "integrity": "sha512-owBggipoHMikDHHDW5Gc7RZYlVuvxHADiU4bxfjBVkHDAmmck+fCkm46n2JzC3j33hWvP9nSCAeh37t6stgWeg==",
+      "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.5.5"
       }
@@ -1234,6 +1237,7 @@
       "version": "1.7.2",
       "resolved": "https://registry.npmmirror.com/@kjgl77/datav-vue3/-/datav-vue3-1.7.2.tgz",
       "integrity": "sha512-Fvllk4rJEdUwLdumvsnPADZNPMKkDdC7u/vJEAPBsMh6UgFQytIT+SVtjj1vy/TXtgcH/te9hlXBPgV8LVSmQw==",
+      "license": "MIT",
       "dependencies": {
         "@jiaminghi/c-render": "^0.4.3",
         "@jiaminghi/charts": "^0.2.18",
@@ -1241,62 +1245,6 @@
         "@vueuse/core": "^10.7.2"
       }
     },
-    "node_modules/@kjgl77/datav-vue3/node_modules/@jiaminghi/color": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmmirror.com/@jiaminghi/color/-/color-1.1.3.tgz",
-      "integrity": "sha512-ZY3hdorgODk4OSTbxyXBPxAxHPIVf9rPlKJyK1C1db46a50J0reFKpAvfZG8zMG3lvM60IR7Qawgcu4ZDO3+Hg=="
-    },
-    "node_modules/@kjgl77/datav-vue3/node_modules/@types/web-bluetooth": {
-      "version": "0.0.20",
-      "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
-      "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow=="
-    },
-    "node_modules/@kjgl77/datav-vue3/node_modules/@vueuse/core": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-10.9.0.tgz",
-      "integrity": "sha512-/1vjTol8SXnx6xewDEKfS0Ra//ncg4Hb0DaZiwKf7drgfMsKFExQ+FnnENcN6efPen+1kIzhLQoGSy0eDUVOMg==",
-      "dependencies": {
-        "@types/web-bluetooth": "^0.0.20",
-        "@vueuse/metadata": "10.9.0",
-        "@vueuse/shared": "10.9.0",
-        "vue-demi": ">=0.14.7"
-      }
-    },
-    "node_modules/@kjgl77/datav-vue3/node_modules/@vueuse/metadata": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-10.9.0.tgz",
-      "integrity": "sha512-iddNbg3yZM0X7qFY2sAotomgdHK7YJ6sKUvQqbvwnf7TmaVPxS4EJydcNsVejNdS8iWCtDk+fYXr7E32nyTnGA=="
-    },
-    "node_modules/@kjgl77/datav-vue3/node_modules/@vueuse/shared": {
-      "version": "10.9.0",
-      "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-10.9.0.tgz",
-      "integrity": "sha512-Uud2IWncmAfJvRaFYzv5OHDli+FbOzxiVEQdLCKQKLyhz94PIyFC3CHcH7EDMwIn8NPtD06+PNbC/PiO0LGLtw==",
-      "dependencies": {
-        "vue-demi": ">=0.14.7"
-      }
-    },
-    "node_modules/@kjgl77/datav-vue3/node_modules/vue-demi": {
-      "version": "0.14.7",
-      "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.7.tgz",
-      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
-      "hasInstallScript": true,
-      "bin": {
-        "vue-demi-fix": "bin/vue-demi-fix.js",
-        "vue-demi-switch": "bin/vue-demi-switch.js"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "peerDependencies": {
-        "@vue/composition-api": "^1.0.0-rc.1",
-        "vue": "^3.0.0-0 || ^2.6.0"
-      },
-      "peerDependenciesMeta": {
-        "@vue/composition-api": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/@malept/cross-spawn-promise": {
       "version": "1.1.1",
       "resolved": "https://registry.npmmirror.com/@malept/cross-spawn-promise/-/cross-spawn-promise-1.1.1.tgz",
@@ -1552,9 +1500,9 @@
       "optional": true
     },
     "node_modules/@types/web-bluetooth": {
-      "version": "0.0.16",
-      "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz",
-      "integrity": "sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==",
+      "version": "0.0.20",
+      "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
+      "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==",
       "license": "MIT"
     },
     "node_modules/@types/yargs": {
@@ -1719,15 +1667,15 @@
       "license": "MIT"
     },
     "node_modules/@vueuse/core": {
-      "version": "9.13.0",
-      "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-9.13.0.tgz",
-      "integrity": "sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==",
+      "version": "10.9.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-10.9.0.tgz",
+      "integrity": "sha512-/1vjTol8SXnx6xewDEKfS0Ra//ncg4Hb0DaZiwKf7drgfMsKFExQ+FnnENcN6efPen+1kIzhLQoGSy0eDUVOMg==",
       "license": "MIT",
       "dependencies": {
-        "@types/web-bluetooth": "^0.0.16",
-        "@vueuse/metadata": "9.13.0",
-        "@vueuse/shared": "9.13.0",
-        "vue-demi": "*"
+        "@types/web-bluetooth": "^0.0.20",
+        "@vueuse/metadata": "10.9.0",
+        "@vueuse/shared": "10.9.0",
+        "vue-demi": ">=0.14.7"
       },
       "funding": {
         "url": "https://github.com/sponsors/antfu"
@@ -1760,21 +1708,21 @@
       }
     },
     "node_modules/@vueuse/metadata": {
-      "version": "9.13.0",
-      "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-9.13.0.tgz",
-      "integrity": "sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==",
+      "version": "10.9.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-10.9.0.tgz",
+      "integrity": "sha512-iddNbg3yZM0X7qFY2sAotomgdHK7YJ6sKUvQqbvwnf7TmaVPxS4EJydcNsVejNdS8iWCtDk+fYXr7E32nyTnGA==",
       "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
     "node_modules/@vueuse/shared": {
-      "version": "9.13.0",
-      "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-9.13.0.tgz",
-      "integrity": "sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==",
+      "version": "10.9.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-10.9.0.tgz",
+      "integrity": "sha512-Uud2IWncmAfJvRaFYzv5OHDli+FbOzxiVEQdLCKQKLyhz94PIyFC3CHcH7EDMwIn8NPtD06+PNbC/PiO0LGLtw==",
       "license": "MIT",
       "dependencies": {
-        "vue-demi": "*"
+        "vue-demi": ">=0.14.7"
       },
       "funding": {
         "url": "https://github.com/sponsors/antfu"
@@ -1892,7 +1840,6 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmmirror.com/ansi-regex/-/ansi-regex-5.0.1.tgz",
       "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -1902,7 +1849,6 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "color-convert": "^2.0.1"
@@ -2416,6 +2362,14 @@
         "node": ">=6"
       }
     },
+    "node_modules/camelcase": {
+      "version": "5.3.1",
+      "resolved": "https://registry.npmmirror.com/camelcase/-/camelcase-5.3.1.tgz",
+      "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/caniuse-lite": {
       "version": "1.0.30001616",
       "resolved": "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001616.tgz",
@@ -2532,7 +2486,6 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
       "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "color-name": "~1.1.4"
@@ -2545,7 +2498,6 @@
       "version": "1.1.4",
       "resolved": "https://registry.npmmirror.com/color-name/-/color-name-1.1.4.tgz",
       "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/colors": {
@@ -2688,6 +2640,14 @@
         }
       }
     },
+    "node_modules/decamelize": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmmirror.com/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/decompress-response": {
       "version": "3.3.0",
       "resolved": "https://registry.npmmirror.com/decompress-response/-/decompress-response-3.3.0.tgz",
@@ -2766,6 +2726,11 @@
       "license": "MIT",
       "optional": true
     },
+    "node_modules/dijkstrajs": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmmirror.com/dijkstrajs/-/dijkstrajs-1.0.3.tgz",
+      "integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA=="
+    },
     "node_modules/dir-compare": {
       "version": "2.4.0",
       "resolved": "https://registry.npmmirror.com/dir-compare/-/dir-compare-2.4.0.tgz",
@@ -3235,13 +3200,111 @@
         "vue": "^3.2.0"
       }
     },
+    "node_modules/element-plus/node_modules/@types/web-bluetooth": {
+      "version": "0.0.16",
+      "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.16.tgz",
+      "integrity": "sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==",
+      "license": "MIT"
+    },
+    "node_modules/element-plus/node_modules/@vueuse/core": {
+      "version": "9.13.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-9.13.0.tgz",
+      "integrity": "sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.16",
+        "@vueuse/metadata": "9.13.0",
+        "@vueuse/shared": "9.13.0",
+        "vue-demi": "*"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/element-plus/node_modules/@vueuse/core/node_modules/vue-demi": {
+      "version": "0.14.7",
+      "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.7.tgz",
+      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/element-plus/node_modules/@vueuse/metadata": {
+      "version": "9.13.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-9.13.0.tgz",
+      "integrity": "sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/element-plus/node_modules/@vueuse/shared": {
+      "version": "9.13.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-9.13.0.tgz",
+      "integrity": "sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==",
+      "license": "MIT",
+      "dependencies": {
+        "vue-demi": "*"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/element-plus/node_modules/@vueuse/shared/node_modules/vue-demi": {
+      "version": "0.14.7",
+      "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.7.tgz",
+      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
       "resolved": "https://registry.npmmirror.com/emoji-regex/-/emoji-regex-8.0.0.tgz",
       "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
-      "dev": true,
       "license": "MIT"
     },
+    "node_modules/encode-utf8": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmmirror.com/encode-utf8/-/encode-utf8-1.0.3.tgz",
+      "integrity": "sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw=="
+    },
     "node_modules/encodeurl": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/encodeurl/-/encodeurl-1.0.2.tgz",
@@ -4202,7 +4265,6 @@
       "version": "2.0.5",
       "resolved": "https://registry.npmmirror.com/get-caller-file/-/get-caller-file-2.0.5.tgz",
       "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
-      "dev": true,
       "license": "ISC",
       "engines": {
         "node": "6.* || 8.* || >= 10.*"
@@ -4727,7 +4789,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmmirror.com/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
       "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -5418,6 +5479,14 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/p-try": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmmirror.com/p-try/-/p-try-2.2.0.tgz",
+      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/pako": {
       "version": "1.0.11",
       "resolved": "https://registry.npmmirror.com/pako/-/pako-1.0.11.tgz",
@@ -5452,9 +5521,7 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmmirror.com/path-exists/-/path-exists-4.0.0.tgz",
       "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=8"
       }
@@ -5620,6 +5687,14 @@
         "node": ">=10.4.0"
       }
     },
+    "node_modules/pngjs": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/pngjs/-/pngjs-5.0.0.tgz",
+      "integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==",
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
     "node_modules/postcss": {
       "version": "8.4.38",
       "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.38.tgz",
@@ -5753,6 +5828,144 @@
         "node": ">=6"
       }
     },
+    "node_modules/qrcode": {
+      "version": "1.5.3",
+      "resolved": "https://registry.npmmirror.com/qrcode/-/qrcode-1.5.3.tgz",
+      "integrity": "sha512-puyri6ApkEHYiVl4CFzo1tDkAZ+ATcnbJrJ6RiBM1Fhctdn/ix9MTE3hRph33omisEbC/2fcfemsseiKgBPKZg==",
+      "dependencies": {
+        "dijkstrajs": "^1.0.1",
+        "encode-utf8": "^1.0.3",
+        "pngjs": "^5.0.0",
+        "yargs": "^15.3.1"
+      },
+      "bin": {
+        "qrcode": "bin/qrcode"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/qrcode-generator": {
+      "version": "1.4.4",
+      "resolved": "https://registry.npmmirror.com/qrcode-generator/-/qrcode-generator-1.4.4.tgz",
+      "integrity": "sha512-HM7yY8O2ilqhmULxGMpcHSF1EhJJ9yBj8gvDEuZ6M+KGJ0YY2hKpnXvRD+hZPLrDVck3ExIGhmPtSdcjC+guuw==",
+      "license": "MIT"
+    },
+    "node_modules/qrcode-vue3": {
+      "version": "1.6.8",
+      "resolved": "https://registry.npmmirror.com/qrcode-vue3/-/qrcode-vue3-1.6.8.tgz",
+      "integrity": "sha512-LtMnwKWi58ZqHbXBcsTF/VxDYhI6RrBIrDQw8fbDVlO8p5tJBZa7TaIaVYLY937vKO2WCEBmOKksGlpm5ccEIg==",
+      "license": "MIT",
+      "dependencies": {
+        "qrcode-generator": "^1.4.4"
+      }
+    },
+    "node_modules/qrcode/node_modules/cliui": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmmirror.com/cliui/-/cliui-6.0.0.tgz",
+      "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.0",
+        "wrap-ansi": "^6.2.0"
+      }
+    },
+    "node_modules/qrcode/node_modules/find-up": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmmirror.com/find-up/-/find-up-4.1.0.tgz",
+      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
+      "dependencies": {
+        "locate-path": "^5.0.0",
+        "path-exists": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/qrcode/node_modules/locate-path": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/locate-path/-/locate-path-5.0.0.tgz",
+      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
+      "dependencies": {
+        "p-locate": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/qrcode/node_modules/p-limit": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmmirror.com/p-limit/-/p-limit-2.3.0.tgz",
+      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+      "dependencies": {
+        "p-try": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/qrcode/node_modules/p-locate": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmmirror.com/p-locate/-/p-locate-4.1.0.tgz",
+      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
+      "dependencies": {
+        "p-limit": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/qrcode/node_modules/wrap-ansi": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmmirror.com/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/qrcode/node_modules/y18n": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmmirror.com/y18n/-/y18n-4.0.3.tgz",
+      "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ=="
+    },
+    "node_modules/qrcode/node_modules/yargs": {
+      "version": "15.4.1",
+      "resolved": "https://registry.npmmirror.com/yargs/-/yargs-15.4.1.tgz",
+      "integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==",
+      "dependencies": {
+        "cliui": "^6.0.0",
+        "decamelize": "^1.2.0",
+        "find-up": "^4.1.0",
+        "get-caller-file": "^2.0.1",
+        "require-directory": "^2.1.1",
+        "require-main-filename": "^2.0.0",
+        "set-blocking": "^2.0.0",
+        "string-width": "^4.2.0",
+        "which-module": "^2.0.0",
+        "y18n": "^4.0.0",
+        "yargs-parser": "^18.1.2"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/qrcode/node_modules/yargs-parser": {
+      "version": "18.1.3",
+      "resolved": "https://registry.npmmirror.com/yargs-parser/-/yargs-parser-18.1.3.tgz",
+      "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
+      "dependencies": {
+        "camelcase": "^5.0.0",
+        "decamelize": "^1.2.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/queue-microtask": {
       "version": "1.2.3",
       "resolved": "https://registry.npmmirror.com/queue-microtask/-/queue-microtask-1.2.3.tgz",
@@ -5817,12 +6030,16 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmmirror.com/require-directory/-/require-directory-2.1.1.tgz",
       "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
       }
     },
+    "node_modules/require-main-filename": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/require-main-filename/-/require-main-filename-2.0.0.tgz",
+      "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
+    },
     "node_modules/resolve": {
       "version": "1.22.8",
       "resolved": "https://registry.npmmirror.com/resolve/-/resolve-1.22.8.tgz",
@@ -5994,6 +6211,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/set-blocking": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw=="
+    },
     "node_modules/setimmediate": {
       "version": "1.0.5",
       "resolved": "https://registry.npmmirror.com/setimmediate/-/setimmediate-1.0.5.tgz",
@@ -6132,7 +6354,6 @@
       "version": "4.2.3",
       "resolved": "https://registry.npmmirror.com/string-width/-/string-width-4.2.3.tgz",
       "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "emoji-regex": "^8.0.0",
@@ -6147,7 +6368,6 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmmirror.com/strip-ansi/-/strip-ansi-6.0.1.tgz",
       "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^5.0.1"
@@ -6637,6 +6857,11 @@
         "node": ">= 8"
       }
     },
+    "node_modules/which-module": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmmirror.com/which-module/-/which-module-2.0.1.tgz",
+      "integrity": "sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ=="
+    },
     "node_modules/word-wrap": {
       "version": "1.2.5",
       "resolved": "https://registry.npmmirror.com/word-wrap/-/word-wrap-1.2.5.tgz",
diff --git a/front/package.json b/front/package.json
index 3bb0017..750160f 100644
--- a/front/package.json
+++ b/front/package.json
@@ -25,7 +25,8 @@
     "element-plus": "^2.7.1",
     "lodash": "^4.17.21",
     "pinia": "^2.1.7",
-    "pinia-plugin-persist": "^1.0.0"
+    "pinia-plugin-persist": "^1.0.0",
+    "qrcode": "^1.5.3"
   },
   "devDependencies": {
     "@rushstack/eslint-patch": "^1.2.0",
diff --git a/front/src/main/index.js b/front/src/main/index.js
index 399af90..1aac77a 100644
--- a/front/src/main/index.js
+++ b/front/src/main/index.js
@@ -1,4 +1,4 @@
-import { app, shell, BrowserWindow, nativeImage,ipcMain } from 'electron'
+import { app, shell, BrowserWindow, nativeImage, ipcMain } from 'electron'
 import * as path from 'path'
 import { electronApp, optimizer, is } from '@electron-toolkit/utils'
 import axios from 'axios'
@@ -56,8 +56,9 @@ app.whenReady().then(() => {
     // dock icon is clicked and there are no other windows open.
     if (BrowserWindow.getAllWindows().length === 0) createWindow()
   })
-  ipcMain.on('sendMessage', (eve, msg) => {
-    axios.post(`http://127.0.0.1:7001/api/upload`, msg)
+  ipcMain.on('sendMessage', async (eve, msg) => {
+    let res = await axios.post(`http://127.0.0.1:7001/api/upload`, msg)
+    mainWindow.webContents.send('reply', res.data)
   })
 })
 
diff --git a/front/src/renderer/src/App.vue b/front/src/renderer/src/App.vue
index 1d1a81a..0c76490 100644
--- a/front/src/renderer/src/App.vue
+++ b/front/src/renderer/src/App.vue
@@ -33,6 +33,7 @@
         <el-button type="primary" @click="takePhotoUpload">打开视频</el-button>
         <el-button type="primary" @click="takePhoto">拍照</el-button>
         <el-button type="success" @click="updateSeach">上传查看</el-button>
+        <el-button type="success" @click="searchQrcode">下载</el-button>
       </div>
       <div class="botimg">
         <div id="camera">
@@ -48,15 +49,18 @@
       <el-tag type="danger" class="noVipTag">体验已过期，请联系管理员。</el-tag>
     </h3>
   </div>
+  <div calss="yanmo"><canvas id="canvas"></canvas></div>
 </template>
 
 <script>
 import _ from 'lodash'
+import Qrcode from 'qrcode'
 import useConfigStore from './stores/config.js'
 import dayjs from 'dayjs'
 import { ElMessage, ElMessageBox } from 'element-plus'
 export default {
   name: 'app',
+  components: {},
   data() {
     return {
       _: _,
@@ -66,11 +70,15 @@ export default {
         img: ''
       },
       videoEL: null,
-      isVip: false
+      isVip: false,
+      pngObj: {},
+      pngDialog: false,
+      qrcodeData: "",
     }
   },
   methods: {
     async takePhotoUpload() {
+      this.pngObj = {}
       this.form.img = ''
       let device = '' // 所选择的摄像头 deviceId
       this.dialogTakePhotoShow = true
@@ -122,24 +130,60 @@ export default {
         track.stop()
       })
       this.$refs['videoEL'].srcObject = null
-      console.log(777, this.form.img)
     },
     async updateSeach() {
-      console.log(7777, this.form)
-
+      this.pngObj = {}
       window.electron.ipcRenderer.send('sendMessage', {
         name: this.form.name,
         age: this.form.age,
         img: this.form.img
       })
-      ElMessage({
-        message: '上传成功',
-        type: 'success'
+    },
+    watchPng() {
+      let that = this
+      window.electron.ipcRenderer.on('reply', (eve, str) => {
+        that.pngObj = str
+        console.log(77722, that.pngObj)
+        if (that.pngObj.hasError) {
+          ElMessage({
+            message: that.pngObj.msg,
+            type: 'error'
+          })
+        } else {
+          ElMessage({
+            type: 'info',
+            duration: duration - 500,
+            customClass: 'yanmo',
+            icon: 'check',
+            message: '恭喜你，答对了！',
+            appendTo: document.getElementById(`yanmo${perIndex}`)
+          })
+          ElMessage({ message: '上传成功', type: 'success' })
+          console.log(999, that.pngObj.list)
+          let canvas = document.getElementById('canvas')
+          let baseurl="http://127.0.0.1:7001"
+          let res = Qrcode.toCanvas(canvas, `${baseurl}/?id=${_.get(this.pngObj, ["list", "_id"])}`, function (error) {
+            if (error) console.error(error)
+            console.log('success!');
+          })
+        }
       })
-    }
+    },
+    searchQrcode() {
+      this.pngDialog = true
+    },
   },
   async mounted() {
-    let fiveDay = dayjs('2024-05-16T00:00:00').valueOf()
+    this.watchPng()
+    // let canvas = document.getElementById('canvas')
+    // let baseurl="http://127.0.0.1:7001"
+    // Qrcode.toCanvas(canvas, `${baseurl}/?id=${_.get(this.pngObj, ["list", "_id"])}`, function (error) {
+    //   if (error) console.error(error)
+    //   console.log('success!');
+    // })
+    // let canvas11 = document.getElementById('canvas')
+    // console.log(874, canvas11)
+    let fiveDay = dayjs('2024-05-18T00:00:00').valueOf()
     if (!this.isVip) {
       if (dayjs().valueOf() > fiveDay) {
         this.isVip = false
diff --git a/front/src/renderer/src/assets/css/base.css b/front/src/renderer/src/assets/css/base.css
index 706e116..5254a8c 100644
--- a/front/src/renderer/src/assets/css/base.css
+++ b/front/src/renderer/src/assets/css/base.css
@@ -9,4 +9,19 @@ body {
   text-align: left !important;
   padding: 0 0 0 12px;
   line-height: 45px;
+}
+
+.yanmo {
+  position: absolute;
+  height: 0vh;
+  width: 0vw;
+  overflow: visible;
+  top: 20vh !important;
+  background-color: #83838399;
+  border: none;
+}
+
+#canvas {
+  height: 400px;
+  width: 400px;
 }
\ No newline at end of file
diff --git a/front/yarn.lock b/front/yarn.lock
index 938fb3d..945ebcb 100644
--- a/front/yarn.lock
+++ b/front/yarn.lock
@@ -374,14 +374,7 @@
     "@babel/runtime" "^7.5.5"
     "@jiaminghi/c-render" "^0.4.3"
 
-"@jiaminghi/color@*":
-  version "0.1.1"
-  resolved "https://registry.npmmirror.com/@jiaminghi/color/-/color-0.1.1.tgz"
-  integrity sha512-M09+Sb5HGqVim0zo+nG5gU1v+6gXT8ptr0BZR6dMGt83XmCJgnZtO8s7llTW4hLFFFM5co6geZvTekqLpSPAAQ==
-  dependencies:
-    "@babel/runtime" "^7.5.5"
-
-"@jiaminghi/color@^1.1.3":
+"@jiaminghi/color@*", "@jiaminghi/color@^1.1.3":
   version "1.1.3"
   resolved "https://registry.npmmirror.com/@jiaminghi/color/-/color-1.1.3.tgz"
   integrity sha512-ZY3hdorgODk4OSTbxyXBPxAxHPIVf9rPlKJyK1C1db46a50J0reFKpAvfZG8zMG3lvM60IR7Qawgcu4ZDO3+Hg==
@@ -1007,6 +1000,11 @@ callsites@^3.0.0:
   resolved "https://registry.npmmirror.com/callsites/-/callsites-3.1.0.tgz"
   integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==
 
+camelcase@^5.0.0:
+  version "5.3.1"
+  resolved "https://registry.npmmirror.com/camelcase/-/camelcase-5.3.1.tgz"
+  integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
+
 caniuse-lite@^1.0.30001587:
   version "1.0.30001616"
   resolved "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001616.tgz"
@@ -1044,6 +1042,15 @@ ci-info@^3.2.0:
   resolved "https://registry.npmmirror.com/ci-info/-/ci-info-3.9.0.tgz"
   integrity sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==
 
+cliui@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.npmmirror.com/cliui/-/cliui-6.0.0.tgz"
+  integrity sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==
+  dependencies:
+    string-width "^4.2.0"
+    strip-ansi "^6.0.0"
+    wrap-ansi "^6.2.0"
+
 cliui@^8.0.1:
   version "8.0.1"
   resolved "https://registry.npmmirror.com/cliui/-/cliui-8.0.1.tgz"
@@ -1176,6 +1183,11 @@ debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@4:
   dependencies:
     ms "2.1.2"
 
+decamelize@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.npmmirror.com/decamelize/-/decamelize-1.2.0.tgz"
+  integrity sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==
+
 decompress-response@^3.3.0:
   version "3.3.0"
   resolved "https://registry.npmmirror.com/decompress-response/-/decompress-response-3.3.0.tgz"
@@ -1221,6 +1233,11 @@ detect-node@^2.0.4:
   resolved "https://registry.npmmirror.com/detect-node/-/detect-node-2.1.0.tgz"
   integrity sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==
 
+dijkstrajs@^1.0.1:
+  version "1.0.3"
+  resolved "https://registry.npmmirror.com/dijkstrajs/-/dijkstrajs-1.0.3.tgz"
+  integrity sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==
+
 dir-compare@^2.4.0:
   version "2.4.0"
   resolved "https://registry.npmmirror.com/dir-compare/-/dir-compare-2.4.0.tgz"
@@ -1370,6 +1387,11 @@ emoji-regex@^8.0.0:
   resolved "https://registry.npmmirror.com/emoji-regex/-/emoji-regex-8.0.0.tgz"
   integrity sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==
 
+encode-utf8@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.npmmirror.com/encode-utf8/-/encode-utf8-1.0.3.tgz"
+  integrity sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw==
+
 encodeurl@^1.0.2:
   version "1.0.2"
   resolved "https://registry.npmmirror.com/encodeurl/-/encodeurl-1.0.2.tgz"
@@ -1664,6 +1686,14 @@ filelist@^1.0.4:
   dependencies:
     minimatch "^5.0.1"
 
+find-up@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.npmmirror.com/find-up/-/find-up-4.1.0.tgz"
+  integrity sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==
+  dependencies:
+    locate-path "^5.0.0"
+    path-exists "^4.0.0"
+
 find-up@^5.0.0:
   version "5.0.0"
   resolved "https://registry.npmmirror.com/find-up/-/find-up-5.0.0.tgz"
@@ -1768,7 +1798,7 @@ gensync@^1.0.0-beta.2:
   resolved "https://registry.npmmirror.com/gensync/-/gensync-1.0.0-beta.2.tgz"
   integrity sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==
 
-get-caller-file@^2.0.5:
+get-caller-file@^2.0.1, get-caller-file@^2.0.5:
   version "2.0.5"
   resolved "https://registry.npmmirror.com/get-caller-file/-/get-caller-file-2.0.5.tgz"
   integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==
@@ -2204,6 +2234,13 @@ lie@~3.3.0:
   dependencies:
     immediate "~3.0.5"
 
+locate-path@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.npmmirror.com/locate-path/-/locate-path-5.0.0.tgz"
+  integrity sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==
+  dependencies:
+    p-locate "^4.1.0"
+
 locate-path@^6.0.0:
   version "6.0.0"
   resolved "https://registry.npmmirror.com/locate-path/-/locate-path-6.0.0.tgz"
@@ -2440,6 +2477,13 @@ p-cancelable@^1.0.0:
   resolved "https://registry.npmmirror.com/p-cancelable/-/p-cancelable-1.1.0.tgz"
   integrity sha512-s73XxOZ4zpt1edZYZzvhqFa6uvQc1vwUa0K0BdtIZgQMAJj9IbebH+JkgKZc9h+B05PKHLOTl4ajG1BmNrVZlw==
 
+p-limit@^2.2.0:
+  version "2.3.0"
+  resolved "https://registry.npmmirror.com/p-limit/-/p-limit-2.3.0.tgz"
+  integrity sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==
+  dependencies:
+    p-try "^2.0.0"
+
 p-limit@^3.0.2:
   version "3.1.0"
   resolved "https://registry.npmmirror.com/p-limit/-/p-limit-3.1.0.tgz"
@@ -2447,6 +2491,13 @@ p-limit@^3.0.2:
   dependencies:
     yocto-queue "^0.1.0"
 
+p-locate@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.npmmirror.com/p-locate/-/p-locate-4.1.0.tgz"
+  integrity sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==
+  dependencies:
+    p-limit "^2.2.0"
+
 p-locate@^5.0.0:
   version "5.0.0"
   resolved "https://registry.npmmirror.com/p-locate/-/p-locate-5.0.0.tgz"
@@ -2454,6 +2505,11 @@ p-locate@^5.0.0:
   dependencies:
     p-limit "^3.0.2"
 
+p-try@^2.0.0:
+  version "2.2.0"
+  resolved "https://registry.npmmirror.com/p-try/-/p-try-2.2.0.tgz"
+  integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==
+
 pako@~1.0.2:
   version "1.0.11"
   resolved "https://registry.npmmirror.com/pako/-/pako-1.0.11.tgz"
@@ -2535,6 +2591,11 @@ plist@^3.0.1, plist@^3.0.4:
     base64-js "^1.5.1"
     xmlbuilder "^15.1.1"
 
+pngjs@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.npmmirror.com/pngjs/-/pngjs-5.0.0.tgz"
+  integrity sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==
+
 postcss@^8.4.18, postcss@^8.4.38:
   version "8.4.38"
   resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.38.tgz"
@@ -2604,6 +2665,28 @@ punycode@^2.1.0:
   resolved "https://registry.npmmirror.com/punycode/-/punycode-2.3.1.tgz"
   integrity sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==
 
+qrcode-generator@^1.4.4:
+  version "1.4.4"
+  resolved "https://registry.npmmirror.com/qrcode-generator/-/qrcode-generator-1.4.4.tgz"
+  integrity sha512-HM7yY8O2ilqhmULxGMpcHSF1EhJJ9yBj8gvDEuZ6M+KGJ0YY2hKpnXvRD+hZPLrDVck3ExIGhmPtSdcjC+guuw==
+
+qrcode-vue3@^1.6.8:
+  version "1.6.8"
+  resolved "https://registry.npmmirror.com/qrcode-vue3/-/qrcode-vue3-1.6.8.tgz"
+  integrity sha512-LtMnwKWi58ZqHbXBcsTF/VxDYhI6RrBIrDQw8fbDVlO8p5tJBZa7TaIaVYLY937vKO2WCEBmOKksGlpm5ccEIg==
+  dependencies:
+    qrcode-generator "^1.4.4"
+
+qrcode@^1.5.3:
+  version "1.5.3"
+  resolved "https://registry.npmmirror.com/qrcode/-/qrcode-1.5.3.tgz"
+  integrity sha512-puyri6ApkEHYiVl4CFzo1tDkAZ+ATcnbJrJ6RiBM1Fhctdn/ix9MTE3hRph33omisEbC/2fcfemsseiKgBPKZg==
+  dependencies:
+    dijkstrajs "^1.0.1"
+    encode-utf8 "^1.0.3"
+    pngjs "^5.0.0"
+    yargs "^15.3.1"
+
 queue-microtask@^1.2.2:
   version "1.2.3"
   resolved "https://registry.npmmirror.com/queue-microtask/-/queue-microtask-1.2.3.tgz"
@@ -2643,6 +2726,11 @@ require-directory@^2.1.1:
   resolved "https://registry.npmmirror.com/require-directory/-/require-directory-2.1.1.tgz"
   integrity sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==
 
+require-main-filename@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmmirror.com/require-main-filename/-/require-main-filename-2.0.0.tgz"
+  integrity sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==
+
 resolve-from@^4.0.0:
   version "4.0.0"
   resolved "https://registry.npmmirror.com/resolve-from/-/resolve-from-4.0.0.tgz"
@@ -2758,6 +2846,11 @@ serialize-error@^7.0.1:
   dependencies:
     type-fest "^0.13.1"
 
+set-blocking@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmmirror.com/set-blocking/-/set-blocking-2.0.0.tgz"
+  integrity sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==
+
 setimmediate@^1.0.5:
   version "1.0.5"
   resolved "https://registry.npmmirror.com/setimmediate/-/setimmediate-1.0.5.tgz"
@@ -3025,6 +3118,11 @@ vue-demi@>=0.14.7:
     "@vue/server-renderer" "3.4.26"
     "@vue/shared" "3.4.26"
 
+which-module@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.npmmirror.com/which-module/-/which-module-2.0.1.tgz"
+  integrity sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ==
+
 which@^2.0.1:
   version "2.0.2"
   resolved "https://registry.npmmirror.com/which/-/which-2.0.2.tgz"
@@ -3037,6 +3135,15 @@ word-wrap@^1.2.5:
   resolved "https://registry.npmmirror.com/word-wrap/-/word-wrap-1.2.5.tgz"
   integrity sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==
 
+wrap-ansi@^6.2.0:
+  version "6.2.0"
+  resolved "https://registry.npmmirror.com/wrap-ansi/-/wrap-ansi-6.2.0.tgz"
+  integrity sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==
+  dependencies:
+    ansi-styles "^4.0.0"
+    string-width "^4.1.0"
+    strip-ansi "^6.0.0"
+
 wrap-ansi@^7.0.0:
   version "7.0.0"
   resolved "https://registry.npmmirror.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz"
@@ -3056,6 +3163,11 @@ xmlbuilder@^15.1.1:
   resolved "https://registry.npmmirror.com/xmlbuilder/-/xmlbuilder-15.1.1.tgz"
   integrity sha512-yMqGBqtXyeN1e3TGYvgNgDVZ3j84W4cwkOXQswghol6APgZWaff9lnbvN7MHYJOiXsvGPXtjTYJEiC9J2wv9Eg==
 
+y18n@^4.0.0:
+  version "4.0.3"
+  resolved "https://registry.npmmirror.com/y18n/-/y18n-4.0.3.tgz"
+  integrity sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==
+
 y18n@^5.0.5:
   version "5.0.8"
   resolved "https://registry.npmmirror.com/y18n/-/y18n-5.0.8.tgz"
@@ -3071,11 +3183,36 @@ yallist@^4.0.0:
   resolved "https://registry.npmmirror.com/yallist/-/yallist-4.0.0.tgz"
   integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
 
+yargs-parser@^18.1.2:
+  version "18.1.3"
+  resolved "https://registry.npmmirror.com/yargs-parser/-/yargs-parser-18.1.3.tgz"
+  integrity sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==
+  dependencies:
+    camelcase "^5.0.0"
+    decamelize "^1.2.0"
+
 yargs-parser@^21.1.1:
   version "21.1.1"
   resolved "https://registry.npmmirror.com/yargs-parser/-/yargs-parser-21.1.1.tgz"
   integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==
 
+yargs@^15.3.1:
+  version "15.4.1"
+  resolved "https://registry.npmmirror.com/yargs/-/yargs-15.4.1.tgz"
+  integrity sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==
+  dependencies:
+    cliui "^6.0.0"
+    decamelize "^1.2.0"
+    find-up "^4.1.0"
+    get-caller-file "^2.0.1"
+    require-directory "^2.1.1"
+    require-main-filename "^2.0.0"
+    set-blocking "^2.0.0"
+    string-width "^4.2.0"
+    which-module "^2.0.0"
+    y18n "^4.0.0"
+    yargs-parser "^18.1.2"
+
 yargs@^17.5.1:
   version "17.7.2"
   resolved "https://registry.npmmirror.com/yargs/-/yargs-17.7.2.tgz"
diff --git a/h5/.gitignore b/h5/.gitignore
new file mode 100644
index 0000000..782636d
--- /dev/null
+++ b/h5/.gitignore
@@ -0,0 +1,25 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+package-lock.json
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/h5/README.md b/h5/README.md
new file mode 100644
index 0000000..f529bc8
--- /dev/null
+++ b/h5/README.md
@@ -0,0 +1,7 @@
+# base
+
+This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+
+## Recommended IDE Setup
+
+- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
diff --git a/h5/index.html b/h5/index.html
new file mode 100644
index 0000000..ffe2dae
--- /dev/null
+++ b/h5/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="zh">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>
diff --git a/h5/package.json b/h5/package.json
new file mode 100644
index 0000000..683778c
--- /dev/null
+++ b/h5/package.json
@@ -0,0 +1,30 @@
+{
+  "name": "base",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@element-plus/icons-vue": "^2.3.1",
+    "axios": "^1.6.6",
+    "dayjs": "^1.11.10",
+    "element-plus": "^2.5.3",
+    "lodash": "^4.17.21",
+    "md5": "^2.3.0",
+    "nprogress": "^0.2.0",
+    "papaparse": "^5.4.1",
+    "qs": "^6.11.2",
+    "unplugin-auto-import": "^0.17.4",
+    "unplugin-vue-components": "^0.26.0",
+    "vue": "^3.3.11",
+    "vue-router": "^4.2.5"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^4.6.2",
+    "vite": "^5.0.8"
+  }
+}
diff --git a/h5/public/config.json b/h5/public/config.json
new file mode 100644
index 0000000..0f21a96
--- /dev/null
+++ b/h5/public/config.json
@@ -0,0 +1,9 @@
+{
+  "title": "可视化预警平台",
+  "jianceduixiang1path": "@/assets/img/jianceduixiang1.gif",
+  "jianceduixiang2path": "@/assets/img/jianceduixiang2.jpg",
+  "jianceduixiang3path": "@/assets/img/jianceduixiang3.png",
+  "jianceduixiang4path": "@/assets/img/jianceduixiang4.png",
+  "jianceduixiang5path": "@/assets/img/jianceduixiang5.gif",
+  "jianceduixiang6path": "@/assets/img/jianceduixiang6.gif"
+}
diff --git a/h5/public/vite.svg b/h5/public/vite.svg
new file mode 100644
index 0000000..7048ee8
--- /dev/null
+++ b/h5/public/vite.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.1 19.7L8.8 19L9 18.6C7.1 18.1 6 17.3 6 17V14.8C7.3 15.4 8.8 15.8 10.6 16C11.3 15.2 12.2 14.5 13.1 14H12C9.6 14 7.3 13.4 6 12.5V9.6C7.5 10.4 9.6 11 12 11S16.5 10.5 18 9.6V12.4C17.7 12.6 17.4 12.8 17 13C18 13 19 13.2 20 13.6V7C20 4.8 16.4 3 12 3S4 4.8 4 7V17C4 18.8 6.4 20.3 9.7 20.8C9.5 20.5 9.3 20.1 9.1 19.7M12 5C15.9 5 18 6.5 18 7S15.9 9 12 9 6 7.5 6 7 8.1 5 12 5M17 18C17.6 18 18 18.4 18 19S17.6 20 17 20 16 19.6 16 19 16.4 18 17 18M17 15C14.3 15 11.9 16.7 11 19C11.9 21.3 14.3 23 17 23S22.1 21.3 23 19C22.1 16.7 19.7 15 17 15M17 21.5C15.6 21.5 14.5 20.4 14.5 19S15.6 16.5 17 16.5 19.5 17.6 19.5 19 18.4 21.5 17 21.5Z" /></svg>
\ No newline at end of file
diff --git a/h5/src/App.vue b/h5/src/App.vue
new file mode 100644
index 0000000..fac3f64
--- /dev/null
+++ b/h5/src/App.vue
@@ -0,0 +1,72 @@
+<template>
+  <div>
+    <el-row v-for="(item, perIndex) in resData.createImgList" :key="perIndex" class="yangshi">
+      <el-col :span="3">
+        {{ item.age }}岁
+      </el-col>
+      <el-col :span="15">
+        <img :src="item.png" height="200px" />
+      </el-col>
+      <el-col :span="6">
+        <el-button @click="DownloadPng(item)">下载</el-button>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { Download } from '@element-plus/icons-vue';
+
+
+export default {
+  name: "app",
+  data() {
+    return {
+      resData: {},
+    };
+  },
+  async mounted() {
+    let id = this.$_.get(window.location.href.split('?')[1].split('='), [1])
+    console.log(77744, window.location.href, id)
+    let res = await this.$axios.get(`/api/getPng?id=${id}`)
+    this.resData = this.$_.get(res, ["data", 0])
+    console.log(777, res)
+
+
+  },
+  methods: {
+    downloadFile(content, fileName = Date.now()) { //下载base64图片
+      let base64ToBlob = function (code) {
+        let parts = code.split(';base64,');
+        let contentType = parts[0].split(':')[1];
+        let raw = window.atob(parts[1]);
+        let rawLength = raw.length;
+        let uInt8Array = new Uint8Array(rawLength);
+        for (let i = 0; i < rawLength; ++i) {
+          uInt8Array[i] = raw.charCodeAt(i);
+        }
+        return new Blob([uInt8Array], {
+          type: contentType
+        });
+      };
+      let aLink = document.createElement('a');
+      let blob = base64ToBlob(content); //new Blob([content]);
+      let evt = document.createEvent("HTMLEvents");
+      evt.initEvent("click", true, true); //initEvent 不加后两个参数在FF下会报错  事件类型，是否冒泡，是否阻止浏览器的默认行为
+      aLink.download = fileName;
+      aLink.href = URL.createObjectURL(blob);
+      aLink.click();
+    },
+    DownloadPng(item) {
+      this.downloadFile(item.png, `${this.resData.name}_${item.age}`)
+    }
+  },
+  watch: {},
+  computed: {},
+};
+</script>
+<style scoped>
+.yangshi {
+  align-items: center !important;
+}
+</style>
diff --git a/h5/src/main.js b/h5/src/main.js
new file mode 100644
index 0000000..1c56b5c
--- /dev/null
+++ b/h5/src/main.js
@@ -0,0 +1,20 @@
+import App from "./App.vue";
+import { createApp } from "vue";
+// 引入路由实例
+//全局引入lodash
+import _ from "lodash";
+import axios from "axios";
+//全局引入lodash
+import dayjs from "dayjs";
+// 引入css
+//全局引入element-plus所有图标
+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+
+const app = createApp(App);
+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+  app.component(key, component)
+}
+app.config.globalProperties.$axios = axios; //挂载到app实例上
+app.config.globalProperties.$_ = _; //挂载到app实例上
+app.config.globalProperties.$dayjs = dayjs; //挂载到app实例上
+app.mount("#app");
diff --git a/h5/vite.config.js b/h5/vite.config.js
new file mode 100644
index 0000000..11c289b
--- /dev/null
+++ b/h5/vite.config.js
@@ -0,0 +1,42 @@
+// Plugins
+import vue from "@vitejs/plugin-vue";
+
+// Utilities
+import { defineConfig } from "vite";
+import { fileURLToPath, URL } from "node:url";
+import AutoImport from "unplugin-auto-import/vite";
+import Components from "unplugin-vue-components/vite";
+import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [
+    vue(),
+    AutoImport({
+      resolvers: [ElementPlusResolver()],
+    }),
+    Components({
+      resolvers: [ElementPlusResolver()],
+    }),
+  ],
+  define: { "process.env": {} },
+  resolve: {
+    alias: {
+      "@": fileURLToPath(new URL("./src", import.meta.url)),
+    },
+    extensions: [".js", ".json", ".jsx", ".mjs", ".ts", ".tsx", ".vue"],
+  },
+  server: {
+    port: 3000,
+    proxy: {
+      "/api": {
+        target: "http://127.0.0.1:7001/api",
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, ""),
+      },
+    },
+  },
+  build: {
+    sourcemap: true,
+  },
+});