提交代码

src/api/outcomeWmsJbapplyTemp.js

@@ -97,3 +97,11 @@ export function persistOut(data) {
     }
   })
 }
+export function changeLabel(data) {
+  data = Qs.stringify(data)
+  return request({
+    url: '/outcomewmsjbapplytemp/changeLabel',
+    method: 'post',
+    data: data
+  })
+}

src/views/setup/changeLabel.vue

+<template>
+  <div class="enterBound">
+    <div class="enterForm">
+      <div class="search">
+        <el-form
+          ref="from"
+          :model="queryForm"
+          :rules="rules"
+          label-width="80px"
+          class="formClass"
+          label-position="right"
+        >
+          <el-form-item label="XX:" prop="value1">
+            <el-input ref="input1" v-model="queryForm.value1" clearable @keyup.enter.native="handelTab" />
+          </el-form-item>
+        </el-form>
+        <el-form
+          ref="form2"
+          :model="queryFormDate"
+          :rules="queryFormDateRules"
+          label-width="80px"
+          class="formClass"
+          label-position="right"
+        >
+          <el-form-item label="pn:">
+            <span>{{ queryFormDate.pn }}</span>
+          </el-form-item>
+          <el-form-item label="lot:">
+            <span>{{ queryFormDate.lot }}</span>
+          </el-form-item>
+          <el-form-item label="qty:" prop="qty">
+            <el-input ref="input2" v-model="queryFormDate.qty" style="width:20%" />
+          </el-form-item>
+          <el-form-item label="rank">
+            <span>{{ queryFormDate.rank }}</span>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="buttonRegion">
+        <el-button class="button_rowBtn" type="primary" @click="submit">提交</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { playAudio } from '@/utils/common'
+import { changeLabel } from '@/api/outcomeWmsJbapplyTemp'
+
+export default {
+  name: 'ChangeLabel',
+  data() {
+    return {
+      queryForm: {
+        value1: '',
+        qty: ''
+      },
+      queryFormDate: {
+        lot: '',
+        pn: '',
+        qty: '',
+        rank: ''
+      },
+      // 表单校验
+      rules: {
+        value1: [
+          { pattern: /^[^:]+:[^:]+:[^:]+:\d+$/, message: '输入值不符合格式要求，请重新输入', trigger: 'blur' }
+        ]
+      },
+      queryFormDateRules: {
+        qty: [
+          { pattern: /^\d+$/, message: '输入值不符合格式要求，请重新输入', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  mounted() {
+    this.focusing()
+  },
+  methods: {
+    /**
+     * @description: 一开始将焦点聚焦到第一个输入框下
+     * @author:
+     * @param:
+     * @return:
+     **/
+    focusing() {
+      this.$nextTick().then(() => {
+        this.$refs.input1.focus()
+      })
+    },
+
+    // 保存
+    submit() {
+      this.$refs.form2.validateField('qty', (error) => {
+        if (error) {
+          playAudio(true)
+          this.$message.error({
+            message: '输入值不符合格式要求，请重新输入',
+            duration: 2000,
+            onClose: () => {
+              playAudio(false)
+            }
+          })
+          this.queryFormDate.qty = ''
+        } else {
+          changeLabel(this.queryFormDate).then(response => {
+            if (response.code === 200) {
+              this.$message.success('提交成功')
+            }
+          })
+          this.queryFormDate.pn = null
+          this.queryFormDate.lot = null
+          this.queryFormDate.qty = null
+          this.queryFormDate.rank = null
+        }
+      })
+    },
+    handelTab() {
+      this.$refs.from.validateField('value1', (error) => {
+        if (error) {
+          playAudio(true)
+          this.$message.error({
+            message: '输入值不符合格式要求，请重新输入',
+            duration: 2000,
+            onClose: () => {
+              playAudio(false)
+            }
+          })
+          this.queryForm.value1 = ''
+        } else {
+          const values = this.queryForm.value1.split(':')
+          console.log(values)
+          const obj = {
+            lot: values[0],
+            pn: values[1],
+            qty: parseInt(values[3]),
+            rank: values[2]
+          }
+          this.queryFormDate = obj
+          this.queryForm.value1 = null
+          this.$nextTick().then(() => {
+            this.$refs.input2.focus()
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.enterBound {
+  display: flex;
+  justify-content: center;
+
+  .enterForm {
+    width: 96%;
+
+    .normalSelect {
+      width: 100%;
+    }
+
+  }
+
+  .buttonRegion {
+    margin-top: 20px;
+    display: flex;
+    justify-content: space-between;
+
+    .button_rowBtn {
+      font-size: 17px;
+      width: 120px;
+      margin-left: 27%;
+    }
+  }
+}
+</style>