新增批量删除和打印运单按钮

src/views/kaihe/domesticTrade/orderInformation/index.vue

@@ -564,9 +564,22 @@
             >保 存
             </el-button
             >
+            <el-button
+              type="danger"
+              size="small"
+              :disabled="selection.length === 0"
+              @click="deleteAll"
+              v-if="form.fCargoPlanning == 1"
+            >批量删除</el-button>
+            <el-button
+              type="warning"
+              size="small"
+              @click="dialogPrint"
+              :disabled="dataList.length === 0"
+            >打印运单</el-button>
           </div>
         </div>
-        <el-table :data="dataList" style="width: 100%;">
+        <el-table :data="dataList" style="width: 100%;" @selection-change="Selectinventory">
           <el-table-column type="selection" width="55" align="center"/>
           <el-table-column label="序号" type="index" width="80"/>
           <el-table-column label="箱号" align="center" prop="fCntrno">
@@ -1323,7 +1336,7 @@
       >撤销请核
       </el-button>
       <el-button type="primary"
-                 v-if="(form.fUpdeteStatus !== 4 && form.fUpdeteStatus !== 5 && form.fUpdeteStatus !== 6 && form.fUpdeteStatus !== 2) && (form.fBillstatus != 11 ||form.moneyStatus == null || form.moneyStatus != null && form.moneyStatus >= 4)"
+                 v-if="(form.fUpdeteStatus !== 4 && form.fUpdeteStatus !== 5 && form.fUpdeteStatus !== 6) && (form.fBillstatus !== 11 ||form.moneyStatus == 1 || (form.moneyStatus != null && form.moneyStatus >= 4))"
                  @click="addOrUpdateHandle('f_billstatus')"
       >查看审批
       </el-button>
@@ -1431,7 +1444,151 @@
         <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
       </span>
     </el-dialog>
-
+<!--    打印运单-->
+    <el-dialog
+      :visible.sync="dialogPrinting"
+      width="30%"
+      append-to-body
+      fullscreen
+      :show-close="false"
+      :close-on-press-escape="false"
+      :before-close="dialogVisible = false"
+    >
+      <div ref="print" style="width: 99%;margin:1px auto auto;">
+        <div style="width: 100%;">
+          <div
+            style="width: 50%;height: 160px;float: left;justify-content:center;align-items:center;display:-webkit-flex">
+            <div>
+              <h1>青岛凯和志诚物流有限公司</h1>
+              <h3 style="text-align: center">水路集装箱货物运单</h3>
+            </div>
+          </div>
+          <div
+            style="width: 50%;height: 160px;float: left;justify-content:center;align-items:center;display:-webkit-flex">
+            <div style="width: 500px;border: 1px solid #cccccc;padding: 10px">
+              <h4 style="margin: 0">1、本运单一是四联，第一联退回发货人或托运人，做为目的港收货人提货凭证。</h4>
+              <h4 style="margin: 0">2、运单一经题取货物后即失去提货效力。</h4>
+              <h4 style="margin: 0">3、运单非有价证券，不得流通或转让给非本运单指定的第三方。</h4>
+              <h4 style="margin: 0">4、托运人必须投保货物运输综合险，否则由此产生的损失由托运人自负。</h4>
+              <h4 style="margin: 0">5、船东过失承运人不承担责任，由过失方承担。</h4>
+            </div>
+          </div>
+        </div>
+        <div style="display:flex;justify-content: space-between;width: 61.3%;margin-left: 10px">
+          <p>离港日:{{ estimatedTime.fEtd }}</p>
+          <p>运单号:{{ form.fMblno }}</p>
+          <p>运输条款:{{ form.fServiceitems | fServiceitemsNameFormat(transport) }}</p>
+          <p>业务号:{{ form.fBillno }}</p>
+        </div>
+        <table border="1" style="border-collapse: collapse;width: 100%;text-align: center">
+          <tr class="listTd">
+            <td style="width: 9%;">船名</td>
+            <td style="width: 9%;">{{ form.fVslid | fVslidFormat(vslidList) }}</td>
+            <td style="width: 9%;">航次</td>
+            <td style="width: 11%;" colspan="2">{{ form.fVoyid | voyidNameFormat(voyidList) }}</td>
+            <td style="width: 9%;">装货港</td>
+            <td style="width: 9%;">{{ form.fLoadportid | portFormat(fMblnoOptions) }}</td>
+            <td style="width: 9%;">卸货港</td>
+            <td style="width: 11%;" colspan="2">{{ form.fDestportid | portFormat(fMblnoOptions) }}</td>
+            <td style="width: 12%;" rowspan="4" colspan="2">卸货人日期(章)</td>
+            <td style="width: 12%;" rowspan="4" colspan="2">收货人(章)</td>
+          </tr>
+          <tr class="listTd">
+            <td>第一接驳船</td>
+            <td></td>
+            <td>航次</td>
+            <td colspan="2"></td>
+            <td>第一换装港</td>
+            <td colspan="4"></td>
+          </tr>
+          <tr class="listTd">
+            <td>第二接驳船</td>
+            <td></td>
+            <td>航次</td>
+            <td colspan="2"></td>
+            <td>第二换装港</td>
+            <td colspan="4"></td>
+          </tr>
+          <tr class="listTd">
+            <td rowspan="3">托运人</td>
+            <td>全称</td>
+            <td rowspan="3" colspan="2">
+              {{ form.fShippername }}{{
+                form.fShipperattn ? ',' + form.fShipperattn : ''
+              }}{{ form.fShippertel ? ',' + form.fShippertel : '' }}
+            </td>
+            <td rowspan="3">收货人</td>
+            <td>全称</td>
+            <td colspan="4" rowspan="3">
+              {{ form.fConsigneername }}{{
+                form.fConsigneeattn ? ',' + form.fConsigneeattn : ''
+              }}{{ form.fConsigneetel ? ',' + form.fConsigneetel : '' }}
+            </td>
+          </tr>
+          <tr class="listTd">
+            <td>地址:电话</td>
+            <td>地址:电话</td>
+            <td rowspan="3" colspan="2">托运人(签盖)</td>
+            <td rowspan="3" colspan="2">承运人(签盖)</td>
+          </tr>
+          <tr class="listTd">
+            <td>银行:帐号</td>
+            <td>银行:帐号</td>
+          </tr>
+          <tr class="listTd">
+            <td rowspan="2" colspan="2">箱号</td>
+            <td rowspan="2" colspan="2">封号</td>
+            <td rowspan="2">批号</td>
+            <td rowspan="2">货名</td>
+            <td rowspan="2">件数</td>
+            <td rowspan="2">价值</td>
+            <td rowspan="2">托运人确定重量(吨)</td>
+            <td rowspan="2">计算重量(吨)</td>
+          </tr>
+          <tr>
+            <td :rowspan="dataList.length+2" align="center" colspan="4">
+              <img src="../../../../assets/images/chapter.png" alt="无图片" style="width: 50%;">
+            </td>
+          </tr>
+          <!--        此处为遍历列表-->
+          <tr class="listTd" v-for="(item,index) in dataList" :key="index">
+            <td colspan="2">{{ item.fCntrno }}</td>
+            <td colspan="2">{{ item.fSealno }}</td>
+            <td></td>
+            <td>{{ item.fGoodsid | goodsFormat(goodsOptions) }}</td>
+            <td>{{ item.fCntrid | cntrFormat(cntrOptions) }}</td>
+            <td></td>
+            <td></td>
+            <td>{{ item.fCntrweight }}</td>
+          </tr>
+          <tr class="listTd">
+            <td rowspan="5">托运人/发货人须知</td>
+            <td colspan="4" rowspan="5" style="text-align: left;padding: 10px;">
+              1、粗线内各栏由发货人填写，如有更改时，须在更改处盖章；订舱委托书下条款及运单均为本运输合同组成部分，发货人已充分阅读并同意该部分条款。<br>2、按规定正确、清楚填写;并逐张盖上账号、公章，货名、件数、重量不得省略。由于申报不实给承运人、港口经营人造成损失的，托运人应当负赔偿责任；<br>3、托运人负责封箱，承运人对上述箱内货物的描述不知。<br>4、如超载引起事故，由装箱人负责；<br>5、为确保货物安全，货物装箱前请先验箱，无异议视为集装箱箱况完好；<br>6、严禁将危险货物、腐蚀箱体的货物及国家禁运货物装入箱内。<br>7、与本运单有关的任何争议，各方当事人一致同意选择由青岛海事法院管辖
+            </td>
+            <td rowspan="4">箱量合计：</td>
+            <td rowspan="4"></td>
+            <td rowspan="4">备注：</td>
+            <td rowspan="4" colspan="2"></td>
+          </tr>
+          <tr></tr>
+          <tr></tr>
+          <tr></tr>
+          <tr class="listTd">
+            <td style="height: 40px;">收费项目</td>
+            <td>收费明细</td>
+            <td></td>
+            <td>收费金额</td>
+            <td colspan="2"></td>
+            <td colspan="2">预付/到付</td>
+          </tr>
+        </table>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogPrinting = false">取 消</el-button>
+        <el-button type="primary" @click="Printing">打 印</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -1449,7 +1606,9 @@ import {
   portInquiry,
   nameOfVessel,
   voyageNumber,
-  reject
+  reject,
+  deleteAll,
+  shippingList
 } from '@/api/kaihe/domesticTrade/orderInformation'
 import Global from '@/layout/components/global'
 import { getToken } from '@/utils/auth'
@@ -1524,6 +1683,7 @@ export default {
   },
   data() {
     return {
+      selection: [],
       insurance:[],
       etentioncargo:[],
       vslidList:[],
@@ -1616,11 +1776,15 @@ export default {
       formList:{},
       approvalTwo:false,
       amountDr:null,
-      amountCr:null
+      amountCr:null,
+      actId: null,
+      // 打印弹窗
+      dialogPrinting: false,
     }
   },
   //页面跳转后传递参数
   activated() {
+    console.log(this.$route.query)
     if (this.$route.query.testing)this.dataElist = true
     this.modify = true
     let formDate
@@ -1628,6 +1792,7 @@ export default {
       formDate = {
         fId: JSON.parse(this.$route.query.list).billId
       }
+      this.actId = JSON.parse(this.$route.query.list).actId
       this.formList = formDate
       this.approVal = true
       this.cancelButton = false
@@ -1793,6 +1958,62 @@ export default {
       this.fDNameOptions = response.rows
     })
   },
+  filters: {
+    fServiceitemsNameFormat(row, transport) {
+      let name;
+      transport.map(e => {
+        if (row == e.dictValue) {
+          name = e.dictLabel;
+        }
+      })
+      return name;
+    },
+    fVslidFormat(row, vslidList) {
+      let name;
+      vslidList.map(e => {
+        if (row == e.fId) {
+          name = e.fName;
+        }
+      })
+      return name;
+    },
+    voyidNameFormat(row, voyidList) {
+      let name;
+      voyidList.map(e => {
+        if (row == e.fId) {
+          name = e.fNo;
+        }
+      })
+      return name;
+    },
+    portFormat(row, fMblnoOptions) {
+      let name;
+      fMblnoOptions.map(e => {
+        if (row == e.fId) {
+          name = e.fName;
+        }
+      })
+      return name;
+    },
+    goodsFormat(row, goodsOptions) {
+      let name;
+      goodsOptions.map(e => {
+        if (row == e.fId) {
+          name = e.fName;
+        }
+      })
+      return name;
+    },
+    cntrFormat(row, cntrOptions) {
+      let name;
+      cntrOptions.map(e => {
+        if (row == e.fId) {
+          name = e.fNo;
+        }
+      })
+      return name;
+    },
+  },
   methods: {
     rejectDeletion(){
       this.$confirm('驳回并删除, 是否继续?', '提示', {
@@ -2242,17 +2463,25 @@ export default {
         if (valid) {
           this.addOrUpdateVisib = true
           this.$nextTick(() => {
-            let actId = ''
-            if (this.form.fBillstatus < 6) {
-              actId = '410'
-              this.$refs.ApprovalComments.init(form.fId,status,actId,this.form.fMblno)
-            } else if(this.form.fBillstatus > 6 && this.form.fBillstatus < 11){
-              actId = '420'
-              this.$refs.ApprovalComments.init(form.fId, status,actId)
-            }else if (this.form.fBillstatus == 11 && this.form.moneyStatus != null && this.form.moneyStatus < 6) {
-              actId = '460'
-              this.$refs.ApprovalComments.init(form.fId,status,actId)
+            // let actId = ''
+            // if (this.form.fBillstatus < 6) {
+            //   actId = '410'
+            //   this.$refs.ApprovalComments.init(form.fId,status,actId,this.form.fMblno)
+            // } else if(this.form.fBillstatus > 6 && this.form.fBillstatus <= 11 && this.form.moneyStatus < 4){
+            //   actId = '420'
+            //   this.$refs.ApprovalComments.init(form.fId, status,actId)
+            // }else if (this.form.fBillstatus == 11 && this.form.moneyStatus >= 4 && this.form.moneyStatus < 6) {
+            //   actId = '460'
+            //   this.$refs.ApprovalComments.init(form.fId,status,actId)
+            // }
+            if (this.actId == '410') {
+              this.$refs.ApprovalComments.init(form.fId,status,this.actId,this.form.fMblno)
+            } else if (this.actId == '474') {
+              this.$refs.ApprovalComments.init(form.fId,'f_dismount_status',this.actId)
+            } else {
+              this.$refs.ApprovalComments.init(form.fId,status,this.actId)
             }
+
           })
         } else {
           this.$message.error('提单号为空，请维护提单号')
@@ -2329,16 +2558,17 @@ export default {
     addOrUpdateHandle(status) {
       this.addOrUpdateVisible = true
       let id = '448'
-      let actId = ''
-      if (this.form.fBillstatus < 6) {
-        actId = '410'
-      } else if (this.form.moneyStatus != null && this.form.moneyStatus < 6) {
-        actId = '460'
-      } else {
-        actId = '420'
-      }
+      // let actId = ''
+      // if (this.form.fBillstatus < 6) {
+      //   actId = '410'
+      // } else if (this.form.moneyStatus != null && this.form.moneyStatus < 6) {
+      //   actId = '460'
+      // } else {
+      //   actId = '420'
+      // }
+      if (this.actId == '474') status = 'f_dismount_status'
       this.$nextTick(() => {
-        this.$refs.addOrUpdate.init(this.form.fId, actId,status)
+        this.$refs.addOrUpdate.init(this.form.fId, this.actId,status)
       })
     },
     handleSelect() {
@@ -2455,7 +2685,73 @@ export default {
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.fId)
       this.select = selection
-    }
+    },
+    dialogPrint() {
+      // for (let item in this.transport) {
+      //   if (this.transport[item].dictValue == this.form.fServiceitems) {
+      //     this.$set(this.form, 'fServiceitemsName', this.transport[item].dictLabel);
+      //   }
+      // }
+      // this.fMblnoOptions.forEach(item => {
+      //   if (item.fId == this.form.fLoadportid) {
+      //     this.$set(this.form, 'fLoadportidName', item.fName);
+      //   }
+      //   if (item.fId == this.form.fDestportid) {
+      //     this.$set(this.form, 'fDestportidName', item.fName);
+      //   }
+      // });
+      // this.tableData.forEach(term => {
+      //   this.goods.forEach(item => {
+      //     if (item.fId == term.fGoodsid) {
+      //       term.fGoodsid = item.fName;
+      //     }
+      //   });
+      //   this.container.forEach(item => {
+      //     if (item.fId == term.fCntrid) {
+      //       term.fCntrid = item.fNo;
+      //     }
+      //   });
+      // });
+      this.dialogPrinting = true;
+    },
+    //确认打印
+    Printing() {
+      this.$printE(this.$refs.print);
+    },
+    Selectinventory(selection) {
+      this.selection = selection;
+    },
+    deleteAll() {
+      for (let item in this.selection) {
+        if (!this.selection[item].fId) return this.$message.error('存在未保存的数据,请先保存再批量删除!');
+      }
+      let list = [];
+      this.selection.forEach(item => list.push(item.fId));
+      list = JSON.stringify(list)
+        .replace(/\[|]/g, '');
+      this.$confirm('此操作将永久删除已选' + this.selection.length + '条箱信息, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          deleteAll(list).then(res => {
+            shippingList({fPid: this.form.fId}).then(res => {
+              this.dataList = res.rows;
+            })
+          })
+          this.$message({
+            type: 'success',
+            message: '删除成功!'
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消删除'
+          });
+        });
+    },
   }
 }
 </script>