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/packageinspect/packageInspect-form.vue | 617 +++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 495 insertions(+), 122 deletions(-)
diff --git a/src/views/quality/packageinspect/packageInspect-form.vue b/src/views/quality/packageinspect/packageInspect-form.vue
index 3bada7a..020ed5e 100644
--- a/src/views/quality/packageinspect/packageInspect-form.vue
+++ b/src/views/quality/packageinspect/packageInspect-form.vue
@@ -62,74 +62,171 @@
</el-row>
</el-form>
</div>
- <div class="packageInspect-detail">
- <el-row :gutter="10" style="width:100%;z-index: 10;height:50px;">
- <el-col :span="20">妫�楠岄」鐩�</el-col>
- <el-col :span="2">
- <el-button v-if="resultVal=='' || resultVal==null" style="width:100%" size="small" @click="clickAddLine()">娣诲姞妫�楠岄」鐩�</el-button>
- </el-col>
- <el-col :span="2">
- <el-button v-if="resultVal=='' || resultVal==null" style="width:100%" type="primary" size="small"
- @click="savePackIns()">淇濆瓨</el-button>
- </el-col>
- </el-row>
- <el-row style="width:100%;">
- <el-col :span="24">
- <el-table
- :header-cell-style="{textAlign:'center',color:'black',backgroundColor:'#fafafa'}"
- :cell-style="{textAlign:'center'}"
- ref="table"
- :data="list"
- border
- style="width: 100%;"
- height="400"
- row-key="randomId" class="l-mes"
- default-expand-all
- :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
- <el-table-column type="index" label="搴忓彿" width="60">
- </el-table-column>
- <el-table-column prop="name" label="椤圭洰" width="260">
- <template slot-scope="scope">
- <el-input :readonly="resultVal!=null" v-if="scope.row.children" class="inline-input" style="width:90%;" v-model="scope.row.name"
- placeholder="璇疯緭鍏ラ」鐩悕绉�"></el-input>
- </template>
- </el-table-column>
- <el-table-column prop="required" label="瑕佹眰" width="260">
- <template slot-scope="scope">
- <div v-if="!scope.row.children">
- <el-input :readonly="resultVal!=null" v-model="scope.row.required"
- placeholder="璇疯緭鍏ヨ姹�"></el-input>
- </div>
- </template>
- </el-table-column>
- <el-table-column prop="note" label="妫�楠屾弿杩�" width="260" >
- <template slot-scope="scope">
- <div v-if="!scope.row.children">
- <el-input :readonly="resultVal!=null" v-model="scope.row.note" placeholder="妫�楠屾弿杩�"></el-input>
- </div>
- </template>
- </el-table-column>
- <el-table-column prop="testState" label="缁撹" min-width="150">
- <template slot-scope="scope">
- <el-select style="width:100%" :disabled="resultVal!=null" @change="changeResult" v-model="scope.row.result" v-if="!scope.row.children">
- <el-option label="鍚堟牸" value="鍚堟牸"></el-option>
- <el-option label="涓嶅悎鏍�" value="涓嶅悎鏍�"></el-option>
- </el-select>
- </template>
- </el-table-column>
- <el-table-column v-if="resultVal=='' || resultVal==null" fixed="right" style="background-color: white;" label="鎿嶄綔" width="200">
- <template slot-scope="scope">
- <el-button v-if="scope.row.children" icon="el-icon-circle-plus-outline" type="text" @click="clickAddChildren(scope.row,scope.$index)">娣诲姞琛�</el-button>
- <el-button v-if="!scope.row.children" icon="el-icon-circle-close" type="text"
- @click="clickDelLine(scope.row,scope.$index,scope.row.children!=null)">鍙栨秷</el-button>
- <el-button v-if="scope.row.children" icon="el-icon-circle-close" type="text"
- @click="clickDelLine(scope.row,scope.$index,scope.row.children!=null)">鍒犻櫎椤圭洰</el-button>
+ <div>
+ <el-tabs class="packageInspect-detail" @tab-click="tabsClick">
+ <el-tab-pane label="妫�楠岄」鐩�">
+ <el-row>
+ <el-col :span="24" style="text-align: right;">
+ <el-dropdown @command="handleCommand" v-if="isShow && (resultVal==null || resultVal=='')">
+ <el-button size="mini" style="margin-right: 10px;" type="primary" >
+ 鍒囨崲妫�楠岄」妯℃澘<i class="el-icon-arrow-down el-icon--right"></i>
+ </el-button>
+ <el-dropdown-menu slot="dropdown">
+ <el-dropdown-item :key="index" v-for="(item,index) in inspectMoulds" :command="item.father">{{item.father}}</el-dropdown-item>
+ </el-dropdown-menu>
+ </el-dropdown>
+ <el-button v-if="resultVal=='' || resultVal==null" size="mini" @click="clickAddLine()">娣诲姞妫�楠岄」鐩�</el-button>
+ <el-button v-if="resultVal=='' || resultVal==null" type="primary" size="mini"
+ @click="savePackIns()">淇濆瓨</el-button>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="24">
+ <el-table
+ :header-cell-style="{textAlign:'center',color:'black',backgroundColor:'#fafafa'}"
+ :cell-style="{textAlign:'center'}"
+ ref="table"
+ :data="list"
+ border
+ style="width: 100%;"
+ height="400"
+ row-key="randomId" class="l-mes"
+ default-expand-all
+ :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
+ <el-table-column type="index" prop="parentIndex" label="搴忓彿" width="60">
+ <template scope="scope">
+ <span v-if="scope.row.isIndex">{{scope.row.parentIndex}}</span>
+ </template>
+ </el-table-column>
+ <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="璇疯緭鍏ラ」鐩悕绉�"
+ :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">
+ <template slot-scope="scope">
+ <div v-if="!scope.row.children">
+ <el-tooltip :content="scope.row.required">
+ <el-input :readonly="resultVal!=null || !scope.row.isEdit"
+ v-model="scope.row.required"
+ placeholder="璇疯緭鍏ヨ姹�"
+ :id="'standard'+scope.$index"
+ @keyup.native="moveFocus($event, scope.$index, 'standard')"></el-input>
+ </el-tooltip>
+ </div>
+ </template>
+ </el-table-column>
+ <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="妫�楠屾弿杩�"
+ :id="`remark`+scope.$index"
+ @keyup.native="moveFocus($event, scope.$index, `remark`)"></el-input>
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="testState" label="缁撹" min-width="150">
+ <template slot-scope="scope">
+ <el-select style="width:100%" :disabled="resultVal!=null" @change="changeResult" v-model="scope.row.result" v-if="!scope.row.children">
+ <el-option label="鍚堟牸" value="鍚堟牸"></el-option>
+ <el-option label="涓嶅悎鏍�" value="涓嶅悎鏍�"></el-option>
+ <el-option label="涓嶉�傜敤" value="涓嶉�傜敤"></el-option>
+ </el-select>
+ </template>
+ </el-table-column>
+ <el-table-column v-if="resultVal=='' || resultVal==null" fixed="right" style="background-color: white;" label="鎿嶄綔" width="200">
+ <template slot-scope="scope">
+ <el-button v-if="scope.row.children && scope.row.isEdit" icon="el-icon-circle-plus-outline" type="text" @click="clickAddChildren(scope.row,scope.$index)">娣诲姞琛�</el-button>
+ <el-button v-if="!scope.row.children && scope.row.isEdit" icon="el-icon-circle-close" type="text"
+ @click="clickDelLine(scope.row,scope.$index,scope.row.children!=null)">鍙栨秷</el-button>
+ <el-button v-if="scope.row.children && scope.row.isEdit" icon="el-icon-circle-close" type="text"
+ @click="clickDelLine(scope.row,scope.$index,scope.row.children!=null)">鍒犻櫎椤圭洰</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </el-col>
+ </el-row>
+ </el-tab-pane>
+ <el-tab-pane label="闄勪欢涓婁紶" type="card">
+ <div style="display: flex;justify-content:flex-end;">
+ <div></div>
+ </div>
+ <div
+ v-loading="progrecessFileLoading"
+ element-loading-text="璇风◢绛夛紝鏂囦欢涓婁紶涓�"
+ >
+ <el-upload
+ drag
+ ref="upload"
+ action="/mes/attachment/upload"
+ :auto-upload="true"
+ :headers="headers"
+ :before-upload="submitUpload"
+ :on-success="uploadSuccess"
+ :data="paramData"
+ :with-credentials="true"
+ :show-file-list="false"
+ >
+ <i class="el-icon-upload"></i>
+ <div class="el-upload__text">
+ 灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em>
+ </div>
+ </el-upload>
+ </div>
+ <el-table :data="processConfigFileTableData" height="260px">
+ <el-table-column
+ prop="rawInsNo"
+ align="center"
+ width="120"
+ label="鍘熸潗鏂欐楠岀紪鍙�"
+ show-overflow-tooltip
+ ></el-table-column>
+ <el-table-column
+ prop="originalFileName"
+ align="center"
+ label="鍘熸枃浠跺悕"
+ width="200"
+ ></el-table-column>
+ <el-table-column prop="fileName" align="center" label="鏂囦欢鍚庣紑"></el-table-column>
+ <el-table-column prop="createUser" align="center" label="涓婁紶浜�"></el-table-column>
+ <el-table-column
+ prop="createTime"
+ align="center"
+ label="涓婁紶鏃堕棿"
+ show-overflow-tooltip
+ ></el-table-column>
+ <el-table-column prop="updateUser" align="center" label="鏇存柊浜�">
+ </el-table-column>
+ <el-table-column
+ prop="updateTime"
+ align="center"
+ label="鏇存柊鏃堕棿"
+ show-overflow-tooltip
+ ></el-table-column>
+ <el-table-column align="center" label="鎿嶄綔">
+ <template slot-scope="scope">
+ <el-button
+ @click="delProcessConfigFile(scope.row)"
+ type="text"
+ size="small"
+ :disabled="(resultVal!=null && resultVal!='')"
+ >鍒犻櫎</el-button
+ >
+ <el-button
+ @click="downloadProcessConfigFile(scope.row)"
+ type="text"
+ size="small"
+ >涓嬭浇</el-button
+ >
</template>
- </el-table-column>
+ </el-table-column>
</el-table>
- </el-col>
- </el-row>
+ </el-tab-pane>
+ </el-tabs>
</div>
<div class="packageInspect-result">
<el-row>
@@ -140,8 +237,8 @@
<el-table class="l-mes" border height="90" :data="conclusionTable" ref="conclusion" v-model="conclusion"
:header-cell-style="{textAlign:'center',color:'black',backgroundColor:'#fafafa'}"
:cell-style="{textAlign:'center'}">
- <el-table-column prop="packageNo" label="鍖呰缂栧彿"></el-table-column>
- <el-table-column prop="userName" label="妫�楠屽憳"></el-table-column>
+ <el-table-column prop="packageNo" label="鍖呰缂栧彿" width="200" show-overflow-tooltip></el-table-column>
+ <el-table-column prop="userName" label="妫�楠屽憳" width="200" show-overflow-tooltip></el-table-column>
<el-table-column prop="result" label="妫�楠岀粨璁�">
<template slot-scope="scope">
<el-select :disabled="resultVal!=null" style="width:100%" v-model="scope.row.result">
@@ -160,6 +257,20 @@
</el-row>
</div>
</div>
+ <el-dialog
+ title="鎻愮ず"
+ :visible.sync="dialogVisible"
+ width="30%">
+ <el-form :model="submitData" ref="form" label-width="100px" >
+ <el-form-item label="璇疯緭鍏ヨ鍙�" prop="lineNo" :rules="{required:true,message:'琛屽彿涓嶈兘涓虹┖',trigger:'blur'}">
+ <el-input v-model="submitData.lineNo" />
+ </el-form-item>
+ </el-form>
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="dialogVisible = false">鍙� 娑�</el-button>
+ <el-button type="primary" @click="confirmSubmit(submitData,false)">纭� 瀹�</el-button>
+ </span>
+ </el-dialog>
</div>
</template>
@@ -170,12 +281,38 @@
updatePackageInspectById,
getCustomer,
} from '@/api/quality/packageInspect'
+import {
+ getProcessConfigFiles,
+ deleteProcessConfigFile,
+ downloadProcessConfigFile
+ } from '@/api/quality/attachment'
+import {getAllTemplateByEnable} from '@/api/quality/packageInspectTemp'
+import { getStore } from '@/util/store'
export default {
- computed:{},
+ computed:{
+ },
components:{
},
data(){
return{
+ progrecessFileLoading: false,
+ processConfigFileTableData: [],
+ headers: {
+ Authorization: 'Bearer ' + getStore({ name: 'access_token' })
+ },
+ paramData: {
+ rawInsNo: '',
+ lineNumber: '',
+ type: 4
+ },
+ inspectMoulds: [],
+ isShow: true,
+ submitData: {
+ id:null,
+ result: null,
+ lineNo: null,
+ },
+ dialogVisible: false,
loading: false,
resultVal: null,
dataForm:{
@@ -204,6 +341,7 @@
result: ''
}],
dataRule: {},
+ keyfield:['project','standard','remark'],
}
},
beforeUpdate(){
@@ -220,26 +358,110 @@
this.resultVal=val
}
}
+ this.getAllInspect()
this.init()
+
},
watch:{
+ dialogVisible(newVal){
+ if(!newVal){
+ this.$refs.form.resetFields();
+ }
+ }
},
methods:{
+ delProcessConfigFile(row) {
+ this.$confirm('鏄惁鍒犻櫎璇ラ檮浠�', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning',
+ closeOnClickModal: false
+ }).then(function() {
+ return deleteProcessConfigFile(row.id)
+ }).then((data) => {
+ this.getConfigFiles()
+ })
+ },
+ getConfigFiles() {
+ const param = {
+ no: this.dataForm.packInsNo,
+ lineNumber: this.dataForm.id,
+ type: 4
+ }
+ getProcessConfigFiles(param).then((res) => {
+ this.processConfigFileTableData = res.data.data
+ })
+ },
+ downloadProcessConfigFile(row) {
+ downloadProcessConfigFile({
+ bucket: row.bucketName,
+ fileName: row.fileName,
+ originalFileName: row.originalFileName
+ })
+ },
+ submitUpload() {
+ this.paramData.no = this.dataForm.packInsNo
+ this.paramData.lineNumber = this.dataForm.id
+ this.progrecessFileLoading = true
+ },
+ uploadSuccess() {
+ this.progrecessFileLoading = false
+ this.getConfigFiles()
+ },
+ tabsClick(tab,even){
+ if(tab.index == 1){
+ this.getConfigFiles();
+ }
+ },
+ checkShowState(){
+ let num = 0
+ this.list.forEach(ele=>{
+ if(ele.children){
+ ele.children.forEach(c=>{
+ if(c.pid){
+ num+=1
+ }
+ })
+ }
+ })
+ this.isShow = num==0
+ },
+ getAllInspect(){
+ getAllTemplateByEnable().then(res=>{
+ if(res.status===200){
+ this.inspectMoulds = res.data.data
+ }
+ }).catch(error=>{
+ console.error(error)
+ })
+ },
+ handleCommand(command) {
+ this.inspectMoulds.forEach(ele=>{
+ if(ele.father==command){
+ this.init(ele.children)
+ }
+ })
+ },
changeResult(){
let result = ''
let data = this.list
+ let passNum = 0
+ let unPassNum = 0
if(data){
- result='鍚堟牸'
data.forEach(item=>{
if(item.children){
item.children.forEach(ele=>{
if(ele.result=='涓嶅悎鏍�'){
- result='涓嶅悎鏍�'
+ unPassNum+=1
+ }
+ if(ele.result=='鍚堟牸'){
+ passNum+=1
}
})
}
})
}
+ result = (passNum+unPassNum)>0 ? unPassNum>0 ? '涓嶅悎鏍�' :'鍚堟牸' : ''
this.conclusionTable[0].result = result
},
//涓婃姤
@@ -250,39 +472,40 @@
cancelButtonText: '鍙栨秷',
type: 'warning'
}).then(() => {
- this.checkCustomer(_than.dataForm.id)
- }).catch(() => {})
- },
- checkCustomer(id){
- const _than = this
- if(id){
- getCustomer(id).then(res=>{
+ _than.submitData.id = _than.dataForm.id,
+ _than.submitData.result = _than.conclusionTable[0].result,
+ getCustomer(_than.dataForm.id).then(res=>{
if(res.status===200){
- console.log(res.data);
+ _than.confirmSubmit(_than.submitData,true)
}
}).catch(error=>{
- this.$prompt('璇疯緭鍏ヨ鍙�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- inputPattern: /\S/,
- inputErrorMessage: '琛屽彿涓嶈兘涓虹┖'
- }).then(({ value }) => {
- let data = {
- id: _than.dataForm.id,
- result: _than.conclusionTable[0].result,
- lineNo: value
- }
- updatePackageInspectById(data).then(res => {
- if(res.data.code === 0){
- _than.resultVal = res.data.data
- sessionStorage.setItem("packIns-resultVal-"+_than.dataForm.id,res.data.data)
- _than.$message.success("涓婃姤鎴愬姛");
- }else{
- _than.$message.error("涓婃姤澶辫触",res.data.data);
- }
- })
- }).catch(() => {
- })
+ _than.dialogVisible = true
+ })
+
+ }).catch(() => {})
+ },
+ confirmSubmit(data,isOtc){
+ const _than = this
+ let isSubmit = false
+ if(isOtc){
+ isSubmit = true
+ }else{
+ _than.$refs.form.validate(valid=>{
+ if(valid){
+ isSubmit = true
+ _than.dialogVisible = false
+ }
+ })
+ }
+ if(isSubmit){
+ updatePackageInspectById(data).then(res => {
+ if(res.data.code === 0){
+ _than.resultVal = res.data.data
+ sessionStorage.setItem("packIns-resultVal-"+_than.dataForm.id,res.data.data)
+ _than.$message.success("涓婃姤鎴愬姛");
+ }else{
+ _than.$message.error("涓婃姤澶辫触",res.data.data);
+ }
})
}
},
@@ -290,13 +513,17 @@
clickAddLine() {
this.list.push({
name: '',
+ isIndex : true,
+ parentIndex : this.list.length + 1,
randomId: Math.random(),
+ isEdit: true,
children: [{
name: '',
note: '',
required: '',
result: '',
randomId: Math.random(),
+ isEdit: true,
}]
})
},
@@ -308,6 +535,7 @@
required: '',
result: '',
randomId: Math.random(),
+ isEdit: true,
})
},
// 鍒犻櫎琛�
@@ -326,6 +554,7 @@
})
this.list[i].children.splice(childrenIndex,1)
}
+ this.changeResult()
},
//淇濆瓨妫�鏌ラ」
savePackIns(){
@@ -352,6 +581,7 @@
updatePackageInsProduct(dataList).then(res=>{
if(res.status===200){
this.$message.success("淇濆瓨鎴愬姛")
+ this.init()
}
}).catch(error=>{
console.log(error);
@@ -359,22 +589,51 @@
})
}
},
- init(){
- if(this.dataForm.id){
- fetchListById(this.dataForm.id).then(res=>{
+ init(dataList){
+ const _than = this
+ if(_than.dataForm.id){
+ fetchListById(_than.dataForm.id).then(res=>{
let data = res.data.data
- this.dataForm.packInsNo = data.packInsNo
- this.dataForm.packageNo = data.packageNo
- this.dataForm.contractNo = data.contractNo
- this.dataForm.customerName = data.customerName
- this.dataForm.projectName = data.projectName
- this.dataForm.createTime = data.createTime
- this.dataForm.createUser = data.createUser
- this.list = []
+ _than.dataForm.packInsNo = data.packInsNo
+ _than.dataForm.packageNo = data.packageNo
+ _than.dataForm.contractNo = data.contractNo
+ _than.dataForm.customerName = data.customerName
+ _than.dataForm.projectName = data.projectName
+ _than.dataForm.createTime = data.createTime
+ _than.dataForm.createUser = data.createUser
+ _than.list = []
let userNameList = []
- data.packageInsProductS.forEach(item => {
+ if(dataList){
+ let tempList = []
+ dataList.forEach((ele,index)=>{
+ let obj = {
+ randomId: Math.random(),
+ name: ele.inspectName,
+ isIndex: true,
+ parentIndex: index+1,
+ children: []
+ }
+ if(ele.children){
+ ele.children.forEach(e=>{
+ obj.children.push({
+ required: e.inspectRequired,
+ randomId: Math.random(),
+ isEdit: false,
+ note: '',
+ result: ''
+ })
+ })
+ }
+ tempList.push(obj)
+ })
+ _than.list = tempList
+ }
+ data.packageInsProductS.forEach((item,index) => {
if (item.children) {
let ele = {
+ isIndex: true,
+ parentIndex: index+1,
+ isEdit: true,
randomId: Math.random(),
name: null,
children: []
@@ -387,6 +646,7 @@
let o = {
name: item.name,
randomId: Math.random(),
+ isEdit: true,
required: obj.required,
pid: obj.pid,
note: obj.note?obj.note:'',
@@ -394,26 +654,139 @@
}
ele.children.push(o)
})
- this.list.push(ele)
+ _than.list.push(ele)
}
})
- this.conclusionTable = [{
+
+ _than.conclusionTable = [{
packageNo: data.packageNo,
userName: Array.from(new Set(userNameList)).join(','),
result: null
}]
- this.$nextTick(()=>{
- if(this.list.length>0){
- this.changeResult()
+ _than.$nextTick(()=>{
+ if(_than.list.length>0){
+ _than.changeResult()
+ _than.checkShowState()
}
})
}).catch(error=>{
- this.$message.error("鑾峰彇澶辫触",error)
+ _than.$message.error("鑾峰彇澶辫触",error)
})
}else{
- this.conclusionTable = []
+ _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>
@@ -421,14 +794,14 @@
<style>
.packageInspect-detail {
width: 100%;
- height: 490px;
+ height: 520px;
padding: 10px 20px;
- display: flex;
border: 1px solid #ddd;
background-color: #fff;
margin-top: 10px;
box-sizing: border-box;
- flex-wrap: wrap;
+ /* display: flex;
+ flex-wrap: wrap; */
}
.packageInspect-result {
--
Gitblit v1.9.3