5 changed files with 351 additions and 6 deletions
-
7src/api/print/print.js
-
2src/utils/httpRequest.js
-
30src/views/main-navbar.vue
-
118src/views/modules/common/print-list.vue
-
200src/views/modules/common/user-print-list.vue
@ -0,0 +1,7 @@ |
|||
import { createAPI } from "@/utils/httpRequest.js"; |
|||
|
|||
// 获取用户打印机
|
|||
export const getUserLabelPrintList = data => createAPI(`/sysUserPrinter/getUserPrint/${data.userName}`,'get') |
|||
|
|||
// 保存用户打印机
|
|||
export const saveUserLabelPrint = data => createAPI('/sysUserPrinter/saveUserLabelPrint','post',data) |
|||
@ -0,0 +1,118 @@ |
|||
<template> |
|||
<div class="mod-oss"> |
|||
<el-dialog |
|||
v-drag |
|||
:title="title" |
|||
:close-on-click-modal="false" |
|||
:visible.sync="visible" |
|||
width="400px" |
|||
:append-to-body="true"> |
|||
<el-form> |
|||
<el-form label-position="top"> |
|||
<el-form-item :label="'标签名称'"> |
|||
<el-input v-model="userPrint.labelName" readonly></el-input> |
|||
</el-form-item> |
|||
<el-form-item :label="'打印机地址'"> |
|||
<el-input v-model="userPrint.ipAddress" ></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="打印机名称"> |
|||
<el-select style="width:100%" v-model="userPrint.printerName"> |
|||
<el-option v-for="(item,index) in printList" |
|||
:key="index" |
|||
:label="item.label" :value="item.label"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-form> |
|||
|
|||
<select v-show="false" ref="printElement"> |
|||
</select> |
|||
</el-form> |
|||
|
|||
<span slot="footer" class="dialog-footer"> |
|||
<el-button @click="savePrint()" type="primary">{{ buttons.save }}</el-button> |
|||
<el-button @click="visible = false" type="primary">{{ buttons.close }}</el-button> |
|||
</span> |
|||
</el-dialog> |
|||
|
|||
|
|||
|
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import {saveUserLabelPrint} from '@/api/print/print.js'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
tableHeight: 365, |
|||
title: '用户打印机管理', |
|||
visible: false, |
|||
userPrint: { |
|||
printerName: '', |
|||
userId: this.$store.state.user.name, |
|||
ipAddress: '', |
|||
labelName: '', |
|||
}, |
|||
printList: [], |
|||
buttons: { |
|||
save: "保存", |
|||
close: "关闭" |
|||
}, |
|||
buttonList: [] |
|||
} |
|||
}, |
|||
components: {}, |
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
this.height = (window.innerHeight * 0.82); |
|||
}) |
|||
}, |
|||
methods: { |
|||
// 初始化 |
|||
init(val) { |
|||
this.visible = true |
|||
this.userPrint = val |
|||
this.userPrint.ipAddress = val.ipAddress?val.ipAddress: '127.0.0.1' |
|||
this.getPrintName() |
|||
}, |
|||
// 获取所有打印机 |
|||
getPrintName(){ |
|||
this.$nextTick(() => { |
|||
let lodop = this.getLodop() |
|||
var elementById = this.$refs.printElement; |
|||
lodop.Create_Printer_List(elementById) |
|||
setTimeout(()=>{},1000) |
|||
console.log(elementById) |
|||
var children = elementById.children |
|||
let list = [] |
|||
for (let child of children) { |
|||
let option = { |
|||
value: child.index, |
|||
label: child.innerText |
|||
} |
|||
list.push(option) |
|||
} |
|||
this.printList = list |
|||
}) |
|||
|
|||
}, |
|||
|
|||
// 保存打印机 |
|||
savePrint(){ |
|||
this.userPrint.userId = this.$store.state.user.name |
|||
saveUserLabelPrint(this.userPrint).then(({data}) =>{ |
|||
if (data.code === 0){ |
|||
this.$message.success(data.msg) |
|||
this.visible = false |
|||
this.$emit('refreshDataList') |
|||
}else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}) |
|||
} |
|||
}, |
|||
created() { |
|||
} |
|||
} |
|||
</script> |
|||
@ -0,0 +1,200 @@ |
|||
<template> |
|||
<div class="mod-oss"> |
|||
<el-dialog |
|||
v-drag |
|||
:title="title" |
|||
:close-on-click-modal="false" |
|||
:visible.sync="visible" |
|||
width="955px" |
|||
:append-to-body="true"> |
|||
|
|||
<el-table |
|||
:height="tableHeight" |
|||
:data="dataList" |
|||
border |
|||
v-loading="dataListLoading" |
|||
style="width: 100%;"> |
|||
<el-table-column |
|||
v-for="(item,index) in columnList" :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-column |
|||
fixed="right" |
|||
header-align="center" |
|||
align="center" |
|||
width="150" |
|||
:label="buttons.operate"> |
|||
<template slot-scope="scope"> |
|||
<a type="text" size="small" @click="printSetting(scope.row)">{{ buttons.settingPrint }}</a> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<span slot="footer" class="dialog-footer"> |
|||
<el-button @click="visible = false" type="primary">关闭</el-button> |
|||
</span> |
|||
</el-dialog> |
|||
<PrintList ref="printListRef" v-if="printListVisible" @refreshDataList="getDataList"></PrintList> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import {getUserLabelPrintList} from '@/api/print/print.js' |
|||
import PrintList from './print-list.vue' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
tableHeight: 365, |
|||
title: '打印机管理', |
|||
visible: false, |
|||
printListVisible: false, |
|||
dataListLoading: true, |
|||
dataForm: { |
|||
fileName: '' |
|||
}, |
|||
dataList: [], |
|||
printList: [], |
|||
columnList: [ |
|||
{ |
|||
"tableId": "common1001", |
|||
"tableName": "common", |
|||
"columnProp": "labelName", |
|||
"columnLabel": "标签名称", |
|||
"columnHidden": false, |
|||
"columnImage": false, |
|||
"columnSortable": false, |
|||
"columnWidth": '15%', |
|||
"format": null, |
|||
"functionId": this.$route.meta.menuId, |
|||
"sortLv": 0, |
|||
"status": true, |
|||
"fixed": false, |
|||
"serialNumber": null, |
|||
"columnType": null, |
|||
"align": null |
|||
}, |
|||
{ |
|||
"tableId": "common1001", |
|||
"tableName": "common", |
|||
"columnProp": "userId", |
|||
"columnLabel": "用户名", |
|||
"columnHidden": false, |
|||
"columnImage": false, |
|||
"columnSortable": false, |
|||
"columnWidth": '15%', |
|||
"format": null, |
|||
"functionId": this.$route.meta.menuId, |
|||
"sortLv": 0, |
|||
"status": true, |
|||
"fixed": false, |
|||
"serialNumber": null, |
|||
"columnType": null, |
|||
"align": null |
|||
}, |
|||
{ |
|||
"tableId": "common1001", |
|||
"tableName": "common", |
|||
"columnProp": "ipAddress", |
|||
"columnLabel": "打印机地址", |
|||
"columnHidden": false, |
|||
"columnImage": false, |
|||
"columnSortable": false, |
|||
"columnWidth": '20%', |
|||
"format": null, |
|||
"functionId": this.$route.meta.menuId, |
|||
"sortLv": 0, |
|||
"status": true, |
|||
"fixed": false, |
|||
"serialNumber": null, |
|||
"columnType": null, |
|||
"align": null |
|||
}, |
|||
{ |
|||
"tableId": "common1001", |
|||
"tableName": "common", |
|||
"columnProp": "printerName", |
|||
"columnLabel": "打印机名称", |
|||
"columnHidden": false, |
|||
"columnImage": false, |
|||
"columnSortable": false, |
|||
"columnWidth": '50%', |
|||
"format": null, |
|||
"functionId": this.$route.meta.menuId, |
|||
"sortLv": 0, |
|||
"status": true, |
|||
"fixed": false, |
|||
"serialNumber": null, |
|||
"columnType": null, |
|||
"align": null |
|||
}, |
|||
], |
|||
buttons: { |
|||
settingPrint: "设置打印机", |
|||
operate: "操作" |
|||
}, |
|||
buttonList: [] |
|||
} |
|||
}, |
|||
components: {PrintList,}, |
|||
mounted() { |
|||
this.$nextTick(() => { |
|||
this.height = (window.innerHeight * 0.82); |
|||
}) |
|||
}, |
|||
activated() { |
|||
this.getDataList() |
|||
|
|||
}, |
|||
methods: { |
|||
// 初始化 |
|||
init() { |
|||
this.visible = true |
|||
this.getDataList() |
|||
}, |
|||
// 获取数据列表 |
|||
getDataList() { |
|||
|
|||
let query = { |
|||
userName: this.$store.state.user.name |
|||
} |
|||
getUserLabelPrintList(query).then(({data}) => { |
|||
if (data.code === 0) { |
|||
this.dataList = data.dataList |
|||
} |
|||
|
|||
this.dataListLoading = false |
|||
}) |
|||
}, |
|||
// 设置打印机 |
|||
printSetting(row) { |
|||
// 转换参数, 避免值传递 |
|||
let rowData = JSON.parse(JSON.stringify(row)) |
|||
this.printListVisible = true |
|||
this.$nextTick(() => { |
|||
this.$refs.printListRef.init(rowData) |
|||
}) |
|||
}, |
|||
// 保存打印机 |
|||
savePrint() { |
|||
|
|||
|
|||
} |
|||
}, |
|||
created() { |
|||
} |
|||
} |
|||
</script> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue