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/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/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,33 @@ export default {
 		this.loadEquipments();
 	},
 	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.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();