<template>
<div class="inStockAdd">
<div style="height: 100vh;margin: 0 auto;padding: 16px">
<div style="margin: 30px 0px">
<div class="divider_my"><span class="midText">叶酸库存录入</span></div>
</div>
<div style="margin-top: 20px">
<a-form-model ref="formRef" :model="formData" :rules="formRules"
:labelCol="{span: 6}"
:wrapperCol="{span: 16}"
>
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item label="供应商" prop="supplierId">
<a-select v-model="formData.supplierId"
placeholder="请选择供应商"
:dropdownMatchSelectWidth="false"
@click.native="getAllSupply"
>
<a-select-option v-for="item in allSupplyInfo" :key="item.id"
:value="item.id">{{item.supplierName}}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="品牌" prop="brandId">
<a-select v-model="formData.brandId"
placeholder="请选择叶酸品牌"
:dropdownMatchSelectWidth="false"
>
<a-select-option v-for="item in brandNameList" :key="item.enumValue"
:value="item.enumValue">{{item.enumName}}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="批次号" prop="batchNumber">
<a-input
v-toInputNum="{num:10}"
v-model="formData.batchNumber"
placeholder="请输入批次号,最多可输入10个字"></a-input>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="生产日期" prop="produceDate">
<a-date-picker v-model="formData.produceDate" format="YYYY-MM-DD" style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="有效期至" prop="expireDate">
<a-date-picker v-model="formData.expireDate" format="YYYY-MM-DD" style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="单价" prop="unitPrice">
<a-input
v-price="{digit:2, maxNum:10000}"
v-model="formData.unitPrice"
placeholder="0~10000,最多保留2位小数"
>
<span slot="addonAfter">元</span>
</a-input>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="采购日期" prop="purchDate">
<a-date-picker v-model="formData.purchDate" format="YYYY-MM-DD" style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="数量" prop="number">
<a-input v-toInt="{maxNum:10000000}"
v-model="formData.number"
placeholder="0~10000000">
<a-select slot="addonAfter" v-model="formData.specs" default-value="瓶"
style="width: 60px">
<a-select-option value="瓶">
瓶
</a-select-option>
<a-select-option value="盒">
盒
</a-select-option>
</a-select>
</a-input>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="入库时间" prop="enterDate">
<a-date-picker v-model="formData.enterDate" format="YYYY-MM-DD" style="width: 100%"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="入库经手人" prop="handler">
<a-input
v-toInputNum="{num:15}"
v-model="formData.handler"
placeholder="请输入入库经手人，最多可输入15个字"></a-input>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="备注"
prop="remarks"
:labelCol="{span: 3}"
:wrapperCol="{span: 20}">
<a-textarea
:rows="6"
:maxLength="500"
v-model="formData.remarks"
placeholder="请输入备注,最多500个字"></a-textarea>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
</div>
<div style="text-align: center">
<a-button class="search_btn btn_space ant-table-btn" @click="goBack">取消</a-button>
<a-button type="primary" class="search_btn btn_space" :loading="subLoad" style="margin-left: 10px"
@click="submitForm">库存录入
</a-button>
</div>
</div>
</div>
</template>
<script>
import moment from 'moment'
import {closedDetail, getEnumByFlag} from "../../../utils/common";
import commonCode from "../../../commonCode";
export default {
components: {},
data() {
return {
brandNameList: [],
subLoad: false,
// form表单
formData: {
brandId: undefined,
batchNumber: undefined,
supplierId: undefined,
unitPrice: undefined,
produceDate: undefined,
expireDate: undefined,
purchDate: undefined,
enterDate: undefined,
handler: undefined,
number: undefined,
specs: '瓶',
remarks: undefined
},
formRules: {
brandId: [
{required: true, message: '请选择品牌'}
],
batchNumber: [
{required: true, message: '请输入批次号'}
],
supplierId: [
{required: true, message: '请选择供应商'}
],
number: [
{required: true, message: '请输入数量'}
],
produceDate: [
{required: true, message: '请选择日期'}
],
expireDate: [
{required: true, message: '请选择日期'}
],
purchDate: [
{required: true, message: '请选择日期'}
],
enterDate: [
{required: true, message: '请选择日期'}
],
unitPrice: [
{required: true, message: '请输入单价'}
],
handler:[
{required: true, message: '请输入入库经手人'}
],
remarks: [
{required: false, message: '请输入备注'}
],
},
allSupplyInfo: [],
routerParams: {}
}
},
created() {
this.routerParams = this.$route.query
this.brandNameList = getEnumByFlag('folacin_stock_record_brand_id')
},
methods: {
getAllSupply() {
let par = {
menuId: this.routerParams.menuId
}
this.$api.common.fetchAllSupply(par).then(({data = []}) => {
this.allSupplyInfo = data
})
},
// 弹窗确定按钮
submitForm() {
let vm = this;
this.$refs.formRef.validate(valid => {
if (valid) {
this.subLoad = true;
let pars = {};
Object.assign(pars, vm.formData);
console.log(pars);
pars.unitPrice = Number(pars.unitPrice).toFixed(2);
pars.produceDate = moment(vm.formData.produceDate).format('YYYY-MM-DD');
pars.expireDate = moment(vm.formData.expireDate).format('YYYY-MM-DD');
pars.purchDate = moment(vm.formData.purchDate).format('YYYY-MM-DD');
pars.enterDate = moment(vm.formData.enterDate).format('YYYY-MM-DD');
pars.menuId = this.routerParams.menuId
let par = {
...pars
};
vm.$api.stockManage.addHistoryStock(par).then(res => {
if (res.code === 'SUCCESS') {
vm.subLoad = false;
vm.$message.success('录入成功！')
vm.goBack();
} else {
vm.subLoad = false
}
}).catch(() => {
vm.subLoad = false
})
}
});
},
goBack() {
window.top.postMessage({messageType:'THIRD_PAGECHANGE',name:`${this.routerParams.menuCode}`,source:"yesuan"}, '*')
// closedDetail('/inStock/add', '/Home/inStock')
}
},
}
</script>
<style lang="less" scoped>
</style>