|
|
@@ -195,7 +195,14 @@
|
|
|
{{ row.manualBatchNo }}
|
|
|
</template>
|
|
|
<el-form-item v-else>
|
|
|
- <el-input v-model="row.manualBatchNo"> </el-input>
|
|
|
+ <el-input
|
|
|
+ :ref="'manualBatchNo' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus($event, $index, 'manualBatchNo', '产品', row)
|
|
|
+ "
|
|
|
+ v-model="row.manualBatchNo"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
@@ -237,6 +244,16 @@
|
|
|
required
|
|
|
>
|
|
|
<el-input
|
|
|
+ :ref="'minPackingCount' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus(
|
|
|
+ $event,
|
|
|
+ $index,
|
|
|
+ 'minPackingCount',
|
|
|
+ '产品',
|
|
|
+ row
|
|
|
+ )
|
|
|
+ "
|
|
|
type="number"
|
|
|
v-model="row.minPackingCount"
|
|
|
@input="minPackingCountChange(row, $event)"
|
|
|
@@ -267,6 +284,10 @@
|
|
|
required
|
|
|
>
|
|
|
<el-input
|
|
|
+ :ref="'outInNum' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus($event, $index, 'outInNum', '产品', row)
|
|
|
+ "
|
|
|
v-model="row.outInNum"
|
|
|
@input="packNum(row, $event)"
|
|
|
>
|
|
|
@@ -331,6 +352,10 @@
|
|
|
:prop="`warehousingMaterialList.${$index}.univalence`"
|
|
|
>
|
|
|
<el-input
|
|
|
+ :ref="'univalence' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus($event, $index, 'univalence', '产品', row)
|
|
|
+ "
|
|
|
v-model="row.univalence"
|
|
|
placeholder="非必填"
|
|
|
@input="
|
|
|
@@ -542,39 +567,65 @@
|
|
|
prop="measuringUnit"
|
|
|
></el-table-column>
|
|
|
<el-table-column label="发货条码" prop="barcodes" width="130">
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <el-input v-if="!row.isPack" v-model="row.barcodes"></el-input>
|
|
|
+ <template slot-scope="{ row, $index }">
|
|
|
+ <el-input
|
|
|
+ v-if="!row.isPack"
|
|
|
+ :ref="'barcodes' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus($event, $index, 'barcodes', '包装', row)
|
|
|
+ "
|
|
|
+ v-model="row.barcodes"
|
|
|
+ ></el-input>
|
|
|
<span v-else>{{ row.barcodes }}</span>
|
|
|
</template>
|
|
|
</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>
|
|
|
@@ -728,17 +779,25 @@
|
|
|
prop="measuringUnit"
|
|
|
></el-table-column>
|
|
|
<el-table-column label="物料代号" prop="meterielCode" width="130">
|
|
|
- <template slot-scope="{ row }">
|
|
|
+ <template slot-scope="{ row, $index }">
|
|
|
<el-input
|
|
|
+ :ref="'materielCode' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus($event, $index, 'materielCode', '物料', row)
|
|
|
+ "
|
|
|
v-model="row.materielCode"
|
|
|
v-if="!row.isPack"
|
|
|
></el-input>
|
|
|
- <span v-else>{{ row.materialCode }}</span>
|
|
|
+ <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
|
|
|
+ :ref="'clientCode' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus($event, $index, 'clientCode', '物料', row)
|
|
|
+ "
|
|
|
v-model="row.clientCode"
|
|
|
v-if="!row.isPack"
|
|
|
></el-input>
|
|
|
@@ -746,14 +805,25 @@
|
|
|
</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"
|
|
|
+ :ref="'engrave' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus($event, $index, 'engrave', '物料', row)
|
|
|
+ "
|
|
|
+ v-if="!row.isPack"
|
|
|
+ ></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
|
|
|
+ :ref="'weight' + $index"
|
|
|
+ @keyup.native="
|
|
|
+ moveFocus($event, $index, 'weight', '物料', row)
|
|
|
+ "
|
|
|
v-model="row.weight"
|
|
|
v-if="!row.isPack && row.measuringUnit != row.weightUnit"
|
|
|
></el-input>
|
|
|
@@ -943,6 +1013,167 @@
|
|
|
this.initData();
|
|
|
},
|
|
|
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 = [
|
|
|
+ 'barcodes',
|
|
|
+ 'materielCode',
|
|
|
+ 'clientCode',
|
|
|
+ 'engrave',
|
|
|
+ 'weight'
|
|
|
+ ];
|
|
|
+ } else {
|
|
|
+ keyfield = ['barcodes', '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]) {
|
|
|
+ // 当前行最后一个,跳转下一行第一个
|
|
|
+ if (this.$refs[keyfield[0] + (index + 1)].value == 0) {
|
|
|
+ this.$refs[keyfield[0] + (index + 1)].value = '';
|
|
|
+ }
|
|
|
+ this.$refs[keyfield[0] + (index + 1)].focus();
|
|
|
+ } else {
|
|
|
+ // 跳转下一个
|
|
|
+ const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ if (this.$refs[keyfield[nextkeyindex] + index].value == 0) {
|
|
|
+ this.$refs[keyfield[nextkeyindex] + index].value = '';
|
|
|
+ }
|
|
|
+ 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(() => {
|
|
|
+ if (this.$refs[key + (index - 1)].value == 0) {
|
|
|
+ this.$refs[key + (index - 1)].value = '';
|
|
|
+ }
|
|
|
+ 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(() => {
|
|
|
+ if (this.$refs[key + (index + 1)].value == 0) {
|
|
|
+ this.$refs[key + (index + 1)].value = '';
|
|
|
+ }
|
|
|
+ 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]) {
|
|
|
+ if (
|
|
|
+ this.$refs[keyfield[keyfield.length - 1] + (index - 1)].value == 0
|
|
|
+ ) {
|
|
|
+ this.$refs[keyfield[keyfield.length - 1] + (index - 1)].value =
|
|
|
+ '';
|
|
|
+ }
|
|
|
+ // 当前行第一个,跳转上一行最后一个
|
|
|
+ this.$refs[keyfield[keyfield.length - 1] + (index - 1)].focus();
|
|
|
+ } else {
|
|
|
+ // 跳转上一个
|
|
|
+ const prevkeyindex = keyfield.findIndex((k) => k === key) - 1;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ if (this.$refs[keyfield[prevkeyindex] + index].value == 0) {
|
|
|
+ this.$refs[keyfield[prevkeyindex] + index].value = '';
|
|
|
+ }
|
|
|
+ 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]) {
|
|
|
+ // 当前行最后一个,跳转下一行第一个
|
|
|
+ if (this.$refs[keyfield[0] + (index + 1)].value == 0) {
|
|
|
+ this.$refs[keyfield[0] + (index + 1)].value = '';
|
|
|
+ }
|
|
|
+ this.$refs[keyfield[0] + (index + 1)].focus();
|
|
|
+ } else {
|
|
|
+ // 跳转下一个
|
|
|
+ const nextkeyindex = keyfield.findIndex((k) => k === key) + 1;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ if (this.$refs[keyfield[nextkeyindex] + index].value == 0) {
|
|
|
+ this.$refs[keyfield[nextkeyindex] + index].value = '';
|
|
|
+ }
|
|
|
+ this.$refs[keyfield[nextkeyindex] + index].focus();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
// 包装维度最小包装单元改变——>总重量
|
|
|
minPackingCountChange(row, value) {
|
|
|
if (value >= 0) {
|