diff --git a/src/assets/less/index.less b/src/assets/less/index.less
index 2af5130..dc4ada8 100644
--- a/src/assets/less/index.less
+++ b/src/assets/less/index.less
@@ -106,7 +106,12 @@ html, body, #app {
}
.ant-modal-mask {
- background-color: rgba(0, 0, 0, 0.65) !important;
+ background-color: #00000073 !important;
+}
+
+/* 为其他所有的 .ant-modal-mask 设置透明背景 */
+.ant-modal-mask.no-mask {
+ background-color: transparent !important;
}
// 下拉框样式-start
@@ -200,6 +205,7 @@ html, body, #app {
//Modal
.dialog.light {
background-color: #f3f5ff;
+ border: 1px solid #f3f5ff;
.police-con {
color: var(--tableFontColor);
diff --git a/src/components/dialog/Dialog.vue b/src/components/dialog/Dialog.vue
index 4258dab..4dcf2e0 100644
--- a/src/components/dialog/Dialog.vue
+++ b/src/components/dialog/Dialog.vue
@@ -6,6 +6,7 @@
:width="props.width"
:maskClosable="true"
@cancel="handleCancel"
+ destroy-on-close
>
@@ -39,6 +40,11 @@
border: 1px solid #0a50a0;
background-color: #00152b;
padding-bottom: 0;
+ min-height: 300px;
+ box-shadow:
+ 0 3px 6px -4px #0000001f,
+ 0 6px 16px #00000014,
+ 0 9px 28px 8px #0000000d;
.ant-modal-title {
position: relative;
diff --git a/src/views/components/dialogHooks.ts b/src/views/components/dialogHooks.ts
index 3bab307..e93245e 100644
--- a/src/views/components/dialogHooks.ts
+++ b/src/views/components/dialogHooks.ts
@@ -1,10 +1,21 @@
import { ref } from 'vue';
+export function dealMaskStyle() {
+ const maskList = document.getElementsByClassName('ant-modal-mask') as HTMLCollectionOf;
+ let visibleMasks = Array.from(maskList).filter((item) => item.style.display !== 'none');
+ if (visibleMasks.length > 1) {
+ for (let i = 1; i < visibleMasks.length; i++) {
+ visibleMasks[i].classList.add('no-mask');
+ }
+ }
+}
+
export function useDialog({ title } = {}) {
const visible = ref(false);
function openDialog() {
visible.value = true;
+ dealMaskStyle();
}
function closeDialog() {