Commit 9582ef28 authored by nick zheng's avatar nick zheng

Merge branch 'beta' into 'master'

fix: 期望点击弹窗外不会自动关闭

See merge request !220
parents 8897a3b1 131df033
...@@ -16,6 +16,7 @@ interface Props { ...@@ -16,6 +16,7 @@ interface Props {
labelWidth?: number // 标签的宽度 labelWidth?: number // 标签的宽度
labelPlacement?: 'left' | 'top' // 标签显示的位置 labelPlacement?: 'left' | 'top' // 标签显示的位置
contentStyle?: object contentStyle?: object
maskClosable?: boolean // 点击遮罩层是否关闭
} }
interface Emits { interface Emits {
...@@ -37,6 +38,7 @@ const props = withDefaults(defineProps<Props>(), { ...@@ -37,6 +38,7 @@ const props = withDefaults(defineProps<Props>(), {
labelWidth: 80, labelWidth: 80,
labelPlacement: 'left', labelPlacement: 'left',
contentStyle: () => ({}), contentStyle: () => ({}),
maskClosable: true,
}) })
const cancelBtnText = computed(() => props.cancelBtnText || t('common_module.cancel_btn_text')) const cancelBtnText = computed(() => props.cancelBtnText || t('common_module.cancel_btn_text'))
...@@ -73,6 +75,12 @@ function handleCloseModal() { ...@@ -73,6 +75,12 @@ function handleCloseModal() {
function handleConfirm() { function handleConfirm() {
emit('confirm') emit('confirm')
} }
function handleMaskClick() {
if (props.maskClosable) {
handleCloseModal()
}
}
</script> </script>
<template> <template>
...@@ -87,7 +95,8 @@ function handleConfirm() { ...@@ -87,7 +95,8 @@ function handleConfirm() {
:header-style="modalHeaderStyle" :header-style="modalHeaderStyle"
:content-style="contentStyle" :content-style="contentStyle"
:footer-style="modalFooterStyle" :footer-style="modalFooterStyle"
:on-mask-click="handleCloseModal" :mask-closable="maskClosable"
:on-mask-click="handleMaskClick"
@close="handleCloseModal" @close="handleCloseModal"
> >
<template #header> <template #header>
......
...@@ -164,6 +164,7 @@ function handleCloseModal() { ...@@ -164,6 +164,7 @@ function handleCloseModal() {
v-model:show="showModal" v-model:show="showModal"
class="h-[700px] w-[954px] rounded-[10px] bg-white" class="h-[700px] w-[954px] rounded-[10px] bg-white"
:auto-focus="false" :auto-focus="false"
:mask-closable="false"
@after-leave="handleCloseModal" @after-leave="handleCloseModal"
> >
<div class="flex"> <div class="flex">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment