github
/
jeecg-boot-vue3
mirror of https://github.com/jeecgboot/jeecgboot-vue3
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

部门选择弹框出来数据有遮挡 issues/I5IWFM

pull/170/head
zhangdaiscott 2022-07-26 23:05:35 +08:00
parent c951375d0f
commit 86632ea685
2 changed files with 47 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
src/components/Modal/src/BasicModal.vue
View File

@ -24,32 +24,33 @@
</ModalFooter> </ModalFooter>
</template> </template>
<ModalWrapper <!-- update-begin-author:taoyan date:2022-7-18 for: modal弹窗 支持评论 slot -->
:useWrapper="getProps.useWrapper" <a-row>
:footerOffset="wrapperFooterOffset" <a-col :span="24 - commentSpan" class="jeecg-modal-content">
:fullScreen="fullScreenRef" <ModalWrapper
ref="modalWrapperRef" :useWrapper="getProps.useWrapper"
:loading="getProps.loading" :footerOffset="wrapperFooterOffset"
:loading-tip="getProps.loadingTip" :fullScreen="fullScreenRef"
:minHeight="getProps.minHeight" ref="modalWrapperRef"
:height="getWrapperHeight" :loading="getProps.loading"
:visible="visibleRef" :loading-tip="getProps.loadingTip"
:modalFooterHeight="footer !== undefined && !footer ? 0 : undefined" :minHeight="getProps.minHeight"
v-bind="omit(getProps.wrapperProps, 'visible', 'height', 'modalFooterHeight')" :height="getWrapperHeight"
@ext-height="handleExtHeight" :visible="visibleRef"
@height-change="handleHeightChange" :modalFooterHeight="footer !== undefined && !footer ? 0 : undefined"
> v-bind="omit(getProps.wrapperProps, 'visible', 'height', 'modalFooterHeight')"
<!-- update-begin-author:taoyan date:2022-7-18 for: modal弹窗 支持评论 slot --> @ext-height="handleExtHeight"
<a-row> @height-change="handleHeightChange"
<a-col :span="24 - commentSpan"> >
<slot></slot> <slot></slot>
</a-col> </ModalWrapper>
<a-col :span="commentSpan"> </a-col>
<slot name="comment"></slot>
</a-col> <a-col :span="commentSpan" class="jeecg-comment-outer">
</a-row> <slot name="comment"></slot>
<!-- update-end-author:taoyan date:2022-7-18 for: modal弹窗 支持评论 slot --> </a-col>
</ModalWrapper> </a-row>
<!-- update-end-author:taoyan date:2022-7-18 for: modal弹窗 支持评论 slot -->
<template #[item]="data" v-for="item in Object.keys(omit($slots, 'default'))"> <template #[item]="data" v-for="item in Object.keys(omit($slots, 'default'))">
<slot :name="item" v-bind="data || {}"></slot> <slot :name="item" v-bind="data || {}"></slot>
@ -256,3 +257,16 @@
}, },
}); });
</script> </script>
<style lang="less">
.jeecg-comment-outer {
border-left: 1px solid #f0f0f0;
.ant-tabs-nav-wrap {
/* text-align: center;*/
}
}
.jeecg-modal-content {
> .scroll-container {
padding: 14px;
}
}
</style>

11
src/components/Modal/src/components/ModalClose.vue
View File

@ -12,10 +12,10 @@
<!-- 是否开启评论区域 --> <!-- 是否开启评论区域 -->
<template v-if="enableComment"> <template v-if="enableComment">
<Tooltip title="关闭" placement="bottom" v-if="commentSpan > 0"> <Tooltip title="关闭" placement="bottom" v-if="commentSpan > 0">
<RightSquareOutlined @click="handleCloseComment" /> <RightSquareOutlined @click="handleCloseComment" style="font-size: 16px" />
</Tooltip> </Tooltip>
<Tooltip title="展开" placement="bottom" v-else> <Tooltip title="展开" placement="bottom" v-else>
<LeftSquareOutlined @click="handleOpenComment" /> <LeftSquareOutlined @click="handleOpenComment" style="font-size: 16px" />
</Tooltip> </Tooltip>
</template> </template>
@ -62,7 +62,9 @@
function handleFullScreen(e: Event) { function handleFullScreen(e: Event) {
e?.stopPropagation(); e?.stopPropagation();
e?.preventDefault(); e?.preventDefault();
emit('fullscreen'); if (props.commentSpan == 0 || props.enableComment == false) {
emit('fullscreen');
}
} }
//update-begin-author:taoyan date:2022-7-18 for: 关闭按钮的区域宽度 取决于是否有其他图标 //update-begin-author:taoyan date:2022-7-18 for: 关闭按钮的区域宽度 取决于是否有其他图标
@ -82,6 +84,9 @@
function handleOpenComment(e: Event) { function handleOpenComment(e: Event) {
e?.stopPropagation(); e?.stopPropagation();
e?.preventDefault(); e?.preventDefault();
if (props.fullScreen == false) {
emit('fullscreen');
}
emit('comment', true); emit('comment', true);
} }