hanst
/
wms-vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

纸张选择bug

master
han\hanst 5 months ago
parent
76c160f266
commit
248e46643c
2 changed files with 44 additions and 156 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 56
      src/utils/zplGenerator.js
  2. 144
      src/views/modules/labelSetting/components/PaperSelector.vue

56
src/utils/zplGenerator.js
View File

@ -119,20 +119,20 @@ export class ZPLGenerator {
*/ */
generateTextZPL(element, x, y) { generateTextZPL(element, x, y) {
const zpl = [] const zpl = []
// 生成字体命令 // 生成字体命令
const fontCommand = this.generateFontCommand(element) const fontCommand = this.generateFontCommand(element)
zpl.push(fontCommand) zpl.push(fontCommand)
if (element.isChecked) { if (element.isChecked) {
zpl.push(`^FO${x-60},${y}^GB45,45,2,B,0^FS ^FO${x-50},${y+10}^AJN,35,35^FD√^FS `) zpl.push(`^FO${x-60},${y}^GB45,45,2,B,0^FS ^FO${x-50},${y+10}^AJN,35,35^FD√^FS `)
} }
const lineWidth = Math.max(1, Math.round((element.lineWidth || 200) * this.dpi / 25.4)) const lineWidth = Math.max(1, Math.round((element.lineWidth || 200) * this.dpi / 25.4))
// 处理文本对齐 // 处理文本对齐
const alignmentParam = this.getTextAlignmentParam(element.textAlign) const alignmentParam = this.getTextAlignmentParam(element.textAlign)
// 基础文本 // 基础文本
const textCommand = element.newline const textCommand = element.newline
? `^FO${x},${y}^FB${lineWidth},${element.lineRows},0,${alignmentParam}^CFJ,${element.fontSize}^FD${element.data}^FS` ? `^FO${x},${y}^FB${lineWidth},${element.lineRows},0,${alignmentParam}^CFJ,${element.fontSize}^FD${element.data}^FS`
@ -170,7 +170,7 @@ export class ZPLGenerator {
*/ */
generateFontCommand(element) { generateFontCommand(element) {
let fontCmd = '^CI28' // 设置字符编码 let fontCmd = '^CI28' // 设置字符编码
// 根据字体族选择字体文件 // 根据字体族选择字体文件
const fontFamily = element.fontFamily const fontFamily = element.fontFamily
if (fontFamily && fontFamily !== 'default') { if (fontFamily && fontFamily !== 'default') {
@ -179,22 +179,22 @@ export class ZPLGenerator {
fontCmd += ` ^CWJ,E:${fontFile}` fontCmd += ` ^CWJ,E:${fontFile}`
console.log(`ZPL字体映射: ${fontFamily} -> ${fontFile}`) console.log(`ZPL字体映射: ${fontFamily} -> ${fontFile}`)
} else { } else {
fontCmd += ' ^CWJ,E:MSYH.TTF' // 默认字体
fontCmd += ' ^CWJ,E:ARIAL.TTF' // 默认字体
console.warn(`未找到字体映射: ${fontFamily}，使用默认字体`) console.warn(`未找到字体映射: ${fontFamily}，使用默认字体`)
} }
} else { } else {
fontCmd += ' ^CWJ,E:MSYH.TTF' // 默认字体
console.log('使用默认字体: MSYH.TTF')
fontCmd += ' ^CWJ,E:ARIAL.TTF' // 默认字体
console.log('使用默认字体: ARIAL.TTF')
} }
// 设置字体大小 // 设置字体大小
const fontSize = element.fontSize || 30 const fontSize = element.fontSize || 30
fontCmd += ` ^CFJ,${fontSize}` fontCmd += ` ^CFJ,${fontSize}`
// 添加调试信息 // 添加调试信息
console.log(`生成字体命令: ${fontCmd}`) console.log(`生成字体命令: ${fontCmd}`)
console.log(`字体族: ${fontFamily}, 字体大小: ${fontSize}`) console.log(`字体族: ${fontFamily}, 字体大小: ${fontSize}`)
return fontCmd return fontCmd
} }
@ -220,7 +220,7 @@ export class ZPLGenerator {
'新細明體': 'PMINGLIU.TTF', '新細明體': 'PMINGLIU.TTF',
'DFKai-SB': 'DFKAI.TTF', 'DFKai-SB': 'DFKAI.TTF',
'標楷體': 'DFKAI.TTF', '標楷體': 'DFKAI.TTF',
// 英文字体 // 英文字体
'Arial': 'ARIAL.TTF', 'Arial': 'ARIAL.TTF',
'Times New Roman': 'TIMES.TTF', 'Times New Roman': 'TIMES.TTF',
@ -243,7 +243,7 @@ export class ZPLGenerator {
'Futura': 'FUTURA.TTF', 'Futura': 'FUTURA.TTF',
'Bodoni': 'BODONI.TTF', 'Bodoni': 'BODONI.TTF',
'Didot': 'DIDOT.TTF', 'Didot': 'DIDOT.TTF',
// 等宽字体 // 等宽字体
'Consolas': 'CONSOLAS.TTF', 'Consolas': 'CONSOLAS.TTF',
'Monaco': 'MONACO.TTF', 'Monaco': 'MONACO.TTF',
@ -251,7 +251,7 @@ export class ZPLGenerator {
'Source Code Pro': 'SOURCECODE.TTF', 'Source Code Pro': 'SOURCECODE.TTF',
'Fira Code': 'FIRACODE.TTF', 'Fira Code': 'FIRACODE.TTF',
'JetBrains Mono': 'JETBRAINS.TTF', 'JetBrains Mono': 'JETBRAINS.TTF',
// 装饰字体 // 装饰字体
'Brush Script MT': 'BRUSHSCRIPT.TTF', 'Brush Script MT': 'BRUSHSCRIPT.TTF',
'Papyrus': 'PAPYRUS.TTF', 'Papyrus': 'PAPYRUS.TTF',
@ -259,12 +259,12 @@ export class ZPLGenerator {
'Marker Felt': 'MARKERFELT.TTF', 'Marker Felt': 'MARKERFELT.TTF',
'Zapfino': 'ZAPFINO.TTF', 'Zapfino': 'ZAPFINO.TTF',
'Snell Roundhand': 'SNELLROUND.TTF', 'Snell Roundhand': 'SNELLROUND.TTF',
// 默认字体 // 默认字体
'default': 'MSYH.TTF',
'Default': 'MSYH.TTF'
'default': 'ARIAL.TTF',
'Default': 'ARIAL.TTF'
} }
// 如果找不到精确匹配，尝试模糊匹配 // 如果找不到精确匹配，尝试模糊匹配
if (!fontMapping[fontFamily]) { if (!fontMapping[fontFamily]) {
const lowerFontFamily = fontFamily.toLowerCase() const lowerFontFamily = fontFamily.toLowerCase()
@ -274,8 +274,8 @@ export class ZPLGenerator {
} }
} }
} }
return fontMapping[fontFamily] || 'MSYH.TTF' // 默认返回微软雅黑
return fontMapping[fontFamily] || 'ARIAL.TTF' // 默认返回ARIAL
} }
/** /**
@ -295,11 +295,11 @@ export class ZPLGenerator {
*/ */
estimateTextWidth(text, fontSize) { estimateTextWidth(text, fontSize) {
if (!text) return 0 if (!text) return 0
// 简单估算：中文字符按字体大小计算，英文字符按字体大小的0.6倍计算 // 简单估算：中文字符按字体大小计算，英文字符按字体大小的0.6倍计算
let chineseCount = 0 let chineseCount = 0
let englishCount = 0 let englishCount = 0
for (let i = 0; i < text.length; i++) { for (let i = 0; i < text.length; i++) {
const char = text.charAt(i) const char = text.charAt(i)
if (char.match(/[\u4e00-\u9fff]/)) { if (char.match(/[\u4e00-\u9fff]/)) {
@ -308,7 +308,7 @@ export class ZPLGenerator {
englishCount++ englishCount++
} }
} }
return Math.round(chineseCount * fontSize + englishCount * fontSize * 0.6) return Math.round(chineseCount * fontSize + englishCount * fontSize * 0.6)
} }
@ -436,22 +436,22 @@ export class ZPLGenerator {
*/ */
generateSerialNumberZPL(element, x, y) { generateSerialNumberZPL(element, x, y) {
const zpl = [] const zpl = []
// 生成字体命令 // 生成字体命令
const fontCommand = this.generateFontCommand(element) const fontCommand = this.generateFontCommand(element)
zpl.push(fontCommand) zpl.push(fontCommand)
const bold = element.bold || false const bold = element.bold || false
const base = `^FO${x},${y}^FD${element.data}^FS` const base = `^FO${x},${y}^FD${element.data}^FS`
zpl.push(base) zpl.push(base)
// 可选：加粗效果（重复打印） // 可选：加粗效果（重复打印）
if (bold) { if (bold) {
zpl.push(`^FO${x + 1},${y}^FD${element.data}^FS`) zpl.push(`^FO${x + 1},${y}^FD${element.data}^FS`)
zpl.push(`^FO${x},${y + 1}^FD${element.data}^FS`) zpl.push(`^FO${x},${y + 1}^FD${element.data}^FS`)
zpl.push(`^FO${x + 1},${y + 1}^FD${element.data}^FS`) zpl.push(`^FO${x + 1},${y + 1}^FD${element.data}^FS`)
} }
return zpl.join('\n') return zpl.join('\n')
} }
} }

144
src/views/modules/labelSetting/components/PaperSelector.vue
View File

@ -11,12 +11,13 @@
<!-- 纸张类型选择 --> <!-- 纸张类型选择 -->
<div class="paper-type-select"> <div class="paper-type-select">
<el-select <el-select
:value="selectedPaper"
:value="normalizedSelectedPaper"
@change="handlePaperChange" @change="handlePaperChange"
placeholder="选择纸张类型" placeholder="选择纸张类型"
size="small" size="small"
:loading="loading" :loading="loading"
:style="horizontalMode ? 'width: 120px;' : 'width: 100%;'" :style="horizontalMode ? 'width: 120px;' : 'width: 100%;'"
filterable
> >
<el-option <el-option
v-for="option in paperOptions" v-for="option in paperOptions"
@ -31,74 +32,6 @@
</el-option> </el-option>
</el-select> </el-select>
</div> </div>
<!-- 打印方向选择 -->
<!-- <div class="orientation-select" :class="{ 'horizontal-inline': horizontalMode }">
<el-radio-group
:value="orientation"
@change="handleOrientationChange"
size="small"
>
<el-radio label="portrait">纵向</el-radio>
<el-radio label="landscape">横向</el-radio>
</el-radio-group>
</div>-->
<!-- 纸张预览 -->
<div class="paper-preview">
<div class="preview-container">
<div
class="preview-paper"
:style="previewStyle"
:class="{ landscape: orientation === 'landscape' }"
>
<div class="preview-label">
{{ currentSize.width }}×{{ currentSize.height }}
</div>
</div>
</div>
</div>
<!-- 当前画布信息 -->
<div class="canvas-info">
<div class="info-item">
<span class="label">画布尺寸:</span>
<span class="value">{{ currentSize.width }} × {{ currentSize.height }}px</span>
</div>
<div class="info-item">
<span class="label">打印方向:</span>
<span class="value">
{{ orientationText }}
<i :class="orientationIcon" style="margin-left: 4px;"></i>
</span>
</div>
<div v-if="originalPaperInfo" class="info-item">
<span class="label">纸张规格:</span>
<span class="value">{{ originalPaperInfo }}</span>
</div>
<div v-if="currentSize.description" class="info-item description">
<span class="label">说明:</span>
<span class="value">{{ currentSize.description }}</span>
</div>
</div>
<!-- 快速尺寸按钮 -->
<div class="quick-sizes">
<div class="quick-title">常用尺寸</div>
<div class="quick-buttons">
<el-button
v-for="size in quickSizes"
:key="size.value"
:type="selectedPaper === size.value ? 'primary' : ''"
size="mini"
@click="handlePaperChange(size.value)"
>
{{ size.label }}
</el-button>
</div>
</div>
</div> </div>
</template> </template>
@ -163,33 +96,18 @@ export default {
paper: paper paper: paper
})) }))
}, },
currentSize() {
// 如果是数字ID，从动态纸张中获取
if (typeof this.selectedPaper === 'number') {
const paper = this.dynamicPapers.find(p => p.id === this.selectedPaper)
if (paper) {
return dynamicPaperConfig.calculatePixelSize(paper, 203, this.orientation)
}
}
// 兼容旧的字符串格式
if (typeof this.selectedPaper === 'string') {
const legacyPaper = dynamicPaperConfig.findPaperByLegacyType(this.selectedPaper)
if (legacyPaper) {
return dynamicPaperConfig.calculatePixelSize(legacyPaper, 203, this.orientation)
}
// 降级到原有方法
return getCanvasSize(this.selectedPaper, this.orientation)
// 确保选中的纸张ID是正确的类型
normalizedSelectedPaper() {
if (this.selectedPaper === null || this.selectedPaper === undefined) {
return null
} }
// 如果没有选择纸张，返回默认尺寸
if (this.dynamicPapers.length > 0) {
const defaultPaper = this.dynamicPapers[0]
return dynamicPaperConfig.calculatePixelSize(defaultPaper, 203, this.orientation)
// 如果是字符串类型的数字，转换为数字
if (typeof this.selectedPaper === 'string' && /^\d+$/.test(this.selectedPaper)) {
return parseInt(this.selectedPaper, 10)
} }
return { width: 400, height: 300, name: '默认', description: '默认尺寸' }
return this.selectedPaper
}, },
orientationText() { orientationText() {
return this.orientation === 'portrait' ? '纵向' : '横向' return this.orientation === 'portrait' ? '纵向' : '横向'
}, },
@ -200,41 +118,10 @@ export default {
label: paper.name.replace('英寸', '').replace('×', '×') label: paper.name.replace('英寸', '').replace('×', '×')
})) }))
}, },
// 显示原始纸张尺寸信息
originalPaperInfo() {
if (typeof this.selectedPaper === 'number') {
const paper = this.dynamicPapers.find(p => p.id === this.selectedPaper)
return paper ? `${paper.name} (${paper.widthMm}×${paper.heightMm}mm)` : ''
}
// 兼容旧格式
const paper = PAPER_SIZES[this.selectedPaper]
return paper ? `${paper.name} (${paper.width}×${paper.height}px)` : ''
},
// 方向图标 // 方向图标
orientationIcon() { orientationIcon() {
return this.orientation === 'portrait' ? 'el-icon-mobile-phone' : 'el-icon-monitor' return this.orientation === 'portrait' ? 'el-icon-mobile-phone' : 'el-icon-monitor'
}, },
// 预览样式
previewStyle() {
const { width, height } = this.currentSize
const maxWidth = 80
const maxHeight = 50
// 计算缩放比例
const scaleX = maxWidth / width
const scaleY = maxHeight / height
const scale = Math.min(scaleX, scaleY, 1)
const previewWidth = width * scale
const previewHeight = height * scale
return {
width: `${previewWidth}px`,
height: `${previewHeight}px`,
backgroundColor: this.orientation === 'landscape' ? '#e3f2fd' : '#f3e5f5'
}
}
}, },
methods: { methods: {
// 加载纸张数据 // 加载纸张数据
@ -243,14 +130,14 @@ export default {
this.loading = true this.loading = true
await dynamicPaperConfig.loadPapers() await dynamicPaperConfig.loadPapers()
this.dynamicPapers = dynamicPaperConfig.getActivePapers() this.dynamicPapers = dynamicPaperConfig.getActivePapers()
// 设置默认纸张ID // 设置默认纸张ID
if (this.dynamicPapers.length > 0 && !this.defaultPaperId) { if (this.dynamicPapers.length > 0 && !this.defaultPaperId) {
// 优先选择4×2英寸作为默认纸张 // 优先选择4×2英寸作为默认纸张
const defaultPaper = this.dynamicPapers.find(p => p.name.includes('4×2')) || this.dynamicPapers[0] const defaultPaper = this.dynamicPapers.find(p => p.name.includes('4×2')) || this.dynamicPapers[0]
this.defaultPaperId = defaultPaper.id this.defaultPaperId = defaultPaper.id
} }
console.log('纸张选择器加载完成:', this.dynamicPapers.length, '个纸张') console.log('纸张选择器加载完成:', this.dynamicPapers.length, '个纸张')
} catch (error) { } catch (error) {
console.error('加载纸张数据失败:', error) console.error('加载纸张数据失败:', error)
@ -276,8 +163,9 @@ export default {
// 获取当前选择的纸张对象 // 获取当前选择的纸张对象
getCurrentPaper() { getCurrentPaper() {
if (typeof this.selectedPaper === 'number') {
return this.dynamicPapers.find(p => p.id === this.selectedPaper)
const paperId = this.normalizedSelectedPaper
if (typeof paperId === 'number') {
return this.dynamicPapers.find(p => p.id === paperId)
} }
return null return null
} }

Write Preview
Loading…
Cancel
Save