增加质检输入框上下左右移动

src/views/bpm/handleTask/components/purchaseOrder/invoice/procurementWarehousing.vue

@@ -687,26 +687,41 @@
               prop="measuringUnit"
             ></el-table-column>
             <el-table-column label="物料代号" prop="materielCode" width="130">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'materielCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'materielCode', '包装', row)
+                  "
                   v-model="row.materielCode"
                 ></el-input>
                 <span v-else>{{ row.materielCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="客户代号" prop="clientCode">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'clientCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'clientCode', '包装', row)
+                  "
                   v-model="row.clientCode"
                 ></el-input>
                 <span v-else> {{ row.clientCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="刻码" prop="engrave">
-              <template slot-scope="{ row }">
-                <el-input v-if="!row.isPack" v-model="row.engrave"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-if="!row.isPack"
+                  :ref="'engrave' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'engrave', '包装', row)
+                  "
+                  v-model="row.engrave"
+                ></el-input>
                 <span v-else>{{ row.engrave }}</span>
               </template>
             </el-table-column>
@@ -714,6 +729,10 @@
               <template slot-scope="{ row }">
                 <el-input
                   v-if="!row.isPack && row.measuringUnit != row.weightUtil"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '包装', row)
+                  "
                   v-model="row.weight"
                   @input="weightInput($event, row)"
                 ></el-input>
@@ -884,34 +903,53 @@
               prop="measuringUnit"
             ></el-table-column>
             <el-table-column label="物料代号" prop="materielCode" width="130">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
-                  v-model="row.materielCode"
                   v-if="!row.isPack"
+                  :ref="'materielCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'materielCode', '物料', row)
+                  "
+                  v-model="row.materielCode"
                 ></el-input>
                 <span v-else>{{ row.materielCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="客户代号" prop="clientCode">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.clientCode"
                   v-if="!row.isPack"
+                  :ref="'clientCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'clientCode', '物料', row)
+                  "
                 ></el-input>
                 <span v-else> {{ row.clientCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="刻码" prop="engrave">
-              <template slot-scope="{ row }">
-                <el-input v-model="row.engrave" v-if="!row.isPack"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-model="row.engrave"
+                  v-if="!row.isPack"
+                  :ref="'engrave' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'engrave', '物料', row)
+                  "
+                ></el-input>
                 <span v-else> {{ row.engrave }}</span>
               </template>
             </el-table-column>
             <el-table-column width="100" label="重量" prop="weight">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.weight"
                   v-if="!row.isPack && row.measuringUnit != row.weightUnit"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '物料', row)
+                  "
                 ></el-input>
                 <span v-else>{{ row.weight }}</span>
               </template>
@@ -1283,6 +1321,134 @@
         });
     },
     methods: {
+      // 键盘移动
+      moveFocus(event, index, key, type, row) {
+        let keyfield = [];
+        let listLength = 0;
+        switch (type) {
+          case '产品':
+            listLength = this.warehousingMaterialList.length;
+            keyfield = [
+              'manualBatchNo',
+              'minPackingCount',
+              'outInNum',
+              'univalence'
+            ];
+            break;
+          case '包装':
+            listLength = this.materialCodeReqList.length;
+            if (row.measuringUnit != row.weightUtil) {
+              keyfield = ['materielCode', 'clientCode', 'engrave', 'weight'];
+            } else {
+              keyfield = ['materielCode', 'clientCode', 'engrave'];
+            }
+            break;
+          case '物料':
+            listLength = this.resultArray.length;
+            if (row.measuringUnit != row.weightUnit) {
+              keyfield = ['materielCode', 'clientCode', 'engrave', 'weight'];
+            } else {
+              keyfield = ['materielCode', 'clientCode', 'engrave'];
+            }
+            break;
+        }
+
+        if (event.keyCode === 13) {
+          // 回车
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            return;
+          }
+
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 向上 =38
+        if (event.keyCode === 38) {
+          console.log('向上');
+          if (index === 0) {
+            // 第一行
+            console.log('第一行无法向上');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index - 1)].focus();
+          });
+        }
+
+        // 下 = 40
+        if (event.keyCode === 40) {
+          console.log('向下');
+          if (index === listLength - 1) {
+            // 最后一行
+            console.log('最后一行无法向下');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index + 1)].focus();
+          });
+        }
+
+        // 左 = 37
+        if (event.keyCode === 37) {
+          console.log('向左');
+          if (index === 0 && key === keyfield[0]) {
+            // 第一行第一个
+            console.log('第一行第一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[0]) {
+            // 当前行第一个,跳转上一行最后一个
+            this.$refs[keyfield[keyfield.length - 1] + (index - 1)].focus();
+          } else {
+            // 跳转上一个
+            const prevkeyindex = keyfield.findIndex((k) => k === key) - 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[prevkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 右 = 39
+        if (event.keyCode === 39) {
+          console.log('向右');
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            console.log('最后一行最后一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+      },
       //获取回执附件
       getQualityFile() {
         return { qualityFile: this.qualityFile, id: this.infoData.id };

src/views/bpm/handleTask/components/saleOrder/customerReturnGoods/innerFillWeight.vue

@@ -673,9 +673,13 @@
               </template>
             </el-table-column>
             <el-table-column label="重量" prop="weight" width="100">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '包装', row)
+                  "
                   v-model="row.weight"
                   @input="weightInput($event, row)"
                 ></el-input>
@@ -853,8 +857,15 @@
               </template>
             </el-table-column>
             <el-table-column width="100" label="重量" prop="weight">
-              <template slot-scope="{ row }">
-                <el-input v-model="row.weight" v-if="!row.isPack"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-model="row.weight"
+                  v-if="!row.isPack"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '物料', row)
+                  "
+                ></el-input>
                 <span v-else>{{ row.weight }}</span>
               </template>
             </el-table-column>
@@ -1212,6 +1223,126 @@
       }
     },
     methods: {
+      // 键盘移动
+      moveFocus(event, index, key, type, row) {
+        let keyfield = [];
+        let listLength = 0;
+        switch (type) {
+          case '产品':
+            listLength = this.warehousingMaterialList.length;
+            keyfield = [
+              'manualBatchNo',
+              'minPackingCount',
+              'outInNum',
+              'univalence'
+            ];
+            break;
+          case '包装':
+            listLength = this.materialCodeReqList.length;
+            keyfield = ['weight'];
+            break;
+          case '物料':
+            listLength = this.resultArray.length;
+            keyfield = ['weight'];
+            break;
+        }
+
+        if (event.keyCode === 13) {
+          // 回车
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            return;
+          }
+
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 向上 =38
+        if (event.keyCode === 38) {
+          console.log('向上');
+          if (index === 0) {
+            // 第一行
+            console.log('第一行无法向上');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index - 1)].focus();
+          });
+        }
+
+        // 下 = 40
+        if (event.keyCode === 40) {
+          console.log('向下');
+          if (index === listLength - 1) {
+            // 最后一行
+            console.log('最后一行无法向下');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index + 1)].focus();
+          });
+        }
+
+        // 左 = 37
+        if (event.keyCode === 37) {
+          console.log('向左');
+          if (index === 0 && key === keyfield[0]) {
+            // 第一行第一个
+            console.log('第一行第一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[0]) {
+            // 当前行第一个,跳转上一行最后一个
+            this.$refs[keyfield[keyfield.length - 1] + (index - 1)].focus();
+          } else {
+            // 跳转上一个
+            const prevkeyindex = keyfield.findIndex((k) => k === key) - 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[prevkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 右 = 39
+        if (event.keyCode === 39) {
+          console.log('向右');
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            console.log('最后一行最后一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+      },
       //获取回执附件
       getQualityFile() {
         return { qualityFile: this.qualityFile, id: this.infoData.id };

src/views/bpm/handleTask/components/saleOrder/customerReturnGoods/interiorProductionStorageQuality.vue

@@ -655,33 +655,52 @@
               prop="measuringUnit"
             ></el-table-column>
             <el-table-column label="物料代号" prop="materielCode" width="130">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'materielCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'materielCode', '包装', row)
+                  "
                   v-model="row.materielCode"
                 ></el-input>
                 <span v-else>{{ row.materielCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="客户代号" prop="clientCode">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'clientCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'clientCode', '包装', row)
+                  "
                   v-model="row.clientCode"
                 ></el-input>
                 <span v-else> {{ row.clientCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="刻码" prop="engrave">
-              <template slot-scope="{ row }">
-                <el-input v-if="!row.isPack" v-model="row.engrave"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-if="!row.isPack"
+                  :ref="'engrave' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'engrave', '包装', row)
+                  "
+                  v-model="row.engrave"
+                ></el-input>
                 <span v-else>{{ row.engrave }}</span>
               </template>
             </el-table-column>
             <el-table-column label="重量" prop="weight" width="100">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack && row.measuringUnit != row.weightUtil"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '包装', row)
+                  "
                   v-model="row.weight"
                   @input="weightInput($event, row)"
                 ></el-input>
@@ -849,33 +868,52 @@
               prop="measuringUnit"
             ></el-table-column>
             <el-table-column label="物料代号" prop="materielCode" width="130">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.materielCode"
+                  :ref="'materielCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'materielCode', '物料', row)
+                  "
                   v-if="!row.isPack"
                 ></el-input>
                 <span v-else>{{ row.materielCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="客户代号" prop="clientCode">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.clientCode"
+                  :ref="'clientCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'clientCode', '物料', row)
+                  "
                   v-if="!row.isPack"
                 ></el-input>
                 <span v-else> {{ row.clientCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="刻码" prop="engrave">
-              <template slot-scope="{ row }">
-                <el-input v-model="row.engrave" v-if="!row.isPack"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-model="row.engrave"
+                  v-if="!row.isPack"
+                  :ref="'engrave' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'engrave', '物料', row)
+                  "
+                ></el-input>
                 <span v-else> {{ row.engrave }}</span>
               </template>
             </el-table-column>
             <el-table-column width="100" label="重量" prop="weight">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.weight"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '物料', row)
+                  "
                   v-if="!row.isPack && row.measuringUnit != row.weightUnit"
                 ></el-input>
                 <span v-else>{{ row.weight }}</span>
@@ -1242,6 +1280,134 @@
       }
     },
     methods: {
+      // 键盘移动
+      moveFocus(event, index, key, type, row) {
+        let keyfield = [];
+        let listLength = 0;
+        switch (type) {
+          case '产品':
+            listLength = this.warehousingMaterialList.length;
+            keyfield = [
+              'manualBatchNo',
+              'minPackingCount',
+              'outInNum',
+              'univalence'
+            ];
+            break;
+          case '包装':
+            listLength = this.materialCodeReqList.length;
+            if (row.measuringUnit != row.weightUtil) {
+              keyfield = ['materielCode', 'clientCode', 'engrave', 'weight'];
+            } else {
+              keyfield = ['materielCode', 'clientCode', 'engrave'];
+            }
+            break;
+          case '物料':
+            listLength = this.resultArray.length;
+            if (row.measuringUnit != row.weightUnit) {
+              keyfield = ['materielCode', 'clientCode', 'engrave', 'weight'];
+            } else {
+              keyfield = ['materielCode', 'clientCode', 'engrave'];
+            }
+            break;
+        }
+
+        if (event.keyCode === 13) {
+          // 回车
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            return;
+          }
+
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 向上 =38
+        if (event.keyCode === 38) {
+          console.log('向上');
+          if (index === 0) {
+            // 第一行
+            console.log('第一行无法向上');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index - 1)].focus();
+          });
+        }
+
+        // 下 = 40
+        if (event.keyCode === 40) {
+          console.log('向下');
+          if (index === listLength - 1) {
+            // 最后一行
+            console.log('最后一行无法向下');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index + 1)].focus();
+          });
+        }
+
+        // 左 = 37
+        if (event.keyCode === 37) {
+          console.log('向左');
+          if (index === 0 && key === keyfield[0]) {
+            // 第一行第一个
+            console.log('第一行第一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[0]) {
+            // 当前行第一个,跳转上一行最后一个
+            this.$refs[keyfield[keyfield.length - 1] + (index - 1)].focus();
+          } else {
+            // 跳转上一个
+            const prevkeyindex = keyfield.findIndex((k) => k === key) - 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[prevkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 右 = 39
+        if (event.keyCode === 39) {
+          console.log('向右');
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            console.log('最后一行最后一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+      },
       //获取回执附件
       getQualityFile() {
         return { qualityFile: this.qualityFile, id: this.formData.id };

src/views/bpm/handleTask/components/saleOrder/customerReturnGoods/interiorStorageToOutsourcingQuality.vue

@@ -655,33 +655,52 @@
               prop="measuringUnit"
             ></el-table-column>
             <el-table-column label="物料代号" prop="materielCode" width="130">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'materielCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'materielCode', '包装', row)
+                  "
                   v-model="row.materielCode"
                 ></el-input>
                 <span v-else>{{ row.materielCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="客户代号" prop="clientCode">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'clientCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'clientCode', '包装', row)
+                  "
                   v-model="row.clientCode"
                 ></el-input>
                 <span v-else> {{ row.clientCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="刻码" prop="engrave">
-              <template slot-scope="{ row }">
-                <el-input v-if="!row.isPack" v-model="row.engrave"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-if="!row.isPack"
+                  :ref="'engrave' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'engrave', '包装', row)
+                  "
+                  v-model="row.engrave"
+                ></el-input>
                 <span v-else>{{ row.engrave }}</span>
               </template>
             </el-table-column>
             <el-table-column label="重量" prop="weight" width="100">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack && row.measuringUnit != row.weightUtil"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '包装', row)
+                  "
                   v-model="row.weight"
                   @input="weightInput($event, row)"
                 ></el-input>
@@ -832,34 +851,53 @@
               prop="measuringUnit"
             ></el-table-column>
             <el-table-column label="物料代号" prop="materielCode" width="130">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.materielCode"
                   v-if="!row.isPack"
+                  :ref="'materielCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'materielCode', '物料', row)
+                  "
                 ></el-input>
                 <span v-else>{{ row.materielCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="客户代号" prop="clientCode">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.clientCode"
                   v-if="!row.isPack"
+                  :ref="'clientCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'clientCode', '物料', row)
+                  "
                 ></el-input>
                 <span v-else> {{ row.clientCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="刻码" prop="engrave">
-              <template slot-scope="{ row }">
-                <el-input v-model="row.engrave" v-if="!row.isPack"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-model="row.engrave"
+                  v-if="!row.isPack"
+                  :ref="'engrave' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'engrave', '物料', row)
+                  "
+                ></el-input>
                 <span v-else> {{ row.engrave }}</span>
               </template>
             </el-table-column>
             <el-table-column width="100" label="重量" prop="weight">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.weight"
                   v-if="!row.isPack && row.measuringUnit != row.weightUnit"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '物料', row)
+                  "
                 ></el-input>
                 <span v-else>{{ row.weight }}</span>
               </template>
@@ -1233,6 +1271,134 @@
       }
     },
     methods: {
+      // 键盘移动
+      moveFocus(event, index, key, type, row) {
+        let keyfield = [];
+        let listLength = 0;
+        switch (type) {
+          case '产品':
+            listLength = this.warehousingMaterialList.length;
+            keyfield = [
+              'manualBatchNo',
+              'minPackingCount',
+              'outInNum',
+              'univalence'
+            ];
+            break;
+          case '包装':
+            listLength = this.materialCodeReqList.length;
+            if (row.measuringUnit != row.weightUtil) {
+              keyfield = ['materielCode', 'clientCode', 'engrave', 'weight'];
+            } else {
+              keyfield = ['materielCode', 'clientCode', 'engrave'];
+            }
+            break;
+          case '物料':
+            listLength = this.resultArray.length;
+            if (row.measuringUnit != row.weightUnit) {
+              keyfield = ['materielCode', 'clientCode', 'engrave', 'weight'];
+            } else {
+              keyfield = ['materielCode', 'clientCode', 'engrave'];
+            }
+            break;
+        }
+
+        if (event.keyCode === 13) {
+          // 回车
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            return;
+          }
+
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 向上 =38
+        if (event.keyCode === 38) {
+          console.log('向上');
+          if (index === 0) {
+            // 第一行
+            console.log('第一行无法向上');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index - 1)].focus();
+          });
+        }
+
+        // 下 = 40
+        if (event.keyCode === 40) {
+          console.log('向下');
+          if (index === listLength - 1) {
+            // 最后一行
+            console.log('最后一行无法向下');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index + 1)].focus();
+          });
+        }
+
+        // 左 = 37
+        if (event.keyCode === 37) {
+          console.log('向左');
+          if (index === 0 && key === keyfield[0]) {
+            // 第一行第一个
+            console.log('第一行第一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[0]) {
+            // 当前行第一个,跳转上一行最后一个
+            this.$refs[keyfield[keyfield.length - 1] + (index - 1)].focus();
+          } else {
+            // 跳转上一个
+            const prevkeyindex = keyfield.findIndex((k) => k === key) - 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[prevkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 右 = 39
+        if (event.keyCode === 39) {
+          console.log('向右');
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            console.log('最后一行最后一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+      },
       //获取回执附件
       getQualityFile() {
         return { qualityFile: this.qualityFile, id: this.formData.id };

src/views/bpm/handleTask/components/saleOrder/customerReturnGoods/outerFillWeight.vue

@@ -673,10 +673,14 @@
               </template>
             </el-table-column>
             <el-table-column label="重量" prop="weight" width="100">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
                   v-model="row.weight"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '包装', row)
+                  "
                   @input="weightInput($event, row)"
                 ></el-input>
                 <span v-else>{{ row.weight }}</span>
@@ -853,8 +857,15 @@
               </template>
             </el-table-column>
             <el-table-column width="100" label="重量" prop="weight">
-              <template slot-scope="{ row }">
-                <el-input v-model="row.weight" v-if="!row.isPack"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-model="row.weight"
+                  v-if="!row.isPack"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '物料', row)
+                  "
+                ></el-input>
                 <span v-else>{{ row.weight }}</span>
               </template>
             </el-table-column>
@@ -1212,6 +1223,126 @@
       }
     },
     methods: {
+      // 键盘移动
+      moveFocus(event, index, key, type, row) {
+        let keyfield = [];
+        let listLength = 0;
+        switch (type) {
+          case '产品':
+            listLength = this.warehousingMaterialList.length;
+            keyfield = [
+              'manualBatchNo',
+              'minPackingCount',
+              'outInNum',
+              'univalence'
+            ];
+            break;
+          case '包装':
+            listLength = this.materialCodeReqList.length;
+            keyfield = ['weight'];
+            break;
+          case '物料':
+            listLength = this.resultArray.length;
+            keyfield = ['weight'];
+            break;
+        }
+
+        if (event.keyCode === 13) {
+          // 回车
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            return;
+          }
+
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 向上 =38
+        if (event.keyCode === 38) {
+          console.log('向上');
+          if (index === 0) {
+            // 第一行
+            console.log('第一行无法向上');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index - 1)].focus();
+          });
+        }
+
+        // 下 = 40
+        if (event.keyCode === 40) {
+          console.log('向下');
+          if (index === listLength - 1) {
+            // 最后一行
+            console.log('最后一行无法向下');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index + 1)].focus();
+          });
+        }
+
+        // 左 = 37
+        if (event.keyCode === 37) {
+          console.log('向左');
+          if (index === 0 && key === keyfield[0]) {
+            // 第一行第一个
+            console.log('第一行第一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[0]) {
+            // 当前行第一个,跳转上一行最后一个
+            this.$refs[keyfield[keyfield.length - 1] + (index - 1)].focus();
+          } else {
+            // 跳转上一个
+            const prevkeyindex = keyfield.findIndex((k) => k === key) - 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[prevkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 右 = 39
+        if (event.keyCode === 39) {
+          console.log('向右');
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            console.log('最后一行最后一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+      },
       //获取回执附件
       getQualityFile() {
         return {};

src/views/bpm/handleTask/components/saleOrder/entrustedReceive/procurementWarehousing.vue

@@ -687,34 +687,53 @@
               prop="measuringUnit"
             ></el-table-column>
             <el-table-column label="物料代号" prop="materielCode" width="130">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'materielCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'materielCode', '包装', row)
+                  "
                   v-model="row.materielCode"
                 ></el-input>
                 <span v-else>{{ row.materielCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="客户代号" prop="clientCode">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack"
+                  :ref="'clientCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'clientCode', '包装', row)
+                  "
                   v-model="row.clientCode"
                 ></el-input>
                 <span v-else> {{ row.clientCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="刻码" prop="engrave">
-              <template slot-scope="{ row }">
-                <el-input v-if="!row.isPack" v-model="row.engrave"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-if="!row.isPack"
+                  v-model="row.engrave"
+                  :ref="'engrave' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'engrave', '包装', row)
+                  "
+                ></el-input>
                 <span v-else>{{ row.engrave }}</span>
               </template>
             </el-table-column>
             <el-table-column label="重量" prop="weight" width="100">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-if="!row.isPack && row.measuringUnit != row.weightUtil"
                   v-model="row.weight"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '包装', row)
+                  "
                   @input="weightInput($event, row)"
                 ></el-input>
                 <span v-else>{{ row.weight }}</span>
@@ -884,34 +903,53 @@
               prop="measuringUnit"
             ></el-table-column>
             <el-table-column label="物料代号" prop="materielCode" width="130">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.materielCode"
+                  :ref="'materielCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'materielCode', '物料', row)
+                  "
                   v-if="!row.isPack"
                 ></el-input>
                 <span v-else>{{ row.materielCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="客户代号" prop="clientCode">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.clientCode"
                   v-if="!row.isPack"
+                  :ref="'clientCode' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'clientCode', '物料', row)
+                  "
                 ></el-input>
                 <span v-else> {{ row.clientCode }}</span>
               </template>
             </el-table-column>
             <el-table-column label="刻码" prop="engrave">
-              <template slot-scope="{ row }">
-                <el-input v-model="row.engrave" v-if="!row.isPack"></el-input>
+              <template slot-scope="{ row, $index }">
+                <el-input
+                  v-model="row.engrave"
+                  v-if="!row.isPack"
+                  :ref="'engrave' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'engrave', '物料', row)
+                  "
+                ></el-input>
                 <span v-else> {{ row.engrave }}</span>
               </template>
             </el-table-column>
             <el-table-column width="100" label="重量" prop="weight">
-              <template slot-scope="{ row }">
+              <template slot-scope="{ row, $index }">
                 <el-input
                   v-model="row.weight"
                   v-if="!row.isPack && row.measuringUnit != row.weightUnit"
+                  :ref="'weight' + $index"
+                  @keyup.native="
+                    moveFocus($event, $index, 'weight', '物料', row)
+                  "
                 ></el-input>
                 <span v-else>{{ row.weight }}</span>
               </template>
@@ -1284,6 +1322,134 @@
         });
     },
     methods: {
+      // 键盘移动
+      moveFocus(event, index, key, type, row) {
+        let keyfield = [];
+        let listLength = 0;
+        switch (type) {
+          case '产品':
+            listLength = this.warehousingMaterialList.length;
+            keyfield = [
+              'manualBatchNo',
+              'minPackingCount',
+              'outInNum',
+              'univalence'
+            ];
+            break;
+          case '包装':
+            listLength = this.materialCodeReqList.length;
+            if (row.measuringUnit != row.weightUtil) {
+              keyfield = ['materielCode', 'clientCode', 'engrave', 'weight'];
+            } else {
+              keyfield = ['materielCode', 'clientCode', 'engrave'];
+            }
+            break;
+          case '物料':
+            listLength = this.resultArray.length;
+            if (row.measuringUnit != row.weightUnit) {
+              keyfield = ['materielCode', 'clientCode', 'engrave', 'weight'];
+            } else {
+              keyfield = ['materielCode', 'clientCode', 'engrave'];
+            }
+            break;
+        }
+
+        if (event.keyCode === 13) {
+          // 回车
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            return;
+          }
+
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 向上 =38
+        if (event.keyCode === 38) {
+          console.log('向上');
+          if (index === 0) {
+            // 第一行
+            console.log('第一行无法向上');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index - 1)].focus();
+          });
+        }
+
+        // 下 = 40
+        if (event.keyCode === 40) {
+          console.log('向下');
+          if (index === listLength - 1) {
+            // 最后一行
+            console.log('最后一行无法向下');
+            return;
+          }
+          this.$refs[key + index].blur();
+          this.$nextTick(() => {
+            this.$refs[key + (index + 1)].focus();
+          });
+        }
+
+        // 左 = 37
+        if (event.keyCode === 37) {
+          console.log('向左');
+          if (index === 0 && key === keyfield[0]) {
+            // 第一行第一个
+            console.log('第一行第一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[0]) {
+            // 当前行第一个,跳转上一行最后一个
+            this.$refs[keyfield[keyfield.length - 1] + (index - 1)].focus();
+          } else {
+            // 跳转上一个
+            const prevkeyindex = keyfield.findIndex((k) => k === key) - 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[prevkeyindex] + index].focus();
+            });
+          }
+        }
+
+        // 右 = 39
+        if (event.keyCode === 39) {
+          console.log('向右');
+          if (
+            index === listLength - 1 &&
+            key === keyfield[keyfield.length - 1]
+          ) {
+            // 最后一行最后一个
+            console.log('最后一行最后一个无法向左');
+            return;
+          }
+          this.$refs[key + index].blur();
+          if (key === keyfield[keyfield.length - 1]) {
+            // 当前行最后一个,跳转下一行第一个
+            this.$refs[keyfield[0] + (index + 1)].focus();
+          } else {
+            // 跳转下一个
+            const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
+            this.$nextTick(() => {
+              this.$refs[keyfield[nextkeyindex] + index].focus();
+            });
+          }
+        }
+      },
       //获取回执附件
       getQualityFile() {
         return { qualityFile: this.qualityFile, id: this.infoData.id };