适配入仓影像

src/views/ecw/order/stocking/components/MediaDialog.vue

+<script>
+import ImageAndVideoUpload from '@/components/ImageAndVideoUpload'
+
+export default {
+  components: {ImageAndVideoUpload},
+  props:{
+    value:{
+      type:Array,
+      default:() => []
+    },
+    readonly: Boolean
+  },
+  data(){
+    return {
+      show: false,
+      pictureUrls:[]
+    }
+  },
+  watch:{
+    show(){
+      if(!this.show){
+        this.$emit('close', this.pictureUrls)
+      }
+    },
+    pictureUrls(){
+      if(this.value == this.pictureUrls) return
+      this.$emit('input', this.pictureUrls)
+    }
+  },
+  created() {
+    this.pictureUrls = this.value
+    this.show = true
+  },
+  methods:{
+    onBeforeClose(){
+      this.show = false
+    }
+  }
+}
+</script>
+
+<template>
+  <el-dialog :visible.sync="show" :before-close="onBeforeClose">
+    <image-and-video-upload v-model="pictureUrls" readonly></image-and-video-upload>
+  </el-dialog>
+</template>

src/views/ecw/order/stocking/components/Package.vue

@@ -203,7 +203,14 @@
         </el-table>
       </el-form>
     </el-card>
-
+    <el-card style="margin-top: 15px;">
+      <div slot="header" class="clearfix">
+        <span style="font-size: 18px">{{$t('入仓影像')}}</span>
+      </div>
+      <div>
+        <image-and-video-upload :fileSize="50" :isShowTip="true" v-model="pictureUrls" ></image-and-video-upload>
+      </div>
+    </el-card>
     <span slot="footer">
         <el-button type="primary" @click="handleSubmit">{{ $t('完成打包') }}</el-button>
         <el-button @click="handleClose">{{ $t('返回')}}</el-button>
@@ -223,11 +230,13 @@ import {getProductAttrList} from "@/api/ecw/productAttr"
 import {getProductTypeList} from "@/api/ecw/productType"
 import {addProduct} from "@/api/ecw/product"
 import WarehouseRecordDetail from "@/views/ecw/order/warehousing/components/WarehouseRecordDetail.vue";
+import ImageAndVideoUpload from "@/components/ImageAndVideoUpload/index.vue";
 
 export default {
   name: "Package",
 
   components: {
+    ImageAndVideoUpload,
     WarehouseRecordDetail,
     ProductSelector,
     WarehouseAreaSelect,
@@ -423,11 +432,14 @@ export default {
       //类型列表
       typeList: [],
       // 特性列表
-      attrList: []
+      attrList: [],
+      pictureUrls: []
     }
   },
-  created() {
+  async created() {
     this.visible = true
+    this.$nextTick()
+    this.pictureUrls = this.orderItemB.pictureUrls || []
   },
   methods: {
     init(){
@@ -538,6 +550,7 @@ export default {
               orderLocationCreateReqVOList: e.orderLocationBackVOList
             }
           }),
+          pictureUrls: this.pictureUrls
         }).then(r => {
           if (r.data) {
             this.$message.success('打包成功')

src/views/ecw/order/stocking/index.vue

@@ -9,7 +9,58 @@
     <el-table
       v-if="order.orderItemVOList && order.orderItemVOList.length > 0 && orderItemList && orderItemList.length > 0"
       :data="order.orderItemVOList || []"
+      default-expand-all
       style="width: 100%">
+      <!--入仓记录-->
+      <el-table-column type="expand">
+        <template slot-scope="props">
+          <div style="padding-left: 80px">
+            <el-table v-if="wareItem(props.row.orderItemId).orderWarehouseInBackItemDoList" :data="wareItem(props.row.orderItemId).orderWarehouseInBackItemDoList">
+              <el-table-column :label="$t('序号')">
+                <template slot-scope="{row, column, $index}">
+                  {{$index + 1}}
+                </template>
+              </el-table-column>
+              <el-table-column prop="cartonsNum" :label="$t('箱数')"></el-table-column>
+              <el-table-column prop="areaName" :label="$t('入仓类型')">
+                <template v-slot="{row}">
+                  <dict-tag :type="DICT_TYPE.WAREHOUSING_SPECIFICATION_TYPE" :value="row.specificationType"></dict-tag>
+                </template>
+              </el-table-column>
+              <el-table-column prop="areaName" :label="$t('包装类型')">
+                <template v-slot="{row}">
+                  <dict-tag :type="DICT_TYPE.ECW_PACKAGING_TYPE" :value="row.unit"></dict-tag>
+                </template>
+              </el-table-column>
+              <el-table-column prop="areaName" :label="$t('长')">
+                <template v-slot="{row}">{{row.boxGauge.split('*')[0]}}</template>
+              </el-table-column>
+              <el-table-column prop="areaName" :label="$t('宽')">
+                <template v-slot="{row}">{{row.boxGauge.split('*')[1]}}</template>
+              </el-table-column>
+              <el-table-column prop="areaName" :label="$t('高')">
+                <template v-slot="{row}">{{row.boxGauge.split('*')[2]}}</template>
+              </el-table-column>
+              <el-table-column prop="volume" :label="$t('体积')+'(m³)'"></el-table-column>
+              <el-table-column prop="weight" :label="$t('重量')+'(kg)'"></el-table-column>
+              <el-table-column prop="quantityAll" :label="$t('数量') + '(个)'"></el-table-column>
+              <el-table-column prop="expressNo" :label="$t('快递单号')"></el-table-column>
+              <!--<el-table-column prop="areaName" :label="$t('首次入仓时间')"></el-table-column>-->
+              <el-table-column prop="areaName" :label="$t('储位')">
+                <template v-slot="{row}">
+                  {{row.orderLocationStr4Merge}}
+                </template>
+              </el-table-column>
+              <el-table-column prop="areaName" :label="$t('影像')">
+                <template v-slot="{row}">
+                  <el-button type="text" @click="showMedia(props.row)">{{$t('查看')}}</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+        </template>
+      </el-table-column>
+
       <el-table-column
         type="index"
         width="50"
@@ -134,7 +185,7 @@
           <span style="font-size: 18px">{{$t('入仓影像')}}</span>
         </div>
         <div>
-          <image-and-video-upload :fileSize="50" :isShowTip="true" v-model="form.exceptionUrls" ></image-and-video-upload>
+          <image-and-video-upload :fileSize="50" :isShowTip="true" v-model="pictureUrls" readonly ></image-and-video-upload>
         </div>
       </el-card>
       <div style="text-align: center;margin-top: 15px">
@@ -171,6 +222,7 @@
       v-if="!!packageOrderItem"
       @close="onPackageClose"
     ></package>
+    <media-dialog v-if="curPictrues" :value="curPictrues" @close="curPictrues=null"></media-dialog>
   </div>
 </template>
 
@@ -195,11 +247,13 @@ import ImageAndVideoUpload from '@/components/ImageAndVideoUpload'
 import Package from './components/Package'
 import Template from "@/views/cms/template/index.vue";
 import {getProductAttrList} from "@/api/ecw/productAttr";
+import MediaDialog from "@/views/ecw/order/stocking/components/MediaDialog.vue";
 
 export default {
   name: "Stocking",
 
   components: {
+    MediaDialog,
     Template,
     orderBaseInfo,
     WarehouseAreaDialog,
@@ -274,7 +328,9 @@ export default {
       packageOrderItem: null,
       // 打包商品的入仓商品项
       packageWarehouseItem: null,
-      productAttrList: []
+      productAttrList: [],
+      // 当前查看的影像
+      curPictrues: null
     }
   },
 
@@ -365,6 +421,14 @@ export default {
       this.packageOrderItem=null;
       this.packageOrderItem=null;
       this.getList()
+    },
+    showMedia(orderItem){
+      console.log('查看影像', orderItem)
+      const wareItem = this.wareItem(orderItem.orderItemId)
+      if(!wareItem.pictureUrls){
+        return this.$message.info(this.$t('暂无影像'))
+      }
+      this.curPictrues = wareItem.pictureUrls || []
     }
   },
   watch: {
@@ -422,6 +486,15 @@ export default {
         })
         return  arr.join(",")
       }
+    },
+    // 全部入仓记录的入仓影像
+    pictureUrls(){
+      let urls = []
+      this.orderItemList.forEach(item => {
+        console.log('pictureUrls', item.pictureUrls)
+        urls = urls.concat(item.pictureUrls || [])
+      })
+      return urls
     }
   }
 }