From 9193459fbb692abc227b1643ae52f65a2e782ebd Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期四, 28 七月 2022 14:25:18 +0800
Subject: [PATCH] 1.自定义打印完成
---
src/views/scgl/gd.vue | 363 +++++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 333 insertions(+), 30 deletions(-)
diff --git a/src/views/scgl/gd.vue b/src/views/scgl/gd.vue
index 07e2d5a..1c12268 100644
--- a/src/views/scgl/gd.vue
+++ b/src/views/scgl/gd.vue
@@ -467,11 +467,12 @@
/>
</el-table>
</el-dialog>
+
<span slot="footer" class="dialog-footer">
<div class="footerButton">
<el-button @click="dialogVisibleCancel">鍙� 娑�</el-button>
- <el-button v-if="operation==='add'" type="primary" @click="dialogVisibleConfirm">纭� 瀹�</el-button>
- <el-button v-else type="primary" @click="dialogVisibleConfirm">纭� 瀹�/鎵� 鍗�</el-button>
+ <!-- <el-button v-if="operation==='add'" type="primary" @click="dialogVisibleConfirmPreview('add')">棰勮</el-button>-->
+ <el-button type="primary" @click="dialogVisibleConfirm">纭� 瀹�</el-button>
</div>
</span>
</el-dialog>
@@ -484,7 +485,13 @@
top="15vh"
class="dialogVisibleSearch"
:close-on-click-modal="false"
+ @close="dialogVisibleTaskClose"
>
+ <el-button
+ style="margin-bottom: 15px"
+ type="primary"
+ @click="supplementClick"
+ >琛ユ墦</el-button>
<el-table
:data="taskTableData"
border
@@ -548,6 +555,137 @@
</span>
</el-dialog>
+ <!-- 鎵撳嵃棰勮瀵硅瘽妗�-->
+ <el-dialog
+ title=""
+ :visible.sync="dialogVisibleApprove"
+ width="812px"
+ class="dialogVisibleConfirmClass"
+ append-to-body
+ :close-on-click-modal="false"
+ @close="dialogVisibleConfirmClose"
+ >
+ <!-- 瑕佹墦鍗扮殑鍖哄煙 -->
+ <div id="printMe" style="padding: 30px">
+ <div style="font-size: 26px; text-align: center">娴佺▼鍗�</div>
+
+ <div style="display: flex;justify-content: space-around;margin-top: 20px">
+ <div style="width: 78%">
+ <el-form
+ ref="formApprove"
+ :model="formApprove"
+ label-width="100px"
+ inline
+ style="display: flex;justify-content: space-between"
+ >
+ <div class="elForm">
+ <el-form-item label="宸ュ崟缂栧彿锛�" class="formContent">
+ {{ formApprove.mesordercode }}
+ </el-form-item>
+ <el-form-item label="浜у搧缂栫爜锛�" class="formContent">
+ {{ formApprove.partcode }}
+ </el-form-item>
+ <el-form-item label="浜у搧鍚嶇О锛�" class="formContent">
+ {{ formApprove.partname }}
+ </el-form-item>
+ <el-form-item label="浜у搧瑙勬牸锛�" class="formContent">
+ {{ formApprove.partspec }}
+ </el-form-item>
+ <el-form-item label="宸ュ崟鏁伴噺锛�" class="formContent">
+ {{ formApprove.plan_qty }}
+ </el-form-item>
+ <el-form-item label="宸ヨ壓璺嚎锛�" class="formContent">
+ {{ formApprove.routename }}
+ </el-form-item>
+ <el-form-item label="鎵撳嵃浜哄憳锛�" class="formContent">
+ {{ username }}
+ </el-form-item>
+ <el-form-item label="鎵撳嵃鏃堕棿锛�" class="formContent">
+ {{ formApprove.lm_date }}
+ </el-form-item>
+ </div>
+ </el-form>
+ </div>
+ <div style="width: 22%;display: flex;justify-content: center;align-items: center">
+ <!-- <div :id="'qrCode'+0" :ref="'qrCodeDiv'+0" />-->
+ <div />
+ </div>
+ </div>
+
+ <!-- <div style="width:100%;height: 30px;border-bottom: 1px solid #eee;margin-bottom: 20px" />-->
+ <el-table
+ id="table"
+ :data="tableDataPrint"
+ border
+ class="tableDataPrint"
+ :header-cell-style="{ background: '#c0c0c0',textAlign:'center',color:'#000',borderColor:'#000'}"
+ :cell-style="{textAlign: 'center',color:'#000',borderColor:'#000'}"
+ style="width: 100%;margin-top: 20px;text-align: center;border-color: #000"
+ >
+ <el-table-column
+ id="column0"
+ prop="seq"
+ label="宸ュ簭鍙�"
+ width="70"
+ align="center"
+ />
+ <el-table-column
+ id="column1"
+ prop="stepqrcode"
+ label="宸ュ簭浜岀淮鐮�"
+ width="100"
+ align="center"
+ >
+ <template slot-scope="{row}">
+ <div :id="'qrCode'+row.seq" :ref="'qrCodeDiv'+row.seq" class="tableColumn" />
+ </template>
+ </el-table-column>
+ <el-table-column
+ id="column2"
+ prop="stepname"
+ label="宸ュ簭"
+ width="120"
+ align="center"
+ />
+ <el-table-column
+ id="column3"
+ prop="plan_qty"
+ label="鍔犲伐鏁伴噺"
+ width="100"
+ align="center"
+ />
+ <el-table-column
+ id="column4"
+ prop="good_qty"
+ width="100"
+ align="center"
+ label="鍚堟牸鏁伴噺"
+ />
+ <el-table-column
+ id="column5"
+ width="100"
+ prop="ng_qty"
+ align="center"
+ label="涓嶈壇鏁伴噺"
+ />
+ <el-table-column
+ id="column6"
+ prop="desc"
+ align="center"
+ width="120"
+ label="澶囨敞"
+ />
+ </el-table>
+ </div>
+ <span slot="footer" class="dialog-footer">
+ <div class="footerButton">
+ <el-button @click="dialogVisibleBackPreview">杩� 鍥�</el-button>
+ <!-- <el-button v-if="operation==='add'" type="primary" @click="dialogVisibleConfirm">纭� 瀹�</el-button>-->
+ <!-- <el-button type="primary" @click="dialogVisibleConfirm">纭� 瀹�/鎵� 鍗�</el-button>-->
+ <el-button v-print="printObj" type="primary">鎵� 鍗�</el-button>
+ </div>
+ </span>
+ </el-dialog>
</div>
</template>
@@ -565,6 +703,7 @@
import { getCookie } from '@/utils/auth'
import { MesOrderPrintSearch1, PrintOrder } from '@/api/utils'
import { urlAddRandomNo, webapp_ws_ajax_run, webapp_ws_autoupdate } from '@/utils/grwebapp'
+import QRCode from 'qrcodejs2'
const SER_HZ = /^[\u4e00-\u9fa5]+$/
export default {
@@ -588,6 +727,7 @@
isFullscreen: false,
mainHeight: 0,
tableHeight: 0,
+ username: '',
form: {
mesorderstus: '', // 宸ュ崟鐘舵�佺爜
mesordercode: '', // 宸ュ崟缂栧彿
@@ -673,26 +813,42 @@
},
dialogVisibleTask: false,
taskTableData: [],
- // dialogFormTask: {
- // partname: '', // 浜у搧鍚嶇О
- // partspec: '', // 浜у搧瑙勬牸
- // wkshopname: '', // 鐢熶骇杞﹂棿鍚嶇О
- // routename: '', // 宸ヨ壓璺嚎鍚嶇О
- //
- // mesorderstusName: '', // 宸ュ崟鐘舵�佸悕绉�
- // mesorderstus: '', // 宸ュ崟鐘舵�佺爜
- // mesordercode: '', // 宸ュ崟缂栧彿
- // partcode: '', // 浜у搧缂栫爜
- // mesqty: '', // 宸ュ崟鏁伴噺
- //
- // routecode: '', // 宸ヨ壓璺嚎缂栫爜
- // wkshopcode: '', // 鐢熶骇杞﹂棿缂栫爜
- // planstartdate: '', // 璁″垝寮�濮嬫椂闂�
- // planenddate: '', // 璁″垝瀹屾垚鏃堕棿
- // orderlev: '' // 宸ュ崟绛夌骇
- // },
+
dialogVisibleSearch: false,
- searchTableData: []
+ searchTableData: [],
+ dialogVisibleApprove: false,
+ tableDataPrint: [], // 鎵撳嵃椤甸潰鍐呭
+ printObj: {
+ id: 'printMe',
+ popTitle: '鎵撳嵃妯℃澘',
+ preview: false,
+ extraHead: '<meta http-equiv="Content-Language" content="zh-cn"/>',
+ closeCallback(vue) { // 鍏抽棴鎵撳嵃鐨勫洖璋冧簨浠讹紙鏃犳硶纭畾鐐瑰嚮鐨勬槸纭杩樻槸鍙栨秷锛�
+ console.log('11212', vue)
+ // vue.dialogVisible = false
+ vue.dialogVisibleApprove = false
+ },
+ beforeOpenCallback(vue) {
+ vue.printLoading = true
+ console.log('鎵撳紑涔嬪墠')
+ console.log()
+ },
+ openCallback(vue) {
+ vue.printLoading = false
+ console.log('鎵ц浜嗘墦鍗�')
+ }
+ },
+
+ formApprove: {
+ mesordercode: '',
+ partcode: '',
+ partname: '',
+ partspec: '',
+ plan_qty: '',
+ routename: '',
+ lm_date: ''
+ },
+ number: ''
}
},
created() {
@@ -703,7 +859,8 @@
window.addEventListener('resize', this.getHeight)
this.getHeight()
// webapp_urlprotocol_startup()
- webapp_ws_autoupdate(true)
+ // webapp_ws_autoupdate(true)
+ this.username = getCookie('username')
},
methods: {
async getMesOrderSearch() {
@@ -819,6 +976,7 @@
this.dialogVisibleTask = true
const { data: res } = await SearchWorkStep({ wo_code: row.wo_code })
this.taskTableData = res
+ this.dialogForm.mesordercode = res[0].wo_code
},
dialogVisibleBack() {
this.dialogVisibleTask = false
@@ -972,13 +1130,15 @@
orderlev: this.dialogForm.orderlev, // 宸ュ崟绛夌骇
OperType: this.operation === 'add' ? 'Add' : 'Update'
}
+
AddUpdateMesOrder(data).then(res => {
if (res.code === '200') {
- if (this.operation !== 'add') {
- this.sendPrint()
- }
- this.$message.success(this.operation === 'add' ? '娣诲姞鎴愬姛锛�' : '娲惧彂鎴愬姛锛�')
this.dialogVisible = false
+
+ this.handlePrint()
+
+ this.$message.success(this.operation === 'add' ? '娣诲姞鎴愬姛锛�' : '娲惧彂鎴愬姛锛�')
+ // this.dialogVisible = false
this.getMesOrderSearch()
} else {
this.$message.error(this.operation === 'add' ? '娣诲姞澶辫触锛�' : '娲惧彂澶辫触锛�')
@@ -990,12 +1150,12 @@
// 娲惧彂鎵撳嵃
async sendPrint() {
const data = {
- // username: getCookie('admin'),
- username: getCookie('username'),
+ username: getCookie('admin'),
+ // username: getCookie('username'),
mesordercode: this.dialogForm.mesordercode
}
- // const res = await MesOrderPrintSearch1(data)
- const res = await PrintOrder(data)
+ const res = await MesOrderPrintSearch1(data)
+ // const res = await PrintOrder(data)
if (res.code === '200') {
// 鍙傛暟鍏蜂綋璇存槑璇峰弬鑰冨府鍔╂枃妗d腑鐨勨�淲EB鎶ヨ〃(B/S鎶ヨ〃)->WEB鎶ヨ〃瀹㈡埛绔�->鍚姩鍙傛暟璇存槑鈥濋儴鍒�
var args = {
@@ -1007,6 +1167,7 @@
webapp_ws_ajax_run(args)
}
},
+
// 鑾峰彇椤甸潰楂樺害
getHeight() {
this.$nextTick(() => {
@@ -1029,7 +1190,108 @@
},
dialogVisibleSearchBack() {
this.dialogVisibleSearch = false
+ },
+ // 澶勭悊鎵撳嵃
+ handlePrint() {
+ // const number = Math.random() * Math.random()
+ // this.number = number === 0 ? (10 + Math.random()) : number
+ // console.log(number)
+ this.dialogVisibleApprove = true
+ const data2 = {
+ username: getCookie('admin'),
+ mesordercode: this.dialogForm.mesordercode
+ }
+ MesOrderPrintSearch1(data2).then(res2 => {
+ if (res2.code === '200') {
+ const res3 = res2.data.recordset
+
+ this.tableDataPrint = res3
+ this.formApprove.mesordercode = res3[0].wo_code
+ this.formApprove.partcode = res3[0].partcode
+ this.formApprove.partname = res3[0].partname
+ this.formApprove.partspec = res3[0].partspec
+ this.formApprove.plan_qty = res3[0].plan_qty
+ this.formApprove.routename = res3[0].routename
+ this.formApprove.lm_date = res3[0].lm_date
+
+ this.$nextTick(() => {
+ // this.bindQRCode(0, this.formApprove.mesordercode, 'big')
+ res3.forEach(i => {
+ this.bindQRCode(i.seq, i.stepqrcode, 'small')
+ })
+ })
+ }
+ })
+ },
+ dialogVisibleTaskClose() {
+ this.dialogForm.mesordercode = ''
+ },
+ /*
+ * 鎵嬪姩鐐瑰嚮鎵撳嵃
+ * */
+ // 杩斿洖鎸夐挳
+ dialogVisibleBackPreview() {
+ this.dialogVisibleApprove = false
+ },
+ // dialogVisibleConfirmPreview(param) {
+ // this.$refs.dialogForm.validate(valid => {
+ // if (valid) {
+ // const data = {
+ // username: getCookie('admin'),
+ // mesordercode: this.dialogForm.mesordercode
+ // }
+ // MesOrderPrintSearch1(data).then(res => {
+ // if (res.code === '200') {
+ // this.dialogVisibleApprove = true
+ // console.log(res, 11)
+ // }
+ // })
+ // }
+ // })
+ // },
+ // 鐢熸垚浜岀淮鐮�
+ bindQRCode(seq, text, size) {
+ new QRCode(this.$refs['qrCodeDiv' + seq], {
+ text: text,
+ width: size === 'big' ? 90 : 60,
+ height: size === 'big' ? 90 : 60,
+ // colorDark: '#333333', // 浜岀淮鐮侀鑹�
+ colorDark: '#000', // 浜岀淮鐮侀鑹�
+ colorLight: '#ffffff', // 浜岀淮鐮佽儗鏅壊
+ correctLevel: QRCode.CorrectLevel.L// 瀹归敊鐜囷紝L/M/H
+ })
+ },
+
+ dialogVisibleConfirmClose() {
+ // this.dialogForm.mesordercode = ''
+ this.formApprove.mesordercode = ''
+ this.formApprove.partcode = ''
+ this.formApprove.partname = ''
+ this.formApprove.partspec = ''
+ this.formApprove.plan_qty = ''
+ this.formApprove.routename = ''
+ this.formApprove.lm_date = ''
+ // this.$refs.qrCodeDiv0 = ''
+ // this.$refs.qrCodeDiv1 = ''
+ // this.$refs.qrCodeDiv2 = ''
+ // this.$refs.qrCodeDiv3 = ''
+
+ // // this.$ref['qrCodeDiv'].clearable()
+ // this.tableDataPrint.forEach((item, index) => {
+ // this.$ref[('qrCodeDiv' + index).toString()] = ''
+ // // this.bindQRCode(item.seq, '')
+ // })
+ // // this.bindQRCode(this.tableDataPrint.length, '')
+ // this.$ref[('qrCodeDiv' + this.tableDataPrint.length).toString()] = ''
+ // // this.bindQRCode()
+ this.tableDataPrint = []
+ },
+ // 琛ユ墦鎸夐挳
+ supplementClick() {
+ this.dialogVisibleTask = false
+ this.handlePrint()
}
+
}
}
</script>
@@ -1088,6 +1350,10 @@
}
.dialogVisibleSearch ::v-deep .el-dialog__body {
+ padding: 20px 20px !important;
+}
+
+.dialogVisibleConfirmClass ::v-deep .el-dialog__body {
padding: 20px 20px !important;
}
@@ -1182,6 +1448,10 @@
margin-bottom: 0;
}
+.elForm ::v-deep .el-form-item {
+ margin-bottom: 0;
+}
+
::v-deep .el-input__inner:focus {
border-color: $main_color;
}
@@ -1207,4 +1477,37 @@
display: none;
}
}
+
+.el-table::before {
+ height: 0;
+}
+
+//.dialogVisibleConfirmClass >>>.el-table--border, .el-table--fit {
+// border-bottom: 2px solid #000 ;
+// //outline: #000 solid 2px !important;
+//}
+
+.tableDataPrint ::v-deep div.cell{
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+}
+.formContent{
+ width: 240px;
+}
+
+</style>
+
+<style media="print">
+/*@media print {*/
+@page {
+ size: auto;
+ margin: 3mm;
+}
+
+</style>
+<style>
+.formContent .el-form-item__label{
+color: #000 !important;
+}
</style>
--
Gitblit v1.9.3