From 44f3e3fc682bd5aef9b5d47d5d421e6a8736199f Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Mon, 6 May 2024 16:27:52 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E8=AE=BE=E5=A4=87=E5=88=86=E7=B1=BB?=
 =?UTF-8?q?=E5=A2=9E=E5=88=A0=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/em/ecate.vue      | 296 +++++++++++++++++++++---------------
 src/views/em/ecate_form.vue | 167 ++++++++++++++++++++
 2 files changed, 342 insertions(+), 121 deletions(-)
 create mode 100644 src/views/em/ecate_form.vue

diff --git a/src/views/em/ecate.vue b/src/views/em/ecate.vue
index 8832f9e4..b479e502 100644
--- a/src/views/em/ecate.vue
+++ b/src/views/em/ecate.vue
@@ -1,126 +1,180 @@
 <template>
-    <el-container>
-        <el-header>
-            <div class="left-panel">
-                <el-button type="primary" icon="el-icon-plus" v-auth="'ecate.create'" @click="add"></el-button>
-            </div>
-        </el-header>
-        <el-main class="nopadding">
-            <scTable ref="table" :apiObj="apiObj" row-key="id" stripe :query="query">
-                <el-table-column type="index" width="50" />
-                <el-table-column label="名称" prop="name" show-overflow-tooltip>
-                </el-table-column>
-                <el-table-column label="编码" prop="code" show-overflow-tooltip></el-table-column>
-                <el-table-column label="类型" show-overflow-tooltip>
-                    <template #default="scope">
-                        <span>{{ typeOptions_[scope.row.type] }}</span>
-                    </template>
-                </el-table-column>
-                <el-table-column label="是否用于安全" show-overflow-tooltip>
-                    <template #default="scope">
-                        <el-icon v-if="scope.row.is_for_safe" color="green">
-                            <CircleCheckFilled />
-                        </el-icon>
-                    </template>
-                </el-table-column>
-                <el-table-column label="是否用于环保" show-overflow-tooltip>
-                    <template #default="scope">
-                        <el-icon v-if="scope.row.is_for_enp" color="green">
-                            <CircleCheckFilled />
-                        </el-icon>
-                    </template>
-                </el-table-column>
-                <el-table-column label="是否为车辆" show-overflow-tooltip>
-                    <template #default="scope">
-                        <el-icon v-if="scope.row.is_car" color="green">
-                            <CircleCheckFilled />
-                        </el-icon>
-                    </template>
-                </el-table-column>
-            </scTable>
-        </el-main>
-    </el-container>
+	<el-container>
+		<el-header>
+			<div class="left-panel">
+				<el-button
+					type="primary"
+					icon="el-icon-plus"
+					v-auth="'ecate.create'"
+					@click="add"
+				></el-button>
+			</div>
+		</el-header>
+		<el-main class="nopadding">
+			<scTable
+				ref="table"
+				:apiObj="apiObj"
+				row-key="id"
+				stripe
+				:query="query"
+			>
+				<el-table-column type="index" width="50" />
+				<el-table-column label="名称" prop="name" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column
+					label="编码"
+					prop="code"
+					show-overflow-tooltip
+				></el-table-column>
+				<el-table-column label="类型" show-overflow-tooltip>
+					<template #default="scope">
+						<span>{{ typeOptions_[scope.row.type] }}</span>
+					</template>
+				</el-table-column>
+				<el-table-column label="是否用于安全" show-overflow-tooltip>
+					<template #default="scope">
+						<el-icon v-if="scope.row.is_for_safe" color="green">
+							<CircleCheckFilled />
+						</el-icon>
+					</template>
+				</el-table-column>
+				<el-table-column label="是否用于环保" show-overflow-tooltip>
+					<template #default="scope">
+						<el-icon v-if="scope.row.is_for_enp" color="green">
+							<CircleCheckFilled />
+						</el-icon>
+					</template>
+				</el-table-column>
+				<el-table-column label="是否为车辆" show-overflow-tooltip>
+					<template #default="scope">
+						<el-icon v-if="scope.row.is_car" color="green">
+							<CircleCheckFilled />
+						</el-icon>
+					</template>
+				</el-table-column>
+				<el-table-column
+					label="操作"
+					fixed="right"
+					align="left"
+					width="100"
+				>
+					<template #default="scope">
+						<el-button
+							link
+							type="primary"
+							@click="table_edit(scope.row)"
+							v-auth="'equipment.update'"
+						>
+							编辑
+						</el-button>
+						<el-popconfirm
+							title="确定删除吗？"
+							@confirm="table_del(scope.row)"
+							v-auth="'equipment.delete'"
+						>
+							<template #reference>
+								<el-button link type="danger">删除</el-button>
+							</template>
+						</el-popconfirm>
+					</template>
+				</el-table-column>
+			</scTable>
+		</el-main>
+		<save-dialog
+			v-if="dialog.save"
+			ref="saveDialog"
+			@success="handleSaveSuccess"
+			@closed="dialog.save = false"
+		></save-dialog>
+	</el-container>
 </template>
 <script>
+import saveDialog from "./ecate_form.vue";
 export default {
-    data() {
-        return {
-            apiObj: this.$API.em.ecate.list,
-            query: {},
-            typeOptions_: {
-                10: '生产设备',
-                20: '计量设备',
-                30: '治理设备',
-                40: '监测设备',
-                50: '监控设备',
-            },
-            typeOptions: [
-                { id: 10, name: '生产设备' },
-                { id: 20, name: '计量设备' },
-                { id: 30, name: '治理设备' },
-                { id: 40, name: '监测设备' },
-                { id: 50, name: '监控设备' }
-            ],
-        };
-    },
-    methods: {
-        //添加
-        add() {
-            this.dialog.save = true;
-            this.$nextTick(() => {
-                this.$refs.saveDialog.open("add", 20);
-            });
-        },
-        //编辑
-        table_edit(row) {
-            this.dialog.save = true;
-            this.$nextTick(() => {
-                this.$refs.saveDialog.open("edit", 20).setData(row);
-            });
-        },
-        //删除
-        async table_del(row) {
-            this.$API.em.equipment.delete
-                .req(row.id)
-                .then((res) => {
-                    this.$message.success("删除成功");
-                    this.$refs.table.refresh();
-                })
-                .catch((err) => {
-                    return err;
-                });
-        },
-        //提交检验
-        submit() {
-            this.$refs.dialogForm.validate(async (valid) => {
-                if (valid) {
-                    this.isSaveing = true;
-                    this.$API.em.echeckrecord.create.req(this.form).then(res => {
-                        this.visible = false;
-                        this.isSaveing = false;
-                        this.$message.success("操作成功");
-                        this.$refs.drawer_table.refresh();
-                        this.$refs.table.refresh();
-                    }).catch(() => {
-                        this.isSaveing = false;
-                    })
-                }
-            });
-        },
-        //本地更新数据
-        handleSaveSuccess(data, mode) {
-            if (mode == "add") {
-                this.$refs.table.refresh();
-            } else if (mode == "edit") {
-                this.$refs.table.refresh();
-            }
-        },
-        handleQuery() {
-            this.$refs.table.queryData(this.query)
-        },
-        resetQuery() {
-            this.query = {};
-        },
-    },
+	name: "设备类型",
+	components: {
+		saveDialog,
+	},
+	data() {
+		return {
+			apiObj: this.$API.em.ecate.list,
+			query: {},
+			typeOptions_: {
+				10: "生产设备",
+				20: "计量设备",
+				30: "治理设备",
+				40: "监测设备",
+				50: "监控设备",
+			},
+			dialog: {
+				save: false,
+			},
+			typeOptions: [
+				{ id: 10, name: "生产设备" },
+				{ id: 20, name: "计量设备" },
+				{ id: 30, name: "治理设备" },
+				{ id: 40, name: "监测设备" },
+				{ id: 50, name: "监控设备" },
+			],
+		};
+	},
+	methods: {
+		//添加
+		add() {
+			this.dialog.save = true;
+			this.$nextTick(() => {
+				this.$refs.saveDialog.open("add");
+			});
+		},
+		//编辑
+		table_edit(row) {
+			this.dialog.save = true;
+			this.$nextTick(() => {
+				this.$refs.saveDialog.open("edit").setData(row);
+			});
+		},
+		//删除
+		async table_del(row) {
+			this.$API.em.ecate.delete
+				.req(row.id)
+				.then((res) => {
+					this.$message.success("删除成功");
+					this.$refs.table.refresh();
+				})
+				.catch((err) => {
+					return err;
+				});
+		},
+		//提交检验
+		submit() {
+			this.$refs.dialogForm.validate(async (valid) => {
+				if (valid) {
+					this.isSaveing = true;
+					this.$API.em.echeckrecord.create
+						.req(this.form)
+						.then((res) => {
+							this.visible = false;
+							this.isSaveing = false;
+							this.$message.success("操作成功");
+							this.$refs.drawer_table.refresh();
+							this.$refs.table.refresh();
+						})
+						.catch(() => {
+							this.isSaveing = false;
+						});
+				}
+			});
+		},
+		//本地更新数据
+		handleSaveSuccess(data, mode) {
+			this.$refs.table.refresh();
+		},
+		handleQuery() {
+			this.$refs.table.queryData(this.query);
+		},
+		resetQuery() {
+			this.query = {};
+		},
+	},
 };
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/em/ecate_form.vue b/src/views/em/ecate_form.vue
new file mode 100644
index 00000000..2a7ec819
--- /dev/null
+++ b/src/views/em/ecate_form.vue
@@ -0,0 +1,167 @@
+<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"
+					:disabled="mode == 'show'"
+					label-width="120px"
+				>
+					<el-row>
+						<el-col :md="12" :sm="24">
+							<el-form-item label="名称" prop="name">
+								<el-input
+									v-model="form.name"
+									clearable
+								></el-input>
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24" prop="type">
+							<el-form-item label="类型">
+								<el-select
+									v-model="form.type"
+									style="width: 100%"
+								>
+									<el-option
+										v-for="e in eqTypeEnum.values"
+										:key="e.key"
+										:value="e.key"
+										:label="e.text"
+									></el-option>
+								</el-select>
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24">
+							<el-form-item label="编号">
+								<el-input
+									v-model="form.code"
+									clearable
+								></el-input>
+							</el-form-item>
+						</el-col>
+					</el-row>
+					<el-row>
+						<el-col :md="12" :sm="24">
+							<el-form-item label="是否用于安全">
+								<el-switch v-model="form.is_for_safe" />
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24">
+							<el-form-item label="是否用于环保">
+								<el-switch v-model="form.is_for_enp" />
+							</el-form-item>
+						</el-col>
+						<el-col :md="12" :sm="24">
+							<el-form-item label="是否为车辆">
+								<el-switch v-model="form.is_car" />
+							</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>
+import { eqTypeEnum } from "@/utils/enum.js";
+export default {
+	emits: ["success", "closed"],
+	data() {
+		return {
+			eqTypeEnum,
+			loading: false,
+			mode: "add",
+			titleMap: {
+				add: "新增",
+				edit: "编辑",
+				show: "查看",
+			},
+			form: {
+				name: "",
+				code: "",
+				type: 10,
+				is_for_safe: false,
+				is_for_enp: false,
+				is_car: false,
+			},
+			rules: {
+				name: [{ required: true, message: "请输入类型名称" }],
+				type: [{ required: true, message: "请请选择设备类型" }],
+			},
+			visible: false,
+			isSaveing: false,
+		};
+	},
+	mounted() {},
+	methods: {
+		//显示
+		open(mode = "add") {
+			this.mode = mode;
+			this.visible = true;
+			return this;
+		},
+		//表单提交方法
+		submit() {
+			this.$refs.dialogForm.validate(async (valid) => {
+				if (valid) {
+					this.isSaveing = true;
+					if (this.mode == "add") {
+						this.$API.em.ecate.create
+							.req(this.form)
+							.then((res) => {
+								this.isSaveing = false;
+								this.$emit("success");
+								this.visible = false;
+								this.$message.success("操作成功");
+							})
+							.catch((res) => {
+								this.isSaveing = false;
+							});
+					} else if (this.mode == "edit") {
+						this.$API.em.ecate.update
+							.req(this.form.id, this.form)
+							.then((res) => {
+								this.isSaveing = false;
+								this.$emit("success");
+								this.visible = false;
+								this.$message.success("操作成功");
+							})
+							.catch((res) => {
+								this.isSaveing = false;
+							});
+					}
+				}
+			});
+		},
+		//表单注入数据
+		setData(data) {
+			Object.assign(this.form, data);
+		},
+		//设置过滤项
+		setFilters(filters) {
+			this.selectionFilters = filters;
+		},
+	},
+};
+</script>
+
+<style>
+.formItem {
+	width: 100%;
+}
+</style>