From 9d8f92e48f8c93d27ec02a042a06aa3d84d4ceb5 Mon Sep 17 00:00:00 2001 From: lijianxiong <1518062161@qq.com> Date: Wed, 5 Nov 2025 14:14:28 +0800 Subject: [PATCH 1/5] =?UTF-8?q?feat=EF=BC=9A=E7=A7=BB=E5=8A=A8=E7=AB=AF?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E5=85=B3=E7=B3=BB=E6=A0=8F=E3=80=81=E6=95=B0?= =?UTF-8?q?=E6=8D=AE=E5=85=B3=E7=B3=BB=E5=88=86=E9=A1=B5=E6=89=93=E5=BC=80?= =?UTF-8?q?=E5=AF=BC=E8=88=AA=E8=A7=86=E5=9B=BE=E6=97=B6=E8=B7=AF=E7=94=B1?= =?UTF-8?q?=E8=B7=B3=E8=BD=AC=E6=94=B9=E7=94=A8replace=EF=BC=8C=E9=98=B2?= =?UTF-8?q?=E6=AD=A2=E8=B7=AF=E7=94=B1=E5=90=8E=E9=80=80=E5=90=8E=E8=BF=98?= =?UTF-8?q?=E5=9C=A8=E5=BD=93=E5=89=8D=E9=A1=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/control/drbar/drbar.controller.ts | 4 +++- src/control/drtab/drtab.controller.ts | 3 +++ 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/src/control/drbar/drbar.controller.ts b/src/control/drbar/drbar.controller.ts index a9a94b9abee..c17686756d9 100644 --- a/src/control/drbar/drbar.controller.ts +++ b/src/control/drbar/drbar.controller.ts @@ -332,7 +332,6 @@ export class DRBarController if (this.isCreate) { this.state.defaultItem = this.model.uniqueTag!; - return; } } @@ -567,6 +566,9 @@ export class DRBarController params, viewId: drBarItem.appViewId, isRoutePushed, + modalOptions: { + replace: true, + }, }); } diff --git a/src/control/drtab/drtab.controller.ts b/src/control/drtab/drtab.controller.ts index 03ed2135ba7..ebf65d80e3a 100644 --- a/src/control/drtab/drtab.controller.ts +++ b/src/control/drtab/drtab.controller.ts @@ -445,6 +445,9 @@ export class DRTabController params, viewId: drTabPages.appViewId, isRoutePushed, + modalOptions: { + replace: true, + }, }); } -- Gitee From fd2bf397d40d47c2dc9fd69904e05ca16b79dc79 Mon Sep 17 00:00:00 2001 From: lijianxiong <1518062161@qq.com> Date: Wed, 5 Nov 2025 14:14:47 +0800 Subject: [PATCH 2/5] =?UTF-8?q?feat=EF=BC=9A=E6=96=B0=E5=A2=9E=E6=A0=91?= =?UTF-8?q?=E5=AF=BC=E8=88=AA=E8=A7=86=E5=9B=BE=E7=9A=84=E8=A7=86=E5=9B=BE?= =?UTF-8?q?=E5=88=B7=E6=96=B0=E8=83=BD=E5=8A=9B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/view-engine/mob-tree-exp-view.engine.ts | 30 ++++++++++++++++++++- 1 file changed, 29 insertions(+), 1 deletion(-) diff --git a/src/view-engine/mob-tree-exp-view.engine.ts b/src/view-engine/mob-tree-exp-view.engine.ts index 4e3b55e1523..87f44369e78 100644 --- a/src/view-engine/mob-tree-exp-view.engine.ts +++ b/src/view-engine/mob-tree-exp-view.engine.ts @@ -8,6 +8,8 @@ import { ViewEngineBase, IExpBarControlController, calcDeCodeNameById, + SysUIActionTag, + IApiMDViewCall, } from '@ibiz-template/runtime'; import { IAppDataEntity, IAppDETreeExplorerView } from '@ibiz/model-core'; @@ -15,7 +17,7 @@ export class MobTreeExpViewEngine extends ViewEngineBase { /** * 树导航视图控制器 */ - protected declare view: ViewController< + declare protected view: ViewController< IAppDETreeExplorerView, ITreeExpViewState, ITreeExpViewEvent @@ -81,6 +83,32 @@ export class MobTreeExpViewEngine extends ViewEngineBase { await this.loadEntityData(); } + async call( + key: keyof IApiMDViewCall, + // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types + _args: any, + ): Promise { + if (key === SysUIActionTag.REFRESH) { + await this.refresh(); + return null; + } + } + + /** + * 视图刷新 + * + * @protected + * @return {*} {Promise} + * @memberof MobTreeExpViewEngine + */ + protected async refresh(): Promise { + // 重置当前展开节点,适配树控制load逻辑 + this.tree.state.mobExpandedKey = ''; + // 刷新后导航栏默认选中第一条并导航 + this.expBar.state.srfnav = ''; + await this.tree.refresh(); + } + /** * @description 检测实体数据变更 * @protected -- Gitee From 65d962af028158cb87eb0539ea2afe3499863ae8 Mon Sep 17 00:00:00 2001 From: lijianxiong <1518062161@qq.com> Date: Wed, 5 Nov 2025 14:16:01 +0800 Subject: [PATCH 3/5] =?UTF-8?q?feat=EF=BC=9A=E6=96=B0=E5=A2=9E=E6=A0=91?= =?UTF-8?q?=E9=9D=A2=E5=8C=85=E5=B1=91=E7=BB=98=E5=88=B6=E6=A8=A1=E5=BC=8F?= =?UTF-8?q?=EF=BC=88=E5=A4=B4=E9=83=A8=E6=A0=B7=E5=BC=8F=EF=BC=89=EF=BC=8C?= =?UTF-8?q?=E5=BD=93=E9=85=8D=E7=BD=AE=E6=A0=91=E6=8E=A7=E4=BB=B6=E5=8A=A8?= =?UTF-8?q?=E6=80=81=E5=8F=82=E6=95=B0crumbshowmode=3DHEADERSTYLE=E6=88=96?= =?UTF-8?q?=E5=A4=84=E4=BA=8E=E6=A0=91=E5=AF=BC=E8=88=AA=E6=A0=8F=E8=A7=86?= =?UTF-8?q?=E5=9B=BE=E6=97=B6=EF=BC=8C=E5=B0=86=E7=BB=98=E5=88=B6=E8=AF=A5?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/control/tree/tree.scss | 60 +++++++++++++++++++++++++++++++++++++- src/control/tree/tree.tsx | 39 ++++++++++++++++++++++++- 2 files changed, 97 insertions(+), 2 deletions(-) diff --git a/src/control/tree/tree.scss b/src/control/tree/tree.scss index ea8ba97da0e..1bbd9522495 100644 --- a/src/control/tree/tree.scss +++ b/src/control/tree/tree.scss @@ -8,6 +8,7 @@ $control-treeview: ( // Width/Height 'height-node': getCssVar(height, control, large), 'height-crumb': getCssVar('height-control', 'large'), + 'width-crumb-back-btn': rem(24px), // Spacing 'spacing-padding': 0 0 getCssVar(spacing, base) 0, 'spacing-node-padding': 0 getCssVar(spacing, base), @@ -52,13 +53,26 @@ $control-treeview: ( padding: getCssVar('control-treeview', 'spacing-node-padding'); height: getCssVar('control-treeview', 'height-node'); - &.selected { + // 修复节点点击后背景色改变 + &:hover { + background-color: unset; + } + + &.selected, + &.selected:hover { background-color: getCssVar('control-treeview', 'color-node-active'); } .vs-tree-inner { display: flex; align-items: center; + flex: 1; + overflow: hidden; + } + + .vs-tree-text { + text-overflow: ellipsis; + overflow: hidden; } .vs-icon-parent, @@ -160,6 +174,50 @@ $control-treeview: ( & > span:not(:last-child) { color: getCssVar('control-treeview', 'color-crumb-history-nav-text'); } + + // 导航内的（即树导航里的树）样式 + @include when(header-style) { + & > span:not(:last-child) { + display: none; + } + & > span:last-child { + display: flex; + width: 100%; + + // 返回按钮样式 + .#{bem(control-treeview-header, crumb, back-btn)} { + display: inline-block; + width: getCssVar('control-treeview', 'width-crumb-back-btn'); + color: getCssVar('control-treeview', 'color-crumb-history-nav-text'); + } + + // 面包屑文本与图标样式 + .vs-breadcrumb-link { + flex: 1; + overflow: hidden; + } + .#{bem(control-treeview-header, crumb)} { + display: flex; + align-items: center; + & > span:first-child { + // 图标样式 + display: flex; + align-items: center; + &::after { + display: none; + } + .#{bem(icon)} { + position: unset; + } + } + & > span:last-child { + text-overflow: ellipsis; + overflow: hidden; + flex: 1; + } + } + } + } } @include b(control-treeview-container) { diff --git a/src/control/tree/tree.tsx b/src/control/tree/tree.tsx index 3156ff5f14e..7ffca2addd0 100644 --- a/src/control/tree/tree.tsx +++ b/src/control/tree/tree.tsx @@ -95,6 +95,9 @@ export const TreeControl = defineComponent({ // 隐藏显示面包屑 const hiddenBreadcrumb = ref(false); + const isHeaderStyle = + c.crumbShowMode === 'HEADERSTYLE' || c.state.navigational; + // 创建图标节点 const createIconNode = (customProps: IData) => { const iop = h(IBizIcon, customProps); @@ -253,6 +256,22 @@ export const TreeControl = defineComponent({ c.state.mobExpandedKey = data._uuid || ''; }; + // 面包屑回退按钮点击事件 + const handleCrumbBack = (_e: MouseEvent, crumbItem?: IData) => { + _e.preventDefault(); + _e.stopPropagation(); + + const breads = crumbItem?.parent.list; + const prevIndex = breads.length - 2; + const prevNode = breads[prevIndex]; + if (!prevNode) return; + const store = prevNode.store; + const _data = prevNode.store?.data; + breads.splice(prevIndex + 1); + store.update(); + handleExpandedLastKey(_data); + }; + // 搜索 const debounceSearch = debounce(async () => { if (treeRef.value) { @@ -408,7 +427,7 @@ export const TreeControl = defineComponent({ renderNode, renderContent, customNodeClick, - }; + } as IParams; if (breadcrumb.value) { Object.assign(options, { @@ -438,6 +457,22 @@ export const TreeControl = defineComponent({ separator: '>', }, }); + + if (isHeaderStyle) { + Object.assign(options.breadcrumb, { + icon: (...args: IParams[]) => { + const crumbItem = args[2]; + const content = document.createElement('span'); + const iconDom = document.createElement('i'); + iconDom.className = 'van-icon van-icon-arrow-left'; + content.className = `${ns.bem('header', 'crumb', 'back-btn')}`; + content.appendChild(iconDom); + content.onclick = (_e: MouseEvent) => + handleCrumbBack.bind(this)(_e, crumbItem); + return content; + }, + }); + } } /** @@ -494,6 +529,7 @@ export const TreeControl = defineComponent({ checkedKeys, treeRefreshKey, hiddenBreadcrumb, + isHeaderStyle, onInput, loadData, onScroll, @@ -533,6 +569,7 @@ export const TreeControl = defineComponent({ class={[ this.ns.b('header'), this.ns.is('no-root', !this.treeData.length), + this.ns.is('header-style', this.isHeaderStyle), ]} > -- Gitee From eb9d5feea26e5da0f92ce0a9cb22ca0ec9d57d47 Mon Sep 17 00:00:00 2001 From: lijianxiong <1518062161@qq.com> Date: Wed, 5 Nov 2025 14:16:25 +0800 Subject: [PATCH 4/5] =?UTF-8?q?feat=EF=BC=9A=E4=BC=98=E5=8C=96=E6=A0=91?= =?UTF-8?q?=E5=AF=BC=E8=88=AA=E6=A0=8F=E7=BB=84=E4=BB=B6=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?=EF=BC=8C=E9=81=B5=E5=BE=AA=E4=B8=BB=E9=A2=98=E8=B0=83=E6=95=B4?= =?UTF-8?q?=E5=8E=9F=E5=88=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/control/tree-exp-bar/tree-exp-bar.scss | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/control/tree-exp-bar/tree-exp-bar.scss b/src/control/tree-exp-bar/tree-exp-bar.scss index 13085e2ad13..7973bd31642 100644 --- a/src/control/tree-exp-bar/tree-exp-bar.scss +++ b/src/control/tree-exp-bar/tree-exp-bar.scss @@ -1,6 +1,7 @@ $control-treeexpbar: ( - caption-padding: getCssVar(spacing, base), - toolbar-padding: getCssVar(spacing, base), + // Spacing + spacing-caption-padding: getCssVar(spacing, base), + spacing-toolbar-padding: getCssVar(spacing, base), ); @include b('control-treeexpbar') { @@ -13,12 +14,12 @@ $control-treeexpbar: ( white-space: nowrap; } @include b('control-treeexpbar-caption') { - padding: getCssVar(control-treeexpbar, caption-padding); + padding: getCssVar(control-treeexpbar, spacing-caption-padding); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .#{bem(panel-ctrl-pos--treeexpbar_toolbar)}{ - padding: getCssVar(control-treeexpbar, toolbar-padding); + padding: getCssVar(control-treeexpbar, spacing-toolbar-padding); } } -- Gitee From d4398cb217d0b6ca3ef80c9082a0d076f3726d6f Mon Sep 17 00:00:00 2001 From: lijianxiong <1518062161@qq.com> Date: Wed, 5 Nov 2025 14:16:39 +0800 Subject: [PATCH 5/5] =?UTF-8?q?feat=EF=BC=9A=E6=9B=B4=E6=96=B0CHANGELOG?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 7d80d928718..ecc9275a9a8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -49,6 +49,8 @@ - 新增浮动按钮通用组件 - 新增图标菜单、列表菜单识别模型配置（支持自定义） - 新增树部件加载时显示loadding +- 新增树导航视图的视图刷新能力 +- 新增树面包屑绘制模式（头部样式），当配置树控件动态参数crumbshowmode=HEADERSTYLE或处于树导航栏视图时，将绘制该样式 ### Change @@ -102,6 +104,8 @@ - 多数据选择模式支持分割线 - 模态消息弹框样式与主题保持一致 - 优化树部件组件样式，不直接用基础css变量，定义组件专属变量 +- 移动端数据关系栏、数据关系分页打开导航视图时路由跳转改用replace，防止路由后退后还在当前页 +- 优化树导航栏组件样式，遵循主题调整原则 ### Fixed -- Gitee