From ef4e46f182aee6253805e66286dee847c573cbde Mon Sep 17 00:00:00 2001 From: licp <lichunping@guanfang.com.cn> Date: 星期三, 22 五月 2024 17:18:34 +0800 Subject: [PATCH] 完成原材料、产品检验、过程检,包装检键盘切换输入框 --- src/views/quality/rawMaterial/rawMaterial-form.vue | 159 +++++++++++++++ src/views/quality/packageinspect/packageInspect-form.vue | 124 ++++++++++++ vue.config.js | 9 src/views/quality/finishedProductInspection/finishedProduct-form.vue | 141 +++++++++++++ src/views/quality/processInspect/processInspect-form.vue | 138 +++++++++++++ 5 files changed, 546 insertions(+), 25 deletions(-) diff --git a/src/views/quality/finishedProductInspection/finishedProduct-form.vue b/src/views/quality/finishedProductInspection/finishedProduct-form.vue index e3a41b4..dbbc3f5 100644 --- a/src/views/quality/finishedProductInspection/finishedProduct-form.vue +++ b/src/views/quality/finishedProductInspection/finishedProduct-form.vue @@ -134,7 +134,9 @@ class="item" effect="dark" content="璇峰厛閫夋嫨璁惧锛�" placement="top-start"> <el-input :disabled="scope.row.eId == null" v-model="scope.row.empiricalValueAddss[index]" - @blur="changeState(scope.row)" placeholder="璇疯緭鍏ユ娴嬪��"></el-input> + @blur="changeState(scope.row)" placeholder="璇疯緭鍏ユ娴嬪��" + :id="`detectionValue${index}`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `detectionValue${index}`)"></el-input> <span v-if="resultVal != null" v-text="scope.row.empiricalValueAddss[index]"></span> </el-tooltip> </el-col> @@ -179,7 +181,9 @@ <el-input :disabled="scope.row.eId == null" v-model="scope.row.inote" - @blur="changeState(scope.row)" placeholder="璇疯緭鍏ユ楠屾弿杩�"></el-input> + @blur="changeState(scope.row)" placeholder="璇疯緭鍏ユ楠屾弿杩�" + :id="`remark`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `remark`)"></el-input> <span v-if="resultVal != null && processInspectVo.id != null" v-text="scope.row.inote"></span> @@ -190,7 +194,8 @@ class="item" effect="dark" content="璇峰厛閫夋嫨璁惧锛�" placement="top-start"> <el-input :disabled="scope.row.eId == null" v-model="scope.row.inote" - @blur="changeState(scope.row)" placeholder="璇疯緭鍏ユ楠屾弿杩�"></el-input> + @blur="changeState(scope.row)" placeholder="璇疯緭鍏ユ楠屾弿杩�" :id="`remark`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `remark`)"></el-input> <span v-if="resultVal != null && processInspectVo.id != null" v-text="scope.row.inote"></span> </el-tooltip> @@ -459,10 +464,24 @@ }, inspectionItems: [], // 鏂板妫�楠岄」鐩〃鏍� inspectionResultForm: [], - configFileTableData:[] + configFileTableData:[], + keyfield:['inspectProject','project','unit','standard','remark'], + keyfield0:['detectionValue0'] } }, watch: { + empiricalValueAdd(newVal){ + if(newVal!=this.keyfield0.length){ + if(newVal>this.keyfield0.length){ + this.keyfield0 = [] + for(let i=0;i<newVal;i++){ + this.keyfield0.push('detectionValue'+i) + } + }else{ + this.keyfield0.splice(this.keyfield0.length-1,1); + } + } + } }, beforeUpdate(){ this.$nextTick(()=>{ @@ -909,7 +928,121 @@ // 娣诲姞妫�楠屽�煎垪 clickAddInspectionColumn() { this.empiricalValueAdd = this.empiricalValueAdd + 1; + }, + moveFocus(event, index, key) { + console.log(key, index,key) + let keyfield = this.insertArrayAt(this.keyfield,0,this.keyfield0); + // enter閿� + // if (event.keyCode === 13) { // 鍥炶溅 + // if (index === this.getLen() - 1 && key === keyfield[keyfield.length - 1]) { // 鏈�鍚庝竴琛屾渶鍚庝竴涓� + // console.log('鏈�鍚庝竴琛屾渶鍚庝竴涓棤娉曞洖杞�') + // return + // } + // this.$nextTick(() => { + // event.target.blur() + // }) + // if (key === keyfield[keyfield.length - 1]) { // 褰撳墠琛屾渶鍚庝竴涓�,璺宠浆涓嬩竴琛岀涓�涓� + + // } else { // 璺宠浆涓嬩竴涓� + // const nextkeyindex = keyfield.findIndex(k => k === key) + 1 + // this.$nextTick(() => { + // document.getElementById(keyfield[nextkeyindex] + index).focus() + // }) + // } + // } + + // 鍚戜笂 =38 + if (event.keyCode === 38) { + console.log('鍚戜笂') + if (index === 0) { // 绗竴琛� + console.log('绗竴琛屾棤娉曞悜涓�') + return + } + document.getElementById(key + index).blur() + let i = 0; + while (true){ + let dom = document.getElementById(key + (index - 1-i)) + if(dom){ + dom.focus() + return + }else if((index-1-i)==0){ + return + } + i++ + } } + + // 涓� = 40 + if (event.keyCode === 40) { + console.log('鍚戜笅') + if (index === this.getLen() - 1) { // 鏈�鍚庝竴琛� + console.log('鏈�鍚庝竴琛屾棤娉曞悜涓�') + return + } + document.getElementById(key + index).blur() + this.$nextTick(() => { + let i = 0; + while (true){ + let dom = document.getElementById(key + (index + 1+i)) + console.log(dom,key + (index + 1+i)) + if(dom){ + dom.focus() + return + }else if((index+1+i)==this.getLen() - 1){ + return + } + i++ + } + }) + } + + // 宸� = 37 + if (event.keyCode === 37) { + console.log('鍚戝乏') + if (index === 0 && key === keyfield[0]) { // 绗竴琛岀涓�涓� + console.log('绗竴琛岀涓�涓棤娉曞悜宸�') + return + } + document.getElementById(key + index).blur() + const prevkeyindex = keyfield.findIndex(k => k === key) - 1 + this.$nextTick(() => { + let dom = document.getElementById(keyfield[prevkeyindex] + index) + if(dom){ + dom.focus() + } + }) + } + + // 鍙� = 39 + if (event.keyCode === 39) { + console.log('鍚戝彸') + if (index === this.getLen() - 1 && key === keyfield[keyfield.length - 1]) { // 鏈�鍚庝竴琛屾渶鍚庝竴涓� + console.log('鏈�鍚庝竴琛屾渶鍚庝竴涓棤娉曞悜鍙�') + return + } + document.getElementById(key + index).blur() + const nextkeyindex = keyfield.findIndex(k => k === key) + 1 + this.$nextTick(() => { + let dom = document.getElementById(keyfield[nextkeyindex] + index) + if(dom){ + dom.focus() + } + }) + } + }, + insertArrayAt(arr1, index, arr2) { + return arr1.slice(0, index).concat(arr2, arr1.slice(index)); + }, + getLen(){ + let arr = [] + this.inspectionItems.forEach(item => { + arr.push(item) + item.children.forEach(child => { + arr.push(child) + }) + }) + return arr.length + } }, } </script> diff --git a/src/views/quality/packageinspect/packageInspect-form.vue b/src/views/quality/packageinspect/packageInspect-form.vue index 21a93ae..020ed5e 100644 --- a/src/views/quality/packageinspect/packageInspect-form.vue +++ b/src/views/quality/packageinspect/packageInspect-form.vue @@ -101,7 +101,9 @@ <el-table-column prop="name" label="椤圭洰" min-width="160"> <template slot-scope="scope"> <el-input :readonly="resultVal!=null || !scope.row.isEdit" v-if="scope.row.children" class="inline-input" style="width:80%;" v-model="scope.row.name" - placeholder="璇疯緭鍏ラ」鐩悕绉�"></el-input> + placeholder="璇疯緭鍏ラ」鐩悕绉�" + :id="'project'+scope.$index" + @keyup.native="moveFocus($event, scope.$index, 'project')"></el-input> </template> </el-table-column> <el-table-column prop="required" label="瑕佹眰" min-width="160"> @@ -110,7 +112,9 @@ <el-tooltip :content="scope.row.required"> <el-input :readonly="resultVal!=null || !scope.row.isEdit" v-model="scope.row.required" - placeholder="璇疯緭鍏ヨ姹�"></el-input> + placeholder="璇疯緭鍏ヨ姹�" + :id="'standard'+scope.$index" + @keyup.native="moveFocus($event, scope.$index, 'standard')"></el-input> </el-tooltip> </div> </template> @@ -118,7 +122,9 @@ <el-table-column prop="note" label="妫�楠屾弿杩�" min-width="160"> <template slot-scope="scope"> <div v-if="!scope.row.children"> - <el-input :readonly="resultVal!=null" v-model="scope.row.note" placeholder="妫�楠屾弿杩�"></el-input> + <el-input :readonly="resultVal!=null" v-model="scope.row.note" placeholder="妫�楠屾弿杩�" + :id="`remark`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `remark`)"></el-input> </div> </template> </el-table-column> @@ -335,6 +341,7 @@ result: '' }], dataRule: {}, + keyfield:['project','standard','remark'], } }, beforeUpdate(){ @@ -669,6 +676,117 @@ _than.conclusionTable = [] } }, + moveFocus(event, index, key) { + console.log(key, index,key) + let keyfield = this.keyfield; + // enter閿� + // if (event.keyCode === 13) { // 鍥炶溅 + // if (index === this.getLen() - 1 && key === keyfield[keyfield.length - 1]) { // 鏈�鍚庝竴琛屾渶鍚庝竴涓� + // console.log('鏈�鍚庝竴琛屾渶鍚庝竴涓棤娉曞洖杞�') + // return + // } + // this.$nextTick(() => { + // event.target.blur() + // }) + // if (key === keyfield[keyfield.length - 1]) { // 褰撳墠琛屾渶鍚庝竴涓�,璺宠浆涓嬩竴琛岀涓�涓� + + // } else { // 璺宠浆涓嬩竴涓� + // const nextkeyindex = keyfield.findIndex(k => k === key) + 1 + // this.$nextTick(() => { + // document.getElementById(keyfield[nextkeyindex] + index).focus() + // }) + // } + // } + + // 鍚戜笂 =38 + if (event.keyCode === 38) { + console.log('鍚戜笂') + if (index === 0) { // 绗竴琛� + console.log('绗竴琛屾棤娉曞悜涓�') + return + } + document.getElementById(key + index).blur() + let i = 0; + while (true){ + let dom = document.getElementById(key + (index - 1-i)) + if(dom){ + dom.focus() + return + }else if((index-1-i)==0){ + return + } + i++ + } + } + + // 涓� = 40 + if (event.keyCode === 40) { + console.log('鍚戜笅') + if (index === this.getLen() - 1) { // 鏈�鍚庝竴琛� + console.log('鏈�鍚庝竴琛屾棤娉曞悜涓�') + return + } + document.getElementById(key + index).blur() + this.$nextTick(() => { + let i = 0; + while (true){ + let dom = document.getElementById(key + (index + 1+i)) + console.log(dom,key + (index + 1+i)) + if(dom){ + dom.focus() + return + }else if((index+1+i)==this.getLen() - 1){ + return + } + i++ + } + }) + } + + // 宸� = 37 + if (event.keyCode === 37) { + console.log('鍚戝乏') + if (index === 0 && key === keyfield[0]) { // 绗竴琛岀涓�涓� + console.log('绗竴琛岀涓�涓棤娉曞悜宸�') + return + } + document.getElementById(key + index).blur() + const prevkeyindex = keyfield.findIndex(k => k === key) - 1 + this.$nextTick(() => { + let dom = document.getElementById(keyfield[prevkeyindex] + index) + if(dom){ + dom.focus() + } + }) + } + + // 鍙� = 39 + if (event.keyCode === 39) { + console.log('鍚戝彸') + if (index === this.getLen() - 1 && key === keyfield[keyfield.length - 1]) { // 鏈�鍚庝竴琛屾渶鍚庝竴涓� + console.log('鏈�鍚庝竴琛屾渶鍚庝竴涓棤娉曞悜鍙�') + return + } + document.getElementById(key + index).blur() + const nextkeyindex = keyfield.findIndex(k => k === key) + 1 + this.$nextTick(() => { + let dom = document.getElementById(keyfield[nextkeyindex] + index) + if(dom){ + dom.focus() + } + }) + } + }, + getLen(){ + let arr = [] + this.list.forEach(item => { + arr.push(item) + item.children.forEach(child => { + arr.push(child) + }) + }) + return arr.length + } }, } </script> diff --git a/src/views/quality/processInspect/processInspect-form.vue b/src/views/quality/processInspect/processInspect-form.vue index 7980cef..b2dc4c5 100644 --- a/src/views/quality/processInspect/processInspect-form.vue +++ b/src/views/quality/processInspect/processInspect-form.vue @@ -146,7 +146,9 @@ class="item" effect="dark" content="璇峰厛閫夋嫨璁惧锛�" placement="top-start"> <el-input :disabled="scope.row.eId == null" v-model="scope.row.empiricalValueAddss[index]" - @blur="changeState(scope.row,true)" placeholder="璇疯緭鍏ユ娴嬪��"></el-input> + @blur="changeState(scope.row,true)" placeholder="璇疯緭鍏ユ娴嬪��" + :id="`detectionValue${index}`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `detectionValue${index}`)"></el-input> <span v-if="resultVal != null && processInspectVo.id != null" v-text="scope.row.empiricalValueAddss[index]"></span> </el-tooltip> @@ -192,7 +194,9 @@ class="item" effect="dark" content="璇峰厛閫夋嫨璁惧锛�" placement="top-start"> <el-input :disabled="scope.row.eId == null" v-model="scope.row.inote" - @blur="changeState(scope.row)" placeholder="璇疯緭鍏ユ楠屾弿杩�"></el-input> + @blur="changeState(scope.row)" placeholder="璇疯緭鍏ユ楠屾弿杩�" + :id="`remark`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `remark`)"></el-input> <span v-if="resultVal != null && processInspectVo.id != null" v-text="scope.row.inote"></span> </el-tooltip> @@ -516,10 +520,24 @@ inspectionItems: [], // 鏂板妫�楠岄」鐩〃鏍� inspectionResultForm: [], configFileTableData:[], - dataForm:null + dataForm:null, + keyfield:['remark'], + keyfield0:['detectionValue0'] } }, watch: { + empiricalValueAdd(newVal){ + if(newVal!=this.keyfield0.length){ + if(newVal>this.keyfield0.length){ + this.keyfield0 = [] + for(let i=0;i<newVal;i++){ + this.keyfield0.push('detectionValue'+i) + } + }else{ + this.keyfield0.splice(this.keyfield0.length-1,1); + } + } + } }, beforeUpdate() { this.$nextTick(() => { @@ -1022,7 +1040,121 @@ // 娣诲姞妫�楠屽�煎垪 clickAddInspectionColumn() { this.empiricalValueAdd = this.empiricalValueAdd + 1; + }, + moveFocus(event, index, key) { + console.log(key, index,key) + let keyfield = this.insertArrayAt(this.keyfield,0,this.keyfield0); + // enter閿� + // if (event.keyCode === 13) { // 鍥炶溅 + // if (index === this.getLen() - 1 && key === keyfield[keyfield.length - 1]) { // 鏈�鍚庝竴琛屾渶鍚庝竴涓� + // console.log('鏈�鍚庝竴琛屾渶鍚庝竴涓棤娉曞洖杞�') + // return + // } + // this.$nextTick(() => { + // event.target.blur() + // }) + // if (key === keyfield[keyfield.length - 1]) { // 褰撳墠琛屾渶鍚庝竴涓�,璺宠浆涓嬩竴琛岀涓�涓� + + // } else { // 璺宠浆涓嬩竴涓� + // const nextkeyindex = keyfield.findIndex(k => k === key) + 1 + // this.$nextTick(() => { + // document.getElementById(keyfield[nextkeyindex] + index).focus() + // }) + // } + // } + + // 鍚戜笂 =38 + if (event.keyCode === 38) { + console.log('鍚戜笂') + if (index === 0) { // 绗竴琛� + console.log('绗竴琛屾棤娉曞悜涓�') + return + } + document.getElementById(key + index).blur() + let i = 0; + while (true){ + let dom = document.getElementById(key + (index - 1-i)) + if(dom){ + dom.focus() + return + }else if((index-1-i)==0){ + return + } + i++ + } } + + // 涓� = 40 + if (event.keyCode === 40) { + console.log('鍚戜笅') + if (index === this.getLen() - 1) { // 鏈�鍚庝竴琛� + console.log('鏈�鍚庝竴琛屾棤娉曞悜涓�') + return + } + document.getElementById(key + index).blur() + this.$nextTick(() => { + let i = 0; + while (true){ + let dom = document.getElementById(key + (index + 1+i)) + console.log(dom,key + (index + 1+i)) + if(dom){ + dom.focus() + return + }else if((index+1+i)==this.getLen() - 1){ + return + } + i++ + } + }) + } + + // 宸� = 37 + if (event.keyCode === 37) { + console.log('鍚戝乏') + if (index === 0 && key === keyfield[0]) { // 绗竴琛岀涓�涓� + console.log('绗竴琛岀涓�涓棤娉曞悜宸�') + return + } + document.getElementById(key + index).blur() + const prevkeyindex = keyfield.findIndex(k => k === key) - 1 + this.$nextTick(() => { + let dom = document.getElementById(keyfield[prevkeyindex] + index) + if(dom){ + dom.focus() + } + }) + } + + // 鍙� = 39 + if (event.keyCode === 39) { + console.log('鍚戝彸') + if (index === this.getLen() - 1 && key === keyfield[keyfield.length - 1]) { // 鏈�鍚庝竴琛屾渶鍚庝竴涓� + console.log('鏈�鍚庝竴琛屾渶鍚庝竴涓棤娉曞悜鍙�') + return + } + document.getElementById(key + index).blur() + const nextkeyindex = keyfield.findIndex(k => k === key) + 1 + this.$nextTick(() => { + let dom = document.getElementById(keyfield[nextkeyindex] + index) + if(dom){ + dom.focus() + } + }) + } + }, + insertArrayAt(arr1, index, arr2) { + return arr1.slice(0, index).concat(arr2, arr1.slice(index)); + }, + getLen(){ + let arr = [] + this.inspectionItems.forEach(item => { + arr.push(item) + item.children.forEach(child => { + arr.push(child) + }) + }) + return arr.length + } }, } </script> diff --git a/src/views/quality/rawMaterial/rawMaterial-form.vue b/src/views/quality/rawMaterial/rawMaterial-form.vue index 02d1bf4..a9ed951 100644 --- a/src/views/quality/rawMaterial/rawMaterial-form.vue +++ b/src/views/quality/rawMaterial/rawMaterial-form.vue @@ -157,21 +157,30 @@ </el-table-column> <el-table-column prop="father" label="妫�楠岄」鐩�" width="160"> <template slot-scope="scope"> - <el-input v-if="scope.row.children" style="width:80%" :disabled="dataForm.id!=null&&(resultVal!=null && resultVal!='')" v-model="scope.row.father" placeholder="璇疯緭鍏ユ楠岄」鐩�"></el-input> + <el-input v-if="scope.row.children" style="width:80%" :disabled="dataForm.id!=null&&(resultVal!=null && resultVal!='')" v-model="scope.row.father" placeholder="璇疯緭鍏ユ楠岄」鐩�" + :ref="'inspectProject'+scope.$index" + :id="'inspectProject'+scope.$index" + @keyup.native="moveFocus($event, scope.$index, 'inspectProject')"></el-input> </template> </el-table-column> <el-table-column prop="name" label="椤圭洰" width="160"> <template slot-scope="scope"> <div v-if="!scope.row.children"> <el-input class="inline-input" :disabled="dataForm.id!=null&&(resultVal!=null && resultVal!='')" v-model="scope.row.name" - placeholder="璇疯緭鍏ラ」鐩悕绉�"></el-input> + placeholder="璇疯緭鍏ラ」鐩悕绉�" + :ref="'project'+scope.$index" + :id="'project'+scope.$index" + @keyup.native="moveFocus($event, scope.$index, 'project')"></el-input> </div> </template> </el-table-column> <el-table-column prop="unit" label="鍗曚綅" width="160"> <template slot-scope="scope"> <div v-if="!scope.row.children"> - <el-input :disabled="dataForm.id!=null&&(resultVal!=null && resultVal!='')" v-model="scope.row.unit" placeholder="璇疯緭鍏ュ崟浣�"></el-input> + <el-input :disabled="dataForm.id!=null&&(resultVal!=null && resultVal!='')" v-model="scope.row.unit" placeholder="璇疯緭鍏ュ崟浣�" + :ref="'unit'+scope.$index" + :id="'unit'+scope.$index" + @keyup.native="moveFocus($event, scope.$index, 'unit')"></el-input> </div> </template> @@ -180,7 +189,10 @@ <template slot-scope="scope"> <div v-if="!scope.row.children"> <el-input :disabled="dataForm.id!=null&&(resultVal!=null && resultVal!='')" v-model="scope.row.required" - placeholder="璇疯緭鍏ユ爣鍑嗗��"></el-input> + placeholder="璇疯緭鍏ユ爣鍑嗗��" + :ref="'standard'+scope.$index" + :id="'standard'+scope.$index" + @keyup.native="moveFocus($event, scope.$index, 'standard')"></el-input> </div> </template> </el-table-column> @@ -199,7 +211,9 @@ :disabled="scope.row.deviceId == null || (dataForm.id!=null&&(resultVal!=null && resultVal!=''))" v-model="scope.row.testValueList[index]" :fetch-suggestions="querySearch" - placeholder="璇疯緭鍏ユ垨閫夋嫨妫�娴嬪��" > + placeholder="璇疯緭鍏ユ垨閫夋嫨妫�娴嬪��" + :id="`detectionValue${index}`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `detectionValue${index}`)"> <template slot-scope="{ item }"> <div>{{ item.value }}</div> </template> @@ -228,7 +242,10 @@ <el-table-column prop="note" label="妫�楠屾弿杩�" width="160" > <template slot-scope="scope"> <div v-if="!scope.row.children"> - <el-input @blur="checkTestValues(scope.row,'blur',$event)" :disabled="scope.row.deviceId == null || (dataForm.id!=null&&(resultVal!=null && resultVal!=''))" v-model="scope.row.note" placeholder="妫�楠屾弿杩�"></el-input> + <el-input @blur="checkTestValues(scope.row,'blur',$event)" :disabled="scope.row.deviceId == null || (dataForm.id!=null&&(resultVal!=null && resultVal!=''))" v-model="scope.row.note" placeholder="妫�楠屾弿杩�" + :ref="`remark`+scope.$index" + :id="`remark`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `remark`)"></el-input> </div> </template> </el-table-column> @@ -494,6 +511,8 @@ // startTime: [{ required: true, message: '璇烽�夋嫨鎶ユ鏃ユ湡', trigger: 'blur' }] }, deviceList: [], + keyfield:['inspectProject','project','unit','standard','remark'], + keyfield0:['detectionValue0'] } }, beforeUpdate(){ @@ -517,6 +536,18 @@ this.unqualifiedNum = null } }, + empiricalValueAdd(newVal){ + if(newVal!=this.keyfield0.length){ + if(newVal>this.keyfield0.length){ + this.keyfield0 = [] + for(let i=0;i<newVal;i++){ + this.keyfield0.push('detectionValue'+i) + } + }else{ + this.keyfield0.splice(this.keyfield0.length-1,1); + } + } + } }, methods:{ querySearch(queryString, cb){ @@ -1034,7 +1065,121 @@ this.deviceList = res.data.data }) }, - }, + moveFocus(event, index, key) { + console.log(key, index,key) + let keyfield = this.insertArrayAt(this.keyfield,4,this.keyfield0); + // enter閿� + // if (event.keyCode === 13) { // 鍥炶溅 + // if (index === this.getLen() - 1 && key === keyfield[keyfield.length - 1]) { // 鏈�鍚庝竴琛屾渶鍚庝竴涓� + // console.log('鏈�鍚庝竴琛屾渶鍚庝竴涓棤娉曞洖杞�') + // return + // } + // this.$nextTick(() => { + // event.target.blur() + // }) + // if (key === keyfield[keyfield.length - 1]) { // 褰撳墠琛屾渶鍚庝竴涓�,璺宠浆涓嬩竴琛岀涓�涓� + + // } else { // 璺宠浆涓嬩竴涓� + // const nextkeyindex = keyfield.findIndex(k => k === key) + 1 + // this.$nextTick(() => { + // document.getElementById(keyfield[nextkeyindex] + index).focus() + // }) + // } + // } + + // 鍚戜笂 =38 + if (event.keyCode === 38) { + console.log('鍚戜笂') + if (index === 0) { // 绗竴琛� + console.log('绗竴琛屾棤娉曞悜涓�') + return + } + document.getElementById(key + index).blur() + let i = 0; + while (true){ + let dom = document.getElementById(key + (index - 1-i)) + if(dom){ + dom.focus() + return + }else if((index-1-i)==0){ + return + } + i++ + } + } + + // 涓� = 40 + if (event.keyCode === 40) { + console.log('鍚戜笅') + if (index === this.getLen() - 1) { // 鏈�鍚庝竴琛� + console.log('鏈�鍚庝竴琛屾棤娉曞悜涓�') + return + } + document.getElementById(key + index).blur() + this.$nextTick(() => { + let i = 0; + while (true){ + let dom = document.getElementById(key + (index + 1+i)) + console.log(dom,key + (index + 1+i)) + if(dom){ + dom.focus() + return + }else if((index+1+i)==this.getLen() - 1){ + return + } + i++ + } + }) + } + + // 宸� = 37 + if (event.keyCode === 37) { + console.log('鍚戝乏') + if (index === 0 && key === keyfield[0]) { // 绗竴琛岀涓�涓� + console.log('绗竴琛岀涓�涓棤娉曞悜宸�') + return + } + document.getElementById(key + index).blur() + const prevkeyindex = keyfield.findIndex(k => k === key) - 1 + this.$nextTick(() => { + let dom = document.getElementById(keyfield[prevkeyindex] + index) + if(dom){ + dom.focus() + } + }) + } + + // 鍙� = 39 + if (event.keyCode === 39) { + console.log('鍚戝彸') + if (index === this.getLen() - 1 && key === keyfield[keyfield.length - 1]) { // 鏈�鍚庝竴琛屾渶鍚庝竴涓� + console.log('鏈�鍚庝竴琛屾渶鍚庝竴涓棤娉曞悜鍙�') + return + } + document.getElementById(key + index).blur() + const nextkeyindex = keyfield.findIndex(k => k === key) + 1 + this.$nextTick(() => { + let dom = document.getElementById(keyfield[nextkeyindex] + index) + if(dom){ + dom.focus() + } + }) + } + }, + insertArrayAt(arr1, index, arr2) { + return arr1.slice(0, index).concat(arr2, arr1.slice(index)); + }, + getLen(){ + let arr = [] + this.list.forEach(item => { + arr.push(item) + item.children.forEach(child => { + arr.push(child) + }) + }) + return arr.length + } + } } </script> diff --git a/vue.config.js b/vue.config.js index d768c80..6296cca 100644 --- a/vue.config.js +++ b/vue.config.js @@ -1,11 +1,4 @@ -/*** - * @Author licp lichunping@guanfang.com.cn - * @Date 2024-05-13 10:35:46 - * @LastEditors licp lichunping@guanfang.com.cn - * @LastEditTime 2024-05-21 14:44:16 - * @FilePath \mes-ocea-before\vue.config.js - * @Description 杩欐槸榛樿璁剧疆,璇疯缃甡customMade`, 鎵撳紑koroFileHeader鏌ョ湅閰嶇疆 杩涜璁剧疆: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE - */ + /** * 閰嶇疆鍙傝��: * https://cli.vuejs.org/zh/config/ -- Gitblit v1.9.3