|
|
|
<template>
|
|
|
|
<el-container class="form-container">
|
|
|
|
<el-header>
|
|
|
|
<h1>危险品出库</h1>
|
|
|
|
</el-header>
|
|
|
|
<el-main>
|
|
|
|
<el-card class="form-card">
|
|
|
|
<el-form :label-position="labelPosition" :model="form" ref="form" label-width="100px" :rules="rules">
|
|
|
|
<el-form-item label="运单号" prop="waybill">
|
|
|
|
<el-input class="form-input" v-model="form.waybill" placeholder="请输入运单号" clearable @blur="handleBlur"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="件数" prop="pcs">
|
|
|
|
<el-input class="form-input" type="number" v-model="form.pcs" placeholder="请输入件数" clearable></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="重量 (kg)" prop="weight">
|
|
|
|
<el-input class="form-input" type="number" v-model="form.weight" placeholder="请输入重量" clearable></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="危险品" prop="hazardous">
|
|
|
|
<el-select class="form-input" v-model="form.hazardous" placeholder="请选择">
|
|
|
|
<el-option
|
|
|
|
v-for="item in options"
|
|
|
|
:key="item.value"
|
|
|
|
:label="item.label"
|
|
|
|
:value="item.value">
|
|
|
|
</el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item>
|
|
|
|
<el-button type="primary" @click="submitForm" class="submit-button">危险品出库</el-button>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
|
|
</el-card>
|
|
|
|
</el-main>
|
|
|
|
</el-container>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
import {selectNewInventroys} from '../../api/consigner/station'
|
|
|
|
import {dangerousExt,} from '../../api/consigner/dangerous'
|
|
|
|
export default {
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
options: [
|
|
|
|
{
|
|
|
|
value: "3481",
|
|
|
|
label: '一般危险品'
|
|
|
|
}, {
|
|
|
|
value: "3091",
|
|
|
|
label: '锂电池'
|
|
|
|
}
|
|
|
|
],
|
|
|
|
labelPosition:'left',
|
|
|
|
form: {
|
|
|
|
waybill: '',
|
|
|
|
pcs: null,
|
|
|
|
weight: null,
|
|
|
|
hazardous: '3481'
|
|
|
|
},
|
|
|
|
queryInfo: {
|
|
|
|
waybill:'',
|
|
|
|
billfhl:'',
|
|
|
|
locationno:'',
|
|
|
|
// 当前页数
|
|
|
|
pageNum: 1,
|
|
|
|
// 每页大小
|
|
|
|
pageSize: 10,
|
|
|
|
starttime:'',
|
|
|
|
endtime:'',
|
|
|
|
remark2:''
|
|
|
|
},
|
|
|
|
rules: {
|
|
|
|
waybill: [
|
|
|
|
{ required: true, message: '运单号不能为空', trigger: 'blur' }
|
|
|
|
],
|
|
|
|
pcs: [
|
|
|
|
{ required: true, message: '件数不能为空', trigger: 'blur' }
|
|
|
|
],
|
|
|
|
weight: [
|
|
|
|
{ required: true, message: '重量不能为空', trigger: 'blur' }
|
|
|
|
],
|
|
|
|
hazardous: [
|
|
|
|
{ required: true, message: '请选择是否为危险品', trigger: 'change' }
|
|
|
|
]
|
|
|
|
}
|
|
|
|
};
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
submitForm() {
|
|
|
|
this.$refs.form.validate((valid) => {
|
|
|
|
if (valid) {
|
|
|
|
dangerousExt(this.form).then((response) => {
|
|
|
|
const res = response.data
|
|
|
|
if (res.code !== '200') {
|
|
|
|
return this.$message.error(res.msg)
|
|
|
|
}
|
|
|
|
this.$message.success(res.msg);
|
|
|
|
this.$refs.form.resetFields();
|
|
|
|
}).catch(error => {
|
|
|
|
// 关闭加载
|
|
|
|
this.$message.error(error.toString())
|
|
|
|
})
|
|
|
|
} else {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
handleBlur() {
|
|
|
|
// 在这里处理失去焦点事件
|
|
|
|
if(this.form.waybill!==null && this.form.waybill!==''){
|
|
|
|
this.queryInfo.waybill=this.form.waybill;
|
|
|
|
selectNewInventroys(this.queryInfo).then((response) => {
|
|
|
|
const res = response.data
|
|
|
|
if (res.code !== '200') {
|
|
|
|
return this.$message.error('剩余库调取失败')
|
|
|
|
}
|
|
|
|
if(res.data.list!==null){
|
|
|
|
this.form.pcs=res.data.list[0].pcs;
|
|
|
|
this.form.weight=res.data.list[0].weight;
|
|
|
|
this.form.hazardous=res.data.list[0].remark3;
|
|
|
|
}
|
|
|
|
this.$message.success('库存调取成功')
|
|
|
|
}).catch(error => {
|
|
|
|
// 关闭加载
|
|
|
|
this.$message.error(error.toString())
|
|
|
|
})
|
|
|
|
}
|
|
|
|
// 你可以在这里执行其他操作，比如验证输入或发送请求等
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
.form-container {
|
|
|
|
background-color: #f5f5f5;
|
|
|
|
padding: 20px;
|
|
|
|
min-height: 100vh;
|
|
|
|
}
|
|
|
|
|
|
|
|
.el-header {
|
|
|
|
text-align: center;
|
|
|
|
margin-bottom: 20px;
|
|
|
|
color: #333;
|
|
|
|
}
|
|
|
|
|
|
|
|
.form-card {
|
|
|
|
background-color: #ffffff;
|
|
|
|
border-radius: 8px;
|
|
|
|
padding: 20px;
|
|
|
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
|
|
|
}
|
|
|
|
|
|
|
|
.form-input {
|
|
|
|
width: 100%; /* 设置宽度为100% */
|
|
|
|
}
|
|
|
|
|
|
|
|
.submit-button {
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.el-form-item {
|
|
|
|
margin-bottom: 15px;
|
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: 600px) {
|
|
|
|
.form-container {
|
|
|
|
padding: 10px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style> |
...
|
...
|
|
