摸具生产计划单优化

mes-ui/mes-ui-admin-vue3/src/views/heli/hlvuestyle/productionPrint.vue

@@ -7,7 +7,7 @@
           <tr>
             <td colspan="2">
               <div style="width: 100px; text-align: center">
-                <img src="/src/assets/imgs/exlogo.png" style="width: 100%" alt="" />
+                <img :src="logoDataUrl" style="width: 100%" alt="" />
               </div>
             </td>
             <td colspan="6">
@@ -72,10 +72,7 @@
             <div style="display: flex; justify-content: space-between">
               <div style="width: 100%; font-size: 12px; display: flex; flex-direction: column">
                 <div style="text-align: left; width: 100; margin-left: 10px">自客户提供资料：</div>
-                <div
-                  id="fruitForm"
-                  style="display: flex; justify-content: flex-start; align-items: center"
-                >
+                <div id="fruitForm" style="display: flex; justify-content: flex-start; align-items: center">
                   <span class="checkbox" v-if="isSelected.includes(1) == false"></span>
                   <span class="checkbox" v-else-if="isSelected.includes(1) == true">√</span>
                   <label for="checkbox1">修理内容</label>
@@ -104,9 +101,11 @@
         </tr>
 
         <tbody>
-          <tr
-            ><td colspan="10"> <div style="text-align: left; width: 100%">子项目信息:</div></td></tr
-          >
+          <tr>
+            <td colspan="10">
+              <div style="text-align: left; width: 100%">子项目信息:</div>
+            </td>
+          </tr>
           <tr>
             <td class="xh"> 序号 </td>
             <td colspan="3"> 名称/编号 </td>
@@ -163,22 +162,16 @@
         <tbody>
           <tr>
             <td colspan="10">
-              <div
-                style="
+              <div style="
                   text-align: left;
                   width: 100%;
                   display: flex;
                   flex-direction: column;
                   padding-left: 15px;
-                "
-              >
+                ">
                 <span>说明:</span>
-                <span
-                  >1.每个项目的零部件制作工艺，材料材质，硬度要求必须统一，出现任何问题，各工程师负责!</span
-                >
-                <span
-                  >2.模具调试，试模需要根据客户要求，自己安排调试，我司根据需要安排人员参与配合。</span
-                >
+                <span>1.每个项目的零部件制作工艺，材料材质，硬度要求必须统一，出现任何问题，各工程师负责!</span>
+                <span>2.模具调试，试模需要根据客户要求，自己安排调试，我司根据需要安排人员参与配合。</span>
               </div>
             </td>
           </tr>
@@ -211,7 +204,7 @@
           <tr>
             <td colspan="2">
               <div style="width: 100px; text-align: center">
-                <img src="/src/assets/imgs/exlogo.png" style="width: 100%" alt="" />
+                <img :src="logoDataUrl" style="width: 100%" alt="" />
               </div>
             </td>
             <td colspan="6">
@@ -264,9 +257,11 @@
         </tr>
 
         <tbody>
-          <tr
-            ><td colspan="10"> <div style="text-align: left; width: 100%">子项目信息:</div></td></tr
-          >
+          <tr>
+            <td colspan="10">
+              <div style="text-align: left; width: 100%">子项目信息:</div>
+            </td>
+          </tr>
           <tr>
             <td class="xh"> 序号 </td>
             <td colspan="3"> 名称/编号 </td>
@@ -306,22 +301,16 @@
         <tbody>
           <tr>
             <td colspan="10">
-              <div
-                style="
+              <div style="
                   text-align: left;
                   width: 100%;
                   display: flex;
                   flex-direction: column;
                   padding-left: 15px;
-                "
-              >
+                ">
                 <span>说明:</span>
-                <span
-                  >1.每个项目的零部件制作工艺，材料材质，硬度要求必须统一，出现任何问题，各工程师负责!</span
-                >
-                <span
-                  >2.模具调试，试模需要根据客户要求，自己安排调试，我司根据需要安排人员参与配合。</span
-                >
+                <span>1.每个项目的零部件制作工艺，材料材质，硬度要求必须统一，出现任何问题，各工程师负责!</span>
+                <span>2.模具调试，试模需要根据客户要求，自己安排调试，我司根据需要安排人员参与配合。</span>
               </div>
             </td>
           </tr>
@@ -358,6 +347,8 @@
 <script setup lang="ts">
 // import { ref, reactive } from 'vue'
 import { Check } from '@element-plus/icons-vue'
+import urlimg from '@/assets/imgs/exlogo.png'
+const logoDataUrl = ref('') // 存储Logo的Base64编码数据URL
 const dialogVisible = ref(false) // 弹窗的是否展示
 
 const formData = ref({
@@ -495,6 +486,19 @@ const isSelected = ref([1, 3])
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
+  //图片处理
+  // 在组件挂载后，将Logo图片转换为Base64编码数据URL
+  const logoImage = new Image()
+  logoImage.src = urlimg // 替换为Logo图片路径
+  logoImage.onload = () => {
+    const canvas = document.createElement('canvas')
+    canvas.width = logoImage.width
+    canvas.height = logoImage.height
+    const context = canvas.getContext('2d')
+    context.drawImage(logoImage, 0, 0)
+    const base64String = canvas.toDataURL('image/png')
+    logoDataUrl.value = base64String
+  }
 }
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 </script>