From c51d546e918abc6bebfc8460d9fe1cdbdd6e5007 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期二, 13 九月 2022 16:51:08 +0800
Subject: [PATCH] 1.解决扫码枪回车事件问题2.新增条码打印模板切换
---
src/views/scgl/gd.vue | 277 ++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 224 insertions(+), 53 deletions(-)
diff --git a/src/views/scgl/gd.vue b/src/views/scgl/gd.vue
index 3d00d04..9a1a29f 100644
--- a/src/views/scgl/gd.vue
+++ b/src/views/scgl/gd.vue
@@ -215,6 +215,7 @@
label="浜у搧瑙勬牸"
sortable="custom"
width="110"
+ show-tooltip-when-overflow
>
<template slot-scope="{row}">
<div v-if="row.partspec">{{ row.partspec }}</div>
@@ -376,19 +377,23 @@
<el-table-column
prop="partcode"
label="浜у搧缂栫爜"
+ width="150"
/>
<el-table-column
prop="partname"
label="浜у搧鍚嶇О"
+ width="200"
/>
<el-table-column
label="宸ュ簭缂栫爜"
prop="stepcode"
+ width="150"
/>
<el-table-column
label="宸ュ簭鍚嶇О"
prop="stepname"
+ width="150"
/>
<el-table-column
label="浠诲姟鏁伴噺"
@@ -1217,63 +1222,200 @@
:close-on-click-modal="false"
@close="dialogVisible2Close"
>
- <!-- 瑕佹墦鍗扮殑鍖哄煙 -->
- <div id="printMe2" style="padding: 0px;">
- <div
- style="display: flex;width: 280px;height: 150px;border: 1px solid #000;text-align: center;font-size: 10px;"
- >
+ <div style="height: 300px">
+ <!-- 涓嬫媺妗嗛�夋嫨鎵撳嵃灏哄-->
+ <div style="display: flex;align-items: center;margin: 0 0 20px 0">
+ <div>閫夋嫨鎵撳嵃灏哄锛�</div>
+ <el-select
+ v-model="printSize"
+ :popper-append-to-body="false"
+ style="width: 200px"
+ placeholder="璇烽�夋嫨"
+ @change="printSizeChange"
+ >
- <div style="width: 90px;display: flex;flex-direction: column;border-right: 1px solid #000">
- <div
- style="display: flex;height: 90px;border-bottom:1px solid #000;
+ <el-option
+ v-for="item in printSizeSelectArr"
+ :key="item.code"
+ :label="item.name"
+ :value="item.code"
+ />
+ </el-select>
+ </div>
+ <!-- 瑕佹墦鍗扮殑鍖哄煙 -->
+ <!-- <div id="printMe2" :style="{paddingLeft:'10px',paddingTop: '5px'}">-->
+ <div id="printMe2" :style="printMe2StylePadding(printSize)">
+ <div
+ v-if="printSize===0"
+ style="display: flex;width: 280px;height: 160px;border: 1px solid #000;text-align: center;font-size: 10px;"
+ >
+
+ <div style="width: 90px;display: flex;flex-direction: column;border-right: 1px solid #000">
+ <div
+ style="display: flex;height: 96px;border-bottom:1px solid #000;
justify-content: center;align-items: center;position: relative"
- >
- <div id="qrCode2" ref="qrCodeDiv2" style="overflow-y: hidden;height:60px;position: absolute;left: 14px;" />
+ >
+ <div id="qrCode2" ref="qrCodeDiv2" style="overflow-y: hidden;height:60px;position: absolute;left: 14px;" />
+ </div>
+ <div
+ style="display: flex;height: 32px;justify-content: flex-start;border-bottom:1px solid #000;align-items: center"
+ >
+ <div style="margin-left: 5px;width: 28px">鏁伴噺:</div>
+ {{ qrForm.startqty }}
+ </div>
+ <div style="display: flex;height: 32px;justify-content: flex-start;align-items: center">
+ <div style="margin-left: 5px;width: 42px">澶勭悊浜�:</div>
+ {{ qrForm.operator }}
+ </div>
</div>
- <div
- style="display: flex;height: 30px;justify-content: flex-start;border-bottom:1px solid #000;align-items: center"
- >
- <div style="margin-left: 5px;width: 28px">鏁伴噺:</div>
- {{ qrForm.startqty }}
- </div>
- <div style="display: flex;height: 30px;justify-content: flex-start;align-items: center">
- <div style="margin-left: 5px;width: 42px">澶勭悊浜�:</div>
- {{ qrForm.operator }}
- </div>
- </div>
- <div style="width:190px;display: flex;flex-direction: column">
- <div
- style="display: flex;height: 20%;border-bottom:1px solid #000;justify-content: flex-start;align-items: center;text-align: left"
- >
- <div style="width: 60px;margin-left: 5px;">宸ュ崟缂栧彿:</div>
- <div>{{ qrForm.wo_code }}</div>
- </div>
- <div
- style="display: flex;height: 20%;border-bottom:1px solid #000;justify-content: flex-start;align-items: center ;text-align: left"
- >
- <div style="width: 60px;margin-left: 5px;">浜у搧缂栫爜:</div>
- <div>{{ qrForm.partcode }}</div>
- </div>
- <div
- style="display: flex;height: 20%;border-bottom:1px solid #000 ;justify-content: flex-start;align-items: center;text-align: left"
- >
- <div style="width:60px;margin-left: 5px;">浜у搧鍚嶇О:</div>
- <div>{{ qrForm.partname }}</div>
- </div>
- <div
- style="display: flex;height: 20%;border-bottom:1px solid #000 ;justify-content: flex-start;align-items: center;text-align: left"
- >
- <div style="width:60px;margin-left: 5px;">涓嬮亾宸ュ簭:</div>
- <div>{{ qrForm.nextstepname }}</div>
- </div>
- <div style="display: flex;height: 20%;justify-content: flex-start;align-items: center;text-align: left">
- <div style="width: 60px;margin-left: 5px;">澶勭悊鏃堕棿:</div>
- <div>{{ qrForm.operatorTime }}</div>
+ <div style="width:190px;display: flex;flex-direction: column">
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000;justify-content: flex-start;align-items: center;text-align: left"
+ >
+ <div style="width: 60px;margin-left: 5px;">宸ュ崟缂栧彿:</div>
+ <div>{{ qrForm.wo_code }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000;justify-content: flex-start;align-items: center ;text-align: left"
+ >
+ <div style="width: 60px;margin-left: 5px;">浜у搧缂栫爜:</div>
+ <div>{{ qrForm.partcode }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000 ;justify-content: flex-start;align-items: center;text-align: left"
+ >
+ <div style="width:60px;margin-left: 5px;">浜у搧鍚嶇О:</div>
+ <div>{{ qrForm.partname }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000 ;justify-content: flex-start;align-items: center;text-align: left"
+ >
+ <div style="width:60px;margin-left: 5px;">涓嬮亾宸ュ簭:</div>
+ <div>{{ qrForm.nextstepname }}</div>
+ </div>
+ <div style="display: flex;height: 20%;justify-content: flex-start;align-items: center;text-align: left">
+ <div style="width: 60px;margin-left: 5px;">澶勭悊鏃堕棿:</div>
+ <div>{{ qrForm.operatorTime }}</div>
+ </div>
+
</div>
</div>
+ <div
+ v-if="printSize===1"
+ style="display: flex;width: 280px;height: 160px;border: 1px solid #000;text-align: center;font-size: 10px;"
+ >
+ <div style="width: 90px;display: flex;flex-direction: column;border-right: 1px solid #000">
+ <div
+ style="display: flex;height: 96px;border-bottom:1px solid #000;
+ justify-content: center;align-items: center;position: relative"
+ >
+ <div id="qrCode2" ref="qrCodeDiv2" style="overflow-y: hidden;height:60px;position: absolute;left: 14px;" />
+ </div>
+ <div
+ style="display: flex;height: 32px;justify-content: flex-start;border-bottom:1px solid #000;align-items: center"
+ >
+ <div style="margin-left: 5px;width: 28px">鏁伴噺:</div>
+ {{ qrForm.startqty }}
+ </div>
+ <div style="display: flex;height: 32px;justify-content: flex-start;align-items: center">
+ <div style="margin-left: 5px;width: 42px">澶勭悊浜�:</div>
+ {{ qrForm.operator }}
+ </div>
+ </div>
+
+ <div style="width:190px;display: flex;flex-direction: column">
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000;justify-content: flex-start;align-items: center;text-align: left"
+ >
+ <div style="width: 60px;margin-left: 5px;">宸ュ崟缂栧彿:</div>
+ <div>{{ qrForm.wo_code }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000;justify-content: flex-start;align-items: center ;text-align: left"
+ >
+ <div style="width: 60px;margin-left: 5px;">浜у搧缂栫爜:</div>
+ <div>{{ qrForm.partcode }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000 ;justify-content: flex-start;align-items: center;text-align: left"
+ >
+ <div style="width:60px;margin-left: 5px;">浜у搧鍚嶇О:</div>
+ <div>{{ qrForm.partname }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000 ;justify-content: flex-start;align-items: center;text-align: left"
+ >
+ <div style="width:60px;margin-left: 5px;">涓嬮亾宸ュ簭:</div>
+ <div>{{ qrForm.nextstepname }}</div>
+ </div>
+ <div style="display: flex;height: 20%;justify-content: flex-start;align-items: center;text-align: left">
+ <div style="width: 60px;margin-left: 5px;">澶勭悊鏃堕棿:</div>
+ <div>{{ qrForm.operatorTime }}</div>
+ </div>
+
+ </div>
+
+ </div>
+ <div
+ v-if="printSize===5"
+ style="display: flex;width: 140px;height: 80px;border: 1px solid #000;text-align: center;font-size: 10px;"
+ >
+
+ <div v-if="false" style="width: 45px;display: flex;flex-direction: column;border-right: 1px solid #000">
+ <div
+ style="display: flex;height: 60px;border-bottom:1px solid #000;
+ justify-content: center;align-items: center;position: relative"
+ >
+ <div id="qrCode2" ref="qrCodeDiv2" style="overflow-y: hidden;height:60px;position: absolute;left: 14px;" />
+ </div>
+ <div
+ style="display: flex;height: 20px;justify-content: flex-start;border-bottom:1px solid #000;align-items: center"
+ >
+ <div style="margin-left: 5px;width: 28px">鏁伴噺:</div>
+ {{ qrForm.startqty }}
+ </div>
+ <div style="display: flex;height: 20px;justify-content: flex-start;align-items: center">
+ <div style="margin-left: 5px;width: 42px">澶勭悊浜�:</div>
+ {{ qrForm.operator }}
+ </div>
+ </div>
+
+ <div style="width:100%;display: flex;flex-direction: column;">
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000;justify-content: center;align-items: center;text-align: left"
+ >
+ <!-- <div style="width: 60px;margin-left: 5px;">宸ュ崟缂栧彿:</div>-->
+ <div>{{ qrForm.wo_code }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000;justify-content: center;align-items: center ;text-align: left"
+ >
+ <!-- <div style="width: 60px;margin-left: 5px;">浜у搧缂栫爜:</div>-->
+ <div>{{ qrForm.partcode }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000 ;justify-content: center;align-items: center;text-align: left"
+ >
+ <!-- <div style="width:60px;margin-left: 5px;">浜у搧鍚嶇О:</div>-->
+ <div>{{ qrForm.partname }}</div>
+ </div>
+ <div
+ style="display: flex;height: 20%;border-bottom:1px solid #000 ;justify-content: center;align-items: center;text-align: left"
+ >
+ <!-- <div style="width:60px;margin-left: 5px;">涓嬮亾宸ュ簭:</div>-->
+ <div>{{ qrForm.nextstepname }}</div>
+ </div>
+ <div style="display: flex;height: 20%;justify-content: center;align-items: center;text-align: left">
+ <!-- <div style="width: 60px;margin-left: 5px;">澶勭悊鏃堕棿:</div>-->
+ <div>{{ qrForm.operatorTime }}</div>
+ </div>
+
+ </div>
+
+ </div>
</div>
</div>
<span slot="footer" class="dialog-footer">
@@ -1571,7 +1713,7 @@
closeCallback(vue) { // 鍏抽棴鎵撳嵃鐨勫洖璋冧簨浠讹紙鏃犳硶纭畾鐐瑰嚮鐨勬槸纭杩樻槸鍙栨秷锛�
console.log('11212', vue)
// vue.dialogVisible = false
- vue.dialogVisible2 = false
+ // vue.dialogVisible2 = false
// vue.dialogVisible = false
},
beforeOpenCallback(vue) {
@@ -1625,7 +1767,16 @@
defaultroute_codeArr: '', // 榛樿宸ヨ壓璺嚎鏁扮粍
projectTableData: [], // 璁惧鍒楄〃
isExpandForm: false, // 琛ㄥ崟鏄惁灞曞紑锛岄粯璁や笉灞曞紑
- tableDataDetail: []// 鐐瑰嚮宸ュ崟琛ㄧ殑琛� 鏄剧ず璇︾粏淇℃伅
+ tableDataDetail: [], // 鐐瑰嚮宸ュ崟琛ㄧ殑琛� 鏄剧ず璇︾粏淇℃伅
+ printSize: 1,
+ printSizeSelectArr: [// 瀹�*楂�
+ { code: 0, name: '80*50' },
+ { code: 1, name: '78*60' },
+ { code: 2, name: '50*60' },
+ { code: 3, name: '50*40' },
+ { code: 4, name: '50*80' },
+ { code: 5, name: '40*30' }
+ ]
}
},
created() {
@@ -2076,7 +2227,7 @@
// }
// })
// },
- // 鐢熸垚浜岀淮鐮�
+ // 鐢熸垚浜岀淮鐮� 宸ュ崟鎶ヨ〃浜岀淮鐮�
bindQRCode(seq, text, size) {
if (size === 'big') {
console.log(text, 1)
@@ -2165,7 +2316,7 @@
this.qrForm.operatorTime = ''
// this.$refs.qrCodeDiv2 = ''
},
- // 鐢熸垚浜岀淮鐮�
+ // 鐢熸垚浜岀淮鐮� 宸ュ簭鏍囩浜岀淮鐮�
bindQRCode2(text) {
new QRCode(this.$refs.qrCodeDiv2, {
text: text,
@@ -2370,6 +2521,20 @@
// 鎵撳嵃宸ュ崟
printOrder() {
+ },
+ // 閫夋嫨鎵撳嵃灏哄鐨勫ぇ灏忓�兼敼鍙�
+ printSizeChange(val) {
+ this.$nextTick(() => {
+ this.bindQRCode2(this.qrForm.qrvalue)
+ })
+ },
+ printMe2StylePadding(val) {
+ if (val === 0) {
+ return { paddingLeft: '10px', paddingTop: '5px' }
+ }
+ if (val === 5) {
+ return { paddingLeft: '15px', paddingTop: '7px' }
+ }
}
}
}
@@ -2669,6 +2834,12 @@
//}
}
+::v-deep .el-select__caret{
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
</style>
<style>
--
Gitblit v1.9.3