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