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 | 470 +++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 334 insertions(+), 136 deletions(-) diff --git a/src/views/quality/rawMaterial/rawMaterial-form.vue b/src/views/quality/rawMaterial/rawMaterial-form.vue index 53a8f6a..a9ed951 100644 --- a/src/views/quality/rawMaterial/rawMaterial-form.vue +++ b/src/views/quality/rawMaterial/rawMaterial-form.vue @@ -3,7 +3,7 @@ <div class="page-header"> <div class="header-left"> <a @click="$router.go(-1)"><i class="icon-btn-back"></i></a> - <h2 v-if="resultVal!=null && dataForm.id!=null">鏌ョ湅-鍘熸潗鏂欐楠�</h2> + <h2 v-if="(resultVal!=null && resultVal!='') && dataForm.id!=null">鏌ョ湅-鍘熸潗鏂欐楠�</h2> <h2 v-else>缂栬緫-鍘熸潗鏂欐楠�</h2> </div> <div class="btn-group header-right"> @@ -28,16 +28,16 @@ </el-col> <el-col :span="6"> <el-form-item label="闆朵欢鍙�" prop="code"> - <el-input v-model="dataForm.code"> + <el-input v-model="dataForm.code" :disabled="dataForm&&dataForm.id!==null&&dataForm.id!==''"> <el-button slot="append" icon="el-icon-search" - :disabled="resultVal!=null" + :disabled="dataForm&&dataForm.id!==null&&dataForm.id!==''" @click="queryCode"></el-button> <el-button slot="append" icon="el-icon-full-screen" - :disabled="resultVal!=null" + :disabled="dataForm&&dataForm.id!==null&&dataForm.id!==''" @click="Turnonthecamera"></el-button> </el-input> </el-form-item> @@ -86,28 +86,40 @@ </el-col> <el-col :span="6"> <el-form-item label="鏁伴噺" prop="number"> - <el-input v-model="dataForm.number" :disabled="resultVal!=null" /> + <el-input v-model="dataForm.number" :disabled="dataForm&&dataForm.id!==null&&dataForm.id!==''" /> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="6"> - <el-form-item prop="projectName" label="椤圭洰鍚嶇О" v-if="dataForm.id!=null"> + <el-form-item label="鎶ユ鏃ユ湡" prop="startTime"> + <el-date-picker + disabled + v-model="dataForm.startTime" + type="datetime" + format="yyyy-MM-dd HH:mm:ss" + value-format="yyyy-MM-dd HH:mm:ss" + placeholder="鎶ユ鏃ユ湡"> + </el-date-picker> + </el-form-item> + </el-col> + <el-col :span="6" v-if="dataForm.id!=null"> + <el-form-item label="鎶ユ浜�" prop="createUser" > + <el-input v-model="dataForm.createUser" disabled /> + </el-form-item> + </el-col> + <el-col :span="6" v-if="dataForm.id!=null"> + <el-form-item prop="projectName" label="椤圭洰鍚嶇О" > <el-tooltip :disabled="dataForm.projectName==null" :content="dataForm.projectName"> <el-input v-model="dataForm.projectName" disabled ></el-input> </el-tooltip> </el-form-item> </el-col> <el-col :span="6"> - <el-form-item label="鎶ユ鏃ユ湡" prop="createTime" v-if="dataForm.id!=null"> - <el-input v-model="dataForm.createTime" disabled /> - </el-form-item> - </el-col> - <el-col :span="6"> - <el-form-item label="鎶ユ浜�" prop="createUser" v-if="dataForm.id!=null"> - <el-input v-model="dataForm.createUser" disabled /> - </el-form-item> - </el-col> + <el-form-item label="澶囨敞" prop="remark"> + <el-input :disabled="dataForm&&dataForm.id!==null&&dataForm.id!==''" v-model="dataForm.remark" /> + </el-form-item> + </el-col> </el-row> </el-form> </div> @@ -117,6 +129,9 @@ <el-row style="width:100%;z-index: 10;height:50px;" v-if="resultVal==null"> <el-col :span="12"></el-col> <el-col :span="12" style="text-align: right;"> + <el-button v-if="dataForm.id&&resultVal==null" size="small" + type="primary" + @click="saveTable()">淇濆瓨</el-button> <el-button v-if="dataForm.id==null" size="small" @click="clickAddLine()">娣诲姞妫�楠岄」鐩�</el-button> <el-button class="pad-addcol-btn" v-if="resultVal==null || dataForm.id==null" size="small" @click="addTeatValueColumn()">娣诲姞妫�娴嬪�煎垪</el-button> <el-button v-if="resultVal==null || dataForm.id==null" size="small" @click="delTeatValueColumn()">鍒犻櫎妫�娴嬪�煎垪</el-button> @@ -142,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" 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" v-model="scope.row.name" - placeholder="璇疯緭鍏ラ」鐩悕绉�"></el-input> + <el-input class="inline-input" :disabled="dataForm.id!=null&&(resultVal!=null && resultVal!='')" v-model="scope.row.name" + 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" 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> @@ -164,39 +188,36 @@ <el-table-column prop="required" label="鏍囧噯鍊�" width="160"> <template slot-scope="scope"> <div v-if="!scope.row.children"> - <el-input :disabled="dataForm.id != null" v-model="scope.row.required" - placeholder="璇疯緭鍏ユ爣鍑嗗��"></el-input> + <el-input :disabled="dataForm.id!=null&&(resultVal!=null && resultVal!='')" v-model="scope.row.required" + placeholder="璇疯緭鍏ユ爣鍑嗗��" + :ref="'standard'+scope.$index" + :id="'standard'+scope.$index" + @keyup.native="moveFocus($event, scope.$index, 'standard')"></el-input> </div> </template> </el-table-column> <el-table-column prop="testValue" label="妫�娴嬪��" min-width="160" v-for="(item,index) in empiricalValueAdd" :key="index"> <template slot-scope="scope"> <div v-if="!scope.row.children"> - <el-tooltip :disabled="scope.row.deviceId != null" class="item" effect="dark" content="璇峰厛閫夋嫨璁惧锛�" placement="top-start"> - <!-- <el-autocomplete clearable - :disabled="scope.row.deviceId == null || (dataForm.id!=null&&resultVal!=null)" - @blur="changeState(scope.row,scope.$index)" - v-model="scope.row.testValueList[index]" - :fetch-suggestions="querySearch" - placeholder="璇疯緭鍏ユ垨閫夋嫨妫�娴嬪��" > - <i style="line-height: normal;padding: 10px 7px;" class="el-icon-arrow-down" slot="suffix"></i> - <template slot-scope="{ item }"> - <div>{{ item.value }}</div> - </template> - </el-autocomplete> --> - - <el-select style="width:100%" filterable - :disabled="scope.row.deviceId == null || (dataForm.id!=null&&resultVal!=null)" - v-model="scope.row.testValueList[index]" - placeholder="璇疯緭鍏ユ垨閫夋嫨妫�娴嬪��" - allow-create - default-first-option - @change="changeState(scope.row,scope.$index)" - @blur="selectBlur" - > - <el-option label="鏄�" value="鏄�"/> - <el-option label="鍚�" value="鍚�"/> - </el-select> + <!-- :disabled="scope.row.deviceId == null || (dataForm.id!=null&&(resultVal!=null && resultVal!=''))" --> + <!-- @input="$nextTick(()=>{checkTestValues(scope.row)})" --> + <!-- @blur.capture.native="changeState(scope.row)" --> + <el-tooltip :disabled="scope.row.deviceId != null" class="item" effect="dark" content="璇峰厛閫夋嫨璁惧锛�" placement="top-start"> + <el-autocomplete clearable + cache="false" + ref="testValueInput" + @blur="checkTestValues(scope.row,'blur',$event)" + @select="checkTestValues(scope.row,'select',$event)" + :disabled="scope.row.deviceId == null || (dataForm.id!=null&&(resultVal!=null && resultVal!=''))" + v-model="scope.row.testValueList[index]" + :fetch-suggestions="querySearch" + placeholder="璇疯緭鍏ユ垨閫夋嫨妫�娴嬪��" + :id="`detectionValue${index}`+scope.$index" + @keyup.native="moveFocus($event, scope.$index, `detectionValue${index}`)"> + <template slot-scope="{ item }"> + <div>{{ item.value }}</div> + </template> + </el-autocomplete> </el-tooltip> </div> </template> @@ -204,7 +225,7 @@ <el-table-column prop="deviceName" label="璇曢獙璁惧" min-width="200"> <template slot-scope="scope"> <div v-if="!scope.row.children"> - <el-select ref="" :disabled="dataForm!=null && resultVal!=null" style="width:60%" + <el-select ref="" :disabled="dataForm!=null && (resultVal!=null && resultVal!='')" style="width:60%" v-model="scope.row.deviceId" filterable @change="updateDevice(scope.row,scope.$index)"> <el-option v-for="(item,index) in deviceList" :key="index" :value="item.id" :label="item.code +'-'+ item.name"></el-option> @@ -213,7 +234,7 @@ size="small" slot="append" icon="el-icon-full-screen" - :disabled="dataForm!=null && resultVal!=null" + :disabled="dataForm!=null && (resultVal!=null && resultVal!='')" @click="codeDevice(scope.row,scope.$index)"></el-button> </div> </template> @@ -221,7 +242,10 @@ <el-table-column prop="note" label="妫�楠屾弿杩�" width="160" > <template slot-scope="scope"> <div v-if="!scope.row.children"> - <el-input @blur="changeState(scope.row, scope.$index)" :disabled="scope.row.deviceId == null || (dataForm.id!=null&&resultVal!=null)" 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> @@ -256,10 +280,10 @@ element-loading-text="璇风◢绛夛紝鏂囦欢涓婁紶涓�" > <el-upload - :disabled="dataForm.rawInsNo==null || resultVal!=null" + :disabled="dataForm.rawInsNo==null || (resultVal!=null && resultVal!='')" drag ref="upload" - action="/mes/rawInsProduct/upload" + action="/mes/attachment/upload" :auto-upload="true" :headers="headers" :before-upload="submitUpload" @@ -274,7 +298,6 @@ </div> </el-upload> </div> - <el-table :data="processConfigFileTableData" height="260px"> <el-table-column prop="rawInsNo" @@ -311,7 +334,7 @@ @click="delProcessConfigFile(scope.row)" type="text" size="small" - :disabled="resultVal!=null" + :disabled="(resultVal!=null && resultVal!='')" >鍒犻櫎</el-button > <el-button @@ -340,13 +363,13 @@ <el-table-column prop="userName" label="妫�楠屽憳"></el-table-column> <el-table-column prop="judgeState" label="妫�楠岀粨璁�"> <template slot-scope="scope"> - <el-tag type="success" v-if="scope.row.testState == '1'">鍚堟牸</el-tag> - <el-tag type="danger" v-else-if="scope.row.testState == '0'">涓嶅悎鏍�</el-tag> + <el-tag type="success" v-if="scope.row.testState == 1">鍚堟牸</el-tag> + <el-tag type="danger" v-else-if="scope.row.testState == 0">涓嶅悎鏍�</el-tag> </template> </el-table-column> <el-table-column label="鎿嶄綔"> <template> - <el-button type="text" :disabled="resultVal!=null && dataForm.id!=null" @click="showDialog()" size="small">涓婃姤</el-button> + <el-button type="text" :disabled="(resultVal!=null && resultVal!='') && dataForm.id!=null" @click="showDialog()" size="small">涓婃姤</el-button> </template> </el-table-column> </el-table> @@ -404,18 +427,20 @@ getObj, updateRawInsProduct, updateRawInspectsById, - getProcessConfigFiles, - downloadProcessConfigFile, - deleteProcessConfigFile, + updateRawInsProduct2, updateDeviceById, chooseIFS} from '@/api/quality/rawMaterial' + import { + getProcessConfigFiles, + deleteProcessConfigFile, + downloadProcessConfigFile + } from '@/api/quality/attachment' import rawMaterialPartDialog from '@/views/common/rawMaterial-part' import { getStore } from '@/util/store' import qrCodeApp from '@/views/common/qrCodeApp' - import transformImage from '@/util/fileTransform' export default { components:{ rawMaterialPartDialog, - qrCodeApp + qrCodeApp, }, computed:{}, data(){ @@ -427,8 +452,9 @@ Authorization: 'Bearer ' + getStore({ name: 'access_token' }) }, paramData: { - rawInsNo: '', - lineNumber: '' + no: '', + lineNumber: '', + type: 0 }, row: null, proIndex: 0, @@ -460,6 +486,7 @@ unit: '', number: '', supplier: '', + remark:'', rawInsProducts: [{ deviceId: 0, father:'', @@ -480,9 +507,12 @@ testState: '' }], dataRule: { - code:[{ required: true, message: '璇锋壂鎻忛�夋嫨闆朵欢', trigger: 'blur' }] + code:[{ required: true, message: '璇锋壂鎻忛�夋嫨闆朵欢', trigger: 'blur' }], + // startTime: [{ required: true, message: '璇烽�夋嫨鎶ユ鏃ユ湡', trigger: 'blur' }] }, deviceList: [], + keyfield:['inspectProject','project','unit','standard','remark'], + keyfield0:['detectionValue0'] } }, beforeUpdate(){ @@ -492,7 +522,7 @@ }, created(){ this.dataForm.id = this.$route.query.id - this.resultVal = this.$route.query.resultVal + this.resultVal = this.$route.params.resultVal if(this.resultVal == null){ let val = sessionStorage.getItem("raw-resultVal-"+this.dataForm.id) val == undefined ? null : this.resultVal=val @@ -506,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){ @@ -523,8 +565,9 @@ }, getConfigFiles() { const param = { - rawInsNo: this.dataForm.rawInsNo, - lineNumber: this.dataForm.id + no: this.dataForm.rawInsNo, + lineNumber: this.dataForm.id, + type: 0 } getProcessConfigFiles(param).then((res) => { this.processConfigFileTableData = res.data.data @@ -550,7 +593,7 @@ }) }, submitUpload() { - this.paramData.rawInsNo = this.dataForm.rawInsNo + this.paramData.no = this.dataForm.rawInsNo this.paramData.lineNumber = this.dataForm.id this.progrecessFileLoading = true }, @@ -618,6 +661,7 @@ this.dataForm.code = param.code this.dataForm.name = param.name this.dataForm.formTime = param.formTime + this.dataForm.startTime = param.formTime this.dataForm.unit = param.unit this.dataForm.specs = param.specs this.dataForm.supplier = param.supplier @@ -697,7 +741,9 @@ }); }, addTeatValueColumn(){ - this.empiricalValueAdd = this.empiricalValueAdd + 1; + this.$nextTick(()=>{ + this.empiricalValueAdd = this.empiricalValueAdd + 1; + }) }, // 娣诲姞琛� clickAddLine(row,index) { @@ -743,7 +789,7 @@ required: null, rpId: null, name: null, - unit: 'mm', + unit: '', userName: null, testValue: '', testValueList: [], @@ -758,32 +804,35 @@ if(this.list){ this.list.forEach(e=>{ if(e.children){ - e.children.forEach(i=>{ + e.children.map(i=>{ if(i.testValueList.length>1){ - let arr = i.testValue.split(",") - arr.splice((arr.length-1),1) - let obj = { - deviceId: i.deviceId, - rpId: i.rpId, - testValue: arr.join(","), - note: i.note - } - updateRawInsProduct(obj).then(res=>{ - if(res.data.code === 0){ - this.init(this.dataForm.id) - } - }) + i.testValueList = i.testValueList.splice(i.testValueList.length-1,1) + return i + // let arr = i.testValue.split(",") + // arr.splice((arr.length-1),1) + // let obj = { + // deviceId: i.deviceId, + // rpId: i.rpId, + // testValue: arr.join(","), + // note: i.note + // } + // updateRawInsProduct(obj).then(res=>{ + // if(res.data.code === 0){ + // this.init(this.dataForm.id) + // } + // }) } }) } }) + this.saveTable() } }, delTeatValueColumn(){ if (this.empiricalValueAdd - 1 > 0) { if (this.empiricalValueAddMaxNumber != this.empiricalValueAdd - 1) { this.empiricalValueAdd = this.empiricalValueAdd - 1; - this.changeRowResult() + // this.changeRowResult() this.list.forEach(i => { if(i.children){ i.children.forEach(ele=>{ @@ -791,6 +840,7 @@ }) } }); + this.saveTable() } } }, @@ -801,6 +851,8 @@ this.dataForm.rawInsNo = data.rawInsNo this.dataForm.name = data.name this.dataForm.formTime = data.formTime + this.dataForm.startTime = data.startTime + this.dataForm.remark = data.remark this.dataForm.code = data.code this.dataForm.specs = data.specs this.dataForm.unit = data.runit @@ -886,43 +938,63 @@ console.log(e,e.target.tabIndex); console.log(e.target.value); }, - changeState(row, index) { - this.$nextTick(()=>{ - if(row){ - let isTrue = true - for(var i=0;i<row.testValueList.length;i++){ - let val = row.testValueList[i] - let reg = /(^-?[0-9]{1,6}$)|(^-?[0-9]{1,6}[\.]{1}[0-9]{1,3}$)/ - if(!reg.test(val) && !['鏄�','鍚�'].includes(val)){ - row.testValueList[i] = null - this.$message.error("璇疯緭鍏ユ暟瀛楁垨閫夋嫨鏄惁") + checkTestValues(row,currentOption,event){ + if(row){ + let isTrue = true + if(currentOption==='blur'){ + let targetVal = event.target.value + if( (targetVal && ['鏄�','鍚�'].includes(targetVal)) || !targetVal){ isTrue = false - } - } - if(!isTrue){ - return - } + }else{ + for(var i=0;i<row.testValueList.length;i++){ + let val = row.testValueList[i] + if(val != '' && val != null){ + if(!['鏄�','鍚�'].includes(val)){ + let reg = /(^-?[0-9]{1,6}$)|(^-?[0-9]{1,6}[\.]{1}[0-9]{1,3}$)/ + if(!reg.test(val)){ + row.testValueList[i] = '' + event.target.value = '' + this.$message.error("璇疯緭鍏�6浣嶆暟瀛楁垨閫夋嫨鏄惁") + isTrue = false + } + } + } + } + } + } + if(!isTrue){ + return + } + // this.changeState(row) } - if (row.rpId != null && row.rpId != '') { - let val = row.testValueList.join(",") - if (val === undefined || val === '' || val === null) { - return - } - let obj = { - deviceId: row.deviceId, - rpId: row.rpId, - testValue: val, - note: row.note - } - updateRawInsProduct(obj).then(res => { - if (res.data.code == 0) { - this.$message.success("鏇存柊鎴愬姛") - } else { - this.$message.error("鏇存柊澶辫触") + }, + saveTable() { + let rawInsProducts = []; + this.$nextTick(()=>{ + this.list.forEach(item=>{ + if(item.children){ + item.children.forEach(ele=>{ + let obj = JSON.parse(JSON.stringify(ele)) + obj.testValue = obj.testValueList.join(",") + obj.id = obj.rpId + delete obj.testValueList; + obj.name = ele.name; + obj.father = item.father; + obj.unit = ele.unit; + rawInsProducts.push(obj) + }) } - this.init(this.dataForm.id) }) - } + if(rawInsProducts.length>0){ + updateRawInsProduct2(rawInsProducts).then(res => { + if (res.data.code == 0) { + this.$message.success("鏇存柊鎴愬姛") + } else { + this.$message.error("鏇存柊澶辫触") + } + this.init(this.dataForm.id) + }) + } }) }, // 鍒犻櫎瀛愰」鐩� @@ -955,7 +1027,7 @@ required: null, rpId: null, name: null, - unit: 'mm', + unit: '', userName: null, testValue: null, testValueList: [], @@ -965,22 +1037,27 @@ row.children.push(obj) }, save(){ - const _than = this - let data = this.dataForm - this.list.forEach(item=>{ - item.children.forEach(c=>{ - c.testValue=c.testValueList.join(",") - }) - }) - data.rawInsProducts = this.list - addRawInspects(data).then(res=>{ - this.$message.success("淇濆瓨鎴愬姛") - // this.$router.go(-1) - }).catch(error=>{ - this.$message.error(error) - }) - _than.$nextTick(()=>{ - _than.init(Number(res.data.msg)) + this.$refs.dataForm.validate(valid=>{ + if(valid){ + const _than = this + let data = this.dataForm + this.list.forEach(item=>{ + item.children.forEach(c=>{ + c.testValue=c.testValueList.join(",") + c.required = c.required.replace(',','锛�').replace('(','锛�').replace(')','锛�') + }) + }) + data.rawInsProducts = this.list + addRawInspects(data).then(res=>{ + this.$message.success("淇濆瓨鎴愬姛") + this.$router.go(-1) + }).catch(error=>{ + this.$message.error(error) + }) + _than.$nextTick(()=>{ + _than.init(Number(res.data.msg)) + }) + } }) }, getDeviceList(){ @@ -988,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> @@ -1192,6 +1383,13 @@ border: 1px solid #e4e7ed; border-bottom: none; } +.dropdown{ + position: relative; + right: 30px; + top: 5px; + color: #C0C4CC; + font-size: 14px; +} @media (max-width: 767px) { .pad-addcol-btn{ font-size:12px; -- Gitblit v1.9.3