factory_web/src/views/pum/supplier_form.vue

115 lines
4.5 KiB
Vue

<template>
<el-dialog
:title="titleMap[mode]"
v-model="visible"
:size="1000"
destroy-on-close
@closed="$emit('closed')"
>
<el-container v-loading="loading">
<el-main style="padding: 0 20px 20px 20px">
<el-form
ref="dialogForm"
:model="form"
:rules="rules"
label-width="110px"
>
<el-row>
<el-col :md="12" :sm="24">
<el-form-item label="供应商名称" prop="name">
<el-input v-model="form.name" placeholder="供应商名称"/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="联系人" prop="contact">
<el-input v-model="form.contact" placeholder="联系人"/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="联系方式" prop="contact_phone">
<el-input v-model="form.contact_phone" :maxlength="11" placeholder="联系方式" style="width:100%"/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="地址">
<el-input v-model="form.address" placeholder="地址"/>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-main>
<el-footer>
<el-button type="primary" :loading="isSaveing" @click="submit">保存</el-button>
<el-button @click="visible = false">取消</el-button>
</el-footer>
</el-container>
</el-dialog>
</template>
<script>
export default {
emits: ["success", "closed"],
data() {
return {
loading: false,
mode: "add",
titleMap: {
add: "新增采购详情",
edit: "编辑采购详情",
show: "查看采购详情",
},
form: {},
rules: {
name: [{required: true, message: "请输入供应商名称", trigger: "blur"}],
contact: [{required: true, message: "请输入联系人", trigger: "blur"}],
contact_phone: [{required: true, message: "请输入联系电话", trigger: "blur"}],
},
visible: false,
isSaveing: false,
setFiltersVisible: false,
options: [],
};
},
methods: {
//显示
open(mode = "add") {
this.mode = mode;
this.visible = true;
return this;
},
//提交
submit() {
this.$refs.dialogForm.validate(async (valid) => {
if (valid) {
this.isSaveing = true;
try {
var res;
if (this.mode == "add") {
res = await this.$API.pum.supplier.create.req(this.form);
} else if (this.mode == "edit") {
res = await this.$API.pum.supplier.update.req(this.form.id,this.form);
}
this.isSaveing = false;
this.$emit("success", this.form, this.mode);
this.visible = false;
this.$message.success("操作成功");
} catch (err) {
//可以处理校验错误
this.isSaveing = false;
return err;
}
}
});
},
//表单注入数据
setData(data) {
Object.assign(this.form, data);
},
//设置过滤项
setFilters(filters) {
this.selectionFilters = filters;
this.setFiltersVisible = true;
},
},
};
</script>