领料申请领料单，出库单修改

src/views/material/lease/apply/component/homeApply.vue

@@ -274,29 +274,19 @@
    width="1100px"
    append-to-body
  >
-      <div style="height: 500px; overflow-y: scroll">
+   <div style="height: 600px; overflow-y: scroll;padding: 0 20px">
-        <vue-easy-print tableShow ref="remarksPrintRef" class="print">
+     <!-- <vue-easy-print tableShow ref="remarksPrintRefCheck" class="print" :printable="'checkId'"> -->
+       <div id="checkId">
        <div
          class="title"
          style="text-align: center; font-weight: 600; font-size: 16px"
        >
-            机具设备到货验收单
+       施工机具设备出库检验记录表
        </div>
        <div
          class="info"
          style="margin-top: 10px; display: flex; flex-wrap: wrap"
        >
-            <div
-              class="item"
-              style="
-                width: 100%;
-                flex-shrink: 0;
-                margin-bottom: 5px;
-                font-size: 14px;
-              "
-            >
-              <span>单据编号：</span>
-            </div>
          <div
            class="item"
            style="
@@ -306,7 +296,8 @@
              font-size: 14px;
            "
          >
-              <span>生产厂家（供应商）：</span>
+           <span>领用工程：</span>
+           {{ checkDataInfo.leaseProject }}
          </div>
 
          <div
@@ -318,7 +309,8 @@
              font-size: 14px;
            "
          >
-              <span>到货日期：</span>
+           <span>使用单位：</span>
+           {{ checkDataInfo.leaseUnit }}
          </div>
        </div>
        <el-table
@@ -327,51 +319,18 @@
          style="margin-top: 20px;width: 1000px; padding-bottom: 1px"
          border
        >
-            <!--          <el-table-column type="selection" width="55" align="center" />-->
+         <el-table-column label="机具名称" align="center" prop="typeName"/>
-            <el-table-column label="序号" align="center" type="index" row="2" />
+         <el-table-column label="规格型号" align="center" prop="typeModelName" />
-            <el-table-column
+         <el-table-column label="单位" align="center" prop="unit" width="40px"/>
-              label="物资名称"
+         <el-table-column label="数量" align="center" prop="num" width="40px"/>
-              align="center"
+         <el-table-column label="设备编码" align="center" prop="maCode"/>
-              prop="machineTypeName"
+         <el-table-column label="额定载荷KN" align="center" prop="ratedLoad" width="80px"/>
-            />
+         <el-table-column label="试验载荷KN" align="center" prop="testLoad" width="80px"/>
-            <el-table-column
+         <el-table-column label="持荷时间min" align="center" prop="holdingTime" width="80px"/>
-              label="规格型号"
+         <el-table-column label="试验日期" align="center" prop="testTime" />
-              align="center"
+         <el-table-column label="下次试验日期" align="center" prop="nextTestTime" width="120px"/>
-              prop="specificationType"
+         <el-table-column label="检验结论" align="center" prop="checkResult" />
-            />
+         <el-table-column label="备注" align="center" prop="remark"/>
-            <el-table-column label="单位" align="center" prop="unitName" />
-            <el-table-column label="配送信息" align="center">
-              <el-table-column
-                label="到货数量"
-                align="center"
-                prop="purchaseNum"
-              />
-              <el-table-column
-                label="验收结论"
-                align="center"
-                prop="purchaseNum"
-              />
-              <el-table-column label="质保质量" align="center">
-                <el-table-column
-                  label="实收份数"
-                  align="center"
-                  prop="purchaseNum"
-                />
-                <el-table-column
-                  label="符合要求"
-                  align="center"
-                  prop="purchaseNum"
-                />
-              </el-table-column>
-            </el-table-column>
-            <el-table-column label="备注" align="center" prop="unitName" />
-
-            <!--                        <el-table-column-->
-            <!--                            label="合格证及技术资料"-->
-            <!--                            align="center"-->
-            <!--                            prop=""-->
-            <!--                        />-->
-            <!--                        <el-table-column label="包装" align="center" prop="" />-->
        </el-table>
 
        <div
@@ -379,36 +338,30 @@
          style="
            margin-top: 20px;
            display: flex;
-              justify-content: space-between;
+           align-items: center;
+           justify-content: right;
          "
        >
-            <div class="item" style="width: 33%">
+         <div class="item"  style="width: 30%;  align-items: center;position: relative;">
            <div>
-                <span>供应科：</span>
+             <span>检验单位：</span>
+           </div>
+           <div >
+             <canvas id="canvas" width="165" height="165" style="position: absolute; top: 50%; left: 90%; transform: translate(-100%, -50%);"></canvas>
          </div>
          </div>
 
-            <div class="item" style="width: 33%">
-              <div>
-                <span>生产技术科：</span>
        </div>
      </div>
-
+     <!-- </vue-easy-print> -->
-            <div class="item" style="width: 33%">
-              <div>
-                <span>库管班：</span>
-              </div>
-            </div>
-          </div>
-        </vue-easy-print>
    </div>
 
    <div slot="footer" class="dialog-footer" style="text-align: center">
-        <el-button type="primary" @click="print">打 印</el-button>
+     <el-button type="primary" @click="handleExportCheck">导出</el-button>
-        <el-button @click="openPrint = false">关 闭</el-button>
+     <el-button type="primary" @click="printCheck">打 印</el-button>
+     <el-button @click="closeDialogAndRefresh">关 闭</el-button>
    </div>
   </el-dialog>
-
     <!-- 领料单弹窗 -->
     <el-dialog :visible.sync="open" width="800px" :title="title" append-to-body>
       <div style="height: 500px; overflow-y: scroll; padding: 0 20px">
@@ -618,9 +571,11 @@ import {
   applyRemove,
   applySend,
   applySendAll,
+  getCheckInfo
 } from "@/api/lease/apply";
 
 import vueEasyPrint from "vue-easy-print";
+import printJS from 'print-js';
 
 export default {
   name: "Home",
@@ -682,6 +637,7 @@ export default {
       open: false,
       printData: {},
       printTableData: [],
+      checkDataInfo: {},
       // 供应商
       supplierStr: "",
 
@@ -809,11 +765,26 @@ export default {
       });
     },
     //查看验收单
-    handlePrint(row) {
+    async handlePrint(row) {
-      // this.query.taskId = row.taskId
+      const res = await getCheckInfo({id:row.id});
-      // this.getPrintTable(row.taskId)
+      this.idTemp = row.id;
+      this.checkDataInfo = res.data.leaseApplyInfo;
+
+      this.printTableData = res.data.leaseOutVoList;
+      setTimeout(() => {
+        this.chapter('检验专用章', '机具设备分公司')
+      }, 200);
       this.openPrint = true;
-      this.title = "机具设备到货验收单";
+      this.title = "出库检验单";
+    },
+
+    /** 导出按钮操作 */
+      handleExportCheck() {
+      this.download(
+        "/material/lease_apply_info/exportInfo",
+        { id:this.idTemp },
+        `出库检验单_${new Date().getTime()}.xlsx`
+      );
     },
 
     //打开领料单
@@ -822,10 +793,23 @@ export default {
       this.open = true;
       var ids = row.id;
       const res = await getApplyInfo(ids);
-      console.log(res);
       this.leaseApplyDetails = res.data.leaseApplyDetailsList;
       this.leaseApplyData = res.data.leaseApplyInfo;
-      console.log(this.leaseApplyData);
+    },
+
+    //出库检验单打印
+    printCheck() {
+      printJS({
+        printable: 'checkId',
+        type: 'html',
+        targetStyles: ['*'],
+        // 其他配置选项
+      });
+    },
+
+    // 关闭弹窗并刷新页面
+    closeDialogAndRefresh() {
+      this.openPrint = false;
     },
 
     codeInfo(row) {
@@ -902,6 +886,82 @@ export default {
         });
       }
     },
+
+    chapter(text, companyName) {
+    let canvas = document.getElementById("canvas");
+    let context = canvas.getContext("2d");
+    canvas.width = canvas.width;
+    context.height = canvas.height;
+    // // 清除画布内容
+    // context.clearRect(0, 0, canvas.width, canvas.height);
+    //let text = "XXX专用章";
+    //let companyName = "XXX科技股份有限公司";
+  
+    // 绘制印章边框
+    let width = canvas.width / 2;
+    let height = canvas.height / 2;
+    context.lineWidth = 3;
+    context.strokeStyle = "#f00";
+    context.beginPath();
+    context.arc(width, height, 80, 0, Math.PI * 2); //宽、高、半径
+    context.stroke();
+  
+    //画五角星
+    this.create5star(context, width, height, 20, "#f00", 0);
+  
+    // 绘制印章名称
+    context.font = "18px 宋体";
+    context.textBaseline = "middle"; //设置文本的垂直对齐方式
+    context.textAlign = "center"; //设置文本的水平对对齐方式
+    context.lineWidth = 1;
+    context.strokeStyle = "#ff2f2f";
+    context.strokeText(text, width, height + 50);
+  
+    // 绘制印章单位
+    context.translate(width, height); // 平移到此位置,
+    context.font = "16px 宋体";
+    let count = companyName.length; // 字数
+    let angle = (4 * Math.PI) / (3 * (count - 1)); // 字间角度
+    let chars = companyName.split("");
+    let c;
+    for (let i = 0; i < count; i++) {
+      c = chars[i]; // 需要绘制的字符
+      if (i == 0) {
+        context.rotate((5 * Math.PI) / 6);
+      } else {
+        context.rotate(angle);
+      }
+  
+      context.save();
+      context.translate(65, 0); // 平移到此位置,此时字和x轴垂直，公司名称和最外圈的距离
+      context.rotate(Math.PI / 2); // 旋转90度,让字平行于x轴
+      context.strokeStyle = "#ff5050"; // 设置印章单位字体颜色为较浅的红色
+      context.strokeText(c, 0, 0); // 此点为字的中心点
+      context.restore();
+    }
+    },
+  
+    //绘制五角星
+    create5star(context, sx, sy, radius, color, rotato) {
+      context.save();
+      context.fillStyle = color;
+      context.translate(sx, sy); //移动坐标原点
+      context.rotate(Math.PI + rotato); //旋转
+      context.beginPath(); //创建路径
+      // let x = Math.sin(0);
+      // let y = Math.cos(0);
+      let dig = (Math.PI / 5) * 4;
+      for (let i = 0; i < 5; i++) {
+        //画五角星的五条边
+        let x = Math.sin(i * dig);
+        let y = Math.cos(i * dig);
+        context.lineTo(x * radius, y * radius);
+      }
+      context.closePath();
+      context.stroke();
+      context.fill();
+      context.restore();
+    }
   },
 
   watch: {

src/views/material/lease/outBound/index.vue

@@ -486,10 +486,10 @@
     <el-dialog
       :title="title"
       :visible.sync="openPrint"
-      width="800px"
+      width="1100px"
       append-to-body
     >
-      <div style="height: 500px; overflow-y: scroll;padding: 0 20px">
+      <div style="height: 600px; overflow-y: scroll;padding: 0 20px">
         <!-- <vue-easy-print tableShow ref="remarksPrintRefCheck" class="print" :printable="'checkId'"> -->
           <div id="checkId">
           <div
@@ -531,20 +531,20 @@
           <el-table
             :data="printTableData"
             class="table"
-            style="margin-top: 20px; padding-bottom: 1px"
+            style="margin-top: 20px;width: 1000px; padding-bottom: 1px"
             border
           >
-            <el-table-column label="机具名称" align="center" prop="typeName" width="60px"/>
+            <el-table-column label="机具名称" align="center" prop="typeName"/>
-            <el-table-column label="规格型号" align="center" prop="typeModelName" width="60px"/>
+            <el-table-column label="规格型号" align="center" prop="typeModelName" />
             <el-table-column label="单位" align="center" prop="unit" width="40px"/>
             <el-table-column label="数量" align="center" prop="num" width="40px"/>
-            <el-table-column label="设备编码" align="center" prop="maCode" width="60px"/>
+            <el-table-column label="设备编码" align="center" prop="maCode"/>
-            <el-table-column label="额定载荷KN" align="center" prop="ratedLoad" width="60px"/>
+            <el-table-column label="额定载荷KN" align="center" prop="ratedLoad" width="80px"/>
-            <el-table-column label="试验载荷KN" align="center" prop="testLoad" width="60px"/>
+            <el-table-column label="试验载荷KN" align="center" prop="testLoad" width="80px"/>
-            <el-table-column label="持荷时间min" align="center" prop="holdingTime" width="60px"/>
+            <el-table-column label="持荷时间min" align="center" prop="holdingTime" width="80px"/>
-            <el-table-column label="试验日期" align="center" prop="testTime" width="50px"/>
+            <el-table-column label="试验日期" align="center" prop="testTime" />
-            <el-table-column label="下次试验日期" align="center" prop="nextTestTime" width="60px"/>
+            <el-table-column label="下次试验日期" align="center" prop="nextTestTime" width="120px"/>
-            <el-table-column label="检验结论" align="center" prop="checkResult" width="50px"/>
+            <el-table-column label="检验结论" align="center" prop="checkResult" />
             <el-table-column label="备注" align="center" prop="remark"/>
           </el-table>