Jelajahi Sumber

Merge branch 'feature_20260330_拜访连拍速度优化' into release

# Conflicts:
#	src/components/deleteUploadImgTaskPhoto.vue
#	src/views/deviceWithin/storeVisit.vue
#	src/views/deviceWithin/taskPhotoTaking.vue
zhujindu 12 jam lalu
induk
melakukan
b7c8006bdf

+ 158 - 44
src/components/deleteUploadImgTaskPhoto.vue

@@ -4,7 +4,6 @@
       <van-col span="6" style="" v-if="insert == 'true' && formData.processStatus != 1">
         <div class="addImg">
           <uploadVNormalTaskPhoto
-            :imgArr="imgs"
             :shouws="true"
             :storeGroupId="storeGroupId"
             :taskList="taskIds.split(',')"
@@ -20,39 +19,27 @@
             ref="uploadVNormal" />
         </div>
       </van-col>
-      <van-col span="6" v-for="(urls, index) in imgs" :key="urls.id">
+      <van-col span="6" v-for="(urls, index) in imgArr" :key="index">
         <div class="imgview">
           <van-icon
-            v-if="
-              (photoIdentifyType != 6 || photoIdentifyType != 7) &&
-              insert == 'true' &&
-              formData.processStatus != 1
-            "
+            v-if="insert == 'true' && formData.processStatus != 1"
             name="close"
             size="16"
-            v-on:click="deleteImg(index, urls.fileIdSplicing)" />
+            v-on:click="deleteImg(index, urls)" />
           <img
-            v-if="urls.type == '2'"
-            :src="urls.fileUrl"
+            :src="urls.fileUrl || urls.mediaFileUrl"
             width="100px"
             height="100px"
             @click="previewsImg(index)" />
-          <img
+          <!-- <img
             v-else
             :src="urls.fileUrl"
             width="100px"
             height="100px"
-            @click="previewsImg(index)" />
+            @click="previewsImg(index)" /> -->
         </div>
       </van-col>
     </van-row>
-    <!--  <div style="padding: 10px 16px 0;">-->
-    <!--    <div class="img-box" v-for="(urls, index) in imgs" :key="index">-->
-    <!--      <van-icon name="clear" v-on:click="deleteImg(index,urls.id)"/>-->
-    <!--      <img v-if="urls.type=='2'" :src="urls.fileUrl" width="100px" height="100px" @click="previewsImg(index)"/>-->
-    <!--      <img v-else :src="urls.fileUrl" width="100px" height="100px" @click="previewsImg(index)"/>-->
-    <!--    </div>-->
-    <!--  </div>-->
   </div>
 </template>
 
@@ -60,9 +47,16 @@
 import { ImagePreview } from 'vant';
 import { removePhotoBatch } from '@/api/index';
 import uploadVNormalTaskPhoto from '@/components/uploadVNormalTaskPhoto';
+import { mapState } from 'vuex';
+import { getTicketFun } from '@/utils/TXApiFun';
 export default {
   name: 'deleteUploadImgTaskPhoto',
   components: { uploadVNormalTaskPhoto },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.user.userInfo,
+    }),
+  },
   props: {
     formData: {
       type: Object,
@@ -70,12 +64,6 @@ export default {
         return {};
       },
     },
-    imgs: {
-      type: Array,
-      default() {
-        return [];
-      },
-    },
     photoIdentifyType: {
       // 图匠识别目的(1:店招内容识别,2:门店代码识别,3:调色机识别,4:更换店招,6:sku陈列照)
       type: String,
@@ -119,10 +107,30 @@ export default {
       type: String,
       default: 'false',
     },
+    fileInfoList: {
+      type: Array,
+      default() {
+        return [];
+      },
+    },
   },
   watch: {
-    imgs: {
-      handler(val) {},
+    formData: {
+      handler(val) {
+        // <!-- 0=企业微信,1=H5相机 -->
+        if (this.userInfo.photoMethod == '1') {
+          this.imgArr = this.fileInfoList || [];
+        } else {
+          this.imgArr = [];
+          if (this.formData.mediaInfos) {
+            getTicketFun(['downloadImage']).then(() => {
+              this.toastLoading(0, '加载中,请稍候...', true);
+              let mediaInfosCopy = JSON.parse(JSON.stringify(this.formData.mediaInfos));
+              this.downloadImage(mediaInfosCopy);
+            });
+          }
+        }
+      },
       deep: true,
       immediate: true,
     },
@@ -130,34 +138,140 @@ export default {
   data() {
     return {
       url: process.env.VUE_APP_Target1 + process.env.VUE_APP_BASE_API,
+      imgArr: [],
+      mediaIds: [],
+      locationRemark: '',
+      isUploadImg: true,
     };
   },
   methods: {
-    deleteImg(index, fileIdList) {
-      removePhotoBatch({ fileIdList: fileIdList.split(',') }).then((res) => {
-        if (res.code == 200) {
-          this.$toast('删除成功!');
-          this.$emit('upDataDetail');
+    downloadImage(mediaInfos) {
+      if (!mediaInfos.length) {
+        this.toastLoading().clear();
+        return;
+      } else {
+        let mediaitem = mediaInfos.pop();
+        if (mediaitem.fileUrl) {
+          this.imgArr.push(mediaitem);
+          this.downloadImage(mediaInfos);
         } else {
-          this.$toast('删除失败!');
+          wx.downloadImage({
+            serverId: mediaitem.mediaId,
+            isShowProgressTips: 0, // 默认为1,显示进度提示
+            success: (res) => {
+              wx.getLocalImgData({
+                localId: res.localId,
+                success: (res2) => {
+                  this.imgArr.push({
+                    mediaId: mediaitem.mediaId,
+                    mediaFileUrl: res2.localData,
+                  });
+                  this.downloadImage(mediaInfos);
+                },
+                fail: (err) => {
+                  console.error('获取本地图片数据失败:', err);
+                  this.$toast('获取图片数据失败');
+                  this.toastLoading().clear();
+                  this.downloadImage(mediaInfos);
+                },
+              });
+            },
+            fail: (err) => {
+              console.error('下载图片失败:', err);
+              this.$toast('下载图片失败,请重试');
+              // 可以选择继续下载其他图片或停止
+              this.downloadImage(mediaInfos);
+            },
+          });
         }
-      });
+      }
     },
-    previewsImg(index) {
-      var arrimg = [];
-      for (var imgi = 0; imgi < this.imgs.length; imgi++) {
-        arrimg.push(this.imgs[imgi].fileUrl);
+    deleteImg(index, urls) {
+      // <!-- 0=企业微信,1=H5相机 -->
+      if (this.userInfo.photoMethod == '1') {
+        removePhotoBatch({ fileIdList: urls.fileIdSplicing.split(',') }).then((res) => {
+          if (res.code == 200) {
+            this.$toast('删除成功!');
+            this.$emit('upDataDetail');
+          } else {
+            this.$toast('删除失败!');
+          }
+        });
+      } else {
+        this.imgArr.splice(index, 1);
       }
+    },
+    previewsImg(index) {
+      let urls = this.imgArr.map((item) => item.fileUrl || item.mediaFileUrl);
       ImagePreview({
-        images: arrimg,
+        images: urls,
         startPosition: index,
-        onClose() {
-          // do something
-        },
       });
     },
-    newimgarr() {
-      this.$emit('upDataDetail');
+    newimgarr(data) {
+      const { localIds, locationRemark, source } = data;
+      this.locationRemark = locationRemark;
+      console.log(source);
+      // 0=企业微信,1=H5相机
+      if (this.userInfo.photoMethod == '0') {
+        this.isUploadImg = false;
+        const startIndex = this.imgArr.length;
+        this.imgArr = this.imgArr.concat(
+          localIds.map((item) => {
+            return {
+              mediaId: '',
+              mediaFileUrl: item,
+            };
+          }),
+        );
+        this.$nextTick(() => {
+          this.syncUpload(localIds, startIndex);
+        });
+      } else {
+        this.$emit('upDataDetail');
+      }
+      // if (this.isIOS()) {
+      //   this.imgArr = this.imgArr.concat([...localIds]);
+      //   // 解决ios微信localId无法直接使用的问题,获取base64后再上传
+      //   // this.setIosImg(localIds);
+      // } else {
+      //   this.imgArr = this.imgArr.concat([...localIds]);
+      // }
+      // this.$emit('upDataDetail');
+    },
+    syncUpload(localIds, baseIndex = 0, callback) {
+      if (!localIds.length) {
+        this.isUploadImg = true;
+        callback && callback();
+        return;
+      } else {
+        var localId = localIds.pop();
+        wx.uploadImage({
+          localId: localId,
+          isShowProgressTips: 0, // 默认为1,显示进度提示
+          success: (res) => {
+            const index = baseIndex + localIds.length;
+            if (this.imgArr[index]) {
+              this.imgArr[index].mediaId = res.serverId;
+            }
+            this.syncUpload(localIds, baseIndex, callback);
+          },
+        });
+      }
+    },
+    isIOS() {
+      return /iPhone|iPad|iPod/i.test(navigator.userAgent);
+    },
+    setIosImg(localIds) {
+      localIds.forEach((localId) => {
+        this.wx.getLocalImgData({
+          localId: localId, // 图片的localID
+          success: (res) => {
+            console.log(res.localData);
+            // this.imgArr.push(res.localData);
+          },
+        });
+      });
     },
   },
 };

+ 9 - 107
src/components/uploadVNormalTaskPhoto.vue

@@ -89,58 +89,6 @@ export default {
       type: [String, Number],
       default: '',
     },
-    // uploadid: {
-    //   type: String,
-    //   default: '',
-    // },
-    // secondCollectionId: {
-    //   type: [String, Number],
-    //   default: '',
-    // },
-    // firstCollectionId: {
-    //   type: String,
-    //   default: '',
-    // },
-    // fourthCollectionId: {
-    //   type: String,
-    //   default: '',
-    // },
-    // thirdCollectionId: {
-    //   type: String,
-    //   default: '',
-    // },
-    // type: {
-    //   type: Number,
-    //   default: 1,
-    // },
-    // imgArr: {
-    //   type: Array,
-    //   default() {
-    //     return [];
-    //   },
-    // },
-    // visitModel: {
-    //   type: String,
-    //   default: '1',
-    // },
-    // deviceCode: {
-    //   type: String,
-    //   default: '',
-    // },
-    // putInCode: {
-    //   type: String,
-    //   default: '',
-    // },
-    // equipmentCode: {
-    //   // 当前任务对应的资产编号
-    //   type: String,
-    //   default: '',
-    // },
-    // inStore: {
-    //   // 调色机是否在店
-    //   type: String,
-    //   default: '否',
-    // },
   },
   computed: {
     ...mapState({
@@ -271,25 +219,13 @@ export default {
                 success: function (res) {
                   let localIds = res.localIds;
                   that.localIdsArr = [];
-                  that.syncUpload(localIds);
-                  // var localIds = '';
-                  // if (res.localIds != undefined) {
-                  //   localIds = res.localIds[0];
-                  // } else {
-                  //   localIds = res.localId;
-                  // }
-                  // wx.uploadImage({
-                  //   localId: localIds, // 需要上传的图片的本地ID,由chooseImage接口获得
-                  //   isShowProgressTips: 0, // 默认为1,显示进度提示
-                  //   success: function (res) {
-                  //     that.mediaId = res.serverId;
-                  //     that.uploadImagev(addressesRemark);
-                  //   },
-                  //   fail: (err) => {
-                  //     that.$toast(err.errMsg);
-                  //     that.$toast(err.errCode);
-                  //   },
-                  // });
+                  that.$emit('newimgarr', {
+                    localIds: localIds,
+                    locationRemark: that.addressesRemark,
+                    collectionItemId: that.collectionItemId,
+                    source: 'weixin',
+                  });
+                  // that.syncUpload(localIds);
                 },
               });
             });
@@ -306,7 +242,7 @@ export default {
           isShowProgressTips: 1, // 默认为1,显示进度提示
           success: (res) => {
             this.localIdsArr.push(res.serverId);
-            this.syncUpload(localIds);
+            // this.syncUpload(localIds);
           },
         });
       }
@@ -315,19 +251,6 @@ export default {
       this.close();
       var that = this;
       var form = {
-        // mediaIds: [],
-        // fileUrl: '',
-        // objectType: that.objectType,
-        // storeGroupId: that.storeGroupId,
-        // taskList: that.taskList,
-        // visitsId: that.visitsId,
-        // visitSource: '1',
-        // locationRemark: that.addressesRemark,
-        // deviceCode: that.deviceCode, //设备编号
-        // putInCode: that.putInCode, //投放编号
-        // equipmentCode: that.equipmentCode,
-        // inStore: that.inStore,
-
         mediaIds: [], //	是	List<String>	图片素材id集合
         visitSource: '1', //	是	Long	拜访模式
         storeGroupId: that.storeGroupId, //	是	string	门店任务组,多个用逗号隔开
@@ -417,10 +340,8 @@ export default {
       });
       this.$emit('newimgarr', {
         fileInfoList: fileInfoList,
-        // fileUrl: res.data.url,
-        // id: res.data.fileId,
-        // type: 2,
         photoIdentifyType: this.photoIdentifyType,
+        source: 'H5',
       });
     },
     // 照片是否入库,1.照片识别三次不通过仍要上传,2.照片识别通过
@@ -431,23 +352,6 @@ export default {
         (this.photoIdentifyType != '6' || this.photoIdentifyType != '7')
       ) {
         var form = {
-          // mediaIds: [],
-          // fileUrl: '',
-          // objectType: that.objectType,
-          // visitSource: '1', //	Long	拜访模式
-          // storeGroupId: this.storeGroupId, //	string	门店任务组,多个用逗号隔开
-          // visitsId: that.visitsId,
-          // taskList: this.taskList, //	string	任务id
-          // locationRemark: this.addressesRemark, //	String	当前地址信息
-          // // firstCollectionId: this.firstCollectionId, //	Long	第一级采集项id,取当前采集项的字段就行
-          // // secondCollectionId: this.secondCollectionId, //	Long	第二级采集项id,取当前采集项的字段就行
-          // // putInCode: this.putInCode, //	String	当前任务对应的投放编号
-          // // deviceCode: this.deviceCode, //	String	当前任务对应的设备编号
-          // url: res.data.url, //	String	当前拍摄图片的url
-          // businessId: res.data.businessId, // 当前拍摄图片id
-          // feedbackMessage: res.feedbackMessage,
-          // equipmentCode: this.equipmentCode,
-          // inStore: this.inStore,
           mediaIds: [], //	是	List<String>	图片素材id集合
           visitSource: '1', //	是	Long	拜访模式
           storeGroupId: this.storeGroupId, //	是	string	门店任务组,多个用逗号隔开
@@ -506,8 +410,6 @@ export default {
 .questionNamep {
   font-size: 16px;
   color: #484848;
-  // line-height: 40px;
-  // padding: 0 15px;
   box-sizing: border-box;
   position: relative;
 

+ 73 - 20
src/views/deviceWithin/taskPhotoTaking.vue

@@ -41,9 +41,9 @@
                   </taskTips>
                 </template>
               </van-cell>
-              <deleteUploadImg
+              <deleteUploadImgTaskPhoto
+                ref="taskPhoto"
                 :formData="formData"
-                :imgs="item.fileInfoList"
                 :storeGroupId="storeGroupId"
                 :taskIds="taskIds"
                 :visitsId="visitsId"
@@ -54,7 +54,8 @@
                 :pictureSource="item.pictureSource"
                 :continuousShoot="item.continuousShoot"
                 :insert="insert"
-                :objectType="objectType"></deleteUploadImg>
+                :fileInfoList="item.fileInfoList"
+                :objectType="objectType"></deleteUploadImgTaskPhoto>
             </div>
           </div>
         </van-form>
@@ -127,10 +128,16 @@
 <script>
 import { getCollectionInfosBatch, addCollectionAnswerBatch, getVisitsDetail } from '@/api/index';
 import taskTips from './taskTips';
-import deleteUploadImg from '@/components/deleteUploadImgTaskPhoto';
+import deleteUploadImgTaskPhoto from '@/components/deleteUploadImgTaskPhoto';
+import { mapState } from 'vuex';
 export default {
   name: 'abnortaskPhotoTakingmalVisit',
-  components: { taskTips, deleteUploadImg },
+  components: { taskTips, deleteUploadImgTaskPhoto },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.user.userInfo,
+    }),
+  },
   data() {
     return {
       isEdit: true,
@@ -145,6 +152,7 @@ export default {
       taskPhotoRecognitionResult: null,
       spanArr: [],
       pos: 0,
+      mediaIds: [],
     };
   },
   activated() {
@@ -159,6 +167,13 @@ export default {
       this.getDetaile();
     }
   },
+  beforeRouteLeave(to, from, next) {
+    if (this.$refs.taskPhoto && this.$refs.taskPhoto[0]) {
+      this.$refs.taskPhoto[0].imgArr = [];
+    }
+    next();
+  },
+  watch: {},
   methods: {
     taskObjectSpanMethod({ row, column, rowIndex, columnIndex }) {
       const cellValue = row[column.property];
@@ -228,24 +243,62 @@ export default {
         this.taskPhotoRecognitionResult = item.taskPhotoRecognitionResult;
       });
     },
-    onSubmit() {
-      let formData = {
-        storeId: this.$route.query.storeId,
-        storeCode: this.$route.query.storeCode,
-        storeGroupId: this.$route.query.storeGroupId,
-        visitsId: this.visitsId,
-        taskList: this.taskIds.split(',').map((val) => Number(val)),
-        insert: true,
-        collectionAnswers: [],
-        checkUnManage: 'N',
-        deviceCode: '',
-        putInCode: '',
-        equipmentCode: '',
-      };
-      addCollectionAnswerBatch(formData).then((res) => {
+    waitUploadReady(interval = 1000) {
+      return new Promise((resolve) => {
+        const intervalId = setInterval(() => {
+          const taskPhoto = this.$refs.taskPhoto && this.$refs.taskPhoto[0];
+          if (taskPhoto && taskPhoto.isUploadImg) {
+            clearInterval(intervalId);
+            resolve();
+          }
+        }, interval);
+      });
+    },
+    async onSubmit() {
+      this.toastLoading(0, '提交中,请稍候...', true);
+      try {
+        const taskPhoto = this.$refs.taskPhoto && this.$refs.taskPhoto[0];
+        if (taskPhoto && !taskPhoto.isUploadImg) {
+          await this.waitUploadReady(1000);
+        }
+
+        let formData = {
+          storeId: this.$route.query.storeId,
+          storeCode: this.$route.query.storeCode,
+          storeGroupId: this.$route.query.storeGroupId,
+          visitsId: this.visitsId,
+          taskList: this.taskIds.split(',').map((val) => Number(val)),
+          insert: true,
+          collectionAnswers: [],
+          checkUnManage: 'N',
+          deviceCode: '',
+          putInCode: '',
+          equipmentCode: '',
+          collectionItemId: taskPhoto ? taskPhoto.collectionItemId : '',
+          objectType: this.$route.query.photoType,
+          locationRemark: taskPhoto ? taskPhoto.locationRemark : '',
+          mediaInfos: [],
+          isH5: this.userInfo.photoMethod == '1',
+        };
+        if (this.userInfo.photoMethod == '1') {
+          formData.mediaInfos = [];
+        } else if (taskPhoto) {
+          formData.mediaInfos = taskPhoto.imgArr;
+        }
+        await this.addCollection(formData);
+      } catch (err) {
+        this.$toast(err.message || '提交失败,请稍后再试');
+      } finally {
+        this.toastLoading().clear();
+      }
+    },
+    addCollection(formData) {
+      return addCollectionAnswerBatch(formData).then((res) => {
         if (res.code == 200) {
           localStorage.setItem('getRequestFlage', 'true');
           this.$router.go(-1);
+        } else {
+          this.$toast('提交失败,请重试');
         }
       });
     },