完成原材料、产品检验、过程检，包装检键盘切换输入框

licp

2024-05-22 ef4e46f182aee6253805e66286dee847c573cbde

 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>
@@ -285,6 +290,54 @@
                        </el-table-column>
                        </el-table>
                </el-tab-pane>
                <el-tab-pane label="附件">
                    <el-table :data="configFileTableData" height="400px">
                        <el-table-column
                        prop="orderNumber"
                        align="center"
                        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 fixed="right" align="center" label="操作">
                        <template slot-scope="scope">
                            <el-button
                            @click="downloadProcessConfigFiles(scope.row)"
                            type="text"
                            size="small"
                            >下载</el-button
                            >
                        </template>
                        </el-table-column>
                    </el-table>
                </el-tab-pane>
            </el-tabs>

        </div>
@@ -351,12 +404,15 @@
 import { getIfsLocationByGroupCopyAll } from '@/api/warehouse/location'
 import qrCodeApp from '@/views/common/qrCodeApp'
 import { getStore } from '@/util/store'
 import { getProcessConfigFile } from '@/api/plan/manufacturingorder'
 import * as customerorder from '@/api/plan/customerorder'
export default {
    components:{
        qrCodeApp
    },
    data() {
        return {
            dataForm:null,
            progrecessFileLoading: false,
            processConfigFileTableData: [],
            headers: {
@@ -408,9 +464,24 @@
            },
            inspectionItems: [], // 新增检验项目表格
            inspectionResultForm: [],
            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(()=>{
@@ -431,6 +502,21 @@
        this.init()
    },
    methods: {
        getProcessConfigFile(){
            getProcessConfigFile({
            orderNumber: this.dataForm.orderNumber,
            lineNumber: this.dataForm.customerNo
            }).then((res)=>{
                this.configFileTableData = res.data.data
            })
        },
        downloadProcessConfigFiles(row){
            customerorder.downloadProcessConfigFile(
                row.fileName,
                row.bucketName,
                row.originalFileName
            )
        },
      saveTable(){
        let finishedInsProducts = [];
        if(this.inspectionItems.length>0){
@@ -553,22 +639,31 @@
                result: this.inspectionResultForm[0].result
            }
            if (pro > 0) {
                this.$prompt('请输入不合格数量', '不合格数量', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    inputPattern: /^\d+$/,
                    inputErrorMessage: '请输入正确数字格式'
                }).then(({ value }) => {
                    obj.number = value
                    updateFinishedInspectById(obj).then(res => {
                        if(res.data.data.indexOf("成功") > 0){
                            this.$message.success("上报成功");
                            this.checkTestState()
                        }else{
                            this.$message.warning(res.data.data)
                        }
                    });
                }).catch(() => {});
                obj.number = 1;
                updateFinishedInspectById(obj).then(res => {
                    if(res.data.data.indexOf("成功") > 0){
                        this.$message.success("上报成功");
                        this.checkTestState()
                    }else{
                        this.$message.warning(res.data.data)
                    }
                });
                // this.$prompt('请输入不合格数量', '不合格数量', {
                //     confirmButtonText: '确定',
                //     cancelButtonText: '取消',
                //     inputPattern: /^\d+$/,
                //     inputErrorMessage: '请输入正确数字格式'
                // }).then(({ value }) => {
                //     obj.number = value
                //     updateFinishedInspectById(obj).then(res => {
                //         if(res.data.data.indexOf("成功") > 0){
                //             this.$message.success("上报成功");
                //             this.checkTestState()
                //         }else{
                //             this.$message.warning(res.data.data)
                //         }
                //     });
                // }).catch(() => {});
            }else{
                updateFinishedInspectById(obj).then(res => {
                    if(res.data.data.indexOf("成功") > 0){
@@ -601,6 +696,7 @@
            if(id != null){
                queryById(id).then(res=>{
                    let result = res.data.data
                    this.dataForm = result
                    this.processInspectVo.finInsNo = result.finInsNo
                    this.processInspectVo.orderNumber = result.orderNumber
                    this.processInspectVo.mcode = result.materialCode
@@ -628,10 +724,14 @@
                                if(obj.inspectionValue){
                                    arr = obj.inspectionValue.split(",")
                                }
                                obj.empiricalValueAddss = arr
                                this.$set(obj,'empiricalValueAddss',arr)
                                // obj.empiricalValueAddss = arr
                                if(obj.note){
                                        snote=obj.inote
                                    }
                                    // obj.inote=obj.note
                                    this.$set(obj,'inote',obj.note)
                                }else{
                                    this.$set(obj,'inote',null)
                                }
                                if(arr.length > this.empiricalValueAdd){
                                    this.empiricalValueAdd = arr.length
                                }
@@ -661,6 +761,7 @@
                        userName: Array.from(new Set(userList)).join(","),
                        result: this.resultVal==null ? rVal : this.resultVal,
                    }]
                    this.getProcessConfigFile()
                }).catch(error=>{
                    console.error(error)
                })
@@ -795,7 +896,7 @@
                                arr.splice((arr.length-1),1)
                                let obj = {
                                    devideId: i.eId,
                                    fpid: row.iid,
                                    fpid: i.iid,
                                    inspectionValue: arr.join(","),
                                    note : i.inote
                                }
@@ -816,18 +917,132 @@
            } else {
                if (this.empiricalValueAddMaxNumber != this.empiricalValueAdd - 1) {
                    this.empiricalValueAdd = this.empiricalValueAdd - 1;
                    // this.changeRowResult()
                    this.saveTable()
                    this.changeRowResult()
                    this.inspectionItems.forEach(i => {
                        i.empiricalValueAddss.splice(this.empiricalValueAdd, 1);
                    });
                    this.saveTable()
                }
            }
        },
        // 添加检验值列
        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>