Browse Source
fix: lock state will not change overflow style in drawer and modal (#6067)
* Modal和Drawer的锁定状态不再修改overflow样式
pull/6068/head
Netfan
9 months ago
committed by
GitHub
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with
26 additions and
37 deletions
-
packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue
-
packages/@core/ui-kit/popup-ui/src/modal/modal.vue
|
|
|
@ -82,17 +82,17 @@ const { |
|
|
|
zIndex, |
|
|
|
} = usePriorityValues(props, state); |
|
|
|
|
|
|
|
watch( |
|
|
|
() => showLoading.value, |
|
|
|
(v) => { |
|
|
|
if (v && wrapperRef.value) { |
|
|
|
wrapperRef.value.scrollTo({ |
|
|
|
// behavior: 'smooth', |
|
|
|
top: 0, |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
); |
|
|
|
// watch( |
|
|
|
// () => showLoading.value, |
|
|
|
// (v) => { |
|
|
|
// if (v && wrapperRef.value) { |
|
|
|
// wrapperRef.value.scrollTo({ |
|
|
|
// // behavior: 'smooth', |
|
|
|
// top: 0, |
|
|
|
// }); |
|
|
|
// } |
|
|
|
// }, |
|
|
|
// ); |
|
|
|
|
|
|
|
function interactOutside(e: Event) { |
|
|
|
if (!closeOnClickModal.value || submitting.value) { |
|
|
|
@ -266,19 +266,13 @@ const getForceMount = computed(() => { |
|
|
|
ref="wrapperRef" |
|
|
|
:class=" |
|
|
|
cn('relative flex-1 overflow-y-auto p-3', contentClass, { |
|
|
|
'overflow-hidden': showLoading, |
|
|
|
'pointer-events-none': showLoading || submitting, |
|
|
|
}) |
|
|
|
" |
|
|
|
> |
|
|
|
<VbenLoading |
|
|
|
v-if="showLoading || submitting" |
|
|
|
class="size-full" |
|
|
|
spinning |
|
|
|
/> |
|
|
|
|
|
|
|
<slot></slot> |
|
|
|
</div> |
|
|
|
|
|
|
|
<VbenLoading v-if="showLoading || submitting" spinning /> |
|
|
|
<SheetFooter |
|
|
|
v-if="showFooter" |
|
|
|
:class=" |
|
|
|
|
|
|
|
@ -123,17 +123,17 @@ watch( |
|
|
|
{ immediate: true }, |
|
|
|
); |
|
|
|
|
|
|
|
watch( |
|
|
|
() => [showLoading.value, submitting.value], |
|
|
|
([l, s]) => { |
|
|
|
if ((s || l) && wrapperRef.value) { |
|
|
|
wrapperRef.value.scrollTo({ |
|
|
|
// behavior: 'smooth', |
|
|
|
top: 0, |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
); |
|
|
|
// watch( |
|
|
|
// () => [showLoading.value, submitting.value], |
|
|
|
// ([l, s]) => { |
|
|
|
// if ((s || l) && wrapperRef.value) { |
|
|
|
// wrapperRef.value.scrollTo({ |
|
|
|
// // behavior: 'smooth', |
|
|
|
// top: 0, |
|
|
|
// }); |
|
|
|
// } |
|
|
|
// }, |
|
|
|
// ); |
|
|
|
|
|
|
|
function handleFullscreen() { |
|
|
|
props.modalApi?.setState((prev) => { |
|
|
|
@ -274,18 +274,13 @@ function handleClosed() { |
|
|
|
ref="wrapperRef" |
|
|
|
:class=" |
|
|
|
cn('relative min-h-40 flex-1 overflow-y-auto p-3', contentClass, { |
|
|
|
'overflow-hidden': showLoading || submitting, |
|
|
|
'pointer-events-none': showLoading || submitting, |
|
|
|
}) |
|
|
|
" |
|
|
|
> |
|
|
|
<VbenLoading |
|
|
|
v-if="showLoading || submitting" |
|
|
|
class="size-full h-auto min-h-full" |
|
|
|
spinning |
|
|
|
/> |
|
|
|
<slot></slot> |
|
|
|
</div> |
|
|
|
|
|
|
|
<VbenLoading v-if="showLoading || submitting" spinning /> |
|
|
|
<VbenIconButton |
|
|
|
v-if="fullscreenButton" |
|
|
|
class="hover:bg-accent hover:text-accent-foreground text-foreground/80 flex-center absolute right-10 top-3 hidden size-6 rounded-full px-1 text-lg opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none sm:block" |
|
|
|
|