From 21b72c50054115cef569e2b68161b50776e6a955 Mon Sep 17 00:00:00 2001 From: zhf <1204297681@qq.com> Date: Sun, 8 Oct 2023 19:19:29 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E5=88=86=E5=89=B2=E9=9D=A2?= =?UTF-8?q?=E6=9D=BF=E5=AE=B9=E5=99=A8=E6=94=AF=E6=8C=81=E9=9A=90=E8=97=8F?= =?UTF-8?q?=E5=AD=90=E9=9D=A2=E6=9D=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../split-container.controller.ts | 52 +++++++++++++++++++ .../split-container/split-container.scss | 10 ++++ .../split-container/split-container.state.ts | 30 +++++++++++ .../split-container/split-container.tsx | 11 ++-- 4 files changed, 98 insertions(+), 5 deletions(-) create mode 100644 src/panel-component/split-container/split-container.state.ts diff --git a/src/panel-component/split-container/split-container.controller.ts b/src/panel-component/split-container/split-container.controller.ts index 855a1a01..979fc7fb 100644 --- a/src/panel-component/split-container/split-container.controller.ts +++ b/src/panel-component/split-container/split-container.controller.ts @@ -1,5 +1,6 @@ import { IPanelContainer } from '@ibiz/model-core'; import { PanelItemController } from '@ibiz-template/runtime'; +import { SplitContainerState } from './split-container.state'; /** * 分割面板容器控制器 @@ -11,6 +12,15 @@ import { PanelItemController } from '@ibiz-template/runtime'; * @extends {PanelItemController} */ export class SplitContainerController extends PanelItemController { + /** + * 分割面板容器状态 + * + * @author zhanghengfeng + * @date 2023-10-08 17:10:25 + * @type {SplitContainerState} + */ + declare state: SplitContainerState; + /** * 分割面板模式 * @@ -29,6 +39,15 @@ export class SplitContainerController extends PanelItemController { @@ -70,4 +90,36 @@ export class SplitContainerController extends PanelItemController.#{bem('split-wrapper')} { + >.#{bem('split', '', 'horizontal')}, >.#{bem('split', '', 'vertical')} { + >.#{bem(split-trigger-con)} { + display: none; + } + } + } + } } \ No newline at end of file diff --git a/src/panel-component/split-container/split-container.state.ts b/src/panel-component/split-container/split-container.state.ts new file mode 100644 index 00000000..e501e796 --- /dev/null +++ b/src/panel-component/split-container/split-container.state.ts @@ -0,0 +1,30 @@ +import { PanelItemState } from '@ibiz-template/runtime'; + +/** + * 分割面板容器状态 + * + * @author zhanghengfeng + * @date 2023-10-08 17:10:22 + * @export + * @class SplitContainerState + * @extends {PanelItemState} + */ +export class SplitContainerState extends PanelItemState { + /** + * 分割值 + * + * @author zhanghengfeng + * @date 2023-10-08 17:10:28 + * @type {(number | string)} + */ + splitValue: number | string = 0.5; + + /** + * 是否隐藏拖拽触发器 + * + * @author zhanghengfeng + * @date 2023-10-08 17:10:44 + * @type {boolean} + */ + isHiddenTrigger: boolean = false; +} diff --git a/src/panel-component/split-container/split-container.tsx b/src/panel-component/split-container/split-container.tsx index 594409de..785b122a 100644 --- a/src/panel-component/split-container/split-container.tsx +++ b/src/panel-component/split-container/split-container.tsx @@ -1,5 +1,5 @@ import { useNamespace } from '@ibiz-template/vue3-util'; -import { PropType, VNode, computed, defineComponent, ref } from 'vue'; +import { PropType, VNode, computed, defineComponent } from 'vue'; import { IPanelContainer } from '@ibiz/model-core'; import { SplitContainerController } from './split-container.controller'; import './split-container.scss'; @@ -26,23 +26,24 @@ export const SplitContainer = defineComponent({ ...result, ...props.controller.containerClass, ns.is('hidden', !props.controller.state.visible), + ns.is('hidden-trigger', props.controller.state.isHiddenTrigger), ]; return result; }); - const splitValue = ref(props.controller.splitValue); - return { ns, classArr, - splitValue, }; }, render() { const defaultSlots: VNode[] = this.$slots.default?.() || []; return (
- + {{ left: () => defaultSlots[0], right: () => defaultSlots[1], -- Gitee From 21a31262aba0dc659603c17112863439aef7c9c2 Mon Sep 17 00:00:00 2001 From: zhf <1204297681@qq.com> Date: Sun, 8 Oct 2023 19:21:05 +0800 Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Dsplit=E5=88=86?= =?UTF-8?q?=E5=89=B2=E9=9D=A2=E6=9D=BF=E7=BB=84=E4=BB=B6=E5=86=85=E5=AE=B9?= =?UTF-8?q?=E6=BA=A2=E5=87=BA=E5=BC=82=E5=B8=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 2 ++ src/common/split/split.scss | 4 ++++ 2 files changed, 6 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 54c7c8f5..ad328206 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,6 +12,7 @@ - 树刷新(包括刷新父节点，刷新全部)之后，保留原有的展开和选中 - 导航占位支持配置导航模式 - 编辑类视图里的界面行为如果是单项数据的时候，在执行之前需要校验一下表单数据，通过后才能执行。 +- 分割面板容器支持隐藏子面板 ### Changed @@ -22,6 +23,7 @@ - markdown 编辑器，表单项更新后未回填 - 修复树表格视图工具栏点击新建报错 - 修复表格部件排序属性未正确设置异常 +- 修复split分割面板组件内容溢出异常 ### PackageUpgrade diff --git a/src/common/split/split.scss b/src/common/split/split.scss index 67840953..b3187ff1 100644 --- a/src/common/split/split.scss +++ b/src/common/split/split.scss @@ -48,24 +48,28 @@ $trigger-width: 6px; top: 0; bottom: 0; left: 0; + overflow: hidden; } @include m(right) { top: 0; right: 0; bottom: 0; + overflow: hidden; } @include m(top) { top: 0; right: 0; left: 0; + overflow: hidden; } @include m(bottom) { right: 0; bottom: 0; left: 0; + overflow: hidden; } @include m(moving) { -- Gitee