feat: 邮件弹窗优化+上传面部头像优化

pages/base-info-more/index.vue

@@ -50,18 +50,42 @@
 
     <view class="btn-bottom">
       <button class="next-btn" @tap="nextStep"> 下一步 </button>
+
+      <uni-file-picker
+        v-if="isHideUploadBtn"
+        :auto-upload="false"
+        :del-icon="false"
+        :disable-preview="true"
+        sizeType="['original']"
+        class="custom-upload"
+        :sourceType="['album', 'camera']"
+        limit="1"
+        mode="grid"
+        @select="selectPic"
+      />
     </view>
 
     <div class="dialog" v-if="false">
       <div class="dialog-main">
-        <input class="next-input" type="file" />
+        <div class="next-input">
+          <uni-file-picker
+            :auto-upload="false"
+            :del-icon="false"
+            :disable-preview="true"
+            sizeType="['original']"
+            class="upload"
+            limit="1"
+            mode="grid"
+            >选择选择选择选择选择选择选择选择
+          </uni-file-picker>
+        </div>
       </div>
     </div>
   </view>
 </template>
 
 <script setup>
-  import { ref } from 'vue';
+  import { ref, computed } from 'vue';
   import { getAccessToken } from '@/sheep/request';
   import { getUserInfo, saveUserInfo } from '@/sheep/api/user';
 
@@ -394,6 +418,91 @@
 
   // getUserInfo()
 
+  const isHideUploadBtn = computed(() => {
+    if (!form.value.color) {
+      return false;
+    }
+
+    if (!form.value.feeling_of_quantity) {
+      return false;
+    }
+
+    if (!form.value.right_and_wrong) {
+      return false;
+    }
+
+    if (!form.value.dynamic_and_static) {
+      return false;
+    }
+
+    if (!form.value.somatotype) {
+      return false;
+    }
+
+    if (!form.value.question.length) {
+      return false;
+    }
+
+    if (!form.value.purpose.length) {
+      return false;
+    }
+
+    if (!form.value.occasion_dressing.length) {
+      return false;
+    }
+
+    return true;
+  });
+
+  const selectPic = async (e) => {
+    console.log('selectPic: ', e.tempFilePaths[0]);
+
+    uni.showLoading({
+      icon: 'loading',
+      title: '',
+    });
+
+    const userInfo = await getUserInfo();
+
+    await saveUserInfo({
+      ...JSON.parse(userInfo.data.dataJson),
+      ...form.value,
+      question: form.value.question.toString(),
+      purpose: form.value.purpose.toString(),
+      occasion_dressing: form.value.occasion_dressing.toString(),
+    }).then(() => {
+      uni.showLoading({
+        icon: 'loading',
+        title: '',
+      });
+      uni.uploadFile({
+        url: 'https://puton.huimeimeta.com/app-api/cloth/uploadFace',
+        filePath: e.tempFilePaths[0],
+        name: 'file',
+        formData: {},
+        header: {
+          Authorization: getAccessToken(),
+        },
+        success: (res) => {
+          console.log('上传成功', typeof res.data);
+          console.log('res.data.code: ', JSON.parse(res.data));
+
+          if (JSON.parse(res.data).code === 200) {
+            window.location.href = `https://face-canvas.huimeimeta.com/?img=${
+              JSON.parse(res.data).result.fileUrl
+            }&token=${getAccessToken()}`;
+          }
+
+          uni.hideLoading();
+        },
+
+        complete: () => {
+          uni.hideLoading();
+        },
+      });
+    });
+  };
+
   const nextStep = async () => {
     if (!form.value.color) {
       uni.showToast({
@@ -472,14 +581,14 @@
       uni.chooseImage({
         count: 1, //默认9
         sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
-        sourceType: ['album'], //从相册选择
+        sourceType: ['album', 'camera'], //从相册选择
         success: function (res) {
           console.log(JSON.stringify(res.tempFilePaths));
 
           uni.showLoading({
             icon: 'loading',
-            title: ''
+            title: '',
-          })
+          });
 
           uni.uploadFile({
             url: 'https://puton.huimeimeta.com/app-api/cloth/uploadFace',
@@ -487,26 +596,28 @@
             name: 'file',
             formData: {},
             header: {
-              Authorization: getAccessToken()
+              Authorization: getAccessToken(),
             },
             success: (res) => {
               console.log('上传成功', typeof res.data);
               console.log('res.data.code: ', JSON.parse(res.data));
 
               if (JSON.parse(res.data).code === 200) {
-                window.location.href = `https://face-canvas.huimeimeta.com/?img=${JSON.parse(res.data).result.fileUrl}&token=${getAccessToken()}`
+                window.location.href = `https://face-canvas.huimeimeta.com/?img=${
+                  JSON.parse(res.data).result.fileUrl
+                }&token=${getAccessToken()}`;
               }
             },
 
             complete: () => {
-              uni.hideLoading()
+              uni.hideLoading();
             },
           });
         },
 
         fail: (fail) => {
           console.log('fail: ', fail);
-          uni.showToast('上传图片报错了')
+          uni.showToast('上传图片报错了');
         },
       });
     });
@@ -592,8 +703,8 @@
 
     .btn-bottom {
       margin-top: 40rpx;
-      // padding-bottom: 40rpx;
       padding: 20rpx 40rpx;
+      position: relative;
 
       .next-btn {
         height: 80rpx;
@@ -602,8 +713,17 @@
         color: white;
         font-size: 32rpx;
       }
-    }
 
+      .custom-upload {
+        // background-color: red;
+        position: absolute;
+        inset: 0;
+        opacity: 0;
+        :deep(.file-picker__box) {
+          width: 100% !important;
+        }
+      }
+    }
 
     .dialog {
       position: fixed;
@@ -623,27 +743,39 @@
         font-size: 32rpx;
         .next-input {
           height: 80rpx;
+          width: 200rpx;
           border-radius: 16rpx;
           background-color: #0d232c;
           color: white;
           font-size: 32rpx;
           position: relative;
 
-          // &:after {
+          :deep(.file-picker__box-content) {
-          //   content: '点击上传头像';
+            background-color: pink;
-          //   position: absolute;
+            width: 100%;
-          //   left: 50%;
+            height: 100%;
-          //   top: 50%;
+            position: absolute;
-          //   color: white;
+            inset: 0;
-          //   font-size: 28rpx;
+            padding: 300rpx;
-          //   transform: translate(-50%, -50%);
+            z-index: 200;
-          //   font-weight: bolder;
+            opacity: 0;
-          // }
-        }
-      }
-    }
           }
 
+          // position: relative;
 
-
+          &:after {
+            content: '点击上传头像';
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            color: white;
+            font-size: 28rpx;
+            transform: translate(-50%, -50%);
+            font-weight: bolder;
+            z-index: 100;
+          }
+        }
+      }
+    }
+  }
 </style>

pages/report/index.vue

@@ -313,6 +313,7 @@
     <button class="next-btn" @click="openEmailDialog">发送到邮件</button>
   </view>
 
+<!--
   <view class="m-dialog" v-if="dialog.visible">
     <div class="m-dialog-main">
       <div class="email">
@@ -326,7 +327,7 @@
 
       <button class="btn" @click="sendEmail">发送</button>
     </div>
-  </view>
+  </view> -->
 </template>
 
 <script setup>
@@ -887,16 +888,14 @@
     visible: false,
   });
 
-  const openEmailDialog = () => {
+
+  const openEmailDialog = async () => {
     console.log('openEmailDialog: ');
+    const emailVal = window.prompt('请输入邮箱')
 
-    dialog.value.visible = true;
-  };
-
-  const sendEmail = async () => {
     const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
 
-    if (!emailRegex.test(email.value)) {
+    if (!emailRegex.test(emailVal)) {
       uni.showToast({ title: '请输入正确的邮箱', icon: 'none' });
       return;
     }
@@ -904,7 +903,7 @@
     const res = await sendMail({
       timeout: 100 * 1000,
       pageUrl: window.location.href,
-      email: email.value,
+      email: emailVal
     });
 
     if (res.data.code == 0) {
@@ -913,6 +912,8 @@
 
       uni.showToast({ title: '已经进入发送队列，稍后请查收邮件', icon: 'none' });
     }
+
+    // dialog.value.visible = true;
   };
 </script>