<template> <a-spin :spinning="confirmLoading"> <j-form-container :disabled="formDisabled"> <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail"> <a-row> <a-col :span="24"> <a-form-model-item label="货主" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="companyCode"> <a-select show-search placeholder="请选择货主" option-filter-prop="children" :filter-option="filterOption" v-model="model.companyCode"> <a-select-option v-for="item in companyList" :key="item.name" :value="item.code">{{ item.name }} </a-select-option> </a-select> </a-form-model-item> </a-col> <a-col :span="24"> <a-form-model-item label="盘点类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="countType"> <a-select show-search placeholder="请输入盘点类型" option-filter-prop="children" :filter-option="filterOption" v-model="model.countType"> <a-select-option v-for="item in CountTypeList" :key="item.name" :value="item.code">{{ item.name }} </a-select-option> </a-select> </a-form-model-item> </a-col> <a-col :span="24"> <a-form-model-item label="指定盘点人员" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="stocktakingAs"> <j-select-multi-user v-model="model.stocktakingAs" :query-config="selectUserQueryConfig"/> </a-form-model-item> </a-col> <a-col :span="24"> <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="remark"> <a-input type="textarea" v-model="model.remark" placeholder="请输入备注" ></a-input> </a-form-model-item> </a-col> </a-row> </a-form-model> </j-form-container> </a-spin> </template> <script> import { httpAction, getAction } from '@/api/manage' import { validateDuplicateValue } from '@/utils/util' import {getCompanyList} from '@/api/api' import {getCountTypeList} from '@/api/api' export default { name: 'CycleCountHeaderForm', components: { }, props: { //表单禁用 disabled: { type: Boolean, default: false, required: false } }, data () { return { // 选择用户查询条件配置 selectUserQueryConfig: [ {key: 'locationCode', label: '库位'}, ], companyList: [], CountTypeList:[], model:{ }, labelCol: { xs: { span: 24 }, sm: { span: 5 }, }, wrapperCol: { xs: { span: 24 }, sm: { span: 16 }, }, confirmLoading: false, validatorRules: { }, url: { add: "/cycleCountHeader/cycleCountHeader/add", edit: "/cycleCountHeader/cycleCountHeader/edit", queryById: "/cycleCountHeader/cycleCountHeader/queryById" } } }, computed: { formDisabled(){ return this.disabled }, }, created () { //备份model原始值 this.modelDefault = JSON.parse(JSON.stringify(this.model)); this.loadFrom(); }, methods: { add () { this.edit(this.modelDefault); }, edit (record) { this.model = Object.assign({}, record); this.visible = true; }, loadFrom() { getCompanyList().then((res) => { if (res.success) { this.companyList = res.result this.model.companyCode = this.companyList[0].code; } }); getCountTypeList().then((res) => { if (res.success) { this.CountTypeList = res.result this.model.countType = this.CountTypeList[0].code; } }); }, submitForm () { const that = this; // 触发表单验证 this.$refs.form.validate(valid => { if (valid) { that.confirmLoading = true; let httpurl = ''; let method = ''; if(!this.model.id){ httpurl+=this.url.add; method = 'post'; }else{ httpurl+=this.url.edit; method = 'put'; } httpAction(httpurl,this.model,method).then((res)=>{ if(res.success){ that.$message.success(res.message); that.$emit('ok'); }else{ that.$message.warning(res.message); } }).finally(() => { that.confirmLoading = false; }) } }) }, } } </script>