更正前端内容
This commit is contained in:
@@ -147,6 +147,14 @@ export default {
|
|||||||
timestamp: '2025.04.12 10:14',
|
timestamp: '2025.04.12 10:14',
|
||||||
qrcodeRecordId: '',
|
qrcodeRecordId: '',
|
||||||
})
|
})
|
||||||
|
},
|
||||||
|
paperWidthMm: {
|
||||||
|
type: Number,
|
||||||
|
default: 180
|
||||||
|
},
|
||||||
|
paperHeightMm: {
|
||||||
|
type: Number,
|
||||||
|
default: 100
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
@@ -207,8 +215,8 @@ export default {
|
|||||||
const dpi = 96; // 标准 DPI
|
const dpi = 96; // 标准 DPI
|
||||||
const mmToPx = dpi / 25.4; // 1mm = 3.779527559px
|
const mmToPx = dpi / 25.4; // 1mm = 3.779527559px
|
||||||
|
|
||||||
const paperWidthMm = 180;
|
const paperWidthMm = this.paperWidthMm || 180;
|
||||||
const paperHeightMm = 100;
|
const paperHeightMm = this.paperHeightMm || 100;
|
||||||
const marginMm = 2;
|
const marginMm = 2;
|
||||||
|
|
||||||
const paperWidthPx = paperWidthMm * mmToPx;
|
const paperWidthPx = paperWidthMm * mmToPx;
|
||||||
@@ -414,8 +422,8 @@ export default {
|
|||||||
transform-origin: top left !important;
|
transform-origin: top left !important;
|
||||||
|
|
||||||
/* 确保缩放后不超出纸张 */
|
/* 确保缩放后不超出纸张 */
|
||||||
max-width: 180mm !important;
|
max-width: var(--paper-width, 180mm) !important;
|
||||||
max-height: 100mm !important;
|
max-height: var(--paper-height, 100mm) !important;
|
||||||
overflow: hidden !important;
|
overflow: hidden !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -82,6 +82,14 @@ export default {
|
|||||||
productionDate: '',
|
productionDate: '',
|
||||||
qrcodeRecordId: '',
|
qrcodeRecordId: '',
|
||||||
})
|
})
|
||||||
|
},
|
||||||
|
paperWidthMm: {
|
||||||
|
type: Number,
|
||||||
|
default: 100 // 原料码:100mm x 80mm
|
||||||
|
},
|
||||||
|
paperHeightMm: {
|
||||||
|
type: Number,
|
||||||
|
default: 80
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
@@ -138,8 +146,8 @@ export default {
|
|||||||
const dpi = 96; // 标准 DPI
|
const dpi = 96; // 标准 DPI
|
||||||
const mmToPx = dpi / 25.4; // 1mm = 3.779527559px
|
const mmToPx = dpi / 25.4; // 1mm = 3.779527559px
|
||||||
|
|
||||||
const paperWidthMm = 180;
|
const paperWidthMm = this.paperWidthMm || 100;
|
||||||
const paperHeightMm = 100;
|
const paperHeightMm = this.paperHeightMm || 80;
|
||||||
const marginMm = 2;
|
const marginMm = 2;
|
||||||
|
|
||||||
const paperWidthPx = paperWidthMm * mmToPx;
|
const paperWidthPx = paperWidthMm * mmToPx;
|
||||||
@@ -273,8 +281,8 @@ export default {
|
|||||||
transform-origin: top left !important;
|
transform-origin: top left !important;
|
||||||
|
|
||||||
/* 确保缩放后不超出纸张 */
|
/* 确保缩放后不超出纸张 */
|
||||||
max-width: 180mm !important;
|
max-width: var(--paper-width, 100mm) !important;
|
||||||
max-height: 100mm !important;
|
max-height: var(--paper-height, 80mm) !important;
|
||||||
overflow: hidden !important;
|
overflow: hidden !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -2,8 +2,18 @@
|
|||||||
<div class="label-render-container">
|
<div class="label-render-container">
|
||||||
<!-- 标签预览容器 -->
|
<!-- 标签预览容器 -->
|
||||||
<div class="preview-container" id="label-preview-container" ref="labelRef">
|
<div class="preview-container" id="label-preview-container" ref="labelRef">
|
||||||
<ProductionTagPreview v-if="labelType === '2'" :content="content" />
|
<ProductionTagPreview
|
||||||
<OuterTagPreview v-if="labelType === '3'" :content="content" />
|
v-if="labelType === '2'"
|
||||||
|
:content="content"
|
||||||
|
:paperWidthMm="100"
|
||||||
|
:paperHeightMm="80"
|
||||||
|
/>
|
||||||
|
<OuterTagPreview
|
||||||
|
v-if="labelType === '3'"
|
||||||
|
:content="content"
|
||||||
|
:paperWidthMm="180"
|
||||||
|
:paperHeightMm="100"
|
||||||
|
/>
|
||||||
<SampleTagPreview v-if="labelType === '4'" :content="content" />
|
<SampleTagPreview v-if="labelType === '4'" :content="content" />
|
||||||
<ForgeTagPreview v-if="labelType === '5'" :content="content" />
|
<ForgeTagPreview v-if="labelType === '5'" :content="content" />
|
||||||
<SaltSprayTagPreview v-if="labelType === '6'" :content="content" />
|
<SaltSprayTagPreview v-if="labelType === '6'" :content="content" />
|
||||||
@@ -90,14 +100,16 @@ export default {
|
|||||||
await this.waitForAllResources(labelContainer);
|
await this.waitForAllResources(labelContainer);
|
||||||
|
|
||||||
// 3. 计算纸张尺寸和缩放比例
|
// 3. 计算纸张尺寸和缩放比例
|
||||||
// 纸张尺寸:180mm x 100mm
|
// 根据标签类型设置纸张尺寸:
|
||||||
// 1mm ≈ 3.779527559px (96 DPI)
|
// 产品码:100mm x 180mm(横向,原先180x100)
|
||||||
const paperWidthMm = 180;
|
// 原料码:80mm x 100mm(竖向)
|
||||||
const paperHeightMm = 100;
|
const isMaterial = labelContainer.classList.contains('material-label-container');
|
||||||
|
const paperWidthMm = isMaterial ? 100 : 180;
|
||||||
|
const paperHeightMm = isMaterial ? 80 : 100;
|
||||||
const dpi = 96;
|
const dpi = 96;
|
||||||
const mmToPx = dpi / 25.4;
|
const mmToPx = dpi / 25.4;
|
||||||
const paperWidthPx = paperWidthMm * mmToPx; // 约 680.3px
|
const paperWidthPx = paperWidthMm * mmToPx;
|
||||||
const paperHeightPx = paperHeightMm * mmToPx; // 约 377.95px
|
const paperHeightPx = paperHeightMm * mmToPx;
|
||||||
|
|
||||||
// 获取标签容器的实际尺寸
|
// 获取标签容器的实际尺寸
|
||||||
const containerRect = labelContainer.getBoundingClientRect();
|
const containerRect = labelContainer.getBoundingClientRect();
|
||||||
|
|||||||
Reference in New Issue
Block a user