<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"
|
:inline="true"
|
label-width="100px"
|
>
|
<el-form-item prop="codeBox" label="箱码">
|
<el-input
|
placeholder="请输入箱码"
|
v-model="formData.codeBox"
|
clearable
|
ref="formItem0"
|
@keyup.enter.native="nextFocus(0)"
|
></el-input>
|
</el-form-item>
|
<el-form-item prop="codeCer" label="合格证码">
|
<el-input
|
placeholder="请输入合格证码"
|
v-model="formData.codeCer"
|
clearable
|
ref="formItem1"
|
@keyup.enter.native="nextFocus(1)"
|
></el-input>
|
</el-form-item>
|
|
<el-form-item prop="codeGross" label="毛重码">
|
<el-input
|
placeholder="请输入毛重码"
|
v-model="formData.codeGross"
|
clearable
|
ref="formItem2"
|
@keyup.enter.native="nextFocus(2)"
|
></el-input>
|
</el-form-item>
|
<el-form-item prop="barCode" label="19条码">
|
<el-input
|
placeholder="请输入19条码"
|
v-model="formData.barCode"
|
clearable
|
ref="formItem3"
|
@keyup.enter.native="nextFocus(3)"
|
></el-input>
|
</el-form-item>
|
<el-form-item prop="codeSize" label="尺寸码">
|
<el-input
|
placeholder="请输入尺寸码"
|
v-model="formData.codeSize"
|
clearable
|
ref="formItem4"
|
></el-input>
|
</el-form-item>
|
</el-form>
|
<div style="width: 100%;text-align: center;margin-top: 20px;">
|
<span
|
style="font-size: 20px;background-color: #cccc99;padding: 2px 10px;border-radius: 2px"
|
>扫码请对号入座，按下【Enter】键移动光标，聚焦下一个输入框</span
|
>
|
</div>
|
<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 { addCode19verify } from '@/api/huawei/code19verify'
|
|
export default {
|
name: 'genForm',
|
data() {
|
return {
|
formData: {
|
codeBox: '',
|
codeCer: '',
|
codeGross: '',
|
barCode: '',
|
codeSize: ''
|
},
|
rules: {
|
codeBox: [{ required: true, message: '请输入箱码', trigger: 'blur' }],
|
codeCer: [
|
{ required: true, message: '请输入合格证码', trigger: 'blur' }
|
],
|
codeGross: [
|
{ required: true, message: '请输入毛重码', trigger: 'blur' }
|
],
|
barCode: [{ required: true, message: '请输入19条码', trigger: 'blur' }],
|
codeSize: [{ required: true, message: '请输入尺寸码', trigger: 'blur' }]
|
}
|
}
|
},
|
methods: {
|
submitForm() {
|
this.$refs.form.validate((valid) => {
|
if (valid) {
|
addCode19verify(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>
|
.el-input {
|
width: 300px;
|
}
|
</style>
|
