新增批量打印功能

src/api/distribution/distributionDeliveryList.js

@@ -8,9 +8,9 @@ export const getList = (current, size, params) => {
       ...params,
       current,
       size,
-    }
-  })
-}
+    },
+  });
+};
 export const getPage = (current, size, params) => {
   return request({
     url: '/api/logpm-distribution/deliveryList/page',
@@ -19,9 +19,9 @@ export const getPage = (current, size, params) => {
       ...params,
       current,
       size,
-    }
-  })
-}
+    },
+  });
+};
 export const getstatistics = (current, size, params) => {
   return request({
     url: '/api/logpm-distribution/deliveryList/statistics',
@@ -30,26 +30,26 @@ export const getstatistics = (current, size, params) => {
       ...params,
       current,
       size,
-    }
-  })
-}
+    },
+  });
+};
 
-export const getDetail = (id) => {
+export const getDetail = id => {
   return request({
     url: '/api/logpm-distribution/deliveryList/detail',
     method: 'get',
     params: {
-      id
-    }
-  })
-}
-export const getOneclick = (data) => {
+      id,
+    },
+  });
+};
+export const getOneclick = data => {
   return request({
     url: '/api/logpm-distribution/deliveryList/oneloading',
     method: 'post',
-    data: data
-  })
-}
+    data: data,
+  });
+};
 
 export const getWrapdetail = (current, size, params) => {
   return request({
@@ -59,9 +59,9 @@ export const getWrapdetail = (current, size, params) => {
       ...params,
       current,
       size,
-    }
-  })
-}
+    },
+  });
+};
 export const getpackdetail = (current, size, params) => {
   return request({
     url: '/api/logpm-distribution/deliveryList/packdetail',
@@ -70,9 +70,9 @@ export const getpackdetail = (current, size, params) => {
       ...params,
       current,
       size,
-    }
-  })
-}
+    },
+  });
+};
 export const getinventorydetail = (current, size, params) => {
   return request({
     url: '/api/logpm-distribution/deliveryList/inventory',
@@ -81,9 +81,9 @@ export const getinventorydetail = (current, size, params) => {
       ...params,
       current,
       size,
-    }
-  })
-}
+    },
+  });
+};
 export const getorddetail = (current, size, params) => {
   return request({
     url: '/api/logpm-distribution/deliveryList/order',
@@ -92,116 +92,127 @@ export const getorddetail = (current, size, params) => {
       ...params,
       current,
       size,
-    }
-  })
-}
+    },
+  });
+};
 
-export const remove = (ids) => {
+export const remove = ids => {
   return request({
     url: '/api/logpm-distribution/deliveryList/remove',
     method: 'post',
     params: {
       ids,
-    }
-  })
-}
+    },
+  });
+};
 
-export const add = (row) => {
+export const add = row => {
   return request({
     url: '/api/logpm-distribution/deliveryList/submit',
     method: 'post',
-    data: row
-  })
-}
+    data: row,
+  });
+};
 
-export const update = (row) => {
+export const update = row => {
   return request({
     url: '/api/logpm-distribution/deliveryList/submit',
     method: 'post',
-    data: row
-  })
-}
+    data: row,
+  });
+};
 
 /**
  * 查询配送任务信息
  * @param id
  * @returns {AxiosPromise}
  */
-export const getDeliveryList = (id) => {
+export const getDeliveryList = id => {
   return request({
     url: '/api/logpm-distribution/deliveryList/getDeliveryList',
     method: 'get',
     params: {
       id,
-    }
-  })
-}/**
+    },
+  });
+};
+/**
  * 查询市配任务
  * @param id
  * @returns {AxiosPromise}
  */
-export const getMarketDeliveryList = (id) => {
+export const getMarketDeliveryList = id => {
   return request({
     url: '/api/logpm-distribution/deliveryList/getMarketDeliveryList',
     method: 'get',
     params: {
       id,
-    }
-  })
-}
+    },
+  });
+};
 
 /**
  * 修改配送计划
  * @param data
  * @returns {AxiosPromise}
  */
-export const updateDeliveryList = (data) => {
+export const updateDeliveryList = data => {
   return request({
     url: '/api/logpm-distribution/deliveryList/updateDeliveryList',
     method: 'put',
-    data: data
-  })
-}
+    data: data,
+  });
+};
 /**
  * 修改配送计划
  * @param data
  * @returns {AxiosPromise}
  */
-export const updateMarketDelivery = (data) => {
+export const updateMarketDelivery = data => {
   return request({
     url: '/api/logpm-distribution/deliveryList/updateMarketDelivery',
     method: 'put',
-    data: data
-  })
-}
+    data: data,
+  });
+};
 
 /**
  * 查询配送任务订单地图信息
  * @param data
  * @returns {AxiosPromise}
  */
-export const selectStockArticleAtlasInfo = (id) => {
+export const selectStockArticleAtlasInfo = id => {
   return request({
     url: '/api/logpm-distribution/deliveryList/selectStockArticleAtlasInfo',
     method: 'get',
     params: {
       id,
-    }
-  })
-}
+    },
+  });
+};
 
 /**
  * 取消配送任务
  * @param data
  * @returns {AxiosPromise}
  */
-export const cancelDeliveryListTask = (data) => {
+export const cancelDeliveryListTask = data => {
   return request({
     url: '/api/logpm-distribution/deliveryList/cancelMarketDeliveryListTask',
     method: 'post',
-    data: data
-  })
-}
-
-
+    data: data,
+  });
+};
 
+/**
+ * 批量打印
+ * @param data
+ * @returns {AxiosPromise}
+ */
+export const printBatch = data => {
+  return request({
+    url: '/api/logpm-distribution/deliveryList/printBatch',
+    method: 'post',
+    params: data,
+  });
+};

src/utils/print.js

@@ -0,0 +1,33 @@
+import { getLodop } from '@/utils/LodopFuncs';
+/**
+ * 根据传入的元素列表进行打印
+ * @param nodeList 元素节点列表
+ */
+const point = nodeList => {
+  // 直接调用时使用默认节点列表
+  if (!nodeList) nodeList = document.querySelectorAll('.el-dialog__body>div>div>div');
+  
+  // 初始化打印实例
+  let LODOP = getLodop();
+  
+  // 当列表内没有元素时, 退出函数
+  if (nodeList.length === 0) return;
+
+  // 循环列表内元素并打印
+  nodeList.forEach(orderNode => {
+    let templateData = orderNode.innerHTML;
+    LODOP.PRINT_INITA(1, 1, 900, 660, '测试预览功能');
+    LODOP.SET_PRINT_MODE('WINDOW_DEFPRINTER', 'Godex G500');
+    LODOP.SET_PRINT_STYLEA(0, 'TextNeatRow', true); //允许标点溢出，且英文单词拆开
+    // // 设置打印整宽且不变形
+    LODOP.SET_PRINT_MODE('PRINT_PAGE_PERCENT', 'Auto-Width');
+    // // 设置打印后自动关闭
+    LODOP.SET_PRINT_MODE('AUTO_CLOSE_PREWINDOW', 1);
+    // // data就是一段html文本
+    LODOP.ADD_PRINT_HTM('0%', '0%', '100%', '100%', templateData);
+    // LODOP.PREVIEW(); //预览(预览打印无脚标)
+    LODOP.PRINT(); //直接打印
+  });
+};
+
+export default point;

src/views/distribution/deliverylist/distributionDeliveryList.vue

@@ -91,7 +91,7 @@
                 <div class="avue-crud__header">
                     <!-- 头部左侧按钮模块 -->
                     <div class="avue-crud__left" style="margin-top: 20px">
-                                   <el-button type="primary" icon="el-icon-plus" @click="printBatch">批量打印</el-button>
+                                   <el-button type="primary" icon="el-icon-plus" @click="printBatchOrder">批量打印</el-button>
                         <!--            <el-button type="danger" icon="el-icon-delete" @click="handleDelete" plain>删 除</el-button>-->
                     </div>
                     <!-- 头部右侧按钮模块 -->
@@ -205,6 +205,26 @@
             :drawerShow="drawerShow"
             :columnList="columnList"
     ></edittablehead>
+
+      <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>
 </template>
 
 <script>
@@ -215,7 +235,8 @@
     update,
     remove,
     getPage,
-    getstatistics
+    getstatistics,
+    printBatch
   } from '@/api/distribution/distributionDeliveryList';
   import option from '@/option/distribution/distributionDeliveryList';
   import { mapGetters } from 'vuex';
@@ -223,6 +244,7 @@
   import { addIncrement } from '@/api/distribution/distributionStockArticle';
   import { getDriverList } from '@/api/basicdata/basicdataDriverArtery';
   import { getVehicleList } from '@/api/basicdata/basicdataVehicle';
+  import print from '@/utils/print';
 
   export default {
     data() {
@@ -239,6 +261,10 @@
         loading: true,
         // 是否为查看模式
         view: false,
+              // 打印模版
+      html: '',
+      // 是否显示打印模版
+      isShow: false,
         // 查询信息
         query: {},
         //数据统计
@@ -675,16 +701,14 @@
     /**
      * 批量打印
      */
-     printBatch(){
+     printBatchOrder(){
       if (this.selectionList.length === 0) {
         this.$message.warning("请选择至少一条数据");
         return;
       }
-
-      this.$message({
-            type: 'success',
-            message: '功能开发中!'
-          });
+      const ids = Array.from(this.selectionList).join(',')
+      printBatch({ids, type: 1})
+        this.isShow = true;
 
     },
       aaa() {
@@ -725,6 +749,9 @@
         this.onLoad(this.page);
       },
       selectionsc(value) {
+        console.log('value :>> ', value);
+        // 筛选出所有被选中项的id
+        this.selectionList = value.map(item => item.id)
       },
       editmap(scope) {
         const { row } = scope;
@@ -1011,6 +1038,13 @@
         // getDetail(row.id).then(res => {
         //   this.form = res.data.data;
         // });
+      },
+
+      /**
+       * 打印
+       */
+      printTemplate(){
+        print()
       }
     }
   };

src/views/distribution/inventory/distributionStockArticleDetails.vue

@@ -352,6 +352,7 @@ import { getListMaterial } from '@/api/basic/basicMaterial';
 import { getLodop } from '@/utils/LodopFuncs';
 import { getStockTemplate } from '@/api/distribution/distributionStockArticle';
 import dayjs from 'dayjs';
+import print from '@/utils/print';
 
 export default {
   data() {
@@ -840,39 +841,8 @@ export default {
       this.onLoadOwn(this.page);
     },
     printTemplate() {
-      console.log('111 :>> ', 111);
       const orderNodeList = document.querySelectorAll('.el-dialog__body>div>div>div');
-      orderNodeList.forEach(orderNode => {
-        console.log('orderNode :>> ', orderNode);
-        // console.log('orderNode.innerHTML :>> ', orderNode.innerHTML);
-      });
-
-      let LODOP = getLodop();
-      console.log('LODOP>>>>>', LODOP);
-      // console.log("this.ids>>>>>",this.selectionList);
-      // if (this.selectionList.length === 0){
-      //   this.$message.warning("请选择至少一条数据");
-      //   return;
-      // }
-
-      // 注释
-      getStockTemplate({ id: this.materialQRCode.id }).then(res => {
-        console.log('返回的数据', res.data.data);
-        let templateData = res.data.data;
-        // let templateData = "res.data.data";
-        // console.log(templateData);
-        LODOP.PRINT_INITA(1, 1, 900, 660, '测试预览功能');
-        LODOP.SET_PRINT_MODE('WINDOW_DEFPRINTER', 'Godex G500');
-        LODOP.SET_PRINT_STYLEA(0, 'TextNeatRow', true); //允许标点溢出，且英文单词拆开
-        // // 设置打印整宽且不变形
-        LODOP.SET_PRINT_MODE('PRINT_PAGE_PERCENT', 'Auto-Width');
-        // // 设置打印后自动关闭
-        LODOP.SET_PRINT_MODE('AUTO_CLOSE_PREWINDOW', 1);
-        // // data就是一段html文本
-        LODOP.ADD_PRINT_HTM('0%', '0%', '100%', '100%', templateData);
-        // LODOP.PREVIEW(); //预览(预览打印无脚标)
-        LODOP.PRINT(); //直接打印
-      });
+      print(orderNodeList);
     },
     //提交物品数据
     handleSubmitMethod() {

src/views/distribution/stockup/distributionStockupDetailsSelf.vue

@@ -383,6 +383,7 @@ import { getStockDetail } from '@/api/distribution/distributionStock';
 import { getStockTemplate, showOrderPackgeCode } from '@/api/distribution/distributionStockArticle';
 import { getLodop } from '@/utils/LodopFuncs';
 import dayjs from 'dayjs';
+import print from '@/utils/print';
 
 export default {
   data() {
@@ -1203,7 +1204,7 @@ export default {
           hide: false,
         },
       ],
-      selectionList1:[]
+      selectionList1: [],
     };
   },
   mounted() {
@@ -1464,30 +1465,9 @@ export default {
     },
     //打印
     printTemplate() {
-      let LODOP = getLodop();
-      console.log('LODOP>>>>>', LODOP);
-      // console.log("this.ids>>>>>",this.selectionList);
-      // if (this.selectionList.length === 0){
-      //   this.$message.warning("请选择至少一条数据");
-      //   return;
-      // }
-      getStockTemplate({ id: this.materialQRCode.id }).then(res => {
-        console.log('返回的数据', res.data.data);
-        let templateData = res.data.data;
-        // let templateData = "res.data.data";
-        // console.log(templateData);
-        LODOP.PRINT_INITA(1, 1, 900, 660, '测试预览功能');
-        LODOP.SET_PRINT_MODE('WINDOW_DEFPRINTER', 'Godex G500');
-        LODOP.SET_PRINT_STYLEA(0, 'TextNeatRow', true); //允许标点溢出，且英文单词拆开
-        // // 设置打印整宽且不变形
-        LODOP.SET_PRINT_MODE('PRINT_PAGE_PERCENT', 'Auto-Width');
-        // // 设置打印后自动关闭
-        LODOP.SET_PRINT_MODE('AUTO_CLOSE_PREWINDOW', 1);
-        // // data就是一段html文本
-        LODOP.ADD_PRINT_HTM('0%', '0%', '100%', '100%', templateData);
-        // LODOP.PREVIEW(); //预览(预览打印无脚标)
-        LODOP.PRINT(); //直接打印
-      });
+      // const orderNodeList = document.querySelectorAll('.el-dialog__body>div>div>div');
+      // 调用打印方法打印表单
+      print();
     },
     //查看包条码
     handleQRCode(row) {
@@ -1805,7 +1785,7 @@ export default {
     },
     selectionClear() {
       this.selectionList = [];
-      this.checkselect=[]
+      this.checkselect = [];
       // this.$refs.table.clearSelection();
     },
     currentChange(currentPage) {

vite.config.js

@@ -15,7 +15,8 @@ export default ({ mode, command }) => {
           // target: 'http://192.168.10.126:8889',
           // target: 'http://192.168.10.123:8889',
           // target: 'http://192.168.10.75:8777',
-          target: 'http://test.api.huitongys.com',
+          // target: 'http://test.api.huitongys.com',
+          target: 'http://192.168.10.101:8888',
           // target: 'http://192.168.10.29:13000',
           //target: 'http://test3.javablade.com',
           changeOrigin: true,