Merge branch '0.8.X' of https://gitee.com/hdka/klp-oa into 0.8.X
This commit is contained in:
@@ -1,9 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="label-container" :style="{ '--print-scale': printScale }">
|
<div class="label-container" :style="{ '--print-scale': printScale }">
|
||||||
<table class="material-label-table">
|
<table class="material-label-table">
|
||||||
<!-- 调整第一行结构,使label和value各占2列(等宽) -->
|
<!-- 调整第一行结构,左侧内容扩大,右侧二维码减小边距 -->
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="3" style="padding: 0;">
|
<td colspan="2" style="padding: 0; width: 50%;">
|
||||||
<div
|
<div
|
||||||
style="
|
style="
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -12,35 +12,52 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
font-size: 13px;
|
||||||
">
|
">
|
||||||
<div style="display: flex; flex: 1; align-items: center;">
|
<div style="display: flex; flex: 1; align-items: center;">
|
||||||
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box;" class="label-cell">
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="label-cell">
|
||||||
料卷号
|
料卷号
|
||||||
</div>
|
</div>
|
||||||
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box;" class="value-cell">
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="value-cell">
|
||||||
{{ content.enterCoilNo || '' }}
|
{{ content.enterCoilNo || '' }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex; flex: 1; align-items: center;">
|
<div style="display: flex; flex: 1; align-items: center;">
|
||||||
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box;" class="label-cell">
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="label-cell">
|
||||||
逻辑库区
|
逻辑库区
|
||||||
</div>
|
</div>
|
||||||
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box;" class="value-cell">
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="value-cell">
|
||||||
<input type="text" class="nob" :value="content.warehouseName || ''" />
|
<input type="text" class="nob" :value="content.warehouseName || ''" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex; flex: 1; align-items: center;">
|
<div style="display: flex; flex: 1; align-items: center;">
|
||||||
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box;" class="label-cell">
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="label-cell">
|
||||||
实际库区
|
实际库区
|
||||||
</div>
|
</div>
|
||||||
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box;" class="value-cell">
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="value-cell">
|
||||||
<input type="text" class="nob" :value="content.actualWarehouseName || ''" />
|
<input type="text" class="nob" :value="content.actualWarehouseName || ''" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div style="display: flex; flex: 1; align-items: center;">
|
||||||
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="label-cell">
|
||||||
|
规格(mm)
|
||||||
|
</div>
|
||||||
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="value-cell">
|
||||||
|
<input type="text" class="nob" :value="content.specification || ''" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex; flex: 1; align-items: center;">
|
||||||
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="label-cell">
|
||||||
|
生产班组
|
||||||
|
</div>
|
||||||
|
<div style="flex: 1; height: 100%; display: flex; align-items: center; justify-content: center; border: 1px solid #333; box-sizing: border-box; padding: 3px; word-break: break-all; overflow-wrap: break-word;" class="value-cell">
|
||||||
|
<input type="text" class="nob" :value="content.team || ''" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="value-cell" colspan="1">
|
<td class="value-cell" colspan="4" style="width: 50%; padding: 2px; text-align: center; vertical-align: middle;">
|
||||||
<QRCode :content="content.qrcodeRecordId || ' '" :size="80" />
|
<QRCode :content="content.qrcodeRecordId || ' '" :size="130" />
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<!-- <tr>
|
<!-- <tr>
|
||||||
@@ -56,34 +73,25 @@
|
|||||||
</td>
|
</td>
|
||||||
</tr> -->
|
</tr> -->
|
||||||
<tr>
|
<tr>
|
||||||
<td class="label-cell">规格(mm)</td>
|
<td class="label-cell" style="width: 16.67%; padding: 4px;">净重</td>
|
||||||
<td class="value-cell">
|
<td class="value-cell" colspan="2" style="width: 33.33%; padding: 4px;">
|
||||||
<input type="text" class="nob" :value="content.specification || ''" />
|
|
||||||
</td>
|
|
||||||
<td class="label-cell">净重</td>
|
|
||||||
<td class="value-cell">
|
|
||||||
<input type="text" class="nob" :value="content.netWeight || ''" />
|
<input type="text" class="nob" :value="content.netWeight || ''" />
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
<td class="label-cell" style="width: 16.67%; padding: 4px;">材质</td>
|
||||||
<tr>
|
<td class="value-cell" colspan="2" style="width: 33.33%; padding: 4px;">
|
||||||
<td class="label-cell">材质</td>
|
|
||||||
<td class="value-cell">
|
|
||||||
<input type="text" class="nob" :value="content.material || ''" />
|
<input type="text" class="nob" :value="content.material || ''" />
|
||||||
</td>
|
</td>
|
||||||
<td class="label-cell">下道</td>
|
|
||||||
<td class="value-cell">
|
|
||||||
<input type="text" class="nob" :value="content.nextProcess || ''" />
|
|
||||||
</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="label-cell">生产班组</td>
|
<td class="label-cell" style="width: 16.67%; padding: 4px;">时间</td>
|
||||||
<td class="value-cell">
|
<td class="value-cell" colspan="2" style="width: 33.33%; padding: 4px;">
|
||||||
<input type="text" class="nob" :value="content.team || ''" />
|
|
||||||
</td>
|
|
||||||
<td class="label-cell">时间</td>
|
|
||||||
<td class="value-cell">
|
|
||||||
<input type="text" class="nob" :value="content.updateTime || ''" />
|
<input type="text" class="nob" :value="content.updateTime || ''" />
|
||||||
</td>
|
</td>
|
||||||
|
<td class="label-cell" style="width: 16.67%; padding: 4px;">下道</td>
|
||||||
|
<td class="value-cell" colspan="2" style="width: 33.33%; padding: 4px;">
|
||||||
|
<input type="text" class="nob" :value="content.nextProcess || ''" />
|
||||||
|
</td>
|
||||||
|
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
@@ -170,7 +178,7 @@ export default {
|
|||||||
const container = this.$el;
|
const container = this.$el;
|
||||||
if (!container) return;
|
if (!container) return;
|
||||||
|
|
||||||
// 纸张尺寸:100mm x 80mm
|
// 纸张尺寸:180mm x 100mm
|
||||||
const dpi = 96; // 标准 DPI
|
const dpi = 96; // 标准 DPI
|
||||||
const mmToPx = dpi / 25.4; // 1mm = 3.779527559px
|
const mmToPx = dpi / 25.4; // 1mm = 3.779527559px
|
||||||
|
|
||||||
@@ -231,7 +239,6 @@ export default {
|
|||||||
flex-direction: column; /* 子元素垂直排列 */
|
flex-direction: column; /* 子元素垂直排列 */
|
||||||
font-family: "SimSun", serif;
|
font-family: "SimSun", serif;
|
||||||
box-sizing: border-box; /* 确保内边距/边框不影响总尺寸 */
|
box-sizing: border-box; /* 确保内边距/边框不影响总尺寸 */
|
||||||
overflow: visible; /* 确保所有内容可见,不被裁剪 */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.material-label-table {
|
.material-label-table {
|
||||||
@@ -240,6 +247,7 @@ export default {
|
|||||||
table-layout: fixed;
|
table-layout: fixed;
|
||||||
flex-grow: 1; /* 让表格拉伸,占满剩余垂直空间 */
|
flex-grow: 1; /* 让表格拉伸,占满剩余垂直空间 */
|
||||||
height: 0; /* 配合flex-grow,自动计算高度 */
|
height: 0; /* 配合flex-grow,自动计算高度 */
|
||||||
|
border: 1px solid #333; /* 确保表格有最外层边框 */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 四列均分宽度,每列占25% */
|
/* 四列均分宽度,每列占25% */
|
||||||
@@ -250,6 +258,10 @@ export default {
|
|||||||
/* width: 25%; */
|
/* width: 25%; */
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
word-break: break-all;
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
white-space: normal;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label-cell {
|
.label-cell {
|
||||||
@@ -268,12 +280,16 @@ export default {
|
|||||||
outline: none;
|
outline: none;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
font-size: inherit;
|
||||||
|
word-break: break-all;
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
white-space: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 打印样式 - 强制单页,适配100mm x 80mm纸张,保持原有样式不变 */
|
/* 打印样式 - 强制单页,适配180mm x 100mm纸张,保持原有样式不变 */
|
||||||
@media print {
|
@media print {
|
||||||
@page {
|
@page {
|
||||||
size: 100mm 80mm;
|
size: 180mm 100mm;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user