fix:添加material中的cate选项

This commit is contained in:
shijing 2024-04-11 14:48:38 +08:00
parent 43ecf55818
commit bbff16431d
1 changed files with 376 additions and 248 deletions

View File

@ -1,256 +1,384 @@
<template> <template>
<el-dialog :title="titleMap[mode]" v-model="visible" :size="1000" destroy-on-close @closed="$emit('closed')"> <el-dialog
<el-container v-loading="loading"> :title="titleMap[mode]"
<el-main style="padding: 0 20px 20px 20px"> v-model="visible"
<el-form ref="dialogForm" :model="form" :rules="rules" label-width="120px"> :size="1000"
<el-row> destroy-on-close
<el-col :md="12" :sm="24"> @closed="$emit('closed')"
<el-form-item label="物料类别" prop="type"> >
<el-select v-model="form.type" placeholder="物料类别" clearable style="width:100%" @change="typeChange"> <el-container v-loading="loading">
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option> <el-main style="padding: 0 20px 20px 20px">
</el-select> <el-form
</el-form-item> ref="dialogForm"
</el-col> :model="form"
<el-col :md="12" :sm="24"> :rules="rules"
<el-form-item label="物料编号" prop="number"> label-width="120px"
<el-input v-model="form.number" placeholder="物料编号" /> >
</el-form-item> <el-row>
</el-col> <el-col :md="12" :sm="24">
<el-col :md="12" :sm="24" prop="name"> <el-form-item label="物料类别" prop="type">
<el-form-item label="物料名称"> <el-select
<el-input v-model="form.name" placeholder="物料名称" /> v-model="form.type"
</el-form-item> placeholder="物料类别"
</el-col> clearable
<el-col :md="12" :sm="24" prop="cate"> style="width: 100%"
<el-form-item label="物料系列"> @change="typeChange"
<el-input v-model="form.cate" placeholder="物料系列" /> >
</el-form-item> <el-option
</el-col> v-for="item in options"
<el-col :md="12" :sm="24"> :key="item.id"
<el-form-item label="规格"> :label="item.name"
<el-input v-model="form.specification" placeholder="规格" /> :value="item.id"
</el-form-item> ></el-option>
</el-col> </el-select>
<el-col :md="12" :sm="24"> </el-form-item>
<el-form-item label="型号"> </el-col>
<el-input v-model="form.model" placeholder="型号" /> <el-col :md="12" :sm="24">
</el-form-item> <el-form-item label="物料编号" prop="number">
</el-col> <el-input
<el-col :md="12" :sm="24"> v-model="form.number"
<el-form-item label="关联物料"> placeholder="物料编号"
<el-select v-model="brothers" placeholder="关联物料" clearable multiple style="width:100%"> />
<el-option v-for="item in materialOptions" :key="item.id" :label="item.label" :value="item.id" /> </el-form-item>
</el-select> </el-col>
</el-form-item> <el-col :md="12" :sm="24" prop="name">
</el-col> <el-form-item label="物料名称">
<el-col :md="12" :sm="24"> <el-input
<el-form-item label="已到工序" prop="process"> v-model="form.name"
<el-select v-model="form.process" placeholder="已到工序" clearable style="width:100%"> placeholder="物料名称"
<el-option v-for="item in processOptions" :key="item.id" :label="item.name" :value="item.id" /> />
</el-select> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :md="12" :sm="24" prop="cate">
<el-col :md="12" :sm="24"> <el-form-item label="物料系列">
<el-form-item label="工艺路线" prop="need_route"> <el-select
<el-switch v-model="form.need_route" /> v-model="form.cate"
</el-form-item> placeholder="物料系列"
</el-col> clearable
<el-col :md="12" :sm="24"> style="width: 100%"
<el-form-item label="是否隐藏" prop="is_hidden"> >
<el-switch v-model="form.is_hidden" /> <el-option
</el-form-item> v-for="item in cateOptions"
</el-col> :key="item.id"
<el-col :md="12" :sm="24"> :label="item.name"
<el-form-item label="安全库存" prop="count_safe"> :value="item.id"
<el-input-number v-model="form.count_safe" :min="0" /> ></el-option>
</el-form-item> </el-select>
</el-col> </el-form-item>
<el-col :md="12" :sm="24"> </el-col>
<el-form-item label="组合件" prop="is_assemb"> <el-col :md="12" :sm="24">
<el-switch v-model="form.is_assemb" /> <el-form-item label="规格">
<el-button v-if="form.is_assemb" type="primary" icon="el-icon-plus" style="margin-left: 20px;" <el-input
@click="addComponent"></el-button> v-model="form.specification"
</el-form-item> placeholder="规格"
</el-col> />
</el-row> </el-form-item>
<el-row v-if="form.is_assemb"> </el-col>
<template v-for="(item, $index) in componentList" :key="item.id"> <el-col :md="12" :sm="24">
<el-col :md="11" :sm="24"> <el-form-item label="型号">
<el-form-item label="物料名称"> <el-input
<el-select v-model="item.id" placeholder="物料名称" clearable style="width:100%"> v-model="form.model"
<el-option v-for="item in materialOptions" :key="item.id" :label="item.full_name" :value="item.id" /> placeholder="型号"
</el-select> />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :md="11" :sm="24"> <el-col :md="12" :sm="24">
<el-form-item label="数量"> <el-form-item label="关联物料">
<el-input-number v-model="item.count" controls-position="right" placeholder="数量" clearable <el-select
style="width:100%"></el-input-number> v-model="brothers"
</el-form-item> placeholder="关联物料"
</el-col> clearable
<el-col :md="2"> multiple
<div style="text-align: center;"> style="width: 100%"
<el-icon class="deleteIcons" @click="delComponent($index)"> >
<CircleCloseFilled /> <el-option
</el-icon> v-for="item in materialOptions"
</div> :key="item.id"
</el-col> :label="item.label"
</template> :value="item.id"
</el-row> />
</el-form> </el-select>
</el-main> </el-form-item>
<el-footer> </el-col>
<el-button type="primary" :loading="isSaveing" @click="submit">保存</el-button> <el-col :md="12" :sm="24">
<el-button @click="visible = false">取消</el-button> <el-form-item label="已到工序" prop="process">
</el-footer> <el-select
</el-container> v-model="form.process"
</el-dialog> placeholder="已到工序"
clearable
style="width: 100%"
>
<el-option
v-for="item in processOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="工艺路线" prop="need_route">
<el-switch v-model="form.need_route" />
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="是否隐藏" prop="is_hidden">
<el-switch v-model="form.is_hidden" />
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="安全库存" prop="count_safe">
<el-input-number
v-model="form.count_safe"
:min="0"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="组合件" prop="is_assemb">
<el-switch v-model="form.is_assemb" />
<el-button
v-if="form.is_assemb"
type="primary"
icon="el-icon-plus"
style="margin-left: 20px"
@click="addComponent"
></el-button>
</el-form-item>
</el-col>
</el-row>
<el-row v-if="form.is_assemb">
<template
v-for="(item, $index) in componentList"
:key="item.id"
>
<el-col :md="11" :sm="24">
<el-form-item label="物料名称">
<el-select
v-model="item.id"
placeholder="物料名称"
clearable
style="width: 100%"
>
<el-option
v-for="item in materialOptions"
:key="item.id"
:label="item.full_name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :md="11" :sm="24">
<el-form-item label="数量">
<el-input-number
v-model="item.count"
controls-position="right"
placeholder="数量"
clearable
style="width: 100%"
></el-input-number>
</el-form-item>
</el-col>
<el-col :md="2">
<div style="text-align: center">
<el-icon
class="deleteIcons"
@click="delComponent($index)"
>
<CircleCloseFilled />
</el-icon>
</div>
</el-col>
</template>
</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> </template>
<script> <script>
export default { export default {
emits: ["success", "closed"], emits: ["success", "closed"],
data() { data() {
return { return {
loading: false, loading: false,
mode: "add", mode: "add",
titleMap: { titleMap: {
add: "新增物料", add: "新增物料",
edit: "编辑物料", edit: "编辑物料",
show: "查看物料", show: "查看物料",
}, },
brothers: [], brothers: [],
form: {}, form: {},
rules: { rules: {
name: [{ required: true, message: "请输入物料名称", trigger: "blur" }], name: [
type: [{ required: true, message: "请选择物料类别", trigger: "blur" }], {
number: [{ required: true, message: "请输入物料编号", trigger: "blur" }], required: true,
}, message: "请输入物料名称",
visible: false, trigger: "blur",
isSaveing: false, },
options: [ ],
{ id: 0, name: '电/水/气' }, type: [
{ id: 10, name: '成品' }, {
{ id: 20, name: '半成品' }, required: true,
{ id: 30, name: '主要原料' }, message: "请选择物料类别",
{ id: 40, name: '辅助材料' }, trigger: "blur",
{ id: 50, name: '加工工具' }, },
{ id: 60, name: '辅助工装' }, ],
{ id: 70, name: '办公用品' }, number: [
], {
handle_user: [], required: true,
selectionFilters: [], message: "请输入物料编号",
materialOptions: [], trigger: "blur",
setFiltersVisible: false, },
processOptions: [], ],
componentList: [ },
{ id: '', count: 1 } visible: false,
], isSaveing: false,
}; cateOptions: [
}, { id: "bang", name: "棒" },
mounted() { { id: "guan", name: "管" },
this.getProcessOptions() { id: "bangguan", name: "棒管" },
}, { id: "huiliao", name: "混料" },
methods: { ],
getProcessOptions() { options: [
this.$API.mtm.process.list.req({ page: 0 }).then(res => { { id: 0, name: "电/水/气" },
this.processOptions = res { id: 10, name: "成品" },
}) { id: 20, name: "半成品" },
}, { id: 30, name: "主要原料" },
// { id: 40, name: "辅助材料" },
open(mode = "add", type) { { id: 50, name: "加工工具" },
this.mode = mode; { id: 60, name: "辅助工装" },
this.visible = true; { id: 70, name: "办公用品" },
return this; ],
}, handle_user: [],
getMaterial(val) { selectionFilters: [],
let that = this; materialOptions: [],
let query = {}; setFiltersVisible: false,
query.type = val; processOptions: [],
query.page = 0; componentList: [{ id: "", count: 1 }],
query.is_hidden = false; };
this.$API.mtm.material.list.req(query).then(res => { },
that.materialOptions = []; mounted() {
res.forEach(item => { this.getProcessOptions();
item.label = item.name + '—' + item.specification + '/' + item.model; },
}) methods: {
that.materialOptions = res; getProcessOptions() {
}) this.$API.mtm.process.list.req({ page: 0 }).then((res) => {
}, this.processOptions = res;
typeChange(val) { });
this.getMaterial(val); },
}, //
// open(mode = "add", type) {
submit() { this.mode = mode;
this.$refs.dialogForm.validate(async (valid) => { this.visible = true;
if (valid) { return this;
this.isSaveing = true; },
this.form.brothers = this.brothers; getMaterial(val) {
if (this.form.is_assemb) { let that = this;
let obj = {}; let query = {};
this.componentList.forEach(item => { query.type = val;
obj[item.id] = item.count; query.page = 0;
}) query.is_hidden = false;
this.form.components = obj; this.$API.mtm.material.list.req(query).then((res) => {
} that.materialOptions = [];
if (this.mode == "add") { res.forEach((item) => {
this.$API.mtm.material.create.req(this.form).then(res => { item.label =
this.isSaveing = false; item.name + "—" + item.specification + "/" + item.model;
this.$emit("success", this.form, this.mode); });
this.visible = false; that.materialOptions = res;
this.$message.success("操作成功"); });
}).catch(() => { },
this.isSaveing = false; typeChange(val) {
this.visible = false; this.getMaterial(val);
}) },
} else if (this.mode == "edit") { //
this.$API.mtm.material.update.req(this.form.id, this.form).then(res => { submit() {
this.isSaveing = false; this.$refs.dialogForm.validate(async (valid) => {
this.$emit("success", this.form, this.mode); if (valid) {
this.visible = false; this.isSaveing = true;
this.$message.success("操作成功"); this.form.brothers = this.brothers;
}).catch(() => { if (this.form.is_assemb) {
this.isSaveing = false; let obj = {};
}) this.componentList.forEach((item) => {
} obj[item.id] = item.count;
} });
}); this.form.components = obj;
}, }
// if (this.mode == "add") {
setData(data) { this.$API.mtm.material.create
Object.assign(this.form, data); .req(this.form)
this.brothers = data.brothers; .then((res) => {
let arr = []; this.isSaveing = false;
for (let key in data.components) { this.$emit("success", this.form, this.mode);
let obj = {}; this.visible = false;
obj.id = key; this.$message.success("操作成功");
obj.count = data.components[key] })
arr.push(obj) .catch(() => {
} this.isSaveing = false;
this.componentList = arr; this.visible = false;
this.getMaterial(data.type) });
}, } else if (this.mode == "edit") {
addComponent() { this.$API.mtm.material.update
let obj = {}; .req(this.form.id, this.form)
obj.id = ''; .then((res) => {
obj.count = 1; this.isSaveing = false;
this.componentList.push(obj) this.$emit("success", this.form, this.mode);
}, this.visible = false;
delComponent(index) { this.$message.success("操作成功");
this.componentList.splice(index, 1); })
console.log('this.componentList:', this.componentList); .catch(() => {
}, this.isSaveing = false;
// });
setFilters(filters) { }
this.selectionFilters = filters; }
this.setFiltersVisible = true; });
}, },
}, //
setData(data) {
Object.assign(this.form, data);
this.brothers = data.brothers;
let arr = [];
for (let key in data.components) {
let obj = {};
obj.id = key;
obj.count = data.components[key];
arr.push(obj);
}
this.componentList = arr;
this.getMaterial(data.type);
},
addComponent() {
let obj = {};
obj.id = "";
obj.count = 1;
this.componentList.push(obj);
},
delComponent(index) {
this.componentList.splice(index, 1);
console.log("this.componentList:", this.componentList);
},
//
setFilters(filters) {
this.selectionFilters = filters;
this.setFiltersVisible = true;
},
},
}; };
</script> </script>
<style> <style>
.deleteIcons { .deleteIcons {
color: #f56c6c; color: #f56c6c;
font-size: 25px; font-size: 25px;
line-height: 34px; line-height: 34px;
height: 34px; height: 34px;
}</style> }
</style>