Browse Source

2025-11-17

库存标签补打标签打印
master
fengyuan_yang 2 months ago
parent
commit
bd231a39d1
  1. 228
      src/mixins/labelPrintTemplates.js
  2. 6
      src/views/modules/print/PoPartPrint.vue
  3. 503
      src/views/modules/print/rePrintPoPart.vue

228
src/mixins/labelPrintTemplates.js

@ -0,0 +1,228 @@
/**
* 标签打印模板 Mixin
* 提供 A001A002A003 三种标签打印模板的通用方法
*/
export default {
methods: {
// A001 标签打印(70mm x 30mm)- 左边二维码,右边文字信息
printLabelA001(LODOP, printData, isNewPage){
if(isNewPage){
LODOP.NEWPAGE();
}
// ============================================================
// 1. 纸张设置
// ============================================================
// SET_PRINT_PAGESIZE(方向, 宽度, 高度, 纸张名称)
// 方向: 0=纵向, 1=横向
// 宽度/高度: 单位为 1/10 毫米,如 700 = 70mm
LODOP.SET_PRINT_PAGESIZE(0, 700, 300, '');
// ============================================================
// 2. 绘制边框和分隔线
// ============================================================
// ADD_PRINT_RECT(上边距, 左边距, 宽度, 高度, 边框样式, 边框粗细)
// 边框样式: 0=实线
// 边框粗细: 单位为像素
// 外边框(1mm边距,68mm宽 x 28mm高)
LODOP.ADD_PRINT_RECT('1mm', '1mm', '68mm', '28mm', 0, 1);
// ADD_PRINT_LINE(起点Y, 起点X, 终点Y, 终点X, 线条样式, 线条粗细)
// 线条样式: 0=实线
// 垂直分隔线:左右分隔(从上到下)
// 参数说明:起点(1mm, 22mm) -> 终点(29mm, 22mm)
LODOP.ADD_PRINT_LINE('1mm', '22mm', '29mm', '22mm', 0, 1);
// 水平分隔线1:编码下方
// 参数说明:起点(8mm, 22mm) -> 终点(8mm, 69mm)
LODOP.ADD_PRINT_LINE('8mm', '22mm', '8mm', '69mm', 0, 1);
// 水平分隔线2:型号下方
// 参数说明:起点(13mm, 22mm) -> 终点(13mm, 69mm)
LODOP.ADD_PRINT_LINE('13mm', '22mm', '13mm', '69mm', 0, 1);
// 水平分隔线3:数量下方
// 参数说明:起点(18mm, 22mm) -> 终点(18mm, 69mm)
LODOP.ADD_PRINT_LINE('18mm', '22mm', '18mm', '69mm', 0, 1);
// 水平分隔线4:批号下方
// 参数说明:起点(23mm, 22mm) -> 终点(23mm, 69mm)
LODOP.ADD_PRINT_LINE('23mm', '22mm', '23mm', '69mm', 0, 1);
// ============================================================
// 3. 左侧二维码
// ============================================================
// ADD_PRINT_BARCODE(上边距, 左边距, 宽度, 高度, 条码类型, 条码内容)
// 二维码位置:距上7mm,距左3mm,尺寸20mm x 20mm
const qrIndex = LODOP.ADD_PRINT_BARCODE('7mm', '3mm', '20mm', '20mm', 'QRCode', printData.rollNo || '');
LODOP.SET_PRINT_STYLEA(qrIndex, "QRCodeVersion", 4);
LODOP.SET_PRINT_STYLEA(qrIndex, "QRCodeErrorLevel", "M");
// ============================================================
// 4. 右侧文字信息(5行)
// ============================================================
// ADD_PRINT_TEXT(上边距, 左边距, 宽度, 高度, 文字内容)
// 文字起始X位置(左边距)和宽度
const startX = '23mm'; // 可调整:文字左边距,增大向右移,减小向左移
const textWidth = '43mm'; // 可调整:文字区域宽度
// 编码(第1行)
// 上边距4mm:可调整,增大向下移,减小向上移
const text1 = LODOP.ADD_PRINT_TEXT('4mm', startX, textWidth, '4mm', `编码:${printData.partNo || ''}`);
LODOP.SET_PRINT_STYLEA(text1, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text1, "FontSize", 8); // 可调整:字体大小
// 型号(第2行)
// 上边距9mm:可调整
const text2 = LODOP.ADD_PRINT_TEXT('9mm', startX, textWidth, '4mm', `型号:${printData.spec || ''}`);
LODOP.SET_PRINT_STYLEA(text2, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text2, "FontSize", 8);
// 数量(第3行)
// 上边距14mm:可调整
const text3 = LODOP.ADD_PRINT_TEXT('14mm', startX, textWidth, '4mm', `数量:${printData.quantity || ''}`);
LODOP.SET_PRINT_STYLEA(text3, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text3, "FontSize", 8);
// 批号(第4行)
// 上边距19mm:可调整
const text4 = LODOP.ADD_PRINT_TEXT('19mm', startX, textWidth, '4mm', `批号:${printData.batchNo || ''}`);
LODOP.SET_PRINT_STYLEA(text4, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text4, "FontSize", 8);
// 日期(第5行)
// 上边距24mm:可调整
const text5 = LODOP.ADD_PRINT_TEXT('24mm', startX, textWidth, '4mm', `日期:${printData.documentDate || ''}`);
LODOP.SET_PRINT_STYLEA(text5, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text5, "FontSize", 8);
},
// A002 标签打印(70mm x 20mm)- 其他工序用
printLabelA002(LODOP, printData, isNewPage){
if(isNewPage){
LODOP.NEWPAGE();
}
// ============================================================
// 1. 纸张设置
// ============================================================
// 设置纸张大小 70mm x 20mm (0=纵向)
LODOP.SET_PRINT_PAGESIZE(0, 700, 200, '');
// ============================================================
// 2. 绘制边框
// ============================================================
// 外边框(1mm边距,68mm宽 x 18mm高)
LODOP.ADD_PRINT_RECT('1mm', '1mm', '68mm', '18mm', 0, 1);
// ============================================================
// 3. 左侧二维码
// ============================================================
// 二维码位置:距上1.6mm,距左3.4mm,尺寸18.2mm x 18.2mm
const qrIndex = LODOP.ADD_PRINT_BARCODE('1.6mm', '3.4mm', '18.2mm', '18.2mm', 'QRCode', printData.rollNo || '');
LODOP.SET_PRINT_STYLEA(qrIndex, "QRCodeVersion", 4);
LODOP.SET_PRINT_STYLEA(qrIndex, "QRCodeErrorLevel", "M");
// ============================================================
// 4. 右侧文字信息(4行)
// ============================================================
const startX = '23mm'; // 文字左边距
const textWidth = '43mm'; // 文字区域宽度
// 第1行:编码
const text1 = LODOP.ADD_PRINT_TEXT('3mm', startX, textWidth, '3mm', `编码:${printData.partNo || ''}`);
LODOP.SET_PRINT_STYLEA(text1, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text1, "FontSize", 8);
// 第2行:卷号
const text2 = LODOP.ADD_PRINT_TEXT('7mm', startX, textWidth, '3mm', `卷号:${printData.rollNo || ''}`);
LODOP.SET_PRINT_STYLEA(text2, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text2, "FontSize", 8);
// 第3行:良品 + 不良品(左右分布)
// 良品(左侧)
const text3 = LODOP.ADD_PRINT_TEXT('11mm', startX, '20mm', '3mm', `良品:${printData.goodQuantity || ''}`);
LODOP.SET_PRINT_STYLEA(text3, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text3, "FontSize", 8);
// 不良品(右侧)
const text4 = LODOP.ADD_PRINT_TEXT('11mm', '43mm', '23mm', '3mm', `不良品:${printData.badQuantity || ''}`);
LODOP.SET_PRINT_STYLEA(text4, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text4, "FontSize", 8);
// 第4行:总数 + 良率(左右分布)
// 总数(左侧)
const text5 = LODOP.ADD_PRINT_TEXT('15mm', startX, '20mm', '3mm', `总数:${printData.quantity || ''}`);
LODOP.SET_PRINT_STYLEA(text5, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text5, "FontSize", 8);
// 良率(右侧)
const text6 = LODOP.ADD_PRINT_TEXT('15mm', '43mm', '23mm', '3mm', `良率:${printData.yield || ''}%`);
LODOP.SET_PRINT_STYLEA(text6, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text6, "FontSize", 8);
},
// A003 标签打印(70mm x 20mm)- 绑定用
printLabelA003(LODOP, printData, isNewPage){
if(isNewPage){
LODOP.NEWPAGE();
}
// ============================================================
// 1. 纸张设置
// ============================================================
// 设置纸张大小 70mm x 20mm (0=纵向)
LODOP.SET_PRINT_PAGESIZE(0, 700, 200, '');
// ============================================================
// 2. 绘制边框
// ============================================================
// 外边框(1mm边距,68mm宽 x 18mm高)
LODOP.ADD_PRINT_RECT('1mm', '1mm', '68mm', '18mm', 0, 1);
// ============================================================
// 3. 左侧二维码
// ============================================================
// 二维码位置:距上1.6mm,距左3.4mm,尺寸18.2mm x 18.2mm
const qrIndex = LODOP.ADD_PRINT_BARCODE('1.6mm', '3.4mm', '18.2mm', '18.2mm', 'QRCode', printData.rollNo || '');
LODOP.SET_PRINT_STYLEA(qrIndex, "QRCodeVersion", 4);
LODOP.SET_PRINT_STYLEA(qrIndex, "QRCodeErrorLevel", "M");
// ============================================================
// 4. 右侧文字信息(4行)
// ============================================================
const startX = '23mm'; // 文字左边距
const textWidth = '43mm'; // 文字区域宽度
// 第1行:ERP No.
const text1 = LODOP.ADD_PRINT_TEXT('3mm', startX, textWidth, '3mm', `ERP No.: ${printData.partNo || ''}`);
LODOP.SET_PRINT_STYLEA(text1, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text1, "FontSize", 8);
// 第2行:Batch No. + Reel No.(左右分布)
// Batch No.(左侧)
const text2 = LODOP.ADD_PRINT_TEXT('7mm', startX, '20mm', '3mm', `Batch No.: ${printData.batchNo || ''}`);
LODOP.SET_PRINT_STYLEA(text2, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text2, "FontSize", 8);
// Reel No.(右侧)
const text3 = LODOP.ADD_PRINT_TEXT('7mm', '43mm', '23mm', '3mm', `Reel No.: ${printData.reelNo || ''}`);
LODOP.SET_PRINT_STYLEA(text3, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text3, "FontSize", 8);
// 第3行:Good QTY
const text4 = LODOP.ADD_PRINT_TEXT('11mm', startX, textWidth, '3mm', `Good QTY: ${printData.goodQuantity || ''}`);
LODOP.SET_PRINT_STYLEA(text4, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text4, "FontSize", 8);
// 第4行:Bad QTY
const text5 = LODOP.ADD_PRINT_TEXT('15mm', startX, textWidth, '3mm', `Bad QTY: ${printData.badQuantity || ''}`);
LODOP.SET_PRINT_STYLEA(text5, "FontName", "Microsoft YaHei");
LODOP.SET_PRINT_STYLEA(text5, "FontSize", 8);
}
}
}

6
src/views/modules/print/PoPartPrint.vue

@ -251,7 +251,7 @@
width="650px" width="650px"
class="print-dialog"> class="print-dialog">
<div slot="title" class="dialog-title-wrapper"> <div slot="title" class="dialog-title-wrapper">
<i class="el-icon-printer" style="margin-right: 8px; font-size: 20px; color: #409EFF;"></i>
<i class="el-icon-printer" style="margin-right: 8px; font-size: 20px;"></i>
<span style="font-size: 18px; font-weight: 600;">标签打印设置</span> <span style="font-size: 18px; font-weight: 600;">标签打印设置</span>
</div> </div>
@ -1279,8 +1279,8 @@ export default {
relatedOrderNo: this.currentRow.poOrderNo, relatedOrderNo: this.currentRow.poOrderNo,
relatedOrderLineNo: this.currentRow.poItemNo, relatedOrderLineNo: this.currentRow.poItemNo,
documentNo: this.currentRow.notifyNo, documentNo: this.currentRow.notifyNo,
PartNo: item.partNo,
LabelNo: this.printDialogData.labelNo,
partNo: item.partNo,
labelNo: this.printDialogData.labelNo,
rollNo: item.rollNo rollNo: item.rollNo
}; };

503
src/views/modules/print/rePrintPoPart.vue

@ -118,23 +118,139 @@
:total="totalPage" :total="totalPage"
layout="total, sizes, prev, pager, next, jumper"> layout="total, sizes, prev, pager, next, jumper">
</el-pagination> </el-pagination>
<el-dialog title="补打标签" :close-on-click-modal="false" v-drag :visible.sync="addModelFlag" width="300px">
<el-form :model="addModelData" label-position="top" style="margin-top: -5px;">
<!-- 标签打印对话框 -->
<el-dialog
:close-on-click-modal="false"
v-drag
:visible.sync="printDialogVisible"
width="650px"
class="print-dialog">
<div slot="title" class="dialog-title-wrapper">
<i class="el-icon-printer" style="margin-right: 8px; font-size: 20px;"></i>
<span style="font-size: 18px; font-weight: 600;">标签打印设置</span>
</div>
<div class="print-dialog-content">
<!-- 打印信息提示 -->
<div class="print-info-banner">
<i class="el-icon-info" style="margin-right: 8px; font-size: 16px;"></i>
<span>已选择 <strong style="color: #3a7ba8;">{{ selectionDataList.length }}</strong> 个标签请配置打印参数</span>
</div>
<el-form :model="printDialogData" label-position="top" style="margin-top: 20px;">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="24">
<el-form-item label="标签样式" >
<el-select v-model="addModelData.type" >
<el-option label="A" value="A"></el-option>
<el-col :span="12">
<el-form-item required>
<span slot="label" class="form-label">
<i class="el-icon-document-copy" style="margin-right: 5px;"></i>
打印次数
</span>
<el-input-number
v-model="printDialogData.printTimes"
:min="1"
:max="100"
controls-position="right"
placeholder="每个标签打印份数"
style="width: 100%">
</el-input-number>
<div class="form-tip">设置每个标签的打印份数</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item required>
<span slot="label" class="form-label">
<i class="el-icon-tickets" style="margin-right: 5px;"></i>
标签模板
</span>
<el-select
v-model="printDialogData.labelNo"
placeholder="请选择标签模板"
style="width: 100%"
:disabled="labelTemplateList.length === 0">
<el-option
v-for="item in labelTemplateList"
:key="item.labelNo"
:label="item.labelName"
:value="item.labelNo">
<span style="float: left">{{ item.labelName }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.labelNo }}</span>
</el-option>
</el-select> </el-select>
<div class="form-tip" v-if="labelTemplateList.length === 0" style="color: #F56C6C;">
{{ multiPartNoTip }}
</div>
<div class="form-tip" v-else>
根据物料自动匹配模板
</div>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item required>
<span slot="label" class="form-label">
<i class="el-icon-printer" style="margin-right: 5px;"></i>
目标打印机
</span>
<el-select
v-model="printDialogData.printerName"
placeholder="请选择打印机"
style="width: 100%"
:disabled="printerList.length === 0">
<el-option
v-for="item in printerList"
:key="item"
:label="item"
:value="item">
<i class="el-icon-printer" style="margin-right: 8px; color: #67C23A;"></i>
{{ item }}
</el-option>
</el-select>
<div class="form-tip" v-if="printerList.length === 0" style="color: #F56C6C;">
未检测到打印机请确保已安装并启动 CLodop
</div>
<div class="form-tip" v-else>
已检测到 {{ printerList.length }} 台打印机
</div>
</el-form-item>
</el-col>
</el-row> </el-row>
<!-- 打印预览说明 -->
<div class="print-summary">
<div class="summary-item">
<span class="summary-label">打印总数</span>
<span class="summary-value">{{ selectionDataList.length * printDialogData.printTimes }} </span>
</div>
<div class="summary-item">
<span class="summary-label">标签数量</span>
<span class="summary-value">{{ selectionDataList.length }} </span>
</div>
<div class="summary-item">
<span class="summary-label">每标签份数</span>
<span class="summary-value">{{ printDialogData.printTimes }} </span>
</div>
</div>
</el-form> </el-form>
</div>
<div slot="footer" class="dialog-footer" style="text-align: center;">
<el-button type="success" @click="printLabel()">补打</el-button>
<el-button type="primary" @click="addModelFlag=false">取消</el-button>
<div slot="footer" class="dialog-footer">
<el-button
type="success"
icon="el-icon-printer"
@click="confirmPrint()"
:loading="printLoading"
:disabled="!printDialogData.printerName"
size="medium">
{{ printLoading ? '打印中...' : '开始打印' }}
</el-button>
<el-button
@click="printDialogVisible=false"
size="medium">
取消
</el-button>
</div> </div>
</el-dialog> </el-dialog>
@ -173,11 +289,16 @@ import {
getKuCunLabelData, getKuCunLabelData,
updateInventoryStockAttribute, updateInventoryStockAttribute,
getWarehouseList, getWarehouseList,
freezeStatusInventoryStock
freezeStatusInventoryStock,
getPartLabelTemplateList,
callUspPartLabelTemplate
} from '../../../api/wms/wms' } from '../../../api/wms/wms'
import {kuCunLabelPrint} from '../clodopLabel/kuCunLabel' import {kuCunLabelPrint} from '../clodopLabel/kuCunLabel'
import getLodop from '@/utils/LodopFuncs.js'
import labelPrintTemplates from '@/mixins/labelPrintTemplates.js'
export default { export default {
mixins: [labelPrintTemplates],
data() { data() {
return { return {
height: 450, height: 450,
@ -610,6 +731,17 @@ export default {
remark: '' remark: ''
}, },
selectionDataList:[], selectionDataList:[],
//
printDialogVisible: false,
printDialogData: {
printTimes: 1,
labelNo: '',
printerName: ''
},
labelTemplateList: [],
printerList: [],
printLoading: false,
multiPartNoTip: ''
} }
}, },
components: { components: {
@ -679,13 +811,190 @@ export default {
this.pageIndex = val this.pageIndex = val
this.getMainData() this.getMainData()
}, },
printLabelModel(){
async printLabelModel(){
if(this.selectionDataList.length===0){ if(this.selectionDataList.length===0){
this.$message.error('未选择标签!'); this.$message.error('未选择标签!');
return false; return false;
} }
this.addModelFlag=true;
//
const uniquePartNos = [...new Set(this.selectionDataList.map(item => item.partNo))];
const isSinglePartNo = uniquePartNos.length === 1;
if(isSinglePartNo){
//
await this.getLabelTemplates(uniquePartNos[0]);
//
if(this.labelTemplateList.length === 0) {
this.multiPartNoTip = '暂无可用模板';
} else {
this.multiPartNoTip = '';
}
} else {
//
this.labelTemplateList = [];
this.multiPartNoTip = `已选择 ${uniquePartNos.length} 种物料,将由系统自动匹配模板`;
}
//
this.getPrinterList();
//
this.printDialogData = {
printTimes: 1,
labelNo: '',
printerName: ''
};
this.printDialogVisible = true;
},
//
async getLabelTemplates(partNo){
const params = {
site: this.$store.state.user.site,
buNo: this.selectionDataList[0].buNo,
partNo: partNo
};
try {
const {data} = await getPartLabelTemplateList(params);
if (data && data.code === 0) {
this.labelTemplateList = data.list || [];
if(this.labelTemplateList.length > 0){
//
this.printDialogData.labelNo = this.labelTemplateList[0].labelNo;
}
} else {
this.$message.error(data.msg || '获取标签模板失败!');
}
} catch (error) {
console.error('获取标签模板失败:', error);
this.$message.error('获取标签模板失败!');
}
},
//
getPrinterList(){
try {
const LODOP = getLodop();
if (!LODOP) {
this.$message.warning('未检测到打印控件,请确保已安装并启动CLodop!');
return;
}
const printerCount = LODOP.GET_PRINTER_COUNT();
this.printerList = [];
for (let i = 0; i < printerCount; i++) {
this.printerList.push(LODOP.GET_PRINTER_NAME(i));
}
if(this.printerList.length > 0){
//
this.printDialogData.printerName = this.printerList[0];
}
} catch (error) {
console.error('获取打印机列表失败:', error);
this.$message.error('获取打印机列表失败!');
}
},
//
async confirmPrint(){
//
if(!this.printDialogData.printerName){
this.$message.error('请选择打印机!');
return;
}
this.printLoading = true;
try {
//
const printDataList = [];
for(let i = 0; i < this.selectionDataList.length; i++){
const item = this.selectionDataList[i];
const params = {
site: item.site,
buNo: item.buNo,
menuID: this.$route.meta.menuId || '',
relatedOrderNo: item.orderref1 || '',
relatedOrderLineNo: item.orderref2 || '',
documentNo: item.orderref1 || '',
partNo: item.partNo,
// labelNo
labelNo: this.printDialogData.labelNo || '',
rollNo: item.rollNo
};
const {data} = await callUspPartLabelTemplate(params);
if (data && data.code === 0) {
// labelNo
const printData = {
...data.row,
labelNo: data.row.labelNo || data.row.LabelNo || data.row.label_no || this.printDialogData.labelNo
};
printDataList.push(printData);
} else {
this.$message.error(`获取标签 ${item.rollNo} 的打印参数失败:${data.msg}`);
this.printLoading = false;
return;
}
}
// labelNo
this.executePrint(printDataList);
this.printDialogVisible = false;
this.$message.success('打印任务已发送!');
this.getMainData();
} catch (error) {
console.error('打印失败:', error);
this.$message.error('打印失败:' + error.message);
} finally {
this.printLoading = false;
}
}, },
//
executePrint(printDataList){
const LODOP = getLodop();
if (!LODOP) {
this.$message.error('无法连接到打印控件!');
return;
}
//
LODOP.PRINT_INIT('库存标签补打');
//
LODOP.SET_PRINT_MODE("PRINT_NOCOLLATE", true);
//
LODOP.SET_PRINTER_INDEX(this.printDialogData.printerName);
for(let times = 0; times < this.printDialogData.printTimes; times++){
for(let i = 0; i < printDataList.length; i++){
const printData = printDataList[i];
// labelNo
if(printData.labelNo === 'A001'){
this.printLabelA001(LODOP, printData, i > 0 || times > 0);
} else if(printData.labelNo === 'A002'){
this.printLabelA002(LODOP, printData, i > 0 || times > 0);
} else if(printData.labelNo === 'A003'){
this.printLabelA003(LODOP, printData, i > 0 || times > 0);
} else {
this.$message.warning(`未知的标签模板:${printData.labelNo}`);
}
}
}
//
LODOP.PREVIEW();
},
printLabel(){ printLabel(){
kuCunLabelPrint(this.selectionDataList,"A") kuCunLabelPrint(this.selectionDataList,"A")
}, },
@ -765,9 +1074,177 @@ export default {
} }
} }
</script> </script>
<style scoped>
<style scoped lang="scss">
.sl-svg { .sl-svg {
overflow: hidden; overflow: hidden;
float: right; float: right;
} }
/* 标签打印对话框样式 */
.print-dialog {
/deep/ .el-dialog__header {
background: linear-gradient(135deg, #9ac3d0 20%, #b6c7dd 80%);
padding: 20px 20px 20px 20px;
border-radius: 4px 4px 0 0;
}
/deep/ .el-dialog__title {
color: #ffffff;
}
/deep/ .el-dialog__headerbtn .el-dialog__close {
color: #ffffff;
font-size: 20px;
font-weight: bold;
&:hover {
color: #f0f0f0;
}
}
/deep/ .el-dialog__body {
padding: 0;
}
.dialog-title-wrapper {
color: #ffffff;
display: flex;
align-items: center;
}
.print-dialog-content {
padding: 25px 30px;
}
.print-info-banner {
background: linear-gradient(135deg, #e8f4f8 0%, #f0f5fb 100%);
border-left: 4px solid #60aeff;
padding: 12px 16px;
border-radius: 4px;
color: #606266;
font-size: 14px;
display: flex;
align-items: center;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.form-label {
font-size: 14px;
font-weight: 600;
color: #303133;
display: flex;
align-items: center;
}
.form-tip {
font-size: 12px;
color: #909399;
margin-top: 5px;
line-height: 1.5;
}
.print-summary {
background: linear-gradient(135deg, #e1f0f5 0%, #dae8f3 100%);
border-radius: 8px;
padding: 16px 20px;
margin-top: 20px;
display: flex;
justify-content: space-around;
box-shadow: 0 2px 8px rgba(96, 174, 255, 0.15);
border: 1px solid #c8dff0;
.summary-item {
display: flex;
flex-direction: column;
align-items: center;
.summary-label {
font-size: 12px;
color: #5a7a8f;
margin-bottom: 5px;
font-weight: 500;
}
.summary-value {
font-size: 20px;
font-weight: bold;
color: #3a7ba8;
}
}
}
/deep/ .el-form-item {
margin-bottom: 18px;
}
/deep/ .el-input-number {
width: 100%;
.el-input__inner {
text-align: left;
}
}
/deep/ .el-select {
.el-input__inner {
border: 1px solid #DCDFE6;
transition: all 0.3s;
&:hover {
border-color: #409EFF;
}
&:focus {
border-color: #409EFF;
}
}
}
/deep/ .dialog-footer {
padding: 15px 30px 25px 30px;
text-align: center;
background-color: #fafafa;
border-top: 1px solid #e8e8e8;
.el-button {
min-width: 120px;
height: 40px;
font-weight: 500;
transition: all 0.3s;
font-size: 15px;
}
.el-button--success {
background: linear-gradient(135deg, #67C23A 0%, #85ce61 100%);
border: none;
box-shadow: 0 2px 4px rgba(103, 194, 58, 0.3);
&:hover {
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(103, 194, 58, 0.4);
}
&:active {
transform: translateY(0);
}
}
}
}
/* 选项样式优化 */
/deep/ .el-select-dropdown__item {
padding: 10px 20px;
transition: all 0.2s;
&:hover {
background-color: #f5f7fa;
}
}
/* 输入框聚焦效果 */
/deep/ .el-input__inner:focus,
/deep/ .el-textarea__inner:focus {
border-color: #409EFF;
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
</style> </style>
Loading…
Cancel
Save