Fixiaobai
2023-10-13 e8308ddac0ba4a1f406e8f63d7e6b6f2541cb770
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<template>
  <div>
    <basic-container>
      <div class="task-div-title">
        <div style="margin-left:15px;">
          <span style="font-size: 17px;font-weight: bold;color: #2d2d2d;"
            >数据录入</span
          >
        </div>
      </div>
      <div
        style="margin-bottom: 10px;margin-left: 15px; display:inline-block;width: 80%;margin-top: 30px"
      >
        <el-form
          :model="formData"
          class="l-mes"
          style="margin-left: 10px"
          ref="form"
          :rules="rules"
          label-width="100px"
        >
          <el-form-item prop="newMesCode" label="新MES码">
            <el-input
              type="textarea"
              :rows="6"
              placeholder="请输入新MES码"
              v-model="formData.newMesCode"
              ref="formItem0"
              @keyup.enter.native="nextFocus(0)"
            >
            </el-input>
          </el-form-item>
          <el-form-item prop="barCode" label="19码">
            <el-input
              placeholder="请输入19码"
              v-model="formData.barCode"
              ref="formItem1"
              @keyup.enter.native="nextFocus(1)"
            >
            </el-input>
          </el-form-item>
          <el-form-item prop="codeBox" label="箱码">
            <el-input
              placeholder="请输入箱码"
              v-model="formData.codeBox"
              ref="formItem2"
            >
            </el-input>
          </el-form-item>
          <el-form-item
            style="margin-top: 100px"
            prop="isQualified"
            label="是否合格"
          >
            <el-select
              v-model="formData.isQualified"
              placeholder="请选择"
              clearable
            >
              <el-option
                v-for="item in isQualifiedOptions"
                :key="item.key"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item prop="reason" label="不合格理由">
            <el-input
              type="textarea"
              :rows="4"
              placeholder="请输入不合格理由"
              v-model="formData.reason"
            >
            </el-input>
          </el-form-item>
        </el-form>
        <el-row type="flex" justify="space-around" style="margin-top: 50px">
          <el-button type="primary" @click="submitForm()">提交</el-button>
          <el-button @click="resetForm">清除</el-button>
        </el-row>
      </div>
    </basic-container>
  </div>
</template>
 
<script>
import { addCode19bind } from '@/api/huawei/code19bind'
export default {
  data() {
    return {
      formData: {
        newMesCode: '',
        barCode: '',
        codeBox: '',
        isQualified: 1,
        reason: ''
      },
      rules: {
        newMesCode: [
          { required: true, message: '请填写新MES码', trigger: 'blur' }
        ],
        barCode: [{ required: true, message: '请填写19码', trigger: 'blur' }],
        codeBox: [{ required: true, message: '请输入箱码', trigger: 'blur' }],
        isQualified: [
          { required: true, message: '请选择是否合格', trigger: 'blur' }
        ]
      },
      isQualifiedOptions: [
        {
          value: 1,
          label: '合格'
        },
        {
          value: 0,
          label: '不合格'
        }
      ]
    }
  },
  methods: {
    submitForm() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          addCode19bind(this.formData)
            .then((data) => {
              this.$message.success('提交成功')
              // 刷新列表
              this.$emit('updateList')
            })
            .catch(() => {
              this.$message.error('提交失败')
            })
        }
      })
    },
    resetForm() {
      this.$refs.form.resetFields()
    },
    nextFocus(index) {
      index++
      this.$refs['formItem' + index].focus()
    }
  }
}
</script>
 
<style scoped></style>