2 changed files with 372 additions and 0 deletions
@ -0,0 +1,262 @@ |
|||
<!--扫描组件--> |
|||
<template> |
|||
<!-- <page-meta root-font-size="18px"></page-meta> --> |
|||
<view> |
|||
<view class="pop_tab"> |
|||
<view class="tab_info"> |
|||
<view class="conbox"> |
|||
<textarea inputmode="none" v-model="scanMsg" trim="all" maxlength="1000" |
|||
style="margin-left: 5px;width: 90%;" :focus="boxfocus" :placeholder="placeholderValue" |
|||
@focus="getfocus" @blur="losefocus" @input="handelScanMsg" :cursor="cursorIndex"></textarea> |
|||
</view> |
|||
<view class="uni-flex uni-row space-between u-col-center"> |
|||
<view class="uni-flex"> |
|||
<button class="clean_scan_btn" @click="clearScanValue()">清空</button> |
|||
<button class="scan_btn" @click="clickScanMsg()">扫描</button> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="width: 100%;"> |
|||
<view style="width: 100%;" v-if="scanList.length>0&&isShowHistory"> |
|||
<view class="uni-flex uni-row space-between u-col-center"> |
|||
<view class="" style="padding: 10rpx;"> |
|||
历史记录 |
|||
</view> |
|||
<view class="" style="padding-right: 10rpx;"> |
|||
<u-icon :name="expendIcon" size="35rpx" @click="expands()"></u-icon> |
|||
</view> |
|||
</view> |
|||
<u-line class='line_color' style='padding-top: 10rpx;padding-bottom: 20rpx;'></u-line> |
|||
<scroll-view scroll-y="true" class="scroll-view" v-if="expand&&scanList.length>0" |
|||
style="height: 70px;"> |
|||
<view class="uni-flex u-col" v-for="(item,index) in scanList"> |
|||
<view style="width: 100%;max-height: 100px;"> |
|||
<view class="uni-flex u-row space-between u-col-center" @click="showItem(item)"> |
|||
<view class="text_ellipsis" style="padding: 15rpx;"> |
|||
{{item}} |
|||
</view> |
|||
<view class=""> |
|||
<u-icon name="arrow-right"></u-icon> |
|||
</view> |
|||
</view> |
|||
<u-line class='line_color'></u-line> |
|||
</view> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<comMessage ref="comMessage"></comMessage> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
import { |
|||
getLabelInfo |
|||
} from '../../common/label.js'; |
|||
|
|||
export default { |
|||
name: "winComScan", |
|||
emits: ["getResult"], |
|||
components: {}, |
|||
props: { |
|||
placeholder: { |
|||
type: String, |
|||
default: '请扫描标签' |
|||
}, |
|||
clearResult: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
boxFocus: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
isShowHistory: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
headerType: { |
|||
type: String, |
|||
default: 'HPQ' //HLB HMQ HCQ HPQ |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
// scanMsg: "HPQ;V1.0;ICE115F11161AG;PP20230427000027;B20230427002;Q100", |
|||
scanMsg: "", |
|||
boxfocus: false, |
|||
placeholderValue: '', |
|||
scanResult: {}, |
|||
scanList: [], |
|||
expand: true, |
|||
expendIcon: 'arrow-down', |
|||
cursorIndex: 0 |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.boxfocus = true; |
|||
uni.hideKeyboard(); |
|||
|
|||
// #ifdef H5 |
|||
if (document.querySelector('textarea') != null) { |
|||
document.querySelector('textarea').setAttribute('inputmode', 'none') |
|||
} |
|||
// #endif |
|||
this.hide() |
|||
// #ifdef APP-PLUS |
|||
|
|||
// #endif |
|||
}, |
|||
watch: { |
|||
placeholder() { |
|||
this.placeholderValue = '请扫描' + this.placeholder; |
|||
} |
|||
}, |
|||
created() { |
|||
this.placeholderValue = '请扫描' + this.placeholder; |
|||
}, |
|||
methods: { |
|||
hide() { |
|||
// #ifdef APP-PLUS |
|||
// 只是解决软键盘的闪现 |
|||
var interval = setInterval(function() { |
|||
uni.hideKeyboard(); //隐藏软键盘 |
|||
console.log('刷新') |
|||
}, 5); |
|||
setTimeout(() => { |
|||
clearInterval(interval); |
|||
console.log('停止刷新') |
|||
}, 1000); |
|||
// #endif |
|||
}, |
|||
getValue() { |
|||
return this.scanMsg |
|||
}, |
|||
setValue(val) { |
|||
this.scanMsg = val |
|||
}, |
|||
clearScanValue() { |
|||
this.scanMsg = '' |
|||
this.getfocus(); |
|||
}, |
|||
clickScanMsg() { |
|||
this.scanMsg = this.scanMsg + "\n"; |
|||
this.handelScanMsg(); |
|||
}, |
|||
handelScanMsg() { |
|||
let that = this; |
|||
setTimeout(() => { |
|||
that.losefocus(); |
|||
// let content = uni.$u.trim(that.scanMsg) |
|||
let content = that.scanMsg; |
|||
if (content == "") { |
|||
that.getfocus(); |
|||
this.$refs.comMessage.showErrorMessage("扫描内容为空,请重新扫描", res => { |
|||
if (res) { |
|||
that.scanMsg = "" |
|||
that.getfocus(); |
|||
} |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
if (that.isShowHistory) { |
|||
that.scanList.unshift(content); |
|||
} |
|||
|
|||
try { |
|||
let itemCode = content.substr(0, 10); |
|||
let productDate = content.substr(10, 8); |
|||
let batch = content.substr(18, 3); |
|||
let order = content.substr(21, 8); |
|||
|
|||
let scanResult = { |
|||
itemCode: itemCode, |
|||
productDate: productDate, |
|||
batch: batch, |
|||
order: order, |
|||
qty: 1, |
|||
content: content, |
|||
success: true, |
|||
}; |
|||
that.clear(); |
|||
that.$emit("getResult", scanResult); |
|||
} catch (e) { |
|||
this.$refs.comMessage.showErrorMessage('解析错误', res => { |
|||
if (res) { |
|||
that.getfocus(); |
|||
} |
|||
}) |
|||
} |
|||
}, 500); |
|||
}, |
|||
getfocus() { |
|||
let that = this; |
|||
this.$nextTick(r => { |
|||
that.boxfocus = true; |
|||
}); |
|||
this.hide() |
|||
}, |
|||
losefocus() { |
|||
let that = this; |
|||
this.$nextTick(r => { |
|||
that.boxfocus = false; |
|||
}); |
|||
}, |
|||
clear() { |
|||
this.cursorIndex = 0; |
|||
this.scanMsg = '' |
|||
}, |
|||
iconClick(type) { |
|||
this.$emit("clearResult", this.scanMsg); |
|||
}, |
|||
expands() { |
|||
this.expand = !this.expand; |
|||
this.expendIcon = this.expand == true ? "arrow-down" : "arrow-up" |
|||
}, |
|||
scanClick() { |
|||
this.handelScanMsg(); |
|||
}, |
|||
cancelClick() { |
|||
this.clear(); |
|||
this.getfocus(); |
|||
}, |
|||
showItem(item) { |
|||
this.$refs.comMessage.showMessage(item, res => { |
|||
if (res) { |
|||
// this.$refs.modal.cancelClose(); |
|||
} |
|||
}) |
|||
}, |
|||
|
|||
scanQRCode() { |
|||
let that = this; |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success: (res) => { |
|||
that.scanMsg = res.result; |
|||
that.$emit("getResult", res.result); |
|||
console.log('扫描二维码成功,结果:' + res.result); |
|||
}, |
|||
fail: (res) => { |
|||
that.showItem('扫描出现错误:' + res.result); |
|||
console.log('扫描出现错误:' + res.result); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<script module="textarea" lang="renderjs"> |
|||
export default { |
|||
mounted() { |
|||
document.querySelector('textarea').setAttribute('inputmode', 'none') |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
|
|||
</style> |
|||
@ -0,0 +1,110 @@ |
|||
<template> |
|||
<view> |
|||
<uni-popup ref="popup" @change="change" @maskClick="closeScanPopup()"> |
|||
<view class="popup_box"> |
|||
<view class="pop_title uni-flex space-between"> |
|||
<view class="" style="font-size: 35rpx;"> |
|||
扫描{{title}} |
|||
</view> |
|||
|
|||
<view class=""> |
|||
<image class="fr icons_scan_close" src="/static/icons/icons_scan_close.svg" |
|||
@click="closeScanPopup()"></image> |
|||
</view> |
|||
</view> |
|||
<view class=""> |
|||
<view class=""> |
|||
<win-com-scan-fg ref="comscan" :placeholder="title" @getResult="getScanResult" |
|||
:headerType="headerType" :isShowHistory="isShowHistory" |
|||
:clearResult="true"></win-com-scan-fg> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
<comMessage ref="comMessage" @afterClose="getfocus"></comMessage> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import winComScanFg from '@/mycomponents/scan/winComScanFg.vue' |
|||
|
|||
export default { |
|||
name: 'winScanFGLabel', |
|||
components: { |
|||
winComScanFg, |
|||
}, |
|||
props: { |
|||
title: { |
|||
type: String, |
|||
default: '成品标签' |
|||
}, |
|||
isShowHistory: { |
|||
type: Boolean, |
|||
default: true |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
show: false, |
|||
} |
|||
}, |
|||
created() { |
|||
|
|||
}, |
|||
methods: { |
|||
openScanPopup() { |
|||
setTimeout(res => { |
|||
this.$refs.popup.open('bottom') |
|||
}, 200) |
|||
}, |
|||
|
|||
closeScanPopup() { |
|||
this.$refs.popup.close(); |
|||
this.$emit("close", ''); |
|||
}, |
|||
|
|||
scanClick() { |
|||
this.$refs.comscan.clickScanMsg(); |
|||
}, |
|||
|
|||
cancelClick() { |
|||
this.$refs.comscan.clearScanValue(); |
|||
}, |
|||
|
|||
getScanResult(result) { |
|||
if (result.success) { |
|||
this.$emit("getResult", result); |
|||
} else { |
|||
this.showMessage(result.message) |
|||
} |
|||
}, |
|||
|
|||
getfocus() { |
|||
if (this.$refs.comscan != undefined) { |
|||
this.$refs.comscan.getfocus(); |
|||
} |
|||
}, |
|||
|
|||
losefocus() { |
|||
if (this.$refs.comscan != undefined) { |
|||
this.$refs.comscan.losefocus(); |
|||
} |
|||
}, |
|||
showMessage(message) { |
|||
this.$refs.comMessage.showMessage(message); |
|||
}, |
|||
change(e) { |
|||
this.show = e.show |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.scroll-view { |
|||
overflow-y: scroll; |
|||
height: auto; |
|||
max-height: 300rpx; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue