From bbff16431dcd3232fca06e0e82fb28aaa9675541 Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Thu, 11 Apr 2024 14:48:38 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E6=B7=BB=E5=8A=A0material=E4=B8=AD?=
 =?UTF-8?q?=E7=9A=84cate=E9=80=89=E9=A1=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/mtm/materials_form.vue | 624 +++++++++++++++++++------------
 1 file changed, 376 insertions(+), 248 deletions(-)

diff --git a/src/views/mtm/materials_form.vue b/src/views/mtm/materials_form.vue
index 7a772bfe..e3cacae5 100644
--- a/src/views/mtm/materials_form.vue
+++ b/src/views/mtm/materials_form.vue
@@ -1,256 +1,384 @@
 <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="type">
-                <el-select v-model="form.type" placeholder="物料类别" clearable style="width:100%" @change="typeChange">
-                  <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="物料编号" prop="number">
-                <el-input v-model="form.number" placeholder="物料编号" />
-              </el-form-item>
-            </el-col>
-            <el-col :md="12" :sm="24" prop="name">
-              <el-form-item label="物料名称">
-                <el-input v-model="form.name" placeholder="物料名称" />
-              </el-form-item>
-            </el-col>
-            <el-col :md="12" :sm="24" prop="cate">
-              <el-form-item label="物料系列">
-                <el-input v-model="form.cate" placeholder="物料系列" />
-              </el-form-item>
-            </el-col>
-            <el-col :md="12" :sm="24">
-              <el-form-item label="规格">
-                <el-input v-model="form.specification" placeholder="规格" />
-              </el-form-item>
-            </el-col>
-            <el-col :md="12" :sm="24">
-              <el-form-item label="型号">
-                <el-input v-model="form.model" placeholder="型号" />
-              </el-form-item>
-            </el-col>
-            <el-col :md="12" :sm="24">
-              <el-form-item label="关联物料">
-                <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-select>
-              </el-form-item>
-            </el-col>
-            <el-col :md="12" :sm="24">
-              <el-form-item label="已到工序" prop="process">
-                <el-select v-model="form.process" 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>
+	<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="type">
+								<el-select
+									v-model="form.type"
+									placeholder="物料类别"
+									clearable
+									style="width: 100%"
+									@change="typeChange"
+								>
+									<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="物料编号" prop="number">
+								<el-input
+									v-model="form.number"
+									placeholder="物料编号"
+								/>
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24" prop="name">
+							<el-form-item label="物料名称">
+								<el-input
+									v-model="form.name"
+									placeholder="物料名称"
+								/>
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24" prop="cate">
+							<el-form-item label="物料系列">
+								<el-select
+									v-model="form.cate"
+									placeholder="物料系列"
+									clearable
+									style="width: 100%"
+								>
+									<el-option
+										v-for="item in cateOptions"
+										: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-input
+									v-model="form.specification"
+									placeholder="规格"
+								/>
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24">
+							<el-form-item label="型号">
+								<el-input
+									v-model="form.model"
+									placeholder="型号"
+								/>
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24">
+							<el-form-item label="关联物料">
+								<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-select>
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24">
+							<el-form-item label="已到工序" prop="process">
+								<el-select
+									v-model="form.process"
+									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>
 <script>
 export default {
-  emits: ["success", "closed"],
-  data() {
-    return {
-      loading: false,
-      mode: "add",
-      titleMap: {
-        add: "新增物料",
-        edit: "编辑物料",
-        show: "查看物料",
-      },
-      brothers: [],
-      form: {},
-      rules: {
-        name: [{ required: true, message: "请输入物料名称", trigger: "blur" }],
-        type: [{ required: true, message: "请选择物料类别", trigger: "blur" }],
-        number: [{ required: true, message: "请输入物料编号", trigger: "blur" }],
-      },
-      visible: false,
-      isSaveing: false,
-      options: [
-        { id: 0, name: '电/水/气' },
-        { id: 10, name: '成品' },
-        { id: 20, name: '半成品' },
-        { id: 30, name: '主要原料' },
-        { id: 40, name: '辅助材料' },
-        { id: 50, name: '加工工具' },
-        { id: 60, name: '辅助工装' },
-        { id: 70, name: '办公用品' },
-      ],
-      handle_user: [],
-      selectionFilters: [],
-      materialOptions: [],
-      setFiltersVisible: false,
-      processOptions: [],
-      componentList: [
-        { id: '', count: 1 }
-      ],
-    };
-  },
-  mounted() {
-    this.getProcessOptions()
-  },
-  methods: {
-    getProcessOptions() {
-      this.$API.mtm.process.list.req({ page: 0 }).then(res => {
-        this.processOptions = res
-      })
-    },
-    //显示
-    open(mode = "add", type) {
-      this.mode = mode;
-      this.visible = true;
-      return this;
-    },
-    getMaterial(val) {
-      let that = this;
-      let query = {};
-      query.type = val;
-      query.page = 0;
-      query.is_hidden = false;
-      this.$API.mtm.material.list.req(query).then(res => {
-        that.materialOptions = [];
-        res.forEach(item => {
-          item.label = item.name + '—' + item.specification + '/' + item.model;
-        })
-        that.materialOptions = res;
-      })
-    },
-    typeChange(val) {
-      this.getMaterial(val);
-    },
-    //提交
-    submit() {
-      this.$refs.dialogForm.validate(async (valid) => {
-        if (valid) {
-          this.isSaveing = true;
-          this.form.brothers = this.brothers;
-          if (this.form.is_assemb) {
-            let obj = {};
-            this.componentList.forEach(item => {
-              obj[item.id] = item.count;
-            })
-            this.form.components = obj;
-          }
-          if (this.mode == "add") {
-            this.$API.mtm.material.create.req(this.form).then(res => {
-              this.isSaveing = false;
-              this.$emit("success", this.form, this.mode);
-              this.visible = false;
-              this.$message.success("操作成功");
-            }).catch(() => {
-              this.isSaveing = false;
-              this.visible = false;
-            })
-          } else if (this.mode == "edit") {
-            this.$API.mtm.material.update.req(this.form.id, this.form).then(res => {
-              this.isSaveing = false;
-              this.$emit("success", this.form, this.mode);
-              this.visible = false;
-              this.$message.success("操作成功");
-            }).catch(() => {
-              this.isSaveing = false;
-            })
-          }
-        }
-      });
-    },
-    //表单注入数据
-    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;
-    },
-  },
+	emits: ["success", "closed"],
+	data() {
+		return {
+			loading: false,
+			mode: "add",
+			titleMap: {
+				add: "新增物料",
+				edit: "编辑物料",
+				show: "查看物料",
+			},
+			brothers: [],
+			form: {},
+			rules: {
+				name: [
+					{
+						required: true,
+						message: "请输入物料名称",
+						trigger: "blur",
+					},
+				],
+				type: [
+					{
+						required: true,
+						message: "请选择物料类别",
+						trigger: "blur",
+					},
+				],
+				number: [
+					{
+						required: true,
+						message: "请输入物料编号",
+						trigger: "blur",
+					},
+				],
+			},
+			visible: false,
+			isSaveing: false,
+			cateOptions: [
+				{ id: "bang", name: "棒" },
+				{ id: "guan", name: "管" },
+				{ id: "bangguan", name: "棒管" },
+				{ id: "huiliao", name: "混料" },
+			],
+			options: [
+				{ id: 0, name: "电/水/气" },
+				{ id: 10, name: "成品" },
+				{ id: 20, name: "半成品" },
+				{ id: 30, name: "主要原料" },
+				{ id: 40, name: "辅助材料" },
+				{ id: 50, name: "加工工具" },
+				{ id: 60, name: "辅助工装" },
+				{ id: 70, name: "办公用品" },
+			],
+			handle_user: [],
+			selectionFilters: [],
+			materialOptions: [],
+			setFiltersVisible: false,
+			processOptions: [],
+			componentList: [{ id: "", count: 1 }],
+		};
+	},
+	mounted() {
+		this.getProcessOptions();
+	},
+	methods: {
+		getProcessOptions() {
+			this.$API.mtm.process.list.req({ page: 0 }).then((res) => {
+				this.processOptions = res;
+			});
+		},
+		//显示
+		open(mode = "add", type) {
+			this.mode = mode;
+			this.visible = true;
+			return this;
+		},
+		getMaterial(val) {
+			let that = this;
+			let query = {};
+			query.type = val;
+			query.page = 0;
+			query.is_hidden = false;
+			this.$API.mtm.material.list.req(query).then((res) => {
+				that.materialOptions = [];
+				res.forEach((item) => {
+					item.label =
+						item.name + "—" + item.specification + "/" + item.model;
+				});
+				that.materialOptions = res;
+			});
+		},
+		typeChange(val) {
+			this.getMaterial(val);
+		},
+		//提交
+		submit() {
+			this.$refs.dialogForm.validate(async (valid) => {
+				if (valid) {
+					this.isSaveing = true;
+					this.form.brothers = this.brothers;
+					if (this.form.is_assemb) {
+						let obj = {};
+						this.componentList.forEach((item) => {
+							obj[item.id] = item.count;
+						});
+						this.form.components = obj;
+					}
+					if (this.mode == "add") {
+						this.$API.mtm.material.create
+							.req(this.form)
+							.then((res) => {
+								this.isSaveing = false;
+								this.$emit("success", this.form, this.mode);
+								this.visible = false;
+								this.$message.success("操作成功");
+							})
+							.catch(() => {
+								this.isSaveing = false;
+								this.visible = false;
+							});
+					} else if (this.mode == "edit") {
+						this.$API.mtm.material.update
+							.req(this.form.id, this.form)
+							.then((res) => {
+								this.isSaveing = false;
+								this.$emit("success", this.form, this.mode);
+								this.visible = false;
+								this.$message.success("操作成功");
+							})
+							.catch(() => {
+								this.isSaveing = false;
+							});
+					}
+				}
+			});
+		},
+		//表单注入数据
+		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>
 <style>
 .deleteIcons {
-  color: #f56c6c;
-  font-size: 25px;
-  line-height: 34px;
-  height: 34px;
-}</style>
+	color: #f56c6c;
+	font-size: 25px;
+	line-height: 34px;
+	height: 34px;
+}
+</style>