feat(pdo): 添加标签打印功能并调整布局

- 在PDO列表中添加打印按钮
- 将标签打印从标签页改为独立弹窗
- 调整T.vue组件布局列数
- 修改打印配置以扫描页面样式
This commit is contained in:
砂糖
2025-12-24 14:01:30 +08:00
parent 87fb87fa4f
commit fb5dea4dbe
3 changed files with 24 additions and 10 deletions

View File

@@ -182,8 +182,8 @@ export default {
type: 'html', type: 'html',
header: null, // 不显示默认页眉 header: null, // 不显示默认页眉
footer: null, // 不显示默认页脚 footer: null, // 不显示默认页脚
style: printStyle, // 应用打印样式 // style: printStyle, // 应用打印样式
scanStyles: false, // 不扫描页面现有样式 scanStyles: true, // 不扫描页面现有样式
targetStyles: ['*'], // 允许所有目标样式 targetStyles: ['*'], // 允许所有目标样式
documentTitle: '标签打印', // 打印文档标题 documentTitle: '标签打印', // 打印文档标题
onPrintDialogClose: () => { onPrintDialogClose: () => {

View File

@@ -106,6 +106,7 @@
</div> </div>
</div> </div>
<div class="card-footer"> <div class="card-footer">
<el-button size="mini" type="text" icon="el-icon-view" @click.stop="handlePrint(item)">打印</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click.stop="handleEdit(item)">操作</el-button> <el-button size="mini" type="text" icon="el-icon-edit" @click.stop="handleEdit(item)">操作</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" :loading="item.deleteLoading" <el-button size="mini" type="text" icon="el-icon-delete" :loading="item.deleteLoading"
@click.stop="handleDelete(item)">删除</el-button> @click.stop="handleDelete(item)">删除</el-button>
@@ -156,15 +157,21 @@
</div> </div>
<!-- 编辑保留原有tab显示数据修正+标签打印 --> <!-- 编辑保留原有tab显示数据修正+标签打印 -->
<el-tabs v-else v-model="activeTab"> <!-- <el-tabs v-else v-model="activeTab"> -->
<el-tab-pane label="数据修正" name="basicInfo"> <!-- <el-tab-pane label="数据修正" name="basicInfo"> -->
<pdo-data-correction :detail="formData" :save-callback="handleSave" <pdo-data-correction :detail="formData" :save-callback="handleSave"
:save-loading="saveLoading"></pdo-data-correction> :save-loading="saveLoading"></pdo-data-correction>
</el-tab-pane> <!-- </el-tab-pane> -->
<el-tab-pane label="标签打印" name="labelPrint"> <!-- <el-tab-pane label="标签打印" name="labelPrint"> -->
<pdo-label-print :detail="formData"></pdo-label-print>
</el-tab-pane> <!-- </el-tab-pane>
</el-tabs> </el-tabs> -->
</el-dialog>
<el-dialog title="标签打印" :visible.sync="printOpen" width="600px" :close-on-click-modal="false">
<div style="display: flex; justify-content: center; align-items: center;">
<pdo-label-print :detail="formData"></pdo-label-print>
</div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
@@ -190,6 +197,7 @@ export default {
return { return {
activeTab: 'basicInfo', activeTab: 'basicInfo',
queryForm: { coilid: '', startDate: '', endDate: '' }, queryForm: { coilid: '', startDate: '', endDate: '' },
printOpen: false,
tableData: [], tableData: [],
tableLoading: false, tableLoading: false,
btnLoading: false, btnLoading: false,
@@ -283,6 +291,11 @@ export default {
this.formData = JSON.parse(JSON.stringify(row)); this.formData = JSON.parse(JSON.stringify(row));
this.dialogVisible = true this.dialogVisible = true
}, },
handlePrint(row) {
// 深拷贝行数据(避免直接修改表格数据)
this.formData = JSON.parse(JSON.stringify(row));
this.printOpen = true
},
// 删除(保持不变) // 删除(保持不变)
handleDelete(row) { handleDelete(row) {
this.$confirm(`确定删除成品卷 ${row.exitMatId}?`, '确认删除', { type: 'danger' }).then(() => { this.$confirm(`确定删除成品卷 ${row.exitMatId}?`, '确认删除', { type: 'danger' }).then(() => {

View File

@@ -41,7 +41,7 @@
:xs="24" :xs="24"
:sm="12" :sm="12"
:md="8" :md="8"
:lg="5" :lg="6"
:xl="4" :xl="4"
class="card-col" class="card-col"
> >
@@ -152,6 +152,7 @@
<el-option v-for="item in getFieldOptions(key)" :key="item.value" :label="item.label" :value="item.value" /> <el-option v-for="item in getFieldOptions(key)" :key="item.value" :label="item.label" :value="item.value" />
</el-select> </el-select>
<component <component
v-else
:is="getFieldComponentType(key)" :is="getFieldComponentType(key)"
v-model="form[key]" v-model="form[key]"
:placeholder="`请${getFieldInputHint(key)}${getFieldLabel(key)}`" :placeholder="`请${getFieldInputHint(key)}${getFieldLabel(key)}`"