5 changed files with 351 additions and 3 deletions
-
3src/api/shipment/index.js
-
326src/views/modules/finshProduct/outWarehouse/com_print_pick_list.vue
-
19src/views/modules/finshProduct/outWarehouse/outWarehouseDetail.vue
-
4src/views/modules/label/print_shipment_box_label.js
-
2src/views/modules/label/print_shipment_packing_box_label.js
@ -0,0 +1,326 @@ |
|||||
|
<script src="print_roll_label.js"></script> |
||||
|
<template> |
||||
|
<div class="customer-css"> |
||||
|
<el-dialog |
||||
|
v-drag |
||||
|
width="400px" |
||||
|
class="customer-dialog" |
||||
|
:visible.sync="visible" |
||||
|
:title="titleCon" |
||||
|
v-bind="$attrs" |
||||
|
v-on="$listeners" |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false"> |
||||
|
|
||||
|
<el-form :inline="false" label-position="top" label-width="80px" style="padding: 15px;"> |
||||
|
<!-- 第一行 --> |
||||
|
<el-row :gutter="15" style="margin-bottom: 15px;"> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="产品料号" class="customer-item"> |
||||
|
<el-input |
||||
|
v-model="formData.partNo" |
||||
|
ref="partNo" |
||||
|
type="text" |
||||
|
disabled> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="料号描述" class="customer-item"> |
||||
|
<el-input |
||||
|
v-model="formData.partDesc" |
||||
|
type="text" |
||||
|
disabled> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
|
||||
|
<!-- 第二行 --> |
||||
|
<el-row :gutter="15" style="margin-bottom: 15px;"> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="关联单号" class="customer-item"> |
||||
|
<el-input |
||||
|
v-model="formData.orderNumber" |
||||
|
type="text" |
||||
|
disabled> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="销售数量" class="customer-item"> |
||||
|
<el-input |
||||
|
v-model="formData.saleQty" |
||||
|
type="number" |
||||
|
disabled> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
|
||||
|
<!-- 第三行 --> |
||||
|
<el-row :gutter="15" style="margin-bottom: 15px;"> |
||||
|
<el-col :span="24"> |
||||
|
<el-form-item label="装箱数量" class="customer-item"> |
||||
|
<el-input v-model="formData.boxQty" type="number"> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
|
||||
|
<!-- 按钮区域 --> |
||||
|
<el-row style="margin-top: 20px;"> |
||||
|
<el-col :span="24" style="text-align: center;"> |
||||
|
<el-button type="primary" @click="handlePrintLabel" :loading="printLoading"> |
||||
|
<i class="el-icon-printer"></i> |
||||
|
打印标签 |
||||
|
</el-button> |
||||
|
<el-button @click="handleClose"> |
||||
|
<i class="el-icon-close"></i> |
||||
|
关闭 |
||||
|
</el-button> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</el-form> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
|
||||
|
|
||||
|
/*打印标签专用的js*/ |
||||
|
import { printShipmentPackingBoxLabel } from '@/views/modules/label/print_shipment_packing_box_label.js' |
||||
|
import { |
||||
|
getPrintShipment, |
||||
|
} from '@/api/shipment' |
||||
|
import dayjs from "dayjs"; |
||||
|
|
||||
|
var functionId = 'C10000006'; |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
titleCon: '装箱单标签', |
||||
|
visible: false, |
||||
|
formData: { |
||||
|
partNo: '', |
||||
|
productDescription: '', |
||||
|
relatedOrderNo: '', |
||||
|
saleQty: 0, |
||||
|
boxQty: 0, |
||||
|
}, |
||||
|
printRow: {}, |
||||
|
dataListLoading: false, |
||||
|
printLoading: false, |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
|
||||
|
init(row) { |
||||
|
//判断是否关闭所有的页面按钮 |
||||
|
this.formData.partNo = row.partNo; |
||||
|
this.formData.partDesc = row.partDesc; |
||||
|
this.formData.orderNumber = row.orderNumber; |
||||
|
this.formData.saleQty = row.saleQty; |
||||
|
this.formData.boxQty = row.saleQty; |
||||
|
//打开显示 |
||||
|
this.visible = true; |
||||
|
//赋值 |
||||
|
this.printRow = JSON.parse(JSON.stringify(row)); |
||||
|
//自动获取焦点 |
||||
|
this.$nextTick(() => { |
||||
|
if (this.$refs.partNo) { |
||||
|
this.$refs.partNo.focus(); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 重置表单数据 |
||||
|
resetFormData() { |
||||
|
this.formData = { |
||||
|
partNo: '', |
||||
|
partDesc: '', |
||||
|
relatedOrderNo: '', |
||||
|
salesQty: 0, |
||||
|
boxQty: 0, |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
// 处理打印标签 |
||||
|
handlePrintLabel() { |
||||
|
if (!this.formData || Object.keys(this.formData).length === 0) { |
||||
|
this.$message.warning('请先扫描标签条码'); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
// 数量校验 |
||||
|
const boxQty = parseFloat(this.formData.boxQty); |
||||
|
const maxQty = parseFloat(this.formData.saleQty); |
||||
|
|
||||
|
if (isNaN(boxQty) || boxQty <= 0) { |
||||
|
this.$message.warning('请输入有效的装箱数量'); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (boxQty > maxQty) { |
||||
|
this.$message.warning(`装箱数量不能大于${maxQty}`); |
||||
|
return; |
||||
|
} |
||||
|
//设置参数 |
||||
|
this.printRow.boxQty = boxQty; |
||||
|
getPrintShipment(this.printRow).then(({data})=>{ |
||||
|
if (data && data.code === 0){ |
||||
|
let arr = data.row; |
||||
|
arr.productionDate = `${dayjs(arr.productionDate).format("YYYYMMDD")}`; |
||||
|
printShipmentPackingBoxLabel(arr); |
||||
|
this.$message.success('标签打印成功'); |
||||
|
}else { |
||||
|
this.$message.warning(data.msg) |
||||
|
} |
||||
|
}).catch((error)=>{ |
||||
|
this.$message.error(error) |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
// 处理关闭 |
||||
|
handleClose() { |
||||
|
this.visible = false; |
||||
|
this.resetFormData(); |
||||
|
this.printRow = {}; |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
created() { |
||||
|
// this.factoryList() |
||||
|
// this.getLanguageList() |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
/deep/ .customer-tab .el-tabs__content { |
||||
|
padding: 0px !important; |
||||
|
} |
||||
|
|
||||
|
/*当前按钮的通用样式*/ |
||||
|
.customer-css .customer-bun-mid { |
||||
|
width: 60px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.customer-css .customer-bun-min { |
||||
|
width: 50px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.customer-css .customer-bun-max { |
||||
|
width: 80px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
/*当前按钮的通用样式*/ |
||||
|
.customer-css .el-button--medium { |
||||
|
padding: 5px 5px; |
||||
|
} |
||||
|
|
||||
|
.customer-css .customer-roll-css span { |
||||
|
margin-left: 15px; |
||||
|
font-size: 16px; |
||||
|
color: #387877; |
||||
|
} |
||||
|
|
||||
|
/*定制组件的样式*/ |
||||
|
.customer-css /deep/ .el-dialog { |
||||
|
top: 6vh !important; |
||||
|
margin-top: 0px !important; |
||||
|
margin-bottom: 10px; |
||||
|
} |
||||
|
|
||||
|
/*自定义当前el-input的样式 */ |
||||
|
.customer-item .el-input { |
||||
|
margin-top: -2vh; |
||||
|
margin-right: 15px; |
||||
|
} |
||||
|
|
||||
|
/* 确保对话框有足够的高度 */ |
||||
|
.customer-dialog /deep/ .el-dialog { |
||||
|
min-height: 250px; |
||||
|
} |
||||
|
|
||||
|
/* 调整对话框底部间距 */ |
||||
|
.customer-dialog /deep/ .el-dialog__footer { |
||||
|
padding: 15px 20px; |
||||
|
text-align: center; |
||||
|
border-top: 1px solid #e4e7ed; |
||||
|
margin-top: 10px; |
||||
|
} |
||||
|
|
||||
|
/* 文本域样式优化 */ |
||||
|
.customer-item /deep/ .el-textarea__inner { |
||||
|
font-size: 14px; |
||||
|
line-height: 1.5; |
||||
|
padding: 12px; |
||||
|
border-radius: 4px; |
||||
|
resize: vertical; |
||||
|
min-height: 80px; |
||||
|
} |
||||
|
|
||||
|
.customer-item /deep/ .el-textarea__inner:focus { |
||||
|
border-color: #409eff; |
||||
|
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2); |
||||
|
} |
||||
|
|
||||
|
/* 按钮图标样式 */ |
||||
|
.customer-bun-mid i { |
||||
|
margin-right: 4px; |
||||
|
} |
||||
|
|
||||
|
/* 对话框样式 */ |
||||
|
.customer-dialog /deep/ .el-dialog__body { |
||||
|
padding: 0; |
||||
|
} |
||||
|
|
||||
|
.customer-dialog /deep/ .el-dialog__footer { |
||||
|
padding: 10px 20px; |
||||
|
text-align: right; |
||||
|
border-top: 1px solid #e4e7ed; |
||||
|
} |
||||
|
|
||||
|
.dialog-footer { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
gap: 10px; |
||||
|
} |
||||
|
|
||||
|
/* 新增样式 */ |
||||
|
.customer-css .el-row { |
||||
|
margin-bottom: 10px; |
||||
|
} |
||||
|
|
||||
|
.customer-css .el-col { |
||||
|
padding: 0 10px; |
||||
|
} |
||||
|
|
||||
|
.customer-css .el-form-item { |
||||
|
margin-bottom: 10px; |
||||
|
} |
||||
|
|
||||
|
.customer-css .el-button { |
||||
|
margin: 0 5px; |
||||
|
} |
||||
|
|
||||
|
.customer-css .el-input-group__append { |
||||
|
background-color: #409eff; |
||||
|
border-color: #409eff; |
||||
|
color: white; |
||||
|
} |
||||
|
|
||||
|
.customer-css .el-input-group__append:hover { |
||||
|
background-color: #66b1ff; |
||||
|
border-color: #66b1ff; |
||||
|
} |
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue