使用原生手机拍照，优化企业微信拍照模糊问题

src/components/H5Camera.vue

@@ -1,12 +1,19 @@
 <template>
   <div class="h5Camera">
     <van-icon class="photo photos" name="photograph" size="22px" color="#969696" @click="camera" />
-    <input type="file" accept="image/*" capture="camera" id="h5Camera" />
+    <input type="file" accept="image/*" :capture="capture" id="h5Camera" />
   </div>
 </template>
 <script>
 export default {
   name: 'H5Camera',
+  props: {
+    capture: {
+      // 摄像头类型 camera：照相机；camcorder：摄像机；microphone：录音
+      type: String,
+      default: '',
+    },
+  },
   data() {
     return {
       imgUrl: '',

src/components/uploadVNormal.vue

@@ -1,11 +1,12 @@
 <template>
   <div class="questionNamep">
+    <!-- 0=企业微信，1=H5相机 -->
     <!-- 企业微信拍照 -->
-    <div class="cameraDiv" @click="uploadImg">
+    <div class="cameraDiv" @click="uploadImg" v-if="userInfo.photoMethod == '0'">
       <van-icon class="photo photos" name="photograph" size="22px" color="#969696" />
     </div>
     <!-- 原生自带拍照 -->
-    <H5Camera @getImg="getImg" />
+    <H5Camera @getImg="getImg" :capture="pictureSource == '1' ? '' : 'camera'" v-else />
     <div id="allmap"></div>
     <div class="mask" v-if="progressFlag">
       <el-progress
@@ -35,6 +36,7 @@ import H5Camera from '@/components/H5Camera';
 import axios from 'axios';
 import uploadAliOss from '@/utils/uploadAliOss';
 import { addH5Photo } from '@/api/H5Camera';
+import { mapState } from 'vuex';
 
 export default {
   name: 'uploadImg',
@@ -117,6 +119,11 @@ export default {
       default: '',
     },
   },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.user.userInfo,
+    }),
+  },
   data() {
     return {
       shows: false,
@@ -173,8 +180,12 @@ export default {
               this.toastLoading(0, '上传中...', true);
             }
             addH5Photo(form, this.controller ? this.controller.signal : null)
-              .then((res) => {})
-              .catch((error) => {});
+              .then((res) => {
+                this.requestThen(res);
+              })
+              .catch((error) => {
+                this.requestCatch(error);
+              });
           }
         })
         .catch((err) => {
@@ -335,34 +346,42 @@ export default {
       }
       addstorePhoto(form, this.controller ? this.controller.signal : null)
         .then((res) => {
-          this.toastLoading().clear();
-          if (res.code == -1) {
-            // 图匠图片校验接口超时
-            this.requestTimeOut(res);
-          } else if (res.code == 200) {
-            // 图匠校验结果返回
-            if (this.photoIdentifyType) {
-              // 重置loaidng状态
-              this.resetProgress();
-              this.imageAIVerifyFlag = true;
-              this.imageAIVerifyData = res.data;
-            } else {
-              // 正常流程
-              this.normalFlow(res);
-            }
-          } else {
-            this.resetProgress();
-            that.$toast('上传失败！');
-          }
+          this.requestThen(res);
         })
         .catch((error) => {
-          if (error.message === 'canceled') {
-            this.$toast('取消上传');
-            console.log('请求被取消:', error.message);
-          }
-          this.resetProgress();
+          this.requestCatch(error);
         });
     },
+    // 公用请求then
+    requestThen(res) {
+      this.toastLoading().clear();
+      if (res.code == -1) {
+        // 图匠图片校验接口超时
+        this.requestTimeOut(res);
+      } else if (res.code == 200) {
+        // 图匠校验结果返回
+        if (this.photoIdentifyType) {
+          // 重置loaidng状态
+          this.resetProgress();
+          this.imageAIVerifyFlag = true;
+          this.imageAIVerifyData = res.data;
+        } else {
+          // 正常流程
+          this.normalFlow(res);
+        }
+      } else {
+        this.resetProgress();
+        that.$toast('上传失败！');
+      }
+    },
+    // 公用请求catch
+    requestCatch(error) {
+      if (error.message === 'canceled') {
+        this.$toast('取消上传');
+        console.log('请求被取消:', error.message);
+      }
+      this.resetProgress();
+    },
     // 正常流程
     normalFlow(res) {
       this.$toast('上传成功！');

src/views/week/systemSettings.vue

@@ -30,6 +30,7 @@ export default {
     };
   },
   created() {
+    // 0=企业微信，1=H5相机
     this.switchChecked = this.userInfo.photoMethod == 0 ? false : true;
   },
   methods: {