4 changed files with 627 additions and 2 deletions
-
20src/api/print/rollPrint.js
-
2src/views/modules/labelPrint/outer-box-label-roll.vue
-
2src/views/modules/labelPrint/outer-box-label.vue
-
605src/views/modules/labelPrint/roll-label.vue
@ -0,0 +1,20 @@ |
|||
import { createAPI } from "@/utils/httpRequest.js"; |
|||
|
|||
|
|||
// 获取子模版列表
|
|||
export const checkRollCustomer = data => createAPI(`/rollPrint/checkRollCustomer`,'post',data) |
|||
|
|||
// 获取打印的数据
|
|||
export const getRollCustomer = data => createAPI(`/rollPrint/getRollCustomer/${data}`,'get',data) |
|||
|
|||
// 获取可用模板列表
|
|||
export const getReportFileByCustomer = data => createAPI(`/outBoxPrint/getReportFileByCustomer/${data.customerId}/${data.reportFamily}`,'get') |
|||
|
|||
// 获取子模版列表
|
|||
export const getReportSubFileList = data => createAPI(`/outBoxPrint/getReportSubFileList`,'post',data) |
|||
|
|||
// 获取模板手工参数
|
|||
export const getReportParameters = data => createAPI(`/outBoxPrint/getReportParameters/${data}`,'get') |
|||
|
|||
// 打印
|
|||
export const printLabel = data => createAPI(`/rollPrint/printLabel`,'post',data) |
|||
@ -0,0 +1,605 @@ |
|||
<template> |
|||
<div class="sl-el"> |
|||
|
|||
<el-container> |
|||
<el-main style="width: 75%"> |
|||
<el-row> |
|||
<el-col :span="18"> |
|||
<el-form @submit.native.prevent label-position="top"> |
|||
<el-form-item style="width: 60%" :label="'请输入卷号:'"> |
|||
<el-input placeholder="请输入内容" v-model="rollNos" class="input-with-select" |
|||
@keyup.enter.native="getBoxSoAndReportFile()"> |
|||
<el-button @click="getBoxSoAndReportFile()" slot="append" icon="el-icon-search"></el-button> |
|||
</el-input> |
|||
</el-form-item> |
|||
</el-form> |
|||
</el-col> |
|||
<el-col :span="6"></el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<span>请选择标签:</span> |
|||
<el-table |
|||
:data="reportFileList" |
|||
border |
|||
ref="reportFileTable" |
|||
highlight-current-row |
|||
@current-change="handleCurrentChange" |
|||
height="150px"> |
|||
<el-table-column |
|||
v-for="(item,index) in reportColumnList" :key="index" |
|||
:sortable="item.columnSortable" |
|||
:prop="item.columnProp" |
|||
:header-align="item.headerAlign" |
|||
:show-overflow-tooltip="item.showOverflowTooltip" |
|||
:align="item.align" |
|||
:fixed="item.fixed" |
|||
:min-width="item.columnWidth" |
|||
|
|||
:label="item.columnLabel"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span> |
|||
<span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" |
|||
style="width: 100px; height: 80px"/></span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</el-col> |
|||
|
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<span>打印格式名称:</span> |
|||
<el-input type="textarea" v-model="selectReportString" readonly :rows="3"></el-input> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<el-tabs style="font-size: 14px" v-model="activeName" type="border-card" @tab-click="handleClick" |
|||
class="customer-tab"> |
|||
<el-tab-pane label="打印参数" name="first"> |
|||
<el-table |
|||
:data="reportParamList" |
|||
:cell-style="customerCellStyle" :cell-class-name="customerCellClassName" |
|||
border |
|||
:height="height" |
|||
> |
|||
<el-table-column |
|||
v-for="(item,index) in printParamColumnList" :key="index" |
|||
:sortable="item.columnSortable" |
|||
:prop="item.columnProp" |
|||
:header-align="item.headerAlign" |
|||
:show-overflow-tooltip="item.showOverflowTooltip" |
|||
:align="item.align" |
|||
:fixed="item.fixed" |
|||
:min-width="item.columnWidth" |
|||
:label="item.columnLabel"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="item.columnHidden"> |
|||
<span v-if="scope.row.valuetypeDb === 'T'"> |
|||
<el-input v-model='scope.row[item.columnProp]'> </el-input> |
|||
</span> |
|||
<span v-if="scope.row.valuetypeDb === 'D'"> |
|||
<el-date-picker style="width: 100%;" |
|||
v-model='scope.row[item.columnProp]'> </el-date-picker> |
|||
</span> |
|||
<span v-if="scope.row.valuetypeDb === 'I'"> |
|||
<el-input type="number" v-model='scope.row[item.columnProp]' min="1"> </el-input> |
|||
</span> |
|||
|
|||
</span> |
|||
<span v-else>{{ scope.row[item.columnProp] }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</el-tab-pane> |
|||
|
|||
</el-tabs> |
|||
</el-col> |
|||
</el-row> |
|||
</el-main> |
|||
<el-main style="margin-left: 0px"> |
|||
<el-row> |
|||
<el-col :span="6"> |
|||
<el-form> |
|||
<el-form-item style="margin-top: 20px"> |
|||
|
|||
</el-form-item> |
|||
<el-form-item style="margin-top: 20px"> |
|||
<el-button type="primary" @click="bartenderPrint">打印</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</el-col> |
|||
</el-row> |
|||
</el-main> |
|||
</el-container> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
|
|||
import { |
|||
checkRollCustomer, |
|||
getRollCustomer, |
|||
getReportFileByCustomer, |
|||
getReportSubFileList, |
|||
getReportParameters, |
|||
printLabel |
|||
} from '@/api/print/rollPrint.js'; |
|||
|
|||
export default { |
|||
components: {}, |
|||
data() { |
|||
return { |
|||
rollNos: '', |
|||
activeName: 'first', |
|||
height: 200, |
|||
// 模板 |
|||
reportColumnList: [ |
|||
{ |
|||
tableId: "common1001", |
|||
tableName: "common", |
|||
columnProp: "reportid", |
|||
columnLabel: "报告编号", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
columnWidth: null, |
|||
format: null, |
|||
functionId: this.$route.meta.menuId, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: false, |
|||
serialNumber: null, |
|||
columnType: null, |
|||
align: null |
|||
}, { |
|||
tableId: "common1001", |
|||
tableName: "common", |
|||
columnProp: "Reportfile", |
|||
columnLabel: "报告文件名", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
columnWidth: null, |
|||
format: null, |
|||
functionId: this.$route.meta.menuId, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: false, |
|||
serialNumber: null, |
|||
columnType: null, |
|||
align: null |
|||
}, { |
|||
tableId: "common1001", |
|||
tableName: "common", |
|||
columnProp: "Remark", |
|||
columnLabel: "备注", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
columnWidth: null, |
|||
format: null, |
|||
functionId: this.$route.meta.menuId, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: false, |
|||
serialNumber: null, |
|||
columnType: null, |
|||
align: null |
|||
}, { |
|||
tableId: "common1001", |
|||
tableName: "common", |
|||
columnProp: "DefaultFlag", |
|||
columnLabel: "默认格式", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
columnWidth: null, |
|||
format: null, |
|||
functionId: this.$route.meta.menuId, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: false, |
|||
serialNumber: null, |
|||
columnType: null, |
|||
align: null |
|||
}, |
|||
|
|||
], |
|||
// 打印参数 |
|||
printParamColumnList: [ |
|||
{ |
|||
tableId: "common1001", |
|||
tableName: "common", |
|||
columnProp: "parametername", |
|||
columnLabel: "参数名", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
columnWidth: null, |
|||
format: null, |
|||
functionId: this.$route.meta.menuId, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: false, |
|||
serialNumber: null, |
|||
columnType: null, |
|||
align: null |
|||
}, { |
|||
tableId: "common1001", |
|||
tableName: "common", |
|||
columnProp: "parameterdesc", |
|||
columnLabel: "参数标题", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
columnWidth: null, |
|||
format: null, |
|||
functionId: this.$route.meta.menuId, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: false, |
|||
serialNumber: null, |
|||
columnType: null, |
|||
align: null |
|||
}, { |
|||
tableId: "common1001", |
|||
tableName: "common", |
|||
columnProp: "optionvalue", |
|||
columnLabel: "参数值", |
|||
columnHidden: true, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
columnWidth: null, |
|||
format: null, |
|||
functionId: this.$route.meta.menuId, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: false, |
|||
serialNumber: null, |
|||
columnType: null, |
|||
align: null |
|||
}, { |
|||
tableId: "common1001", |
|||
tableName: "common", |
|||
columnProp: "valuetype", |
|||
columnLabel: "参数类型", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
columnWidth: null, |
|||
format: null, |
|||
functionId: this.$route.meta.menuId, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: false, |
|||
serialNumber: null, |
|||
columnType: null, |
|||
align: null |
|||
}, |
|||
|
|||
], |
|||
// 数据 |
|||
// 可用模板列表 |
|||
reportFileList: [], |
|||
// 选中模板列表 |
|||
selectReportFileList: [], |
|||
selectReportString: '', |
|||
// 数量 |
|||
orderInfo: { |
|||
userName: this.$store.state.user.name, |
|||
rollNo: '', |
|||
customerId: '', |
|||
totalQty: 0, |
|||
perBoxQty: 0, |
|||
boxQty: 0, |
|||
lastBoxQty: 0, |
|||
rollNos:[], |
|||
// 选中模板列表 |
|||
reportFileList: [], |
|||
// 手工参数 |
|||
param: [] |
|||
}, |
|||
// 记录打印参数 |
|||
printParamList: [], |
|||
// 模板参数列表 |
|||
reportParamList: [], |
|||
buttons: { |
|||
settingLanguageList: '按语言设置', |
|||
edit: '编辑', |
|||
delete: '删除', |
|||
deleteList: '批量删除', |
|||
cz: '操作', |
|||
search: '查询', |
|||
download: '导出', |
|||
settingTable: '设置列表', |
|||
defaultTable: '设置默认配置', |
|||
list: "列表", |
|||
addList: '批量添加', |
|||
settingLanguage: "按控件设置" |
|||
}, |
|||
// 导出 end |
|||
buttonList: [ |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '按语言设置', |
|||
objectId: 'settingLanguageList', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '编辑', |
|||
objectId: 'edit', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '删除', |
|||
objectId: 'delete', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '批量删除', |
|||
objectId: 'deleteList', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '操作', |
|||
objectId: 'cz', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '查询', |
|||
objectId: 'search', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '导出', |
|||
objectId: 'download', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '设置列表', |
|||
objectId: 'settingTable', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '设置默认配置', |
|||
objectId: 'defaultTable', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '列表', |
|||
objectId: 'list', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
}, |
|||
{ |
|||
functionId: this.$route.meta.menuId, |
|||
languageValue: '按控件设置', |
|||
objectId: 'settingLanguage', |
|||
objectType: "button", |
|||
tableId: "common1001" |
|||
} |
|||
], |
|||
} |
|||
}, |
|||
watch: { |
|||
orderInfo: { |
|||
handler: function (val, oldVal) { |
|||
if (this.orderInfo.totalQty > 0 && this.orderInfo.perBoxQty > 0) { |
|||
this.orderInfo.lastBoxQty = this.decimalUtil.mod(this.orderInfo.totalQty, this.orderInfo.perBoxQty) |
|||
if (this.decimalUtil.div(this.orderInfo.totalQty, this.orderInfo.perBoxQty) < 1) { |
|||
this.orderInfo.boxQty = 1 |
|||
} else { |
|||
this.orderInfo.boxQty = this.decimalUtil.formatDown(this.decimalUtil.div(this.orderInfo.totalQty, this.orderInfo.perBoxQty), 0) |
|||
} |
|||
|
|||
} |
|||
}, |
|||
// 深度观察监听 |
|||
deep: true |
|||
}, |
|||
updateData: { |
|||
deep: true, |
|||
handler: function (newV, oldV) { |
|||
this.updateData.projectID = this.updateData.projectID.toUpperCase(); |
|||
this.updateData.oriSOOrderNo = this.updateData.oriSOOrderNo.toUpperCase(); |
|||
this.updateData.orderType = this.updateData.orderType.toUpperCase(); |
|||
} |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
this.height = window.innerHeight - 450; |
|||
}) |
|||
}, |
|||
|
|||
methods: { |
|||
// 调用bartender打印 |
|||
bartenderPrint() { |
|||
if (!this.rollNos) { |
|||
this.$message.warning('请输入卷号') |
|||
return |
|||
} |
|||
if (this.selectReportFileList.length === 0) { |
|||
this.$message.warning('选择模板进行打印') |
|||
return |
|||
} |
|||
let rollNoList = this.rollNos.split(";") |
|||
this.orderInfo.reportFileList = this.selectReportFileList |
|||
this.orderInfo.param = this.reportParamList |
|||
this.orderInfo.rollNos = rollNoList |
|||
this.printParamList = JSON.parse(JSON.stringify(this.reportParamList)) |
|||
printLabel(this.orderInfo).then(({data}) =>{ |
|||
if (data.code === 0 ){ |
|||
this.$message.success(data.msg) |
|||
}else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}) |
|||
}, |
|||
// 获取订单信息 |
|||
searchBoxLabelSO() { |
|||
|
|||
if (!this.rollNos) { |
|||
this.$message.warning('请输入卷号') |
|||
return |
|||
} |
|||
let rollNoList = this.rollNos.split(";") |
|||
this.reportFileList = [] |
|||
checkRollCustomer(rollNoList).then(({data}) => { |
|||
if (data.code === 0) { |
|||
getRollCustomer(rollNoList[0]).then(({data}) => { |
|||
if (data.code === 0){ |
|||
let query = { |
|||
customerId: data.data.customerId ? data.data.customerId : '*', |
|||
reportFamily: '卷标签' |
|||
} |
|||
getReportFileByCustomer(query).then(({data}) => { |
|||
if (data.code === 0) { |
|||
this.reportFileList = data.dataList |
|||
this.$refs.reportFileTable.setCurrentRow(this.reportFileList[0]); |
|||
} else { |
|||
this.$message.warning(data.msg) |
|||
Object.assign(this.$data, this.$options.data.call(this.orderInfo)); |
|||
Object.assign(this.$data, this.$options.data.call(this.selectReportString)); |
|||
Object.assign(this.$data, this.$options.data.call(this.reportParamList)); |
|||
} |
|||
}) |
|||
}else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}) |
|||
} else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}) |
|||
}, |
|||
// 获取订单数数据 和 打印 模板数据 |
|||
getBoxSoAndReportFile() { |
|||
this.searchBoxLabelSO() |
|||
}, |
|||
handleClick() { |
|||
|
|||
}, |
|||
// 选择模板 |
|||
handleCurrentChange(val) { |
|||
if (!val) return |
|||
this.selectReportFileList = [] |
|||
let query = { |
|||
reportId: val.reportid, |
|||
defaultFlag: val.DefaultFlag, |
|||
reportFile: val.Reportfile, |
|||
reportFamily: '外箱标签', |
|||
customerId: this.orderInfo.customerId, |
|||
} |
|||
this.selectReportFileList.push(query) |
|||
this.searchReportSubFileList(query) |
|||
this.searchReportParameters(query) |
|||
|
|||
}, |
|||
// 获取子模版 |
|||
searchReportSubFileList(val) { |
|||
let str = '' |
|||
str += val.reportId + ' | ' + val.reportFile + '\n' |
|||
this.selectReportString = str |
|||
getReportSubFileList(val).then(({data}) => { |
|||
if (data.code === 0) { |
|||
for (let item of data.data) { |
|||
str += item.reportid + ' | ' + item.Reportfile + '\n' |
|||
let reportFile = { |
|||
reportId: item.reportid, |
|||
defaultFlag: 'Y', |
|||
reportFile: item.Reportfile, |
|||
reportFamily: '外箱标签', |
|||
customerId: this.orderInfo.customerId, |
|||
} |
|||
this.selectReportFileList.push(reportFile) |
|||
} |
|||
this.selectReportString = str |
|||
} |
|||
}) |
|||
|
|||
}, |
|||
// 获取柱模版打印参数 |
|||
searchReportParameters(val) { |
|||
let printParamList = JSON.parse(JSON.stringify(this.printParamList)) |
|||
getReportParameters(val.reportId).then(({data}) => { |
|||
if (data.code === 0) { |
|||
this.reportParamList = data.data |
|||
if (printParamList) { |
|||
for (let item1 of printParamList) { |
|||
for (let item2 of this.reportParamList) { |
|||
if (item1.parametername === item2.parametername) { |
|||
item2.optionvalue = item1.optionvalue |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
/*添加定制的css类*/ |
|||
customerCellClassName({row, column, rowIndex, columnIndex}) { |
|||
if (columnIndex === 2) { |
|||
return 'customer-text-cell'; |
|||
} |
|||
}, |
|||
|
|||
/*添加定制的cess样式*/ |
|||
customerCellStyle({row, column, rowIndex, columnIndex}) { |
|||
if (columnIndex === 2) { |
|||
return 'padding: 0px 0px;'; |
|||
} |
|||
}, |
|||
}, |
|||
created() { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
|
|||
/deep/ .customer-tab .el-tabs__content { |
|||
padding: 0px !important; |
|||
} |
|||
|
|||
/deep/ .sl-el .el-tabs__item { |
|||
padding: 0 13px; |
|||
height: 26px; |
|||
line-height: 26px; |
|||
font-size: 12px; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
/deep/ div.table-input { |
|||
padding: 0px 0px; |
|||
height: 25px !important; |
|||
} |
|||
|
|||
/*table中input*/ |
|||
div.table-input /deep/ input.el-input__inner { |
|||
padding: 0px 0px; |
|||
height: 23px !important; |
|||
text-align: right; |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue