设备保养

src/views/equipment/base/inspection/Record/addContent.vue

@@ -0,0 +1,312 @@
+<!--
+ * @Author: zwq
+ * @Date: 2021-11-18 14:16:25
+ * @LastEditors: DY
+ * @LastEditTime: 2024-02-24 19:02:14
+ * @Description:
+-->
+<template>
+	<el-drawer
+		:visible.sync="visible"
+		:show-close="false"
+		:wrapper-closable="isdetail"
+		class="drawer"
+		size="60%">
+		<small-title slot="title" :no-padding="true">
+			{{ '设备巡检记录详情' }}
+		</small-title>
+		<div class="content">
+			<div class="visual-part">
+        <el-row :gutter="20">
+          <el-col :span="8">
+            <div class="blodTip">巡检单名称</div>
+            <div class="lightTip">{{ dataForm.planMaintainWorker }}</div>
+          </el-col>
+					<el-col :span="8">
+            <div class="blodTip">部门</div>
+            <div class="lightTip">{{ dataForm.maintainWorker }}</div>
+          </el-col>
+					<el-col :span="8">
+            <div class="blodTip">班次</div>
+            <div class="lightTip">{{ dataForm.maintainWorker }}</div>
+          </el-col>
+        </el-row>
+				<el-row :gutter="20">
+          <el-col :span="8">
+            <div class="blodTip">巡检人</div>
+            <div class="lightTip">{{ dataForm.responsible }}</div>
+          </el-col>
+					<el-col :span="8">
+            <div class="blodTip">巡检时间</div>
+            <div class="lightTip">{{ parseTime(dataForm.actualTime) }}</div>
+          </el-col>
+					<el-col :span="8">
+            <div class="blodTip">确认人</div>
+            <div class="lightTip">{{ dataForm.maintainWorker }}</div>
+          </el-col>
+        </el-row>
+			</div>
+			
+			<div class="attr-list" v-if="idAttrShow">
+				<small-title
+					style="margin: 16px 0; padding-left: 8px"
+					:no-padding="true">
+					巡检内容
+				</small-title>
+
+				<div v-if="!isdetail" class="action_btn">
+          <template>
+            <span style="display: inline-block;">
+              <el-button type="text" @click="addNew()" icon="el-icon-plus">新增</el-button>
+            </span>
+          </template>
+        </div>
+				<base-table
+					:table-props="tableProps"
+					:page="listQuery.pageNo"
+					:limit="listQuery.pageSize"
+					:table-data="planList">
+					<method-btn
+						v-if="!isdetail"
+						slot="handleBtn"
+						:width="120"
+						label="操作"
+						:method-list="tableBtn"
+						@clickBtn="handleClick" />
+				</base-table>
+				<pagination
+					v-show="listQuery.total > 0"
+					:total="listQuery.total"
+					:page.sync="listQuery.pageNo"
+					:limit.sync="listQuery.pageSize"
+					:page-sizes="[5, 10, 15]"
+					@pagination="getList" />
+			</div>
+
+			<div v-if="!isdetail" class="drawer-body__footer">
+				<el-button style="" @click="goback()">取消</el-button>
+				<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			</div>
+
+		</div>
+
+		<!-- <attr-add
+			v-if="addOrUpdateVisible"
+			ref="addOrUpdate"
+			:plan-id="dataForm.id"
+			@refreshDataList="getList" /> -->
+	</el-drawer>
+</template>
+
+<script>
+import basicAdd from '../../../../core/mixins/basic-add';
+import { getEqCheckLog, deleteCheckOrderDet, getCheckOrderDetPage } from '@/api/equipment/base/inspection/record';
+// import { listData } from "@/api/system/dict/data";
+import SmallTitle from '../../maintain/PlanConfig/SmallTitle.vue';
+import { parseTime } from '../../../../core/mixins/code-filter';
+// import attrAdd from './attr-add';
+// import { getDictDatas } from "@/utils/dict";
+
+const tableBtn = [
+	{
+		type: 'edit',
+		btnName: '编辑',
+	},
+	{
+		type: 'delete',
+		btnName: '删除',
+	},
+];
+const tableProps = [
+	{
+		prop: 'equipmentName',
+		label: '设备名称',
+	},
+	{
+		prop: 'program',
+		label: '巡检项目',
+	},
+	{
+		prop: 'checkResult',
+		label: '巡检结果',
+	}
+];
+
+export default {
+	mixins: [basicAdd],
+	components: { SmallTitle },
+	data() {
+		return {
+			tableBtn,
+			tableProps,
+			addOrUpdateVisible: false,
+			urlOptions: {
+			  isGetCode: false,
+				infoURL: getEqCheckLog
+			},
+			listQuery: {
+				pageSize: 99,
+				pageNo: 1,
+				total: 0
+			},
+			dataForm: {},
+			planList: [],
+			visible: false,
+			isdetail: false,
+			idAttrShow: false
+		};
+	},
+	mounted() {},
+	methods: {
+		initData() {
+			this.planList.splice(0);
+			this.listQuery.total = 0;
+		},
+		handleClick(raw) {
+			if (raw.type === 'delete') {
+				this.$confirm(
+					`是否确认删除保养项目名为"${raw.data.program}"的数据项?`,
+					'提示',
+					{
+						confirmButtonText: '确定',
+						cancelButtonText: '取消',
+						type: 'warning',
+					}
+				)
+					.then(() => {
+						deleteCheckOrderDet(raw.data.id).then(({ data }) => {
+							this.$message({
+								message: '操作成功',
+								type: 'success',
+								duration: 1500,
+								onClose: () => {
+									this.getList();
+								},
+							});
+						});
+					})
+					.catch(() => {});
+			} else {
+				this.addNew(raw.data.id);
+			}
+		},
+		getList() {
+			// 获取巡检单详情分页
+			getCheckOrderDetPage({
+				...this.listQuery,
+				orderId: this.dataForm.id,
+			}).then((response) => {
+				this.planList = response.data.list;
+				this.listQuery.total = response.data.total;
+			});
+		},
+		init(id, isdetail) {
+			this.initData();
+			this.isdetail = isdetail || false;
+			this.dataForm.id = id || undefined;
+			this.visible = true;
+			if (id) {
+				this.idAttrShow = true
+			} else {
+				this.idAttrShow = false
+			}
+
+			this.$nextTick(() => {
+
+				if (this.dataForm.id) {
+					// 获取巡检记录详情
+					this.urlOptions.infoURL(id).then(response => {
+            this.dataForm = response.data;
+          });
+					// 获取详情分页
+					this.getList();
+				}
+			});
+		},
+		goback() {
+			this.$emit('refreshDataList');
+			this.visible = false;
+			// this.initData();
+		},
+		// 新增 / 修改
+		addNew(id) {
+			this.addOrUpdateVisible = true;
+			this.$nextTick(() => {
+				this.$refs.addOrUpdate.init(id);
+			});
+		}
+	}
+};
+</script>
+<style scoped>
+.drawer >>> .el-drawer {
+	border-radius: 8px 0 0 8px;
+	display: flex;
+	flex-direction: column;
+}
+
+.drawer >>> .el-form-item__label {
+	padding: 0;
+}
+
+.drawer >>> .el-drawer__header {
+	margin: 0;
+	padding: 32px 32px 24px;
+	border-bottom: 1px solid #dcdfe6;
+}
+.drawer >>> .el-drawer__body {
+	flex: 1;
+	height: 1px;
+	display: flex;
+	flex-direction: column;
+}
+
+.drawer >>> .content {
+	padding: 30px 24px;
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+	/* height: 100%; */
+}
+
+.drawer >>> .visual-part {
+	flex: 1 auto;
+	max-height: 18vh;
+	overflow: hidden;
+	overflow-y: scroll;
+	padding-right: 10px; /* 调整滚动条样式 */
+}
+
+.drawer >>> .el-form,
+.drawer >>> .attr-list {
+	padding: 0 16px;
+}
+
+.drawer-body__footer {
+	display: flex;
+	justify-content: flex-end;
+	padding: 18px;
+}
+.action_btn {
+  float: right;
+  margin: -40px 15px;
+  font-size: 14px;
+}
+.add {
+	color: #0b58ff;
+}
+.blodTip {
+	height: 16px;
+	font-size: 14px;
+	font-weight: 600;
+	color: rgba(0,0,0,0.85);
+	margin-bottom: 8px;
+}
+.lightTip {
+	/* height: 16px; */
+	font-size: 14px;
+	font-weight: 400;
+	color: rgba(102,102,102,0.75);
+	margin-bottom: 12px;
+}
+</style>

src/views/equipment/base/inspection/Record/index.vue

@@ -50,6 +50,11 @@
 			v-if="addOrUpdateVisible"
 			ref="addOrUpdate"
 			@refreshDataList="getList" />
+
+		<add-content
+			v-if="addContent"
+			ref="addContent"
+			@refreshDataList="addContent = false" />
 	</div>
 </template>
 
@@ -57,60 +62,84 @@
 import moment from 'moment';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import addRecord from './addRecord.vue';
+import AddContent from './addContent.vue';
 import { exportCheckLogExcel, deleteEqCheckLog } from '@/api/equipment/base/inspection/record'
 import { parseTime } from '../../../../core/mixins/code-filter';
 
-const timeFilter = (val) => moment(val).format('yyyy-MM-DD HH:mm:ss');
+// const timeFilter = (val) => moment(val).format('yyyy-MM-DD HH:mm:ss');
+
+const btn = {
+	name: 'tableBtn',
+	props: ['injectData'],
+	data() {
+		return {};
+	},
+	methods: {
+		handleClick() {
+			this.$emit('emitData', { action: this.injectData.label, value: this.injectData });
+		},
+	},
+	render: function (h) {
+		return (
+			<el-button type="text" onClick={this.handleClick}>
+				{this.injectData.name}
+			</el-button>
+		);
+	},
+};
 
 export default {
-	name: 'EquipmentRepair',
-	components: { addRecord },
+	name: 'EquipmentInspectionRecord',
+	components: { addRecord, AddContent },
 	mixins: [basicPageMixin],
 	data() {
 		return {
 			addOrUpdateVisible: false,
 			searchBarKeys: ['equipmentId', 'actualTime'],
 			tableBtn: [
-				this.$auth.hasPermi('equipment:check-record:detail')
-					? {
-							type: 'detail',
-							btnName: '详情',
-					  }
-					: undefined,
-				this.$auth.hasPermi('equipment:check-record:update')
-					? {
-							type: 'edit',
-							btnName: '修改',
-					  }
-					: undefined,
-				this.$auth.hasPermi('equipment:check-record:delete')
-					? {
-							type: 'delete',
-							btnName: '删除',
-					  }
-					: undefined,
+				// this.$auth.hasPermi('equipment:check-record:detail')
+				// 	? {
+				// 			type: 'detail',
+				// 			btnName: '详情',
+				// 	  }
+				// 	: undefined,
+				// this.$auth.hasPermi('equipment:check-record:update')
+				// 	? {
+				// 			type: 'edit',
+				// 			btnName: '修改',
+				// 	  }
+				// 	: undefined,
+				// this.$auth.hasPermi('equipment:check-record:delete')
+				// 	? {
+				// 			type: 'delete',
+				// 			btnName: '删除',
+				// 	  }
+				// 	: undefined,
 			].filter((v) => v),
 			tableProps: [
-				{ prop: 'configName', label: '配置名称' },
-				{ prop: 'equipmentName', label: '设备名称' },
-				{ prop: 'origin', label: '数据来源', filter: (val) => ['', '手动', 'PDA'][val] },
+				{ prop: 'configName', label: '巡检单名称' },
+				{ prop: 'equipmentName', label: '部门' },
+				{ prop: 'actualTime1', label: '巡检时间', filter: parseTime },
+				{ prop: 'actualTime', label: '班次' },
+				{ prop: 'opt', label: '巡检内容', name: '详情', subcomponent: btn },
+				{ prop: 'remark', label: '备注' }
+				// { prop: 'origin', label: '数据来源', filter: (val) => ['', '手动', 'PDA'][val] },
 				// { prop: 'sectionName', label: '计划巡检时间' },
-				{ prop: 'actualTime', label: '实际巡检时间', filter: parseTime },
 				// { prop: 'maintenanceDetail', label: '完成状态' },
-				{ prop: 'responsible', label: '巡检人' },
+				// { prop: 'responsible', label: '巡检人' },
 			],
 			searchBarFormConfig: [
 				{
 					type: 'select',
-					label: '设备',
-					placeholder: '请选择设备',
+					label: '巡检单名称',
+					placeholder: '请选择巡检单',
 					param: 'equipmentId',
 					filterable: true
 				},
 				// 开始结束时间 
 				{
 					type: 'datePicker',
-					label: '时间段',
+					label: '巡检时间',
 					dateType: 'daterange', // datetimerange
 					format: 'yyyy-MM-dd',
 					valueFormat: 'yyyy-MM-dd HH:mm:ss',
@@ -138,16 +167,16 @@ export default {
 					name: 'export',
 					plain: true,
 					color: 'primary',
-				},
-				{
-					type: this.$auth.hasPermi('equipment:check-record:create')
-						? 'button'
-						: '',
-					btnName: '新增',
-					name: 'add',
-					plain: true,
-					color: 'success',
-				},
+				}
+				// {
+				// 	type: this.$auth.hasPermi('equipment:check-record:create')
+				// 		? 'button'
+				// 		: '',
+				// 	btnName: '新增',
+				// 	name: 'add',
+				// 	plain: true,
+				// 	color: 'success',
+				// },
 			],
 			rows: [
 				[
@@ -231,6 +260,17 @@ export default {
 		this.getList();
 	},
 	methods: {
+		handleEmitFun({action, value}) {
+ 			switch (action) {
+				// 查看详情
+				case '巡检内容':
+					this.addContent = true;
+					this.$nextTick(() => {
+						this.$refs.addContent.init(value.id, true);
+					});
+				break;
+			}
+		},
 		initSearchBar() {
 			this.http('/base/core-equipment/page', 'get', {
 				special: false,