Merge branch 'feature_20241120_图像识别' into uat(dev)

# Conflicts:
#	src/components/uploadImgVStore.vue
#	src/layout/index.vue

src/assets/styles/variable.scss

@@ -0,0 +1,4 @@
+$vw_base: 690; //设计稿宽度
+@function vw($px) {
+	@return ($px / $vw_base) * 100vw;
+}

src/components/imageAIVerifyErr.vue

@@ -12,22 +12,21 @@
         <!-- shopSignChange 与历史照片是否一致(是否要更换照片) 0一致(要更换)，1不一致(不要更换) -->
         <template v-if="shopSignChange == 0">
           <div class="errorImg">
-            <img v-if="url" :src="url" height="200px" @click="previewsImg(url)" />
-            <img v-else :src="imageEmpty" width="100%" height="200px" />
+            <img v-if="url" :src="url" fit="contain" @click="previewsImg(url)" />
+            <img v-else :src="imageEmpty" width="100%" height="300px" />
           </div>
           <div class="AIVerify">
-            <span style="color: red">{{ contentMessage }}</span>
+            <span>{{ contentMessage }}</span>
           </div>
           <template v-if="shotsNum >= maxNum">
             <div class="feedbackMessage">
-              <div class="label">若图像识别不正确，可在下表反馈:</div>
+              <div class="label">若图像识别不正确，可在此反馈:</div>
               <div class="value">
                 <van-field
                   v-model="feedbackMessage"
-                  rows="1"
-                  autosize
+                  rows="3"
                   type="textarea"
-                  placeholder="请输入反馈意见" />
+                  placeholder="请输原因" />
               </div>
             </div>
           </template>
@@ -39,7 +38,7 @@
           </div>
           <template v-if="shotsNum >= maxNum">
             <div class="tipsAIVerify" v-if="npkpiData.recognizeType == 1">
-              <van-icon name="question-o" />上传后作为本店标准店招，未来每次拜访时校验。
+              <van-icon name="warning-o" />上传后作为本店标准店招，未来每次拜访时校验。
             </div>
           </template>
         </template>
@@ -85,10 +84,10 @@
             </div>
           </div>
           <div class="AIVerify">
-            <span style="color: red">{{ contentMessage }}</span>
+            <span>{{ contentMessage }}</span>
           </div>
           <div class="feedbackMessage">
-            <div class="label">若图像识别不正确，可在下表反馈:</div>
+            <div class="label">若图像识别不正确，可在此反馈:</div>
             <div class="value">
               <van-field
                 v-model="feedbackMessage"
@@ -103,7 +102,8 @@
             <div class="changeImageAIVerify" @click="confirmUpDataImage()">更新门店照</div>
           </div>
           <div class="tipsRemarkAIVerify">
-            <div>若历史照片拍摄不规范，请选择<span style="color: #81b337">更新门店照</span></div>
+            <!-- <div>若历史照片拍摄不规范，请选择<span style="color: #81b337">更新门店照</span></div> -->
+            <div><van-icon name="warning-o" />若历史照片拍摄不规范，请选择更新门店照</div>
             <div>本次拜访店招会作为本店标准店招，未来每次拜访时校验</div>
           </div>
         </template>
@@ -156,7 +156,7 @@ export default {
       createStoreUrl: '', //	建店时店招
       lastVisitUrl: '', //	上次拜访时店招
       storeIDCardUrl: '', //	门店身份证
-      maxNum: 2,
+      maxNum: 1,
     };
   },
   methods: {
@@ -291,6 +291,14 @@ export default {
     width: 95% !important;
     margin-top: 1vh !important;
     border-radius: 8px !important;
+    font-size: vw(32) !important;
+    .el-dialog__headerbtn {
+      width: vw(44);
+      height: vw(44);
+      background-color: #e1e1e1;
+      border-radius: 50%;
+      margin-top: -3px;
+    }
   }
   .AIVerifyErrMask {
     width: 100%;
@@ -302,13 +310,20 @@ export default {
       display: flex;
       align-items: center;
       justify-content: center;
+      img {
+        width: vw(235);
+      }
     }
     .AIVerify {
-      padding: 6px 0;
-      font-size: 16px;
-      /* color: red; */
-      text-align: center;
-      /* border-top: 1px solid #cfcfcf; */
+      font-size: vw(30);
+      margin-top: vw(45);
+      display: flex;
+      justify-content: center;
+      span {
+        color: #9e0202;
+        display: block;
+        max-width: 60%;
+      }
     }
   }
   .van-popup {
@@ -346,41 +361,43 @@ export default {
     }
   }
   .tipsAIVerify {
-    /* border-top: 1px solid #cfcfcf; */
-    padding: 5px 0;
-    font-size: 14px;
-    color: red;
-    /* white-space: nowrap; */
+    padding: vw(28) 0;
+    font-size: vw(22);
+    color: #999999;
   }
   .uploadBtnAIVerify {
-    /* border-top: 1px solid #cfcfcf; */
     display: flex;
     align-items: center;
     justify-content: center;
-    padding: 8px 0;
+    padding: vw(8) 0;
+    margin-top: vw(30);
     div {
-      /* width: 40%; */
       display: flex;
       justify-content: center;
       align-items: center;
-      font-size: 14px;
+      font-size: vw(28);
       color: #fff;
       border-radius: 10px;
-      margin: 0 6px;
-      flex: 1;
+      /* margin: 0 6px; */
+      width: vw(298);
+      height: vw(68);
+      background-blend-mode: normal, normal;
+      box-shadow: 0px 3px 6px 0px rgba(6, 60, 131, 0.35);
     }
     .confirmUploadAIVerify {
-      background-color: #0057ba;
-      padding: 8px 0;
+      background-image: linear-gradient(180deg, #ffa1a1 0%, #f6695f 35%, #ed301d 100%),
+        linear-gradient(#aed0f9, #aed0f9);
+      margin-right: 6px;
     }
     .changeImageAIVerify {
-      background-color: #81b337;
-      padding: 8px 0;
+      background-image: linear-gradient(180deg, #3b89e6 0%, #1e6acb 35%, #014baf 100%),
+        linear-gradient(#0356b9, #0356b9);
+      margin-left: 6px;
     }
     .stillUploadAIVerify {
-      border: 1px solid #0057ba;
-      color: #0057ba;
-      padding: 8px 0;
+      background-image: linear-gradient(180deg, #3b89e6 0%, #1e6acb 35%, #014baf 100%),
+        linear-gradient(#0356b9, #0356b9);
+      margin-left: 6px;
     }
   }
   .historyImageAIVerify {
@@ -400,17 +417,29 @@ export default {
     }
   }
   .tipsRemarkAIVerify {
-    border-top: 1px solid #cfcfcf;
-    padding: 3px 0;
+    padding: vw(28) 0;
     div {
-      font-size: 12px;
-      padding: 3px 0;
+      font-size: vw(22);
+      color: #999999;
+      position: relative;
+      padding-left: 17px;
+    }
+    .van-icon {
+      position: absolute;
+      left: 0;
     }
   }
   .feedbackMessage {
-    border-top: 1px solid #cfcfcf;
-    padding: 5px 0;
-    /* width: 100%; */
+    margin-top: vw(45);
+    .label {
+      font-size: vw(26);
+      line-height: vw(50);
+    }
+    .value {
+      .van-cell {
+        padding: 0;
+      }
+    }
     .van-field__body {
       border: 1px solid #ccc;
       padding-left: 10px;

vue.config.js

@@ -1,15 +1,15 @@
-"use strict";
-const path = require("path");
+'use strict';
+const path = require('path');
 function resolve(dir) {
   return path.join(__dirname, dir);
 }
-const name = process.env.VUE_APP_TITLE || "门店拜访"; // 网页标题
+const name = process.env.VUE_APP_TITLE || '门店拜访'; // 网页标题
 const port = 8888; // 端口
 module.exports = {
   // publicPath: process.env.NODE_ENV === "production" ? "/mobile/" : "/",
-  publicPath: "/mobile/",
-  outputDir: "mobile",
-  assetsDir: "static",
+  publicPath: '/mobile/',
+  outputDir: 'mobile',
+  assetsDir: 'static',
   lintOnSave: false,
   productionSourceMap: false,
   devServer: {
@@ -20,7 +20,7 @@ module.exports = {
         target: process.env.VUE_APP_Target,
         changeOrigin: true,
         pathRewrite: {
-          ["^" + process.env.VUE_APP_BASE_API]: process.env.VUE_APP_BASE_API + "",
+          ['^' + process.env.VUE_APP_BASE_API]: process.env.VUE_APP_BASE_API + '',
         },
       },
     },
@@ -30,19 +30,35 @@ module.exports = {
     name: name,
     resolve: {
       alias: {
-        "@": resolve("src"),
+        '@': resolve('src'),
       },
     },
   },
   chainWebpack(config) {
-    config.plugins.delete("preload"); // TODO: need test
-    config.plugins.delete("prefetch"); // TODO: need test
-    config.when(process.env.NODE_ENV !== "development", (config) => {
-      config.optimization.runtimeChunk("single"),
+    config.plugins.delete('preload'); // TODO: need test
+    config.plugins.delete('prefetch'); // TODO: need test
+    config.when(process.env.NODE_ENV !== 'development', (config) => {
+      config.optimization.runtimeChunk('single'),
         {
-          from: path.resolve(__dirname, "./public/robots.txt"), //防爬虫文件
-          to: "./", //到根目录下
+          from: path.resolve(__dirname, './public/robots.txt'), //防爬虫文件
+          to: './', //到根目录下
         };
     });
   },
+  css: {
+    loaderOptions: {
+      sass: {
+        //注意：sass-loader将文件引用写入每个组件，适合全局引入变量，但不适合在单页面应用中添加样式，如果是全局样式（非变量），建议在main.js里引入
+        // 路径支持别名的写法，案例就是用了路径别名，如果你没有在项目里设置，也可以自己手动设置即可
+        // sass-loader v10以下老版本 用的是prependData，不是additionalData
+        // 给 sass-loader 传递选项
+        // 默认情况下 `sass` 选项会同时对 `sass` 和 `scss` 语法同时生效
+        // 因为 `scss` 语法在内部也是由 sass-loader 处理的
+        // 但是在配置 `data` 选项的时候
+        // `scss` 语法会要求语句结尾必须有分号，`sass` 则要求必须没有分号
+        // 在这种情况下，我们可以使用 `scss` 选项，对 `scss` 语法进行单独配置
+        prependData: `@import "@/assets/styles/variable.scss";`,
+      },
+    },
+  },
 };