wms白胚原材料采购打印修改

src/views/wms/bpprocure/index.vue

@@ -25,90 +25,10 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-<!--      <el-form-item label="供应商" prop="supplyName">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.supplyName"-->
-<!--          placeholder="请输入供应商"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="计划数量" prop="planNumber">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.planNumber"-->
-<!--          placeholder="请输入计划数量"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="已入库数量" prop="realityNumber">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.realityNumber"-->
-<!--          placeholder="请输入已入库数量"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="单位" prop="unit">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.unit"-->
-<!--          placeholder="请输入单位"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="价格" prop="price">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.price"-->
-<!--          placeholder="请输入价格"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="用户自定义1" prop="attr1">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.attr1"-->
-<!--          placeholder="请输入用户自定义1"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="用户自定义2" prop="attr2">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.attr2"-->
-<!--          placeholder="请输入用户自定义2"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="用户自定义3" prop="attr3">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.attr3"-->
-<!--          placeholder="请输入用户自定义3"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="用户自定义4" prop="attr4">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.attr4"-->
-<!--          placeholder="请输入用户自定义4"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="用户自定义5" prop="attr5">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.attr5"-->
-<!--          placeholder="请输入用户自定义5"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
+              </el-form-item>
     </el-form>
 
     <el-row :gutter="10" class="mb8">
@@ -144,6 +64,9 @@
           v-hasPermi="['wms:bpprocure:remove']"
         >删除</el-button>
       </el-col>
+      <el-col :span="1.5">
+      <el-button type="info" icon="el-icon-print" size="mini" @click="handlePrint" :disabled="!ids.length">打印</el-button>
+      </el-col>
       <el-col :span="1.5">
         <el-button
           type="warning"
@@ -159,7 +82,6 @@
 
     <el-table v-loading="loading" :data="bpprocureList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-<!--      <el-table-column label="ID" align="center" prop="ID" />-->
       <el-table-column label="采购单号" align="center" prop="procureCode" />
       <el-table-column label="物料编码" align="center" prop="materialCode" />
       <el-table-column label="物料名称" align="center" prop="materialName" />
@@ -168,11 +90,7 @@
       <el-table-column label="已入库数量" align="center" prop="realityNumber" />
       <el-table-column label="单位" align="center" prop="unit" />
       <el-table-column label="价格" align="center" prop="price" />
-<!--      <el-table-column label="用户自定义1" align="center" prop="attr1" />-->
+
-<!--      <el-table-column label="用户自定义2" align="center" prop="attr2" />-->
-<!--      <el-table-column label="用户自定义3" align="center" prop="attr3" />-->
-<!--      <el-table-column label="用户自定义4" align="center" prop="attr4" />-->
-<!--      <el-table-column label="用户自定义5" align="center" prop="attr5" />-->
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -403,6 +321,81 @@ export default {
         }
       });
     },
+    handlePrint() {
+      // 获取选中数据
+      const selectedData = this.bpprocureList.filter(item => this.ids.includes(item.ID));
+      if (selectedData.length === 0) {
+        this.$message.warning("请先选择要打印的记录");
+        return;
+      }
+
+      // 生成打印数据
+      this.printData = {
+        printDate: new Date().toLocaleString(),
+
+        workTable: selectedData.map(item => ({
+          procureCode: item.procureCode,
+          materialCode: item.materialCode,
+          materialDesc: item.materialName,
+          unit: item.unit,
+          supplyName: item.supplyName,
+          planNumber: item.planNumber,
+          realityNumber: item.realityNumber|| '',
+        }))
+      };
+// 打印内容
+      let printContent = `
+        <div style="text-align: center;">
+          <h3>采购单</h3>
+
+        </div>
+        <div style="display: flex; justify-content: space-between; padding: 10px;">
+          <div>打印日期: ${this.printData.printDate}</div>
+        </div>
+        <table border="1" style="width: 100%; border-collapse: collapse;margin: 0 auto;">
+          <thead>
+            <tr>
+              <th   style="text-align: center;">采购单</th>
+              <th   style="text-align: center;">物料编码</th>
+              <th   style="text-align: center;">物料描述</th>
+               <th  style="text-align: center;">供应商</th>
+              <th   style="text-align: center;">单位</th>
+              <th   style="text-align: center;">计划数量</th>
+              <th   style="text-align: center;">已入库数量</th>
+            </tr>
+          </thead>
+          <tbody>`;
+
+      this.printData.workTable.forEach(item => {
+        printContent += `
+          <tr>
+            <td style="text-align: center;">${item.procureCode}</td>
+            <td style="text-align: center;">${item.materialCode}</td>
+            <td style="text-align: center;">${item.materialDesc}</td>
+            <td style="text-align: center;">${item.supplyName}</td>
+            <td style="text-align: center;">${item.unit}</td>
+            <td style="text-align: center;">${item.planNumber}</td>
+            <td style="text-align: center;">${item.realityNumber}</td>
+          </tr>`;
+      });
+
+      printContent += `
+          </tbody>
+        </table>
+
+      `;
+
+      const printWindow = window.open('', '_blank');
+      printWindow.document.write('<html><head><title>打印</title></head><body>');
+      printWindow.document.write(printContent);
+      printWindow.document.write('</body></html>');
+      printWindow.document.close();
+      printWindow.print();
+      printWindow.close();
+    },
+    // 其他方法（handleQuery, resetQuery, etc.）
+
+
     /** 删除按钮操作 */
     handleDelete(row) {
       const IDs = row.ID || this.ids;