修改

src/components/Materialman/InventoryBosun.vue

@@ -75,7 +75,10 @@
             </td>
             <td><el-input type='text' class="w80" v-model="item.Unit_Money" @keyup.native="checkInteger(item,'Unit_Money')" /></td>
             <td style="width:300px;">{{item.Remark}}</td>
-            <td>{{item.CheckEmpName}}/{{item.CheckDate}}</td>
+            <td>
+              <div>{{item.CheckEmpName}}</div>
+              <div>{{item.CheckDate}}</div>
+            </td>
             <td>
               <span v-if="item.DealStatus==1" style="color:green">已处理</span>
               <span v-if="item.DealStatus==2" style="color:red">未处理</span>

src/components/Materialman/InventoryBoyi.vue

@@ -45,7 +45,10 @@
             </td>
             <td><el-input type='text' class="w80" v-model="item.Unit_Money" @keyup.native="checkInteger(item,'Unit_Money')" /></td>
             <td style="width:300px;">{{item.Remark}}</td>
-            <td>{{item.CheckEmpName}}/{{item.CheckDate}}</td>
+            <td>
+              <div>{{item.CheckEmpName}}</div>
+              <div>{{item.CheckDate}}</div>
+            </td>
             <td>
               <span v-if="item.DealStatus==1" style="color:green">已处理</span>
               <span v-if="item.DealStatus==2" style="color:red">未处理</span>

src/components/Materialman/InventoryDetail.vue

@@ -43,7 +43,7 @@
       <vxe-table stripe style="margin-top:15px" :loading="loading" :data="tableData">
         <vxe-table-column field="Name" title="状态" width="120">
           <template v-slot="{ row }">
-            <span class="ColorSpan huangSpan" v-if="row.CheckStatus == 1"  :id="row.SuppliesId">未</span>
+            <span class="ColorSpan huangSpan" v-if="row.CheckStatus == 1" :id="row.SuppliesId">未</span>
             <span class="ColorSpan greenSpan" v-if="row.CheckStatus == 2">已</span>
             <span class="ColorSpan purpleSpan" v-if="row.CheckStatus == 3">盈</span>
             <span class="ColorSpan redSpan" v-if="row.CheckStatus == 4">亏</span>
@@ -59,23 +59,26 @@
           </template>
         </vxe-table-column>
         <vxe-table-column field="InventoryNum" title="库存" width="80"></vxe-table-column>
-        <vxe-table-column field="RealityNum" title="实际数量" width="100">
+        <vxe-table-column field="RealityNum" title="实际数量" width="150">
           <template v-slot="{ row }">
-            <el-input type='text' class="w70" @keyup.native="checkInteger(row,'RealityNum')" :ref="'barCodeInput'+row.SuppliesId" v-model="row.RealityNum" />
+            <el-input type='text' class="w60" @keyup.native="checkInteger(row,'RealityNum')" size="small"
+              :ref="'barCodeInput'+row.SuppliesId" v-model="row.RealityNum" />
             <span class="InventoryMsg" :id="'barTishi'+row.SuppliesId">盘点数量+1</span>
           </template>
         </vxe-table-column>
         <vxe-table-column field="Remark" title="备注" width="200"></vxe-table-column>
         <vxe-table-column field="CheckEmpName" title="盘点人/时间" width="200">
           <template v-slot="{ row }">
-            <span v-if="row.CheckEmpName||row.CheckDate">{{row.CheckEmpName}}/{{row.CheckDate}}</span>
+            <div v-if="row.CheckEmpName">{{row.CheckEmpName}}</div>
+            <div v-if="row.CheckDate">{{row.CheckDate}}</div>
           </template>
         </vxe-table-column>
         <vxe-table-column field="ImageList" title="图片" width="200">
           <template v-slot="{row}">
-            <div class="Inven_imgList" v-for="(item,index) in row.ImageList" :key="index">
-              <img :src="item" />
+            <div class="Inven_imgList" v-for="(item,index) in row.ImageList" :key="index" v-if="index<3">
+              <img :src="item" @click="getImgView(row.ImageList)" />
             </div>
+            <div v-if="row.ImageList.length>3" class="Inventory_more">...</div>
           </template>
         </vxe-table-column>
 
@@ -129,7 +132,13 @@
         </div>
       </el-form>
     </el-dialog>
-
+    <el-dialog :visible.sync="isShowImageDialog" @closed="clearImg">
+      <el-carousel indicator-position="outside" height="600px">
+        <el-carousel-item v-for="(src,index) in InvimageList" :key="index">
+          <img :src="src" style="max-width: 100%;max-height: 100%;display: block; margin: 0 auto;" />
+        </el-carousel-item>
+      </el-carousel>
+    </el-dialog>
   </div>
 </template>
 
@@ -139,6 +148,10 @@
     components: {},
     data() {
       return {
+        //预览图片弹窗
+        isShowImageDialog: false,
+        //预览图
+        InvimageList:[],
         dialogState: false,
         morequery: true,
         dateList: [],
@@ -175,7 +188,7 @@
         //仓库id
         WarehouseId: 0,
         //CheckState用于管理操作按钮
-        CheckState:0
+        CheckState: 0
       };
     },
     mounted() {
@@ -189,7 +202,10 @@
         "/api/file/LocalFileUploadImportForSuppliesCheck";
     },
     methods: {
-
+      //关闭预览图片
+      clearImg() {
+        this.InvimageList = null
+      },
       currentChange(val) {
         this.msg.pageIndex = val;
         this.getList();
@@ -373,7 +389,7 @@
             file.file.size < 1024 ?
             file.file.size :
             (file.file.size / 1024).toFixed(0);
-            this.tableData.forEach(y => {
+          this.tableData.forEach(y => {
             if (y.Id == this.commonId) {
               y.ImageList.push(
                 this.domainManager().ViittoFileUrl + x.data.FilePath
@@ -384,12 +400,12 @@
         });
       },
       //批量保存
-      saveAll(){
-        let msg=[];
-        this.tableData.forEach(x=>{
-          let obj={
-            Id:x.Id,
-            RealityNum:x.RealityNum
+      saveAll() {
+        let msg = [];
+        this.tableData.forEach(x => {
+          let obj = {
+            Id: x.Id,
+            RealityNum: x.RealityNum
           }
           msg.push(obj);
         })
@@ -418,26 +434,28 @@
             this.loading = false;
             if (res.data.resultCode === 1) {
               var myData = res.data.data.GoodsModel;
-              var isInStore=true;
-              if(myData){
+              var isInStore = true;
+              if (myData) {
                 var scanMsg = {};
-                if(myData.WarehouseId!=this.WarehouseId){
+                if (myData.WarehouseId != this.WarehouseId) {
                   this.Error('该商品未在此仓库中！');
                   return;
-                }else{
-                  this.tableData.forEach((x,index)=>{
-                    if(x.SuppliesId==myData.SuppliesId){
+                } else {
+                  this.tableData.forEach((x, index) => {
+                    if (x.SuppliesId == myData.SuppliesId) {
                       x.RealityNum++;
-                      isInStore=false;
-                      document.getElementById(myData.SuppliesId).scrollIntoView({ behavior: 'smooth' })
-                      this.$refs["barCodeInput"+myData.SuppliesId].focus();
-                      document.getElementById("barTishi"+myData.SuppliesId).style.opacity=1;
-                      setTimeout(()=>{
-                        this.test("barTishi"+myData.SuppliesId);
-                      },3000)
+                      isInStore = false;
+                      document.getElementById(myData.SuppliesId).scrollIntoView({
+                        behavior: 'smooth'
+                      })
+                      this.$refs["barCodeInput" + myData.SuppliesId].focus();
+                      document.getElementById("barTishi" + myData.SuppliesId).style.opacity = 1;
+                      setTimeout(() => {
+                        this.test("barTishi" + myData.SuppliesId);
+                      }, 3000)
                     }
                   })
-                  if(isInStore){
+                  if (isInStore) {
                     this.Error('该商品未在列表中！');
                   }
                 }
@@ -450,8 +468,13 @@
           null
         );
       },
-      test(id){    
-        document.getElementById(id).style.opacity= 0;
+      test(id) {
+        document.getElementById(id).style.opacity = 0;
+      },
+      //点击图片进行预览
+      getImgView(imglist){
+        this.isShowImageDialog=true;
+        this.InvimageList=imglist;
       }
 
     }
@@ -460,6 +483,14 @@
 </script>
 
 <style>
+  .Inventory_more{
+    display: inline-block;
+    width: 10px;
+    height: 50px;
+    line-height: 50px;
+    position: relative;
+    top: -25px;
+  }
   .InventoryDetail .dateList .el-date-editor .el-range__icon {
     line-height: 24px;
 
@@ -513,8 +544,8 @@
     height: 100%;
   }
 
-  .w70 {
-    width: 70px !important;
+  .w60 {
+    width: 60px !important;
   }
 
   .Inven_imgList {
@@ -528,15 +559,20 @@
     width: 100%;
     height: 100%;
   }
-  .InventoryMsg{
+
+  .InventoryMsg {
     opacity: 0;
-    z-index:1500;
-    color:green;
-    -webkit-transition: opacity 1s ease-out; /* Saf3.2+, Chrome */  
-    -moz-transition: opacity 1s ease-out; /* FF4+ */  
-    -ms-transition: opacity 1s ease-out; /* IE10? */  
-    -o-transition: opacity 1s ease-out; /* Opera 10.5+ */  
-    transition: opacity 1s ease-out; 
+    z-index: 1500;
+    color: green;
+    -webkit-transition: opacity 1s ease-out;
+    /* Saf3.2+, Chrome */
+    -moz-transition: opacity 1s ease-out;
+    /* FF4+ */
+    -ms-transition: opacity 1s ease-out;
+    /* IE10? */
+    -o-transition: opacity 1s ease-out;
+    /* Opera 10.5+ */
+    transition: opacity 1s ease-out;
   }
 
 </style>

src/components/assetsman/InventoryDetails.vue

@@ -55,14 +55,16 @@
         <vxe-table-column field="Remark" title="备注" width="200"></vxe-table-column>
         <vxe-table-column field="CheckEmpName" title="盘点人/时间" width="200">
           <template v-slot="{ row }">
-            <span v-if="row.CheckEmpName||row.CheckDate">{{row.CheckEmpName}}/{{row.CheckDate}}</span>
+            <div v-if="row.CheckEmpName">{{row.CheckEmpName}}</div>
+            <div v-if="row.CheckDate">{{row.CheckDate}}</div>
           </template>
         </vxe-table-column>
         <vxe-table-column field="ImageList" title="图片" width="200">
           <template v-slot="{row}">
-            <div class="Inven_imgList" v-for="(item,index) in row.ImageList" :key="index">
-              <img :src="item" />
+            <div class="Inven_imgList" v-for="(item,index) in row.ImageList" :key="index" v-if="index<3">
+              <img :src="item" @click="getImgView(row.ImageList)" />
             </div>
+            <div v-if="row.ImageList.length>3" class="Inventory_more">...</div>
           </template>
         </vxe-table-column>
         <vxe-table-column field="ImageList" title="溢/损处理状态" width="200">
@@ -78,6 +80,15 @@
         :total="total" :current-page.sync="msg.pageIndex">
       </el-pagination>
     </div>
+
+    <el-dialog :visible.sync="isShowImageDialog" @closed="clearImg">
+      <el-carousel indicator-position="outside" height="600px">
+        <el-carousel-item v-for="(src,index) in InvimageList" :key="index">
+          <img :src="src" style="max-width: 100%;max-height: 100%;display: block; margin: 0 auto;" />
+        </el-carousel-item>
+      </el-carousel>
+    </el-dialog>
+
   </div>
 </template>
 
@@ -87,6 +98,10 @@
     components: {},
     data() {
       return {
+        //预览图片弹窗
+        isShowImageDialog: false,
+        //预览图
+        InvimageList:[],
         morequery: true,
         currentPage: 1,
         tableData: [],
@@ -133,7 +148,6 @@
             if (res.data.resultCode === 1) {
               this.tableData = res.data.data.pageData;
               this.total = res.data.data.count;
-              console.log(this.tableData, 'tabledata');
             } else {
               this.Error(res.data.message);
             }
@@ -171,12 +185,30 @@
           }
         });
       },
+      //点击图片进行预览
+      getImgView(imglist){
+        this.isShowImageDialog=true;
+        this.InvimageList=imglist;
+      },
+      //关闭预览图片
+      clearImg() {
+        this.InvimageList = null
+      },
+
     }
   };
 
 </script>
 
 <style>
+  .Inventory_more{
+    display: inline-block;
+    width: 10px;
+    height: 50px;
+    line-height: 50px;
+    position: relative;
+    top: -25px;
+  }
   .InventoryDetail .dateList .el-date-editor .el-range__icon {
     line-height: 24px;