feat(上报内容): 图片和视频拆开来分别上传

pages/record-content/index.vue

@@ -62,14 +62,14 @@
         -->
 
         <!--        上传照片-->
-        <view class="step_box">
+        <view v-for="option of uploadActionsOptions" class="step_box">
           <view class="tep_one">
             <image mode="aspectFill" class="tep_icon" src="/static/icon/ic_rw_zp@2x.png" />
-            <view class="one">{{ !showActive ? null : uploadTitle }}</view>
+            <view class="one">{{ !showActive ? null : getUploadTitle(option) }}</view>
           </view>
           <view class="photo_wrapper">
             <view class="photo_list">
-              <view class="photo_item" bindtap="preview" v-for="(item, index) in photoList" :key="item.id">
+              <view class="photo_item" bindtap="preview" v-for="(item, index) in photoList.filter(v => v.type === option.type)" :key="item.id">
                 <view v-if="item.status === 'loading'" class="photo_item--loading"> </view>
                 <view v-else @click="previewVideo(item, index)">
                   <!-- <image mode="aspectFill" class="upload_img" src="{{item}}" /> -->
@@ -85,7 +85,7 @@
                   <image @click.native.stop="cancel(item, index)" mode="aspectFill" class="upload_del" src="/static/icon/ic_zp_del@2x.png" />
                 </view>
               </view>
-              <view v-if="uploadVisible" class="photo_upload" @click="upload">
+              <view v-if="uploadVisible" class="photo_upload" @click="upload(option)">
                 <image mode="aspectFill" class="upload_icon" src="/static/icon/upload_icon@2x.png" />
               </view>
             </view>
@@ -261,14 +261,14 @@
           </view>
         </view>
 
-        <view class="step_box">
+        <view v-for="option of uploadActionsOptions" class="step_box">
           <view class="tep_one">
             <image mode="aspectFill" class="tep_icon" src="/static/icon/ic_rw_zp@2x.png" />
-            <view class="one">{{ uploadTitle }}</view>
+            <view class="one">{{ !showActive ? null : getUploadTitle(option) }}</view>
           </view>
           <view class="photo_wrapper">
             <view class="photo_list">
-              <view class="photo_item" bindtap="preview" v-for="(item, index) in photoList" :key="item.id">
+              <view class="photo_item" bindtap="preview" v-for="(item, index) in photoList.filter(v => v.type === option.type)" :key="item.id">
                 <view v-if="item.status === 'loading'" class="photo_item--loading"></view>
                 <view v-else @click="previewVideo(item, index)">
                   <!-- <image mode="aspectFill" class="upload_img" src="{{item}}" /> -->
@@ -284,7 +284,7 @@
                   <image @click.native.stop="cancel(item, index)" mode="aspectFill" class="upload_del" src="/static/icon/ic_zp_del@2x.png" />
                 </view>
               </view>
-              <view v-if="uploadVisible" class="photo_upload" @click="upload">
+              <view v-if="uploadVisible" class="photo_upload" @click="upload(option)">
                 <image mode="aspectFill" class="upload_icon" src="/static/icon/upload_icon@2x.png" />
               </view>
             </view>
@@ -682,21 +682,24 @@ export default {
      * 打开选择 上传图片或视频 操作菜单
      * @returns {Promise<void>}
      */
-    async upload() {
+    async upload(option) {
       if (this.address === '' || this.address === '点击授权获取位置信息') {
         uni.showModal({
           title: '提示',
-          content: `请获取地点后${this.uploadTitle}`,
+          content: `请获取地点后上传${option.name}`,
           showCancel: false,
         });
         return;
       }
+      this.onUpload(option)
+      /* 上传类型分开后直接打开
       if (this.isOnlyAllowUploadOneType) {
         // 跳过选择上传照片还是视频
         this.onUpload(this.uploadActionsOptions[0])
         return
       }
       this.$refs.uploadActionSheet.show = true;
+      */
     },
 
     /**
@@ -758,7 +761,7 @@ export default {
         if (type === 'video') {
           this.photoList = this.photoList.map((value, index) => ({
             ...value,
-            videoContext: uni.createVideoContext(`myVideo${index}`),
+            // videoContext: uni.createVideoContext(`myVideo${index}`),
           }));
         }
       };
@@ -887,7 +890,8 @@ export default {
     // 预览视频
     previewVideo(item, index) {
       if (item.type === 'video') {
-        this.photoList.at(index).videoContext.requestFullScreen();
+        const ctx = uni.createVideoContext(`myVideo${index}`)
+        ctx.requestFullScreen()
       }
       if (item.type === 'image') {
         uni.previewImage({
@@ -897,7 +901,7 @@ export default {
     },
 
     cancel(item, index) {
-      this.photoList.splice(index, 1);
+      this.photoList.splice(this.photoList.indexOf(item), 1);
     },
 
     onIllegalTimeConfirm(value) {
@@ -909,6 +913,10 @@ export default {
       if (!value) return '';
       return this.actionsOptions.find(({ id }) => id === value).name;
     },
+
+    getUploadTitle({ name, type }) {
+      return `上传${name}${type === 'image' ? `（${mustUploadImageCount}张）` : ''}`
+    },
   },
 };
 </script>