diff --git a/CHANGELOG.md b/CHANGELOG.md index 1490c6e26747bbcdd92eb4b28fe5cc01f7af3768..f6c43d38f605b05da9c50c942292a1700be6d00e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,8 @@ - 修复数据选择(下拉视图)初始值回显异常问题 - 修复多数据部件项高度异常 - 修复滑动条内滑块按钮样式超出总宽度 +- 修复弹出视图大小调整无效 +- 调整悬浮按钮层级 ## [0.0.27] - 2024-10-16 diff --git a/src/control/toolbar/popper-toolbar/popper-toolbar.scss b/src/control/toolbar/popper-toolbar/popper-toolbar.scss index af24de842add4678b3c2c4d57393fb964da63119..ec08d52396a82f94156a6d16fc8f0b8631286e53 100644 --- a/src/control/toolbar/popper-toolbar/popper-toolbar.scss +++ b/src/control/toolbar/popper-toolbar/popper-toolbar.scss @@ -7,17 +7,20 @@ position: fixed; right: var(--van-back-top-right); bottom: 130px; + z-index: 99; height: auto; - z-index: 999; } + .van-popover { --van-popup-background: transparent; --van-popover-light-background: transparent; --van-popover-action-width: 80px; + max-height: unset; + .van-popover__content { - box-shadow: none; overflow: visible; + box-shadow: none; } .van-popover__content--horizontal .van-popover__action { @@ -26,11 +29,12 @@ .van-popover__content--vertical { .van-popover__action { - margin: 0.25rem 0; padding: 0; + margin: 0.25rem 0; } } } + .van-button { min-width: rem(44px); } diff --git a/src/util/app-drawer/app-drawer-component.tsx b/src/util/app-drawer/app-drawer-component.tsx index 9a2780315fc3ab6b924e7225e8df8338d163d914..fdc0cbe35121b90f9159f502b2994f4ff0678fa9 100644 --- a/src/util/app-drawer/app-drawer-component.tsx +++ b/src/util/app-drawer/app-drawer-component.tsx @@ -1,4 +1,4 @@ -import { defineComponent, PropType, ref, VNode } from 'vue'; +import { defineComponent, PropType, reactive, ref, VNode } from 'vue'; import { OverlayContainer, useNamespace, @@ -11,6 +11,8 @@ import { Modal, ViewMode, } from '@ibiz-template/runtime'; +import { calcOpenModeStyle } from '@ibiz-template/core'; +import { isNumber } from 'lodash-es'; export const AppDrawerComponent = defineComponent({ props: { @@ -69,6 +71,24 @@ export const AppDrawerComponent = defineComponent({ direction = 'right'; } + // 处理自定义样式 + const customStyle = reactive({ height: '80%' }); + const { width, height } = props.opts; + if (width) { + if (isNumber(width)) { + customStyle.width = calcOpenModeStyle(width, 'modal'); + } else { + customStyle.width = width; + } + } + if (height) { + if (isNumber(height)) { + customStyle.height = calcOpenModeStyle(height, 'modal'); + } else { + customStyle.height = height; + } + } + return { ns, isShow, @@ -78,6 +98,7 @@ export const AppDrawerComponent = defineComponent({ dismiss, present, onBeforeClose, + customStyle, }; }, render() { @@ -89,7 +110,7 @@ export const AppDrawerComponent = defineComponent({ closeable close-icon-position='top-left' class={this.ns.b()} - style={{ height: this.opts.height || '80%' }} + style={this.customStyle} position={this.direction} z-index={this.drawerZIndex} before-close={this.onBeforeClose}