多次出入库代码提交
郑明梁
2 years ago
parent
0039e3e2b5
commit
e8155ce822
@ -0,0 +1,18 @@
|
|||||||
|
import MsgBox from '@/views/components/MsgBox'
|
||||||
|
let ConfirmConstructor, instance
|
||||||
|
|
||||||
|
const showMsgBox = {
|
||||||
|
install(Vue) {
|
||||||
|
ConfirmConstructor = Vue.extend(MsgBox)
|
||||||
|
instance = new ConfirmConstructor().$mount()
|
||||||
|
document.body.appendChild(instance.$el)
|
||||||
|
|
||||||
|
Vue.prototype.$showMsgBox = options => {
|
||||||
|
Object.assign(instance, options)
|
||||||
|
instance.init()
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default showMsgBox
|
||||||
@ -0,0 +1,150 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div v-if="show" class="cancelTips" >
|
||||||
|
<div class="cancelBox">
|
||||||
|
<p class="tips">{{ caption }}</p>
|
||||||
|
<p class="title">{{ msg }}</p>
|
||||||
|
<div class="selectBtn">
|
||||||
|
<el-button size="small" type="primary" @click="cancelClick">取消</el-button>
|
||||||
|
<el-button ref="uRef" size="small" type="primary" @click="confirmClick">确定</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "MsgBox",
|
||||||
|
props: {
|
||||||
|
caption: {},
|
||||||
|
show: {},
|
||||||
|
msg: {},
|
||||||
|
callback: {}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value: null,
|
||||||
|
keyCode: '',
|
||||||
|
lastTime: '',
|
||||||
|
nextTime: '',// 上次时间、最新时间
|
||||||
|
lastCode: '',
|
||||||
|
nextCode: '',// 上次按键、最新按键
|
||||||
|
}
|
||||||
|
},
|
||||||
|
destroyed() {
|
||||||
|
// 销毁enter事件
|
||||||
|
this.enterKeyupDestroyed();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
enterKey(event) {
|
||||||
|
this.nextCode = event.keyCode
|
||||||
|
// 如果触发了回车事件(扫码结束时间)
|
||||||
|
if (this.nextCode == 13) {
|
||||||
|
if (this.keyCode == 'true') {
|
||||||
|
this.confirmClick();
|
||||||
|
} else if (this.keyCode == 'false') {
|
||||||
|
this.cancelClick(0);
|
||||||
|
}
|
||||||
|
this.keyCode = ''
|
||||||
|
this.lastCode = ''
|
||||||
|
this.lastTime = ''
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.nextTime = new Date().getTime() // 记录最新时间
|
||||||
|
if (!this.lastTime && !this.lastCode) { // 如果上次时间和上次按键为空
|
||||||
|
this.keyCode += event.key // 执行叠加操作
|
||||||
|
}
|
||||||
|
// 如果有上次时间及上次按键
|
||||||
|
if (this.lastCode && this.lastTime && this.nextTime - this.lastTime > 30) { // 当扫码前有keypress事件时,防止首字缺失
|
||||||
|
this.keyCode = event.key
|
||||||
|
} else if (this.lastCode && this.lastTime) {
|
||||||
|
this.keyCode += event.key
|
||||||
|
}
|
||||||
|
this.lastCode = this.nextCode
|
||||||
|
this.lastTime = this.nextTime
|
||||||
|
},
|
||||||
|
enterKeyupDestroyed() {
|
||||||
|
document.removeEventListener("keyup", this.enterKey);
|
||||||
|
},
|
||||||
|
enterKeyup() {
|
||||||
|
document.addEventListener("keyup", this.enterKey);
|
||||||
|
},
|
||||||
|
init() {
|
||||||
|
this.show = true;
|
||||||
|
this.enterKeyup();
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false;
|
||||||
|
this.callback("close")
|
||||||
|
},
|
||||||
|
confirmClick() {
|
||||||
|
this.show = false;
|
||||||
|
this.callback("yes")
|
||||||
|
this.enterKeyupDestroyed();
|
||||||
|
},
|
||||||
|
cancelClick() {
|
||||||
|
this.show = false;
|
||||||
|
this.callback("no")
|
||||||
|
this.enterKeyupDestroyed();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style type="text/scss" lang="scss" scoped>
|
||||||
|
.cancelTips {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
z-index: 9999999;
|
||||||
|
margin: auto;
|
||||||
|
width: 100%;
|
||||||
|
background: rgba(0, 0, 0, 0.6);
|
||||||
|
|
||||||
|
.cancelBox {
|
||||||
|
position: absolute;
|
||||||
|
top: 30%;
|
||||||
|
left: 40%;
|
||||||
|
width: 20%;
|
||||||
|
margin: auto;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 12px;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
.tips {
|
||||||
|
font-size: 16px;
|
||||||
|
margin: 30px 0 15px;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: bold;;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 16px;
|
||||||
|
text-align: center;
|
||||||
|
color: #767676;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectBtn {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
height: 60px;
|
||||||
|
line-height: 60px;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
border-top: 1px solid #ebebeb;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
Loading…
Reference in New Issue