ui drawer ui change

src/views/specialEquipment/basic/FireFighthing.vue

@@ -117,12 +117,12 @@
 import moment from 'moment';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import EquipmentDrawer from '../components/firefightingDrawer';
+import BaseDialogWrapper from '../components/BaseDialogWrapper.vue';
 
 import {
 	createEquipment,
 	updateEquipment,
 	deleteEquipment,
-	getEquipment,
 	getEquipmentPage,
 	exportEquipmentExcel,
 } from '@/api/base/equipment';
@@ -134,6 +134,7 @@ export default {
 	components: {
 		Editor,
 		EquipmentDrawer,
+		BaseDialog: BaseDialogWrapper
 	},
 	mixins: [basicPageMixin],
 	data() {

src/views/specialEquipment/basic/Manage.vue

@@ -116,12 +116,12 @@
 import moment from 'moment';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import EquipmentDrawer from '../components/manageDrawer';
+import BaseDialogWrapper from '../components/BaseDialogWrapper.vue';
 
 import {
 	createEquipment,
 	updateEquipment,
 	deleteEquipment,
-	getEquipment,
 	getEquipmentPage,
 	exportEquipmentExcel,
 } from '@/api/base/equipment';
@@ -133,6 +133,7 @@ export default {
 	components: {
 		Editor,
 		EquipmentDrawer,
+		BaseDialog: BaseDialogWrapper
 	},
 	mixins: [basicPageMixin],
 	data() {

src/views/specialEquipment/basic/Safety.vue

@@ -126,12 +126,14 @@ import {
 } from '@/api/base/equipment';
 import Editor from '@/components/Editor';
 import AssetsUpload from '../components/AssetsUpload.vue';
+import BaseDialogWrapper from '../components/BaseDialogWrapper.vue';
 
 export default {
 	name: 'SpecialEquipmentForSafety',
 	components: {
 		Editor,
 		EquipmentDrawer,
+		BaseDialog: BaseDialogWrapper,
 	},
 	mixins: [basicPageMixin],
 	data() {

src/views/specialEquipment/check/Config.vue

@@ -51,7 +51,8 @@
 		<addOrUpdata
 			v-if="addOrUpdateVisible"
 			ref="addOrUpdate"
-			@refreshDataList="getList" />
+			@refreshDataList="getList"
+			@destroy="addOrUpdateVisible = false" />
 	</div>
 </template>
 
@@ -60,10 +61,11 @@ import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import addOrUpdata from './add-or-updata.vue';
 import add from './add.vue';
 import { parseTime } from '../../core/mixins/code-filter';
+import BaseDialogWrapperVue from '../components/BaseDialogWrapper.vue';
 
 export default {
 	name: 'SpecialEquipmentCheckConfig',
-	components: { addOrUpdata, add },
+	components: { addOrUpdata, add, BaseDialog: BaseDialogWrapperVue },
 	mixins: [basicPageMixin],
 	data() {
 		return {
@@ -188,6 +190,7 @@ export default {
 				pageSize: 10,
 				name: null,
 				status: 0,
+				special: true,
 			},
 			// 表单参数
 			form: {},

src/views/specialEquipment/check/Content-edit.vue

@@ -9,7 +9,9 @@
 	<el-drawer
 		:visible="visible"
 		:show-close="false"
-		:wrapper-closable="false"
+		:wrapperClosable="true"
+		:close-on-click-modal="true"
+		:before-close="handleConfirmClose"
 		class="drawer"
 		custom-class="mes-drawer"
 		size="60%"
@@ -171,7 +173,7 @@
 			</div>
 
 			<div class="drawer-body__footer">
-				<el-button style="" @click="handleCancel">
+				<el-button v-if="!disableEdit" @click="handleCancel">
 					{{ disableEdit ? '返回' : '取消' }}
 				</el-button>
 				<el-button
@@ -206,35 +208,11 @@
 <script>
 import DialogForm from '../../../components/DialogForm/index.vue';
 import { groupConnectWorkshop } from '@/utils/equipment-module';
-
+import BaseDialogWrapperVue from '../components/BaseDialogWrapper.vue';
-const SmallTitle = {
+import SmallTitle from '../components/SmallTitle.js';
-	name: 'SmallTitle',
-	props: ['size'],
-	components: {},
-	data() {
-		return {};
-	},
-	methods: {},
-	render: function (h) {
-		return h(
-			'span',
-			{
-				class: 'small-title',
-				style: {
-					fontSize: '18px',
-					lineHeight:
-						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
-					fontWeight: 500,
-					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
-				},
-			},
-			this.$slots.default
-		);
-	},
-};
 
 export default {
-	components: { SmallTitle, DialogForm },
+	components: { SmallTitle, DialogForm, BaseDialog: BaseDialogWrapperVue },
 	props: ['dataId'], // dataId 作为一个通用的存放id的字段
 	data() {
 		return {
@@ -411,6 +389,35 @@ export default {
 		this.getList('inspector');
 	},
 	methods: {
+		/** 确认是否关闭 */
+		async handleConfirmClose() {
+			if (this.disableEdit) return this.handleCancel();
+
+			try {
+				if (
+					await this.$confirm(
+						<div style="position: relative; margin-bottom: 26px; overflow: visible;">
+							<h1 style="font-size: 16px; font-weight: bold; color: #000c;">
+								确认要关闭页面吗?
+							</h1>
+							<p style="font-size: 14px; color: #0008; position: absolute; top: 24px;">
+								确定关闭将不保留编辑内容
+							</p>
+						</div>,
+						{
+							confirmButtonText: '确 定',
+							cancelButtonText: '取 消',
+							type: 'warning',
+						}
+					)
+				) {
+					this.handleCancel();
+				}
+			} catch (err) {
+				return false;
+			}
+		},
+
 		handleSearchBarBtnClick(btn) {
 			switch (btn.btnName) {
 				case 'search':

src/views/specialEquipment/check/Content.vue

@@ -64,10 +64,18 @@ import { parseTime } from '../../core/mixins/code-filter';
 import CheckOrderListTable from './CheckOrderListTable.vue';
 import edit from './Content-edit.vue';
 import AddCheckDet from './Content-add_detail.vue';
+import BaseDialogWrapperVue from '../components/BaseDialogWrapper.vue';
 
 export default {
 	name: 'SpecialEquipmentCheckConfig',
-	components: { addOrUpdata, add, edit, AddCheckDet, CheckOrderListTable },
+	components: {
+		addOrUpdata,
+		add,
+		edit,
+		AddCheckDet,
+		BaseDialog: BaseDialogWrapperVue,
+		CheckOrderListTable,
+	},
 	mixins: [basicPageMixin],
 	data() {
 		return {
@@ -334,8 +342,7 @@ export default {
 					}
 
 					return this.$axios({
-						url:
+						url: `/base/equipment-check-order/confirm?confirmPerson=${this.$store.getters.nickname}`,
-							`/base/equipment-check-order/confirm?confirmPerson=${this.$store.getters.nickname}`,
 						// + checkPersonParam,
 						// '/base/equipment-check-order/confirm?ids=' + JSON.stringify([id]).replaceAll("\"", ''),
 						method: 'put',

src/views/specialEquipment/check/Record-detail.vue

@@ -7,9 +7,10 @@
 
 <template>
 	<el-drawer
-		:visible="visible"
+		:visible.sync="visible"
 		:show-close="false"
-		:wrapper-closable="false"
+		:wrapper-closable="true"
+		:close-on-click-modal="true"
 		class="drawer"
 		custom-class="mes-drawer"
 		size="60%"
@@ -30,13 +31,13 @@
 						<el-row :gutter="20">
 							<el-col :span="8">
 								<el-form-item label="巡检单名称" prop="name">
-									<div style="">{{ form.name }}</div>
+									<div style="">{{ form.name || '---' }}</div>
 								</el-form-item>
 							</el-col>
 
 							<el-col :span="8">
 								<el-form-item label="部门" prop="department">
-									<div style="">{{ form.department }}</div>
+									<div style="">{{ form.department || '---' }}</div>
 								</el-form-item>
 							</el-col>
 
@@ -111,7 +112,7 @@
 			</div>
 
 			<div class="drawer-body__footer">
-				<el-button style="" @click="handleCancel">
+				<el-button v-if="!disableEdit" @click="handleCancel">
 					{{ disableEdit ? '返回' : '取消' }}
 				</el-button>
 				<el-button
@@ -146,35 +147,11 @@
 <script>
 import { parseTime } from '../../core/mixins/code-filter';
 import DialogForm from '../../../components/DialogForm/index.vue';
-
+import BaseDialogWrapperVue from '../components/BaseDialogWrapper.vue';
-const SmallTitle = {
+import SmallTitle from '../components/SmallTitle.js';
-	name: 'SmallTitle',
-	props: ['size'],
-	components: {},
-	data() {
-		return {};
-	},
-	methods: {},
-	render: function (h) {
-		return h(
-			'span',
-			{
-				class: 'small-title',
-				style: {
-					fontSize: '18px',
-					lineHeight:
-						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
-					fontWeight: 500,
-					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
-				},
-			},
-			this.$slots.default
-		);
-	},
-};
 
 export default {
-	components: { SmallTitle, DialogForm },
+	components: { SmallTitle, DialogForm, BaseDialog: BaseDialogWrapperVue },
 	props: ['dataId'], // dataId 作为一个通用的存放id的字段
 	filters: { parseTime },
 	data() {

src/views/specialEquipment/check/add-or-updata.vue

@@ -9,7 +9,9 @@
 	<el-drawer
 		:visible.sync="visible"
 		:show-close="false"
-		:wrapper-closable="true"
+		:wrapperClosable="true"
+		:close-on-click-modal="true"
+		@closed="$emit('destroy')"
 		class="drawer"
 		size="50%">
 		<small-title slot="title" :no-padding="true">
@@ -37,12 +39,12 @@
 						</el-col> -->
 						<el-col :span="8">
 							<el-form-item label="巡检单名称" prop="name">
-								{{ dataForm.name }}
+								{{ dataForm.name || '---' }}
 							</el-form-item>
 						</el-col>
 						<el-col :span="8">
 							<el-form-item label="部门" prop="department">
-								{{ dataForm.department }}
+								{{ dataForm.department || '---' }}
 							</el-form-item>
 						</el-col>
 						<el-col :span="8">
@@ -94,7 +96,7 @@
 					@pagination="getList" />
 
 				<!-- <div class="drawer-body__footer">
-					<el-button type="primary" @click="goback()">关闭</el-button>
+					<el-button type="primary" @click="goback()">返回</el-button>
 				</div> -->
 			</div>
 		</div>
@@ -111,7 +113,7 @@
 <script>
 import SmallTitle from './SmallTitle';
 import attrAdd from './attr-add';
-import { DICT_TYPE, getDictDatas } from '@/utils/dict';
+// import { DICT_TYPE, getDictDatas } from '@/utils/dict';
 import { parseTime } from '../../core/mixins/code-filter';
 
 const tableBtn = [
@@ -183,6 +185,33 @@ export default {
 	},
 	mounted() {},
 	methods: {
+		/** 确认是否关闭 */
+		async handleConfirmClose() {
+			try {
+				if (
+					await this.$confirm(
+						<div style="position: relative; margin-bottom: 26px; overflow: visible;">
+							<h1 style="font-size: 16px; font-weight: bold; color: #000c;">
+								确认要关闭页面吗?
+							</h1>
+							<p style="font-size: 14px; color: #0008; position: absolute; top: 24px;">
+								确定关闭将不保留编辑内容
+							</p>
+						</div>,
+						{
+							confirmButtonText: '确 定',
+							cancelButtonText: '取 消',
+							type: 'warning',
+						}
+					)
+				) {
+					this.visible = false;
+				}
+			} catch (err) {
+				return false;
+			}
+		},
+
 		initData() {
 			this.checkDetList.splice(0);
 			this.checkDetList.total = 0;
@@ -245,7 +274,7 @@ export default {
 			});
 		},
 		goback() {
-			this.$emit('refreshDataList');
+			// this.$emit('refreshDataList');
 			this.visible = false;
 			// this.initData();
 		},

src/views/specialEquipment/check/attr-add.vue

@@ -51,7 +51,7 @@
 
 		<el-row style="text-align: right">
 			<el-button @click="visible = false">取消</el-button>
-			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+			<el-button type="primary" @click="dataFormSubmit()">保存</el-button>
 		</el-row>
 	</el-dialog>
 </template>

src/views/specialEquipment/components/BaseDialogWrapper.vue

@@ -0,0 +1,59 @@
+<!-- 
+    filename: BaseDialogWrapper.vue
+    author: liubin
+    date: 2024-03-13 13:51:14
+    description: 对BaseDialog的封装，自定义保存、取消按钮
+-->
+
+<template>
+	<base-dialog
+		:dialogTitle="dialogTitle"
+		:dialogVisible="dialogVisible"
+		:width="width"
+		:custom-class="customClass"
+		:append-to-body="appendToBody"
+		@close="$emit('close')">
+		<slot />
+		<template #footer>
+			<el-row slot="footer" type="flex" justify="end">
+				<el-col :span="24">
+					<el-button size="small" class="btnTextStyle" @click="$emit('cancel')">
+						取消
+					</el-button>
+					<el-button
+						type="primary"
+						class="btnTextStyle"
+						size="small"
+						@click="$emit('confirm')">
+						保存
+					</el-button>
+				</el-col>
+			</el-row>
+		</template>
+	</base-dialog>
+</template>
+
+<script>
+export default {
+	name: 'BaseDialogWrapper',
+	components: {},
+	props: [
+		'dialogTitle',
+		'dialogVisible',
+		'appendToBody',
+		'width',
+		'customClass',
+	],
+	data() {
+		return {};
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.baseDialog .btnTextStyle {
+	letter-spacing: 6px;
+	padding: 9px 10px 9px 16px;
+	font-size: 14px;
+}
+</style>

src/views/specialEquipment/components/SmallTitle.js

@@ -0,0 +1,32 @@
+// <!--
+//     filename: SmallTitle.js
+//     author: liubin
+//     date: 2024-03-13 14:21:01
+//     description:
+// -->
+
+export default {
+	name: 'SmallTitle',
+	props: ['size'],
+	components: {},
+	data() {
+		return {};
+	},
+	methods: {},
+	render: function (h) {
+		return h(
+			'span',
+			{
+				class: 'small-title',
+				style: {
+					fontSize: '18px',
+					lineHeight:
+						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
+					fontWeight: 500,
+					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
+				},
+			},
+			this.$slots.default
+		);
+	},
+};

src/views/specialEquipment/components/firefightingDrawer.vue

@@ -121,35 +121,16 @@
 <script>
 import DialogForm from './DialogForm';
 import EquipmentInfoForm from './EquipmentInfoForm.vue';
-
+import BaseDialogWrapper from './BaseDialogWrapper.vue';
-const SmallTitle = {
+import SmallTitle from './SmallTitle.js';
-	name: 'SmallTitle',
-	props: ['size'],
-	components: {},
-	data() {
-		return {};
-	},
-	methods: {},
-	render: function (h) {
-		return h(
-			'span',
-			{
-				class: 'small-title',
-				style: {
-					fontSize: '18px',
-					lineHeight:
-						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
-					fontWeight: 500,
-					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
-				},
-			},
-			this.$slots.default
-		);
-	},
-};
 
 export default {
-	components: { SmallTitle, DialogForm, EquipmentInfoForm },
+	components: {
+		SmallTitle,
+		DialogForm,
+		EquipmentInfoForm,
+		BaseDialog: BaseDialogWrapper,
+	},
 	props: ['sections', 'mode', 'dataId', 'isFireEquipment'], // dataId 作为一个通用的存放id的字段
 	data() {
 		return {

src/views/specialEquipment/components/manageDrawer.vue

@@ -5,7 +5,6 @@
     description: 
 -->
 
-
 <template>
 	<el-drawer
 		:visible="visible"
@@ -122,35 +121,16 @@
 <script>
 import DialogForm from './DialogForm';
 import EquipmentInfoForm from './manageDrawerForm.vue';
-
+import BaseDialogWrapper from './BaseDialogWrapper.vue';
-const SmallTitle = {
+import SmallTitle from './SmallTitle.js';
-	name: 'SmallTitle',
-	props: ['size'],
-	components: {},
-	data() {
-		return {};
-	},
-	methods: {},
-	render: function (h) {
-		return h(
-			'span',
-			{
-				class: 'small-title',
-				style: {
-					fontSize: '18px',
-					lineHeight:
-						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
-					fontWeight: 500,
-					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
-				},
-			},
-			this.$slots.default
-		);
-	},
-};
 
 export default {
-	components: { SmallTitle, DialogForm, EquipmentInfoForm },
+	components: {
+		SmallTitle,
+		DialogForm,
+		EquipmentInfoForm,
+		BaseDialog: BaseDialogWrapper,
+	},
 	props: ['sections', 'mode', 'dataId', 'isFireEquipment'], // dataId 作为一个通用的存放id的字段
 	data() {
 		return {

src/views/specialEquipment/components/safetyDrawer.vue

@@ -5,7 +5,6 @@
     description: 
 -->
 
-
 <template>
 	<el-drawer
 		:visible="visible"
@@ -122,35 +121,16 @@
 <script>
 import DialogForm from './DialogForm';
 import EquipmentInfoForm from './EquipmentInfoForm.vue';
-
+import BaseDialogWrapper from './BaseDialogWrapper.vue';
-const SmallTitle = {
+import SmallTitle from './SmallTitle.js';
-	name: 'SmallTitle',
-	props: ['size'],
-	components: {},
-	data() {
-		return {};
-	},
-	methods: {},
-	render: function (h) {
-		return h(
-			'span',
-			{
-				class: 'small-title',
-				style: {
-					fontSize: '18px',
-					lineHeight:
-						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
-					fontWeight: 500,
-					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
-				},
-			},
-			this.$slots.default
-		);
-	},
-};
 
 export default {
-	components: { SmallTitle, DialogForm, EquipmentInfoForm },
+	components: {
+		SmallTitle,
+		DialogForm,
+		EquipmentInfoForm,
+		BaseDialog: BaseDialogWrapper,
+	},
 	props: ['sections', 'mode', 'dataId', 'isFireEquipment'], // dataId 作为一个通用的存放id的字段
 	data() {
 		return {

src/views/specialEquipment/maintain/Monitor--detail.vue

@@ -9,7 +9,9 @@
 	<el-drawer
 		:visible="visible"
 		:show-close="false"
-		:wrapper-closable="false"
+		:wrapperClosable="true"
+		:close-on-click-modal="true"
+		:before-close="handleConfirmClose"
 		class="drawer"
 		custom-class="mes-drawer"
 		size="60%"
@@ -115,7 +117,7 @@
 		</div>
 
 		<div class="drawer-body__footer">
-			<el-button style="" @click="cancel">返回</el-button>
+			<!-- <el-button style="" @click="cancel">返回</el-button> -->
 			<!-- <el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit">
 				编辑
 			</el-button>
@@ -143,32 +145,7 @@
 
 <script>
 import DialogForm from '@/components/DialogForm';
-
+import SmallTitle from '../components/SmallTitle.js';
-const SmallTitle = {
-	name: 'SmallTitle',
-	props: ['size'],
-	components: {},
-	data() {
-		return {};
-	},
-	methods: {},
-	render: function (h) {
-		return h(
-			'span',
-			{
-				class: 'small-title',
-				style: {
-					fontSize: '18px',
-					lineHeight:
-						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
-					fontWeight: 500,
-					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
-				},
-			},
-			this.$slots.default
-		);
-	},
-};
 
 export default {
 	name: 'PlanConfig--addContent',
@@ -263,6 +240,35 @@ export default {
 		this.loadEquipments();
 	},
 	methods: {
+		/** 确认是否关闭 */
+		async handleConfirmClose() {
+			if (this.mode.includes('detail')) return this.cancel();
+
+			try {
+				if (
+					await this.$confirm(
+						<div style="position: relative; margin-bottom: 26px; overflow: visible;">
+							<h1 style="font-size: 16px; font-weight: bold; color: #000c;">
+								确认要关闭页面吗?
+							</h1>
+							<p style="font-size: 14px; color: #0008; position: absolute; top: 24px;">
+								确定关闭将不保留编辑内容
+							</p>
+						</div>,
+						{
+							confirmButtonText: '确 定',
+							cancelButtonText: '取 消',
+							type: 'warning',
+						}
+					)
+				) {
+					this.cancel();
+				}
+			} catch (err) {
+				return false;
+			}
+		},
+
 		show({
 			departmentName,
 			id,

src/views/specialEquipment/maintain/Monitor.vue

@@ -61,7 +61,7 @@
 </template>
 
 <script>
-import { publicFormatter } from '@/utils/dict';
+// import { publicFormatter } from '@/utils/dict';
 // import moment from 'moment';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import { exportMaintainMonitorExcel } from '@/api/equipment/base/maintain/record';

src/views/specialEquipment/maintain/PlanConfig--add.vue

@@ -123,7 +123,8 @@
 							type: 'number',
 							message: '请输入正确的数字',
 							trigger: 'blur',
-							transform: (val) => Number(val) && parseInt(val) === Number(val),
+							transform: (val) =>
+								Number(val) && parseInt(val) === Number(val) && Number(val),
 						},
 						{ required: true, message: '保养频率不能为空', trigger: 'blur' },
 					]">

src/views/specialEquipment/maintain/PlanConfig--addContent.vue

@@ -2,14 +2,16 @@
     filename: PlanConfig--addContent.vue
     author: liubin
     date: 2024-02-04 09:40:04
-    description: 
+    description: 计划配置-添加内容
 -->
 
 <template>
 	<el-drawer
-		:visible="visible"
+		:visible.sync="visible"
 		:show-close="false"
-		:wrapper-closable="false"
+		:wrapperClosable="true"
+		:close-on-click-modal="true"
+		:before-close="handleConfirmClose"
 		class="drawer"
 		custom-class="mes-drawer"
 		size="60%"
@@ -19,7 +21,7 @@
 				mode.includes('detail')
 					? '详情'
 					: mode.includes('edit')
-					? '编辑'
+					? '添加内容'
 					: '新增'
 			}}
 		</SmallTitle>
@@ -38,37 +40,37 @@
 							<el-row :gutter="20">
 								<el-col :span="8">
 									<el-form-item label="保养计划名称" prop="name">
-										<span>{{ form.name }}</span>
+										<span>{{ form.name || '---' }}</span>
 									</el-form-item>
 								</el-col>
 
 								<el-col :span="8">
 									<el-form-item label="部门" prop="departmentName">
-										<span>{{ form.departmentName }}</span>
+										<span>{{ form.departmentName || '---' }}</span>
 									</el-form-item>
 								</el-col>
 
 								<el-col :span="8">
 									<el-form-item label="产线名" prop="lineName">
-										<span>{{ form.lineName }}</span>
+										<span>{{ form.lineName || '---' }}</span>
 									</el-form-item>
 								</el-col>
 
 								<el-col :span="8">
 									<el-form-item label="保养频率" prop="maintenancePeriod">
-										<span>{{ form.maintenancePeriod }}</span>
+										<span>{{ form.maintenancePeriod || '---' }}</span>
 									</el-form-item>
 								</el-col>
 
 								<el-col :span="8">
 									<el-form-item label="保养时长" prop="maintainDuration">
-										<span>{{ form.maintainDuration }}</span>
+										<span>{{ form.maintainDuration || '---' }}</span>
 									</el-form-item>
 								</el-col>
 
 								<el-col :span="8">
 									<el-form-item label="计划保养人员" prop="maintainer">
-										<span>{{ form.maintainer }}</span>
+										<span>{{ form.maintainer || '---' }}</span>
 									</el-form-item>
 								</el-col>
 							</el-row>
@@ -143,36 +145,12 @@
 
 <script>
 import DialogForm from '@/components/DialogForm';
-
+import BaseDialogWrapper from '../components/BaseDialogWrapper.vue';
-const SmallTitle = {
+import SmallTitle from '../components/SmallTitle.js';
-	name: 'SmallTitle',
-	props: ['size'],
-	components: {},
-	data() {
-		return {};
-	},
-	methods: {},
-	render: function (h) {
-		return h(
-			'span',
-			{
-				class: 'small-title',
-				style: {
-					fontSize: '18px',
-					lineHeight:
-						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
-					fontWeight: 500,
-					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
-				},
-			},
-			this.$slots.default
-		);
-	},
-};
 
 export default {
 	name: 'PlanConfig--addContent',
-	components: { SmallTitle, DialogForm },
+	components: { SmallTitle, DialogForm, BaseDialog: BaseDialogWrapper },
 	props: ['maintainData'],
 	data() {
 		return {
@@ -263,6 +241,35 @@ export default {
 		this.loadEquipments();
 	},
 	methods: {
+		/** 确认是否关闭 */
+		async handleConfirmClose() {
+			if (this.mode.includes('detail')) return this.cancel();
+			if (document.querySelector('.small-title').innerText.includes('添加内容')) return this.cancel();
+			try {
+				if (
+					await this.$confirm(
+						<div style="position: relative; margin-bottom: 26px; overflow: visible;">
+							<h1 style="font-size: 16px; font-weight: bold; color: #000c;">
+								确认要关闭页面吗?
+							</h1>
+							<p style="font-size: 14px; color: #0008; position: absolute; top: 24px;">
+								确定关闭将不保留编辑内容
+							</p>
+						</div>,
+						{
+							confirmButtonText: '确 定',
+							cancelButtonText: '取 消',
+							type: 'warning',
+						}
+					)
+				) {
+					this.cancel();
+				}
+			} catch (err) {
+				return false;
+			}
+		},
+
 		show({
 			departmentName,
 			id,

src/views/specialEquipment/maintain/PlanConfig.vue

@@ -65,10 +65,15 @@ import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import { deleteEqMaintainPlan } from '@/api/equipment/base/maintain/record';
 import PlanConfigAdd from './PlanConfig--add.vue';
 import PlanConfigAddContent from './PlanConfig--addContent.vue';
+import BaseDialogWrapper from '../components/BaseDialogWrapper.vue';
 
 export default {
 	name: 'SpecialEquipmentPlanConfig',
-	components: { DialogForm: PlanConfigAdd, PlanConfigAddContent },
+	components: {
+		BaseDialog: BaseDialogWrapper,
+		DialogForm: PlanConfigAdd,
+		PlanConfigAddContent,
+	},
 	mixins: [basicPageMixin],
 	data() {
 		const t = new Date();
@@ -98,7 +103,7 @@ export default {
 					: undefined,
 			].filter((v) => v),
 			tableProps: [
-				{ prop: 'name', label: '计划名称' },
+				{ prop: 'name', label: '保养计划名称' },
 				{ prop: 'departmentName', label: '部门' },
 				{ width: 144, prop: 'lineName', label: '产线名' },
 				{ width: 132, prop: 'maintenancePeriod', label: '保养频率(天/次)' },

src/views/specialEquipment/maintain/Record--detail.vue

@@ -9,7 +9,9 @@
 	<el-drawer
 		:visible="visible"
 		:show-close="false"
-		:wrapper-closable="false"
+		:wrapperClosable="true"
+		:close-on-click-modal="true"
+		:before-close="handleConfirmClose"
 		class="drawer"
 		custom-class="mes-drawer"
 		size="60%"
@@ -84,7 +86,7 @@
 		</div>
 
 		<div class="drawer-body__footer">
-			<el-button style="" @click="cancel">返回</el-button>
+			<!-- <el-button style="" @click="cancel">返回</el-button> -->
 			<!-- <el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit">
 				编辑
 			</el-button>
@@ -112,36 +114,12 @@
 
 <script>
 import DialogForm from '@/components/DialogForm';
-
+import SmallTitle from '../components/SmallTitle.js';
-const SmallTitle = {
+import BaseDialogWrapper from '../components/BaseDialogWrapper';
-	name: 'SmallTitle',
-	props: ['size'],
-	components: {},
-	data() {
-		return {};
-	},
-	methods: {},
-	render: function (h) {
-		return h(
-			'span',
-			{
-				class: 'small-title',
-				style: {
-					fontSize: '18px',
-					lineHeight:
-						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
-					fontWeight: 500,
-					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
-				},
-			},
-			this.$slots.default
-		);
-	},
-};
 
 export default {
 	name: 'PlanConfig--addContent',
-	components: { SmallTitle, DialogForm },
+	components: { SmallTitle, DialogForm, BaseDialog: BaseDialogWrapper },
 	props: ['maintainData'],
 	data() {
 		return {
@@ -229,6 +207,35 @@ export default {
 		this.loadEquipments();
 	},
 	methods: {
+		/** 确认是否关闭 */
+		async handleConfirmClose() {
+			if (this.mode.includes('detail')) return this.cancel();
+
+			try {
+				if (
+					await this.$confirm(
+						<div style="position: relative; margin-bottom: 26px; overflow: visible;">
+							<h1 style="font-size: 16px; font-weight: bold; color: #000c;">
+								确认要关闭页面吗?
+							</h1>
+							<p style="font-size: 14px; color: #0008; position: absolute; top: 24px;">
+								确定关闭将不保留编辑内容
+							</p>
+						</div>,
+						{
+							confirmButtonText: '确 定',
+							cancelButtonText: '取 消',
+							type: 'warning',
+						}
+					)
+				) {
+					this.cancel();
+				}
+			} catch (err) {
+				return false;
+			}
+		},
+
 		show({ planMaintainWorker, id, maintainWorker }) {
 			this.form = Object.assign(
 				{},
@@ -305,17 +312,14 @@ export default {
 			}
 
 			try {
-				const res = await this.$axios(
+				const res = await this.$axios('/base/equipment-maintain-log-det/page', {
-					'/base/equipment-maintain-log-det/page',
-					{
 					params: {
 						pageNo: this.detailTableQuery.pageNo,
 						pageSize: this.detailTableQuery.pageSize,
 						// planId: this.form.id,
 						logId: this.form.id,
 					},
-					}
+				});
-				);
 				this.detailList = res.data?.list || [];
 				this.detailTotal = res.data?.total || 0;
 				this.detailLoading = false;

src/views/specialEquipment/maintain/Repair.vue

@@ -70,10 +70,11 @@ import {
 import { parseTime } from '@/utils/ruoyi';
 import htmls from './htmls.vue';
 import DialogForm from './Repair--add.vue';
+import BaseDialogWrapperVue from '../components/BaseDialogWrapper.vue';
 
 export default {
 	name: 'SpecialEquipmentRepair',
-	components: { DetailDrawer, DialogForm },
+	components: { DetailDrawer, DialogForm, BaseDialog: BaseDialogWrapperVue },
 	mixins: [basicPageMixin],
 	data() {
 		return {

src/views/specialEquipment/maintain/WaitingList.vue

@@ -97,42 +97,39 @@
 </template>
 
 <script>
-import moment from 'moment';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 import DialogFormUnplanned from './WaitingList--add--unplanned.vue';
 import UnplannedEditDrawer from './WaitingListUnplanned--edit.vue';
 import PlannedEditDrawer from './WaitingListPlanned--edit.vue';
 import UnplannedAddDet from './WaitingListUnplanned--add_detail.vue';
-import {
+import { exportMaintainLogExcel } from '@/api/equipment/base/maintain/record';
-	exportMaintainLogExcel,
-} from '@/api/equipment/base/maintain/record';
 import WaitingListTable from './WaitingListTable.vue';
 import RecordDetail from './Record--detail.vue';
+import BaseDialogWrapper from '../components/BaseDialogWrapper.vue';
 
-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 = {
-const btn = {
+// 	name: 'tableBtn',
-	name: 'tableBtn',
+// 	props: ['injectData'],
-	props: ['injectData'],
+// 	data() {
-	data() {
+// 		return {};
-		return {};
+// 	},
-	},
+// 	methods: {
-	methods: {
+// 		handleClick() {
-		handleClick() {
+// 			this.$emit('emitData', {
-			this.$emit('emitData', {
+// 				action: this.injectData.label,
-				action: this.injectData.label,
+// 				value: this.injectData,
-				value: this.injectData,
+// 			});
-			});
+// 		},
-		},
+// 	},
-	},
+// 	render: function (h) {
-	render: function (h) {
+// 		return (
-		return (
+// 			<el-button type="text" onClick={this.handleClick}>
-			<el-button type="text" onClick={this.handleClick}>
+// 				{this.injectData.name}
-				{this.injectData.name}
+// 			</el-button>
-			</el-button>
+// 		);
-		);
+// 	},
-	},
+// };
-};
 
 export default {
 	name: 'SpecialEquipmentMaintainRecord',
@@ -143,6 +140,7 @@ export default {
 		UnplannedEditDrawer,
 		UnplannedAddDet,
 		PlannedEditDrawer,
+		BaseDialog: BaseDialogWrapper,
 	},
 	mixins: [basicPageMixin],
 	data() {

src/views/specialEquipment/maintain/WaitingListPlanned--edit.vue

@@ -9,7 +9,9 @@
 	<el-drawer
 		:visible="visible"
 		:show-close="false"
-		:wrapper-closable="false"
+		:wrapperClosable="true"
+		:close-on-click-modal="true"
+		:before-close="handleConfirmClose"
 		class="drawer"
 		custom-class="mes-drawer"
 		size="60%"
@@ -482,6 +484,33 @@ export default {
 		this.getList('line');
 	},
 	methods: {
+		/** 确认是否关闭 */
+		async handleConfirmClose() {
+			try {
+				if (
+					await this.$confirm(
+						<div style="position: relative; margin-bottom: 26px; overflow: visible;">
+							<h1 style="font-size: 16px; font-weight: bold; color: #000c;">
+								确认要关闭页面吗?
+							</h1>
+							<p style="font-size: 14px; color: #0008; position: absolute; top: 24px;">
+								确定关闭将不保留编辑内容
+							</p>
+						</div>,
+						{
+							confirmButtonText: '确 定',
+							cancelButtonText: '取 消',
+							type: 'warning',
+						}
+					)
+				) {
+					this.handleCancel();
+				}
+			} catch (err) {
+				return false;
+			}
+		},
+
 		handleSearchBarBtnClick(btn) {
 			switch (btn.btnName) {
 				case 'search':

src/views/specialEquipment/maintain/WaitingListUnplanned--edit.vue

@@ -9,7 +9,9 @@
 	<el-drawer
 		:visible="visible"
 		:show-close="false"
-		:wrapper-closable="false"
+		:wrapperClosable="true"
+		:close-on-click-modal="true"
+		:before-close="handleConfirmClose"
 		class="drawer"
 		custom-class="mes-drawer"
 		size="60%"
@@ -419,6 +421,34 @@ export default {
 		this.getList('line');
 	},
 	methods: {
+		
+		/** 确认是否关闭 */
+		async handleConfirmClose() {
+			try {
+				if (
+					await this.$confirm(
+						<div style="position: relative; margin-bottom: 26px; overflow: visible;">
+							<h1 style="font-size: 16px; font-weight: bold; color: #000c;">
+								确认要关闭页面吗?
+							</h1>
+							<p style="font-size: 14px; color: #0008; position: absolute; top: 24px;">
+								确定关闭将不保留编辑内容
+							</p>
+						</div>,
+						{
+							confirmButtonText: '确 定',
+							cancelButtonText: '取 消',
+							type: 'warning',
+						}
+					)
+				) {
+					this.handleCancel();
+				}
+			} catch (err) {
+				return false;
+			}
+		},
+
 		handleSearchBarBtnClick(btn) {
 			console.log('btn', btn);
 			switch (btn.btnName) {