Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 3899876

Browse files
fix: make sure the overlay closed
1 parent 41e9a7e commit 3899876

File tree

3 files changed

+27
-6
lines changed

3 files changed

+27
-6
lines changed

‎packages/vue-final-modal/src/Modal.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ export type Vfm = {
5151
install(app: App): void
5252
modals: ComputedRef<Modal>[]
5353
openedModals: ComputedRef<Modal>[]
54+
openedModalOverlays: ComputedRef<Modal>[]
5455
dynamicModals: (UseModalOptions<any> & UseModalOptionsPrivate)[]
5556
modalsContainers: Ref<symbol[]>
5657
get: (modalId: ModalId) => undefined | ComputedRef<Modal>
@@ -64,6 +65,8 @@ export type InternalVfm = {
6465
deleteFromModals: (modal: ComputedRef<Modal>) => void
6566
moveToLastOpenedModals: (modal: ComputedRef<Modal>) => void
6667
deleteFromOpenedModals: (modal: ComputedRef<Modal>) => void
68+
moveToLastOpenedModalOverlays: (modal: ComputedRef<Modal>) => void
69+
deleteFromOpenedModalOverlays: (modal: ComputedRef<Modal>) => void
6770
openLastOverlay: () => Promise<void>
6871
resolvedClosed: (index: number) => void
6972
resolvedOpened: (index: number) => void

‎packages/vue-final-modal/src/components/CoreModal/CoreModal.vue

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,14 +35,18 @@ const { modals, openedModals } = inject(vfmSymbol, {
3535
} as any as Vfm)
3636
3737
const {
38-
moveToLastOpenedModals,
3938
openLastOverlay,
39+
moveToLastOpenedModals,
4040
deleteFromOpenedModals,
41+
moveToLastOpenedModalOverlays,
42+
deleteFromOpenedModalOverlays,
4143
deleteFromModals,
4244
} = inject(internalVfmSymbol, {
43-
moveToLastOpenedModals: noop,
4445
openLastOverlay: noop,
46+
moveToLastOpenedModals: noop,
4547
deleteFromOpenedModals: noop,
48+
moveToLastOpenedModalOverlays: noop,
49+
deleteFromOpenedModalOverlays: noop,
4650
deleteFromModals: noop,
4751
} as any as InternalVfm)
4852
@@ -142,6 +146,7 @@ watch(modelValueLocal, (value) => {
142146
async function open() {
143147
emitEvent('beforeOpen')
144148
moveToLastOpenedModals(modalInstance)
149+
moveToLastOpenedModalOverlays(modalInstance)
145150
refreshZIndex(index.value)
146151
openLastOverlay()
147152
enterTransition()
@@ -150,6 +155,7 @@ async function open() {
150155
function close() {
151156
emitEvent('beforeClose')
152157
enableBodyScroll()
158+
deleteFromOpenedModalOverlays(modalInstance)
153159
focusLast()
154160
openLastOverlay()
155161
leaveTransition()
@@ -159,6 +165,7 @@ onBeforeUnmount(() => {
159165
enableBodyScroll()
160166
deleteFromModals(modalInstance)
161167
deleteFromOpenedModals(modalInstance)
168+
deleteFromOpenedModalOverlays(modalInstance)
162169
focusLast()
163170
openLastOverlay()
164171
})

‎packages/vue-final-modal/src/plugin.ts

Lines changed: 15 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import type { InternalVfm, Modal, ModalId, UseModalOptions, UseModalOptionsPriva
66
export function createVfm() {
77
const modals: ComputedRef<Modal>[] = shallowReactive([])
88
const openedModals: ComputedRef<Modal>[] = shallowReactive([])
9+
const openedModalOverlays: ComputedRef<Modal>[] = shallowReactive([])
910
const dynamicModals: (UseModalOptions<any> & UseModalOptionsPrivate)[] = shallowReactive([])
1011
const modalsContainers = ref<symbol[]>([])
1112

@@ -19,6 +20,7 @@ export function createVfm() {
1920
},
2021
modals,
2122
openedModals,
23+
openedModalOverlays,
2224
dynamicModals,
2325
modalsContainers,
2426
get(modalId: ModalId) {
@@ -43,7 +45,7 @@ export function createVfm() {
4345
}
4446

4547
function createInternalVfm(vfm: Vfm) {
46-
const { modals, openedModals, dynamicModals } = vfm
48+
const { modals, openedModals, openedModalOverlays,dynamicModals } = vfm
4749

4850
const internalVfm: InternalVfm = {
4951
deleteFromModals(modal: ComputedRef<Modal>) {
@@ -60,13 +62,22 @@ function createInternalVfm(vfm: Vfm) {
6062
if (index !== -1)
6163
openedModals.splice(index, 1)
6264
},
65+
moveToLastOpenedModalOverlays(modal: ComputedRef<Modal>) {
66+
internalVfm.deleteFromOpenedModalOverlays(modal)
67+
openedModalOverlays.push(modal)
68+
},
69+
deleteFromOpenedModalOverlays(modal: ComputedRef<Modal>) {
70+
const index = openedModalOverlays.findIndex(_modal => _modal.value === modal.value)
71+
if (index !== -1)
72+
openedModalOverlays.splice(index, 1)
73+
},
6374
async openLastOverlay() {
6475
await nextTick()
6576
// Close all overlay first
66-
openedModals.forEach(modal => modal.value.overlayVisible.value = false)
77+
openedModalOverlays.forEach(modal => modal.value.overlayVisible.value = false)
6778
// Open the last overlay if it has overlay
68-
if (openedModals.length > 0) {
69-
const modal = openedModals[openedModals.length - 1]
79+
if (openedModalOverlays.length > 0) {
80+
const modal = openedModalOverlays[openedModalOverlays.length - 1]
7081
!modal.value.hideOverlay?.value && (modal.value.overlayVisible.value = true)
7182
}
7283
},

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /