You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
296 lines
7.2 KiB
296 lines
7.2 KiB
<!--扫描组件-->
|
|
<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="paizhao" @click="scanQRCode()" v-if="true">
|
|
<image src="/static/icons/icons_camera.svg" alt="" />
|
|
</view> -->
|
|
|
|
<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="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
|
|
//
|
|
// this.hide()
|
|
// uni.onKeyboardHeightChange(res => {
|
|
// console.log(res.height)
|
|
// if(res.height>0){
|
|
// // uni.hideKeyboard();
|
|
// plus.key.hideSoftKeybord();
|
|
// }
|
|
// })
|
|
//
|
|
// uni.onWindowResize((res) => {
|
|
// plus.key.hideSoftKeybord()
|
|
// })
|
|
// plus.key.hideSoftKeybord();
|
|
// setInterval(function(){
|
|
// plus.key.hideSoftKeybord();
|
|
// // uni.hideKeyboard();//隐藏软键盘
|
|
// // plus.key.hideSoftKeybord();
|
|
// },60);
|
|
|
|
// #endif
|
|
|
|
// if (this.$el.querySelector('textarea') != null) {
|
|
// this.$el.querySelector('textarea').setAttribute('inputmode', 'none')
|
|
// }
|
|
},
|
|
watch: {
|
|
placeholder() {
|
|
this.placeholderValue = '请扫描' + this.placeholder;
|
|
}
|
|
},
|
|
created() {
|
|
this.placeholderValue = '请扫描' + this.placeholder;
|
|
},
|
|
methods: {
|
|
setItemCodeSimulate(scanMsg) {
|
|
this.scanMsg = scanMsg;
|
|
},
|
|
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() {
|
|
//点击了回车
|
|
// uni.showLoading({
|
|
// title: '解析中...',
|
|
// mask: true
|
|
// })
|
|
let that = this;
|
|
let index = that.scanMsg.indexOf('\n');
|
|
if (index >= 0) {
|
|
// that.scanMsg = 'HPQ;V1.0;ICE115F11161AG;PP20230427000027;B20230427002;Q50';
|
|
setTimeout(() => {
|
|
that.losefocus();
|
|
let content = uni.$u.trim(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);
|
|
}
|
|
getLabelInfo(content, this.headerType, callback => {
|
|
// uni.hideLoading();
|
|
let scanResult = callback;
|
|
scanResult.scanMessage=content
|
|
if (scanResult.success) {
|
|
that.clear();
|
|
// that.getfocus();//不能自动获取焦点
|
|
that.$emit("getResult", scanResult);
|
|
} else {
|
|
that.clear();
|
|
this.$refs.comMessage.showErrorMessage(scanResult.message, 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() {
|
|
if(this.clearResult)
|
|
{
|
|
this.cursorIndex = 0;
|
|
this.scanMsg = ''
|
|
}
|
|
},
|
|
iconClick(type) {
|
|
this.$emit("clearResult", this.scanMsgk);
|
|
},
|
|
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>
|