提交自提预览

src/views/distribution/inventory/distrilbutionBillLadingList.vue

@@ -45,6 +45,9 @@
             <el-button type="danger" icon="el-icon-delete" v-if="permission.distrilbutionBillLadingList_export"
               @click="handleExportInfo" plain>导出
             </el-button>
+
+            <el-button type="primary" @click="printBatchOrder">批量打印</el-button>
+
           </div>
           <!-- 头部右侧按钮模块 -->
           <div class="avue-crud__right">
@@ -67,6 +70,9 @@
             <el-text type="primary" text icon="el-icon-edit" @click="handleEdits(slotProps.scope)"
               v-if="permission.distrilbutionBillLadingList_edit && slotProps.scope.row.conditions < 20">编辑提货信息</el-text>
             <!--            <el-button size="small" type="danger" icon="el-icon-edit" text @click="handleDeleteOwn(slotProps.scope)">删除</el-button>-->
+
+            <el-text size="small" text 
+              @click="handlePreview(slotProps.scope.row)">打印</el-text>
           </template>
         </tablecmt>
       </el-row>
@@ -115,6 +121,31 @@
           </span>
         </template>
       </el-dialog>
+
+      
+
+  <!-- 打印模块 -->
+  <el-dialog title="二维码" :visible.sync="isShow" width="780px" v-model="isShow">
+        <div>
+          <div v-html="html"></div>
+
+          <!-- <div v-for="(item,index) in qrCodeObj">
+            <el-row>
+              <el-col :span="24" >
+                <el-image  width="10" height="10" w-full  :key="index" :src="item " alt="Preview Image"/>
+              </el-col>
+            </el-row>
+          </div> -->
+        </div>
+        <span slot="footer" class="dialog-footer">
+          <!--    <el-button type="primary" @click="ddd">导 出</el-button>-->
+          <el-button type="primary" @click="printTemplate">打 印</el-button>
+          <el-button type="primary" @click="isShow = false">确 定</el-button>
+          <el-button @click="isShow = false">取 消</el-button>
+        </span>
+      </el-dialog>
+
+
     </div>
     <!-- <div class="avue-crud" :style="`height:`+ height ">
       <el-form :disabled="view" ref="form" :model="form" label-width="80px">
@@ -284,6 +315,9 @@ import {
   getListOwnNUm,
   getBillLadingExport,
 } from '@/api/distribution/distrilbutionBillLading';
+import {
+  printBatch,
+} from '@/api/distribution/distributionDeliveryList';
 import option from '@/option/distribution/distrilbutionBillLading';
 import { mapGetters } from 'vuex';
 import { getDictionaryBiz } from '@/api/system/dict';
@@ -309,7 +343,7 @@ export default {
           label: '提货批次',
           type: 2,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: true,
           sortable: true,
@@ -330,7 +364,7 @@ export default {
           label: '运单号',
           type: 2,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -340,7 +374,7 @@ export default {
           label: '收货单位',
           type: 2,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -360,7 +394,7 @@ export default {
           label: '联系电话',
           type: 2,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -381,7 +415,7 @@ export default {
           label: '入库时间',
           type: 4,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -391,7 +425,7 @@ export default {
           label: '到付运费',
           type: 1,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -428,10 +462,10 @@ export default {
         },
         {
           prop: 'otherFee',
-          label: '其他增值费用',
+          label: '增值费用',
           type: 1,
           values: '',
-          width: '150',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -451,7 +485,7 @@ export default {
           label: '应提件数',
           type: 1,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -461,7 +495,7 @@ export default {
           label: '实提件数',
           type: 1,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -471,7 +505,7 @@ export default {
           label: '品牌',
           type: 2,
           values: '',
-          width: '130',
+          width: '120',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -481,7 +515,7 @@ export default {
           label: '货品信息',
           type: 2,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: true,
@@ -491,7 +525,7 @@ export default {
           label: '提货手机',
           type: 2,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: false,
@@ -511,7 +545,7 @@ export default {
           label: '提货车牌',
           type: 2,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: false,
@@ -521,7 +555,7 @@ export default {
           label: '提货证件',
           type: 2,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: false,
@@ -531,7 +565,7 @@ export default {
           label: '证件类型',
           type: 3,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: false,
@@ -541,7 +575,7 @@ export default {
           label: '状态',
           type: 1,
           values: '',
-          width: '130',
+          width: '100',
           checkarr: [],
           fixed: false,
           sortable: false,
@@ -551,7 +585,7 @@ export default {
           label: '费用合计',
           type: 1,
           values: '',
-          width: '130',
+          width: '140',
           checkarr: [],
           fixed: false,
           sortable: false,
@@ -573,6 +607,10 @@ export default {
       height: 0,
       // 弹框标题
       title: '',
+            // 打印模版
+            html: '',
+      // 是否显示打印模版
+      isShow: false,
       // 是否展示弹框
       box: false,
       // 是否显示查询
@@ -768,9 +806,7 @@ export default {
     handleRemove(file, fileList) {
       console.log(file, fileList);
     },
-    handlePreview(file) {
+
-      console.log(file);
-    },
     textbox(e, index) {
       console.log('e,index', e, index);
       this.costList[index + 1] = e;
@@ -830,9 +866,7 @@ export default {
           return;
         }
         for (let a = 0; a < clientType.length; a++) {
-          // console.log("进来了",clientType[a].dictKey , costListName[i]);
           if (clientType[a].dictKey == costListName[i]) {
-            // console.log("进来了",clientType[a].dictKey , costListName[i]);
             let zhi = costList[costListName[i]];
             if (!zhi) {
               this.pan = true;
@@ -927,7 +961,6 @@ export default {
           ids = this.ids;
           break;
       }
-      console.log('签收！！', ids);
       await getBillLadingDetail(ids);
     },
     //删除
@@ -943,6 +976,50 @@ export default {
         },
       });
     },
+
+
+    // 预览页面
+    async handlePreview(row){
+      console.log('row :>> ', row);
+      const res = await printBatch({ ids: row.id, type: 3 });
+      console.log('res :>> ', res);
+      const {
+        data: { code, data },
+      } = res;
+      if (code === 200) {
+        // 初始化打印页面
+        this.html = '';
+        data.forEach(item => {
+          this.html += item.templateHtml;
+        });
+        this.isShow = true;
+      }
+
+    },
+        /**
+     * 批量打印
+     */
+     async printBatchOrder() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning('请选择至少一条数据');
+        return;
+      }
+      this.isShow = true;
+      const res = await printBatch({ ids: Array.from(this.selectionList).join(','), type: 3 });
+      console.log('res :>> ', res);
+      const {
+        data: { code, data },
+      } = res;
+      if (code === 200) {
+        // 初始化打印页面
+        this.html = '';
+        data.forEach(item => {
+          this.html += item.templateHtml;
+        });
+      }
+    },
+
+
     handleEdits(row) {
       this.$router.push({
         path: '/distribution/inventory/distrilbutionBillLading',