factory_web/src/views/pum/order_form.vue

149 lines
4.1 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="120px"
>
<el-row>
<el-col :md="12" :sm="24">
<el-form-item label="订单编号" prop="number">
<el-input v-model="form.number" placeholder="订单编号"/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="供应商" prop="supplier">
<el-select
v-model="form.supplier"
placeholder="供应商"
clearable
style="width:100%"
>
<el-option
v-for="item in options"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="截止到货日期">
<el-date-picker
v-model="form.delivery_date"
type="date"
placeholder="截止到货日期"
value-format="YYYY-MM-DD"
style="width:100%"
>
</el-date-picker>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="提交时间">
<el-date-picker
v-model="form.submit_time"
type="datetime"
placeholder="提交时间"
value-format="YYYY-MM-DD HH:mm:ss"
style="width:100%"
>
</el-date-picker>
</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: {
number: [{required: true, message: "请输入采购订单编号", trigger: "blur"}]
},
visible: false,
isSaveing: false,
options: [],
setFiltersVisible: false,
};
},
mounted() {
this.getList();
},
methods: {
//显示
open(mode = "add",type) {
this.mode = mode;
this.visible = true;
return this;
},
getList(){
this.$API.pum.supplier.list.req({page:0}).then(res=>{
this.options = res;
})
},
//提交
submit() {
this.$refs.dialogForm.validate(async (valid) => {
if (valid) {
this.isSaveing = true;
try {
var res;
if (this.mode == "add") {
res = await this.$API.pum.order.create.req(this.form);
} else if (this.mode == "edit") {
res = await this.$API.pum.order.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>
<style>
</style>