|
@@ -1,97 +1,107 @@
|
|
<template>
|
|
<template>
|
|
- <div class="saleSelfMachine">
|
|
|
|
- <div class="background">
|
|
|
|
- <img :src="backgroundImgURL" width="100%" height="100%"/>
|
|
|
|
- </div>
|
|
|
|
- <div class="orderNumberData">
|
|
|
|
- <el-input placeholder="请将二维码放置在扫描区" v-model="orderNumber" :focus="true" ref="inputs" :disabled="!isEdit">
|
|
|
|
- </el-input>
|
|
|
|
- <div style="display:block;width:120px">
|
|
|
|
- 手动输入开关:
|
|
|
|
- </div>
|
|
|
|
- <el-switch
|
|
|
|
- v-model="isEdit"
|
|
|
|
- active-color="#66ccff"
|
|
|
|
- inactive-color="#ffffff">
|
|
|
|
- </el-switch>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div class="saleSelfMachine">
|
|
|
|
+ <div class="background">
|
|
|
|
+ <img :src="backgroundImgURL" width="100%" height="100%" />
|
|
|
|
+ </div>
|
|
|
|
+ <div class="orderNumberData">
|
|
|
|
+ <el-input
|
|
|
|
+ placeholder="请将二维码放置在扫描区"
|
|
|
|
+ v-model="orderNumber"
|
|
|
|
+ :focus="true"
|
|
|
|
+ ref="inputs"
|
|
|
|
+ :disabled="!isEdit"
|
|
|
|
+ >
|
|
|
|
+ </el-input>
|
|
|
|
+ <div style="display:block;width:120px">
|
|
|
|
+ 手动输入开关:
|
|
|
|
+ </div>
|
|
|
|
+ <el-switch
|
|
|
|
+ v-model="isEdit"
|
|
|
|
+ active-color="#66ccff"
|
|
|
|
+ inactive-color="#ffffff"
|
|
|
|
+ >
|
|
|
|
+ </el-switch>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
export default {
|
|
export default {
|
|
- data(){
|
|
|
|
- return{
|
|
|
|
- orderNumber:null,
|
|
|
|
- isEdit:false,
|
|
|
|
- backgroundImgURL:require('@/assets/saleSelfMachine/scanCode.jpg'),
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- created(){
|
|
|
|
- this.changfouce();
|
|
|
|
- },
|
|
|
|
- // watch:{
|
|
|
|
- // data:"toSaleSelfMachine"
|
|
|
|
- // },
|
|
|
|
- methods:{
|
|
|
|
- //输入框自动聚焦
|
|
|
|
- changfouce(){
|
|
|
|
- this.$nextTick((x)=>{
|
|
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ orderNumber: null,
|
|
|
|
+ isEdit: true,
|
|
|
|
+ backgroundImgURL: require("@/assets/saleSelfMachine/scanCode.jpg")
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ this.changfouce();
|
|
|
|
+ },
|
|
|
|
+ // watch:{
|
|
|
|
+ // data:"toSaleSelfMachine"
|
|
|
|
+ // },
|
|
|
|
+ methods: {
|
|
|
|
+ //输入框自动聚焦
|
|
|
|
+ changfouce() {
|
|
|
|
+ this.$nextTick(x => {
|
|
this.$refs.inputs.focus();
|
|
this.$refs.inputs.focus();
|
|
- })
|
|
|
|
- },
|
|
|
|
- //失去焦点后自动执行获得焦点事件
|
|
|
|
- // onInputBlur(){
|
|
|
|
- // console.log("获取焦点")
|
|
|
|
- // this.changfouce();
|
|
|
|
- // }
|
|
|
|
- // toSaleSelfMachine(){
|
|
|
|
- // this.$router.push({
|
|
|
|
- // path:'/saleSelfMachine',
|
|
|
|
- // })
|
|
|
|
- // }
|
|
|
|
- },
|
|
|
|
- mounted(){
|
|
|
|
- // this.changfouce();
|
|
|
|
- const timer = setInterval(()=>{
|
|
|
|
- // if(this.$refs.inputs.focus==false){
|
|
|
|
- // console.log("false")
|
|
|
|
- this.changfouce();
|
|
|
|
- //}
|
|
|
|
- if(this.orderNumber!=null&&this.orderNumber.length==21){
|
|
|
|
- if(this.orderNumber.startsWith('WYSDD')==true||this.orderNumber.startsWith('wysdd')==true){
|
|
|
|
- this.$router.push({
|
|
|
|
- path:"/saleSelfMachine?orderNumber="+this.orderNumber,
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
- }else if(this.orderNumber.length>21){
|
|
|
|
- //清空输入框,免得一次多个重复订单还无法删除
|
|
|
|
- this.orderNumber=null;
|
|
|
|
- }
|
|
|
|
- },3000)
|
|
|
|
- this.$once('hook:beforeDestroy', ()=>{
|
|
|
|
- clearInterval(timer)
|
|
|
|
- })
|
|
|
|
-}
|
|
|
|
-}
|
|
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ //失去焦点后自动执行获得焦点事件
|
|
|
|
+ // onInputBlur(){
|
|
|
|
+ // console.log("获取焦点")
|
|
|
|
+ // this.changfouce();
|
|
|
|
+ // }
|
|
|
|
+ // toSaleSelfMachine(){
|
|
|
|
+ // this.$router.push({
|
|
|
|
+ // path:'/saleSelfMachine',
|
|
|
|
+ // })
|
|
|
|
+ // }
|
|
|
|
+ },
|
|
|
|
+ mounted() {
|
|
|
|
+ // this.changfouce();
|
|
|
|
+ const timer = setInterval(() => {
|
|
|
|
+ // if(this.$refs.inputs.focus==false){
|
|
|
|
+ // console.log("false")
|
|
|
|
+ this.changfouce();
|
|
|
|
+ //}
|
|
|
|
+ if (this.orderNumber != null && this.orderNumber.length == 21) {
|
|
|
|
+ if (
|
|
|
|
+ this.orderNumber.startsWith("WYSDD") == true ||
|
|
|
|
+ this.orderNumber.startsWith("wysdd") == true
|
|
|
|
+ ) {
|
|
|
|
+ this.$router.push({
|
|
|
|
+ path: "/saleSelfMachine?orderNumber=" + this.orderNumber
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ } else if (this.orderNumber.length > 21) {
|
|
|
|
+ //清空输入框,免得一次多个重复订单还无法删除
|
|
|
|
+ this.orderNumber = null;
|
|
|
|
+ }
|
|
|
|
+ }, 3000);
|
|
|
|
+ this.$once("hook:beforeDestroy", () => {
|
|
|
|
+ clearInterval(timer);
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+};
|
|
</script>
|
|
</script>
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
- .saleSelfMachine{
|
|
|
|
- width: 100vh;
|
|
|
|
- height: 100vh;
|
|
|
|
- .background {
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- z-index: -1;
|
|
|
|
- position: absolute;
|
|
|
|
- overflow: hidden;
|
|
|
|
- }
|
|
|
|
- .orderNumberData{
|
|
|
|
- width: 100%;
|
|
|
|
- color: #fff;
|
|
|
|
- position: absolute;
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: center;
|
|
|
|
- align-items: center;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-</style>
|
|
|
|
|
|
+.saleSelfMachine {
|
|
|
|
+ width: 100vh;
|
|
|
|
+ height: 100vh;
|
|
|
|
+ .background {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ z-index: -1;
|
|
|
|
+ position: absolute;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ }
|
|
|
|
+ .orderNumberData {
|
|
|
|
+ width: 100%;
|
|
|
|
+ color: #fff;
|
|
|
|
+ position: absolute;
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</style>
|