From d90cb11fe8edbdc5eee3fa29482c8020833cf23d Mon Sep 17 00:00:00 2001 From: Cano1997 <1978141412@qq.com> Date: Fri, 17 Oct 2025 19:53:22 +0800 Subject: [PATCH 1/7] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E6=A0=91?= =?UTF-8?q?=E9=83=A8=E4=BB=B6=E6=A0=B7=E5=BC=8F,=E6=A0=91=E5=A4=B4?= =?UTF-8?q?=E9=83=A8=E6=94=B9=E4=B8=BA=E9=9D=A2=E5=8C=85=E5=B1=91=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 1 + src/control/tree/tree.scss | 27 ++++++++++++++++++--------- src/control/tree/tree.tsx | 34 ++++++++++++++++++++++++++-------- 3 files changed, 45 insertions(+), 17 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index c1ddec3da..1ce622217 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,6 +23,7 @@ - 数据关系分页布局激活样式适配主题颜色 - 多数据部件项默认绘制及面板绘制时在高度与字体大小上保持一致 - 多数据部件项统一下划线样式，同时移出项上其他下划线样式 +- 优化树部件样式,树头部改为面包屑样式 ### Fixed diff --git a/src/control/tree/tree.scss b/src/control/tree/tree.scss index 39872d10d..16437c429 100644 --- a/src/control/tree/tree.scss +++ b/src/control/tree/tree.scss @@ -1,7 +1,7 @@ $control-treeview: ('text-color': getCssVar('color', 'text'), 'hover-bg-color': getCssVar('color', 'primary'), 'active-bg-color': getCssVar('color', 'primary'), - 'padding': rem(10px), + 'padding': getCssVar(spacing, base), 'bg-color': getCssVar('color', 'bg', 2), ); @@ -9,6 +9,7 @@ $control-treeview-node: ( icon-height: getCssVar(spacing, base), icon-width: getCssVar(spacing, base), icon-margin-right: getCssVar(spacing, tight), + item-height: getCssVar(height, control, large), ); $control-treeview-crumb: ( @@ -33,7 +34,6 @@ $control-treeview-crumb: ( @include set-component-css-var(control-treeview-node, $control-treeview-node); height: 100%; - padding: 0 getCssVar('control-treeview', 'padding'); background: getCssVar('control-treeview', 'bg-color'); } @@ -46,6 +46,7 @@ $control-treeview-crumb: ( .vs-tree-node { position: relative; padding: getCssVar('control-treeview', 'padding'); + height: getCssVar('control-treeview-node', 'item-height'); .vs-tree-inner { display: flex; @@ -72,10 +73,11 @@ $control-treeview-crumb: ( @include b(control-treeview-header) { @include set-component-css-var(control-treeview-node, $control-treeview-node); @include set-component-css-var('control-treeview-crumb', $control-treeview-crumb); + height: getCssVar('height-control', 'large'); + overflow: auto; + white-space: nowrap; + line-height: getCssVar('height-control', 'large'); @include e('crumb') { - display: inline-flex; - align-items: center; - height: getCssVar('height-control', 'small'); .#{bem(icon)} { @include icon; @@ -105,16 +107,22 @@ $control-treeview-crumb: ( // 适配面包屑高度在内容区滚动时始终为0px @include e('container') { height: auto; + padding-bottom: getCssVar(spacing, tight); &>div, .van-sticky { height: auto !important; } - } - - @include when('no-root') { - &>span:has(.#{bem('control-treeview-header__crumb')}.is-root) { + &.is-hidden { display: none; } + &::after { + content: ''; + position: absolute; + width: 100%; + height: getCssVar(spacing, tight); + left: 0; + background-color: getCssVar('color', 'bg', 0); + } } } @@ -123,4 +131,5 @@ $control-treeview-crumb: ( height: 100%; display: flex; flex-direction: column; + padding: getCssVar('control-treeview', 'padding'); } \ No newline at end of file diff --git a/src/control/tree/tree.tsx b/src/control/tree/tree.tsx index bcf475e57..3184b96cb 100644 --- a/src/control/tree/tree.tsx +++ b/src/control/tree/tree.tsx @@ -89,6 +89,9 @@ export const TreeControl = defineComponent({ // 启用面包屑功能 const breadcrumb = ref(true); + // 隐藏显示面包屑 + const hiddenBreadcrumb = ref(false); + // 创建图标节点 const createIconNode = (customProps: IData) => { const iop = vueH(IBizIcon, customProps); @@ -162,6 +165,8 @@ export const TreeControl = defineComponent({ if (treeRef.value) { treeRef.value.tree.tree.store.checkedKeys = checkedKeys.value; treeRef.value.tree.tree.store.setDefaultChecked(); + const list = treeRef.value.tree.tree.store.breadcrumb?.list || []; + hiddenBreadcrumb.value = list.length < 2; } }; @@ -246,11 +251,8 @@ export const TreeControl = defineComponent({ const debounceSearch = debounce(async () => { if (treeRef.value) { // 获取最后展开的节点 - const breadcrumbList = - treeRef.value?.tree?.tree?.store?.breadcrumb?.list; - const breadcrumbListLast = breadcrumbList - ? breadcrumbList[breadcrumbList.length - 1] - : null; + const list = treeRef.value?.tree?.tree?.store?.breadcrumb?.list; + const breadcrumbListLast = list ? list[list.length - 1] : null; if (breadcrumbListLast) { breadcrumbListLast.childNodes = []; treeRef.value?.tree?.tree?.store?.nodesChange([]); @@ -314,14 +316,16 @@ export const TreeControl = defineComponent({ if (c.state.singleSelect) handleSingleSelect(opts); const { originData } = opts; if (!originData._leaf) { + const children = document.createElement('i'); + children.className = 'van-icon van-icon-arrow'; return h('div', { - text: ibiz.i18n.t('control.tree.subordinate'), className: 'tree-button', click: (e: Event, _opts: IData) => { _opts.store.breadcrumb.list.push(_opts); _opts.setExpand(true); handleExpandedLastKey(originData); }, + children: [children], }); } }; @@ -349,6 +353,12 @@ export const TreeControl = defineComponent({ breadcrumb: { el: `#breadcrumb${uuid}`, link: (node: IData, data: IData) => { + const list = node.store?.breadcrumb?.list || []; + if (list.length < 2) { + hiddenBreadcrumb.value = true; + return null; + } + hiddenBreadcrumb.value = false; const content = document.createElement('span'); const textDom = document.createElement('span'); textDom.innerText = data.name; @@ -363,6 +373,7 @@ export const TreeControl = defineComponent({ content.onclick = () => handleExpandedLastKey.bind(this)(data); return content; }, + separator: '>', }, }); } @@ -382,6 +393,7 @@ export const TreeControl = defineComponent({ treeData, options, breadcrumb, + hiddenBreadcrumb, checkedKeys, uuid, treeRef, @@ -414,13 +426,18 @@ export const TreeControl = defineComponent({ slots[key] = () => { const content = [ this.breadcrumb && ( -
+
@@ -440,6 +457,7 @@ export const TreeControl = defineComponent({ data={this.treeData} highlightCurrent={true} checkedKeys={this.checkedKeys} + expandKeys={this.c.state.expandedKeys} format={this.treeDataFormat} load={this.loadData} onCheck={this.onNodeCheck} -- Gitee From db6d3e9daf0ccf95182d5639d393ded9b4cc7792 Mon Sep 17 00:00:00 2001 From: Cano1997 <1978141412@qq.com> Date: Fri, 17 Oct 2025 19:55:12 +0800 Subject: [PATCH 2/7] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E8=A7=86?= =?UTF-8?q?=E5=9B=BE=E6=B6=88=E6=81=AF=E7=9B=B4=E6=8E=A5=E5=86=85=E5=AE=B9?= =?UTF-8?q?=E3=80=81=E8=A7=86=E5=9B=BE=E6=B6=88=E6=81=AF=E5=8D=A0=E4=BD=8D?= =?UTF-8?q?=E9=9D=A2=E6=9D=BF=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 1 + src/common/index.ts | 2 + src/common/view-message/view-message.scss | 17 ++ src/common/view-message/view-message.tsx | 173 ++++++++++++++++++ src/panel-component/index.ts | 4 + src/panel-component/view-message/index.ts | 15 ++ .../view-message/view-message.provider.ts | 29 +++ .../view-message/view-message.tsx | 56 ++++++ src/panel-component/view-msg-pos/index.ts | 18 ++ .../view-msg-pos/view-msg-pos.controller.ts | 36 ++++ .../view-msg-pos/view-msg-pos.provider.ts | 30 +++ .../view-msg-pos/view-msg-pos.tsx | 61 ++++++ 12 files changed, 442 insertions(+) create mode 100644 src/common/view-message/view-message.scss create mode 100644 src/common/view-message/view-message.tsx create mode 100644 src/panel-component/view-message/index.ts create mode 100644 src/panel-component/view-message/view-message.provider.ts create mode 100644 src/panel-component/view-message/view-message.tsx create mode 100644 src/panel-component/view-msg-pos/index.ts create mode 100644 src/panel-component/view-msg-pos/view-msg-pos.controller.ts create mode 100644 src/panel-component/view-msg-pos/view-msg-pos.provider.ts create mode 100644 src/panel-component/view-msg-pos/view-msg-pos.tsx diff --git a/CHANGELOG.md b/CHANGELOG.md index 1ce622217..ea509c56d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ - 表单编辑器识别宽高配置 - 表单直接内容识别容器样式表配置 - 表单分组面板识别标题图标配置和loading状态 +- 新增视图消息直接内容、视图消息占位面板组件 ### Change diff --git a/src/common/index.ts b/src/common/index.ts index 743379633..093d7d499 100644 --- a/src/common/index.ts +++ b/src/common/index.ts @@ -26,6 +26,7 @@ import { IBizPreviewImage } from './preview-image/preview-image'; import { IBizDateRangeCalendar } from './date-range-picker/date-range-picker'; import { IBizCropping } from './cropping/cropping'; import { IBizActionGroup } from './action-group/action-group'; +import { ViewMessage } from './view-message/view-message'; export * from './col/col'; export * from './row/row'; @@ -58,6 +59,7 @@ export const IBizCommonComponents = { v.component(IBizPreviewImage.name!, IBizPreviewImage); v.component(IBizCropping.name!, IBizCropping); v.component(IBizSignaturePad.name!, IBizSignaturePad); + v.component(ViewMessage.name!, ViewMessage); }, }; diff --git a/src/common/view-message/view-message.scss b/src/common/view-message/view-message.scss new file mode 100644 index 000000000..9427a5ecc --- /dev/null +++ b/src/common/view-message/view-message.scss @@ -0,0 +1,17 @@ +$view-message: ( +); + +@include b(view-message) { + @include m(info) { + background-color: getCssVar(color, info, light, default); + color: getCssVar(color, info); + } + @include m(warn) { + background-color: getCssVar(color, warning, light, default); + color: getCssVar(color, warning); + } + @include m(error) { + background-color: getCssVar(color, danger, light, default); + color: getCssVar(color, danger); + } +} \ No newline at end of file diff --git a/src/common/view-message/view-message.tsx b/src/common/view-message/view-message.tsx new file mode 100644 index 000000000..156986680 --- /dev/null +++ b/src/common/view-message/view-message.tsx @@ -0,0 +1,173 @@ +import { PropType, defineComponent, ref, watch } from 'vue'; +import { IViewMessage, ViewMsgController } from '@ibiz-template/runtime'; +import { useNamespace } from '@ibiz-template/vue3-util'; +import { createUUID } from 'qx-util'; +import './view-message.scss'; + +export const ViewMessage = defineComponent({ + name: 'ViewMessage', + props: { + messages: { + type: Array, + }, + scroll: { + type: Boolean, + default: false, + }, + context: { + type: Object as PropType, + required: false, + }, + params: { + type: Object as PropType, + required: false, + }, + controller: { + type: Object as PropType, + }, + }, + setup(props) { + const ns = useNamespace('view-message'); + + // 消息类型映射 + const getTypeIcon = (messageType?: string): string => { + switch (messageType) { + case 'WARN': + return 'warning-o'; + case 'ERROR': + return 'close'; + default: + return 'info-o'; + } + }; + + // 消息列表 + const items = ref<(IViewMessage & { hidden?: boolean })[]>([]); + + // 默认展示信息索引 + const initialIndex = ref(0); + + // 横向滚动容器唯一标识 + const uuid = ref(''); + + // 是否隐藏消息容器 + const isHiddenContainer = ref(false); + + watch( + () => props.messages, + () => { + initialIndex.value = 0; + uuid.value = createUUID(); + if (Array.isArray(props.messages)) { + items.value = props.messages + .filter( + item => + item.title || item.message || (item.layoutPanel && item.data), + ) + .map(item => { + return { ...item }; + }); + isHiddenContainer.value = false; + } else { + items.value = []; + isHiddenContainer.value = true; + } + }, + { immediate: true }, + ); + + const container = ref(null); + + // 横向滚动容器高度 + const carouselHeight = ref(''); + + // 处理消息关闭事件 + const handleAlertClose = (index: number) => { + // 关闭对应的消息 + items.value[index].hidden = true; + // 所有消息关闭后，隐藏横向滚动容器 + const isHiddenCarouse = items.value.every(item => item.hidden); + if (isHiddenCarouse) { + isHiddenContainer.value = true; + } + uuid.value = createUUID(); + const item = items.value[index]; + props.controller?.setMsgRemoveModeStorage(item); + }; + + // 处理激活消息索引变化事件 + const handleChange = (index: number) => { + initialIndex.value = index; + }; + + return { + ns, + getTypeIcon, + items, + container, + carouselHeight, + initialIndex, + uuid, + isHiddenContainer, + handleAlertClose, + handleChange, + }; + }, + render() { + // 绘制布局面板 + const renderLayoutPanel = (item: IViewMessage) => { + return ( + + ); + }; + + // 平铺展示消息 + const renderMessages = () => { + return ( +
+ {this.items.map((item: IViewMessage, index: number) => { + return ( + { + this.handleAlertClose(index); + }} + onChange={this.handleChange} + > + {item.layoutPanel && item.data ? ( + renderLayoutPanel(item) + ) : ( +
+ )} + + ); + })} +
+ ); + }; + + if (!this.items.length) { + return; + } + + return renderMessages(); + }, +}); diff --git a/src/panel-component/index.ts b/src/panel-component/index.ts index a6caa2921..19a73cb48 100644 --- a/src/panel-component/index.ts +++ b/src/panel-component/index.ts @@ -35,6 +35,8 @@ import IBizPanelButtonList from './panel-button-list'; import IBizAuthSso from './auth-sso'; import IBizPanelAppTitle from './panel-app-title'; import IBizIndexBlankPlaceholder from './index-blank-placeholder'; +import IBizViewMessage from './view-message'; +import IBizViewMsgPos from './view-msg-pos'; export const IBizPanelComponents = { install: (v: App): void => { @@ -72,6 +74,8 @@ export const IBizPanelComponents = { v.use(IBizTeleportPlaceholder); v.use(IBizPanelAppTitle); v.use(IBizIndexBlankPlaceholder); + v.use(IBizViewMessage); + v.use(IBizViewMsgPos); }, }; diff --git a/src/panel-component/view-message/index.ts b/src/panel-component/view-message/index.ts new file mode 100644 index 000000000..aeee63c5f --- /dev/null +++ b/src/panel-component/view-message/index.ts @@ -0,0 +1,15 @@ +import { App } from 'vue'; +import { withInstall } from '@ibiz-template/vue3-util'; +import { registerPanelItemProvider } from '@ibiz-template/runtime'; +import { ViewMessage } from './view-message'; +import { ViewMessageProvider } from './view-message.provider'; + +export const IBizViewMessage = withInstall(ViewMessage, function (v: App) { + v.component(ViewMessage.name, ViewMessage); + registerPanelItemProvider( + 'RAWITEM_VIEW_MESSAGE', + () => new ViewMessageProvider(), + ); +}); + +export default IBizViewMessage; diff --git a/src/panel-component/view-message/view-message.provider.ts b/src/panel-component/view-message/view-message.provider.ts new file mode 100644 index 000000000..e56ebca4c --- /dev/null +++ b/src/panel-component/view-message/view-message.provider.ts @@ -0,0 +1,29 @@ +import { + IPanelItemProvider, + PanelController, + PanelItemController, +} from '@ibiz-template/runtime'; +import { IPanelItem } from '@ibiz/model-core'; + +/** + * 预置视图消息适配器 + * + * @author zk + * @date 2024-01-25 02:01:01 + * @export + * @class ViewMessageProvider + * @implements {IPanelItemProvider} + */ +export class ViewMessageProvider implements IPanelItemProvider { + component: string = 'IBizViewMessage'; + + async createController( + panelItem: IPanelItem, + panel: PanelController, + parent: PanelItemController | undefined, + ): Promise { + const c = new PanelItemController(panelItem, panel, parent); + await c.init(); + return c; + } +} diff --git a/src/panel-component/view-message/view-message.tsx b/src/panel-component/view-message/view-message.tsx new file mode 100644 index 000000000..f4662eeae --- /dev/null +++ b/src/panel-component/view-message/view-message.tsx @@ -0,0 +1,56 @@ +import { defineComponent, PropType } from 'vue'; +import { useCtx, useNamespace } from '@ibiz-template/vue3-util'; +import { IPanelRawItem } from '@ibiz/model-core'; +import { PanelItemController } from '@ibiz-template/runtime'; + +/** + * 视图消息 + * @primary + * @param {*} + * @return {*} + */ +export const ViewMessage = defineComponent({ + name: 'IBizViewMessage', + props: { + /** + * @description 视图消息组件模型数据 + */ + modelData: { + type: Object as PropType, + required: true, + }, + /** + * @description 视图消息组件控制器 + */ + controller: { + type: PanelItemController, + required: true, + }, + }, + setup(props) { + const ns = useNamespace('view-message'); + const c = props.controller; + const ctx = useCtx(); + const { view } = ctx; + return { + ns, + c, + view, + }; + }, + render() { + const c = this.view; + if (c.state.isCreated) { + const viewMessages = c.state.viewMessages.BODY; + if (viewMessages?.length) { + return ( + + ); + } + } + return null; + }, +}); diff --git a/src/panel-component/view-msg-pos/index.ts b/src/panel-component/view-msg-pos/index.ts new file mode 100644 index 000000000..6d2e2c271 --- /dev/null +++ b/src/panel-component/view-msg-pos/index.ts @@ -0,0 +1,18 @@ +import { App } from 'vue'; +import { withInstall } from '@ibiz-template/vue3-util'; +import { registerPanelItemProvider } from '@ibiz-template/runtime'; +import { ViewMsgPos } from './view-msg-pos'; +import { ViewMsgPosProvider } from './view-msg-pos.provider'; +import { ViewMsgPosController } from './view-msg-pos.controller'; + +export { ViewMsgPosController }; + +export const IBizViewMsgPos = withInstall(ViewMsgPos, function (v: App) { + v.component(ViewMsgPos.name, ViewMsgPos); + registerPanelItemProvider( + 'RAWITEM_VIEWMSG_POS', + () => new ViewMsgPosProvider(), + ); +}); + +export default IBizViewMsgPos; diff --git a/src/panel-component/view-msg-pos/view-msg-pos.controller.ts b/src/panel-component/view-msg-pos/view-msg-pos.controller.ts new file mode 100644 index 000000000..b5328dba1 --- /dev/null +++ b/src/panel-component/view-msg-pos/view-msg-pos.controller.ts @@ -0,0 +1,36 @@ +import { PanelItemController } from '@ibiz-template/runtime'; +import { IPanelRawItem } from '@ibiz/model-core'; + +export class ViewMsgPosController extends PanelItemController { + /** + * @description 直接内容项参数 + * @exposedoc + * @type {IData} + */ + rawItemParams: IData = {}; + + protected async onInit(): Promise { + await super.onInit(); + this.handleRawItemParams(); + } + + /** + * 处理直接内容项参数 + * + * @author zhanghengfeng + * @date 2024-04-08 19:04:59 + * @protected + */ + protected handleRawItemParams(): void { + const rawItemParams = this.model.rawItem?.rawItemParams; + if (Array.isArray(rawItemParams)) { + rawItemParams.forEach(item => { + const key = item.key; + const value = item.value; + if (key && value) { + this.rawItemParams[key.toLowerCase()] = value; + } + }); + } + } +} diff --git a/src/panel-component/view-msg-pos/view-msg-pos.provider.ts b/src/panel-component/view-msg-pos/view-msg-pos.provider.ts new file mode 100644 index 000000000..3921fe325 --- /dev/null +++ b/src/panel-component/view-msg-pos/view-msg-pos.provider.ts @@ -0,0 +1,30 @@ +import { + IPanelItemProvider, + PanelController, + PanelItemController, +} from '@ibiz-template/runtime'; +import { IPanelItem } from '@ibiz/model-core'; +import { ViewMsgPosController } from './view-msg-pos.controller'; + +/** + * 预置视图消息适配器 + * + * @author zk + * @date 2024-01-25 02:01:01 + * @export + * @class ViewMessageProvider + * @implements {IPanelItemProvider} + */ +export class ViewMsgPosProvider implements IPanelItemProvider { + component: string = 'IBizViewMsgPos'; + + async createController( + panelItem: IPanelItem, + panel: PanelController, + parent: PanelItemController | undefined, + ): Promise { + const c = new ViewMsgPosController(panelItem, panel, parent); + await c.init(); + return c; + } +} diff --git a/src/panel-component/view-msg-pos/view-msg-pos.tsx b/src/panel-component/view-msg-pos/view-msg-pos.tsx new file mode 100644 index 000000000..9ba074ac8 --- /dev/null +++ b/src/panel-component/view-msg-pos/view-msg-pos.tsx @@ -0,0 +1,61 @@ +import { defineComponent, PropType } from 'vue'; +import { useCtx, useNamespace } from '@ibiz-template/vue3-util'; +import { IPanelRawItem } from '@ibiz/model-core'; +import { ViewMsgPosController } from './view-msg-pos.controller'; + +/** + * 视图消息占位 + * @primary + */ +export const ViewMsgPos = defineComponent({ + name: 'IBizViewMsgPos', + props: { + /** + * @description 视图消息占位控件模型数据 + */ + modelData: { + type: Object as PropType, + required: true, + }, + /** + * @description 视图消息占位控件控制器 + */ + controller: { + type: ViewMsgPosController, + required: true, + }, + }, + setup() { + const ns = useNamespace('view-msg-pos'); + + const ctx = useCtx(); + const view = ctx.view; + return { + ns, + view, + }; + }, + render() { + const c = this.controller; + if (!this.view.state.isCreated) { + return; + } + const position = c.rawItemParams.position || 'BODY'; + const scroll = c.rawItemParams.scroll === 'true'; + const viewMessages = this.view.state.viewMessages[position]; + if (viewMessages?.length) { + return ( +
+ +
+ ); + } + return null; + }, +}); -- Gitee From 26e71f9e76ec698d49c86ef22efe88f120646626 Mon Sep 17 00:00:00 2001 From: Cano1997 <1978141412@qq.com> Date: Fri, 17 Oct 2025 19:56:08 +0800 Subject: [PATCH 3/7] =?UTF-8?q?feat:=20=E4=B8=BB=E9=A2=98=E6=94=AF?= =?UTF-8?q?=E6=8C=81=E9=85=8D=E7=BD=AE=E5=A4=9A=E4=B8=AA=E4=B8=BB=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 1 + src/mob-app/guard/auth-guard/auth-guard.ts | 14 ++++++++++---- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index ea509c56d..40cf9a359 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -25,6 +25,7 @@ - 多数据部件项默认绘制及面板绘制时在高度与字体大小上保持一致 - 多数据部件项统一下划线样式，同时移出项上其他下划线样式 - 优化树部件样式,树头部改为面包屑样式 +- 主题支持配置多个主题 ### Fixed diff --git a/src/mob-app/guard/auth-guard/auth-guard.ts b/src/mob-app/guard/auth-guard/auth-guard.ts index 410a49aa5..362b090a9 100644 --- a/src/mob-app/guard/auth-guard/auth-guard.ts +++ b/src/mob-app/guard/auth-guard/auth-guard.ts @@ -70,8 +70,11 @@ async function loadTheme(): Promise { ); }); if (colorThemes.length > 0) { - const colorTheme = colorThemes[0]; - await ibiz.util.theme.loadTheme(colorTheme); + for (let index = 0; index < colorThemes.length; index++) { + const colorTheme = colorThemes[index]; + // eslint-disable-next-line no-await-in-loop + await ibiz.util.theme.loadTheme(colorTheme); + } } // 加载图标主题 const iconThemes = uiThemes.filter(uiTheme => { @@ -80,8 +83,11 @@ async function loadTheme(): Promise { ); }); if (iconThemes.length > 0) { - const iconTheme = iconThemes[0]; - await ibiz.util.theme.loadTheme(iconTheme, 'ICON'); + for (let index = 0; index < iconThemes.length; index++) { + const iconTheme = iconThemes[index]; + // eslint-disable-next-line no-await-in-loop + await ibiz.util.theme.loadTheme(iconTheme, 'ICON'); + } } } } -- Gitee From a1222d9eb32b4c03ebb98b8708b8d1de8fdeb970 Mon Sep 17 00:00:00 2001 From: Cano1997 <1978141412@qq.com> Date: Fri, 17 Oct 2025 19:59:51 +0800 Subject: [PATCH 4/7] =?UTF-8?q?style:=20=E5=88=86=E9=A1=B5=E5=AF=BC?= =?UTF-8?q?=E8=88=AA=E3=80=81drtab=E5=88=86=E9=A1=B5=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?=E8=B7=9F=E9=9A=8F=E4=B8=BB=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 1 + src/control/drtab/drtab.scss | 14 ++++++++++++++ src/control/drtab/drtab.tsx | 4 ++++ src/control/tab-exp-panel/tab-exp-panel.scss | 9 +++++++++ src/control/tab-exp-panel/tab-exp-panel.tsx | 3 ++- 5 files changed, 30 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 40cf9a359..fea929421 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -26,6 +26,7 @@ - 多数据部件项统一下划线样式，同时移出项上其他下划线样式 - 优化树部件样式,树头部改为面包屑样式 - 主题支持配置多个主题 +- 分页导航、drtab分页样式跟随主题 ### Fixed diff --git a/src/control/drtab/drtab.scss b/src/control/drtab/drtab.scss index aeeb3726d..6cff5fc80 100644 --- a/src/control/drtab/drtab.scss +++ b/src/control/drtab/drtab.scss @@ -1,4 +1,9 @@ +$control-drtab: ( + 'active-color': getCssVar('color', 'primary'), +); + @include b(control-drtab) { + @include set-component-css-var('control-drtab', $control-drtab); padding: getCssVar(spacing, tight); background-color: getCssVar(view, bg-color); @@ -31,6 +36,15 @@ } } + @include e(tabs) { + .van-tab--active { + color: getCssVar(control-drtab, active-color); + } + .van-tabs__line { + background-color: getCssVar(control-drtab, active-color); + } + } + @include e(popover) { @include m(item) { display: flex; diff --git a/src/control/drtab/drtab.tsx b/src/control/drtab/drtab.tsx index 3894ad418..829c60ab0 100644 --- a/src/control/drtab/drtab.tsx +++ b/src/control/drtab/drtab.tsx @@ -33,6 +33,10 @@ export const DRTabControl = defineComponent({ * @description 部件适配器 */ provider: { type: Object as PropType }, + /** + * @description 隐藏编辑项 + */ + hideEditItem: { type: Boolean, default: undefined }, }, setup() { const c: DRTabController = useControlController( diff --git a/src/control/tab-exp-panel/tab-exp-panel.scss b/src/control/tab-exp-panel/tab-exp-panel.scss index 947cf8eb4..d85687ce2 100644 --- a/src/control/tab-exp-panel/tab-exp-panel.scss +++ b/src/control/tab-exp-panel/tab-exp-panel.scss @@ -1,3 +1,7 @@ +$control-tabexppanel: ( + 'active-color': getCssVar('color', 'primary'), +); + @include b(control-tabexppanel-tab-item-header) { padding: rem(8px) rem(16px); overflow: hidden; @@ -38,12 +42,17 @@ } @include b(control-tabexppanel) { + @include set-component-css-var('control-tabexppanel', $control-tabexppanel); @include e(sidebar) { + --van-sidebar-selected-border-color: #{getCssVar(control-tabexppanel, active-color)}; @include m(left) { margin-left: getCssVar(spacing, base); } @include m(right) { margin-right: getCssVar(spacing, base); } + .van-sidebar-item--select { + color: getCssVar(control-tabexppanel, active-color); + } } } diff --git a/src/control/tab-exp-panel/tab-exp-panel.tsx b/src/control/tab-exp-panel/tab-exp-panel.tsx index 3d429e23f..7d53f2527 100644 --- a/src/control/tab-exp-panel/tab-exp-panel.tsx +++ b/src/control/tab-exp-panel/tab-exp-panel.tsx @@ -116,6 +116,7 @@ export const TabExpPanelControl = defineComponent({ return ( -- Gitee From b40a5d10a642563404cb1d75a6ec66a99fbdb240 Mon Sep 17 00:00:00 2001 From: Cano1997 <1978141412@qq.com> Date: Fri, 17 Oct 2025 20:00:56 +0800 Subject: [PATCH 5/7] =?UTF-8?q?feat:=20=E5=8D=A1=E7=89=87=E9=83=A8?= =?UTF-8?q?=E4=BB=B6=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4=EF=BC=8C=E9=BB=98?= =?UTF-8?q?=E8=AE=A4=E5=8D=A1=E7=89=87=E9=A1=B9=E5=AE=BD=E5=BA=A6=E6=92=91?= =?UTF-8?q?=E6=BB=A1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 1 + src/control/data-view/data-view.scss | 48 +++++++++---------- src/control/data-view/data-view.tsx | 72 +++++++++++++++------------- 3 files changed, 63 insertions(+), 58 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index fea929421..78474252a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -27,6 +27,7 @@ - 优化树部件样式,树头部改为面包屑样式 - 主题支持配置多个主题 - 分页导航、drtab分页样式跟随主题 +- 卡片部件样式调整，默认卡片项宽度撑满 ### Fixed diff --git a/src/control/data-view/data-view.scss b/src/control/data-view/data-view.scss index 879847ecb..58a31bd4e 100644 --- a/src/control/data-view/data-view.scss +++ b/src/control/data-view/data-view.scss @@ -1,27 +1,27 @@ -$control-dataview: (text-color: getCssVar(color, text, 0), - item-padding: rem(10px), +$control-dataview: ( + text-color: getCssVar(color, text, 0), + item-padding: getCssVar(spacing, base), padding: getCssVar(spacing, base-tight) getCssVar(spacing, base), card-margin:getCssVar(spacing, base-tight), - item-margin: calc( getCssVar(spacing, base, tight) / 2 ), + item-gap: getCssVar(spacing, base, tight), pagination-height: var(--van-pagination-height), + item-bg-color: transparent, ); @include b(control-dataview-item) { padding: getCssVar(control-dataview, item-padding); - // 主题缺失，后续补充 - box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.12); + box-shadow: getCssVar(shadow, elevated); background-color: getCssVar(control-dataview, item-bg-color); - color: getCssVar(control-dataview, item-font-color); - &:hover { - background-color: getCssVar(control-dataview, - item-hover-color - ); - } + color: getCssVar(control-dataview, text-color); + width: 100%; @include when(active) { background-color: getCssVar(control-dataview, item-active-color ); } + >.van-card { + padding: 0 + } } @include b(control-dataview) { @@ -29,9 +29,6 @@ $control-dataview: (text-color: getCssVar(color, text, 0), height: 100%; --van-card-thumb-size: auto; - overflow: getCssVar(control, overflow); - - @include e(content-container) { height: 100%; @@ -43,21 +40,22 @@ $control-dataview: (text-color: getCssVar(color, text, 0), @include e(content) { display: flex; flex-wrap: wrap; - &>*{ - margin: getCssVar(control-dataview, item-margin); - flex: none; - } + gap: getCssVar(control-dataview, item-gap); } - .van-card:not(:first-child) { - margin-top: getCssVar(control-dataview, card-margin); + @include e(row) { + gap: 0; + .#{bem(control-dataview, item-col)} { + padding: calc(getCssVar(control-dataview, item-gap) / 2); + } } - @include e(item-row) { - width: 100%; - } - @include e(item-col) { - margin: getCssVar(control-dataview, item-margin) 0; + @include e(collapse-item) { + .van-collapse-item__title { + height: getCssVar(height, control, large); + align-items: center; + padding: 0 getCssVar(spacing, base); + } } @include when(enable-page) { diff --git a/src/control/data-view/data-view.tsx b/src/control/data-view/data-view.tsx index 4709d8bcf..f80c1d011 100644 --- a/src/control/data-view/data-view.tsx +++ b/src/control/data-view/data-view.tsx @@ -189,12 +189,12 @@ export const DataViewControl = defineComponent({ const cardStyle = {}; if (model.cardWidth) { Object.assign(cardStyle, { - width: `${model.cardWidth}px`, + width: `${80}px`, }); } if (model.cardHeight) { Object.assign(cardStyle, { - height: `${model.cardHeight}px`, + height: `${80}px`, }); } Object.assign( @@ -217,12 +217,15 @@ export const DataViewControl = defineComponent({ ); }; - const renderDefault = () => { + const renderContent = (items: IData[]) => { + if (!items.length) { + return renderNoData(); + } const { cardColMD } = c.model; if (cardColMD) { return ( - - {c.state.items.map(item => { + + {items.map(item => { return ( {renderCard(item)} @@ -232,29 +235,6 @@ export const DataViewControl = defineComponent({ ); } - return c.state.items.map(item => { - return renderCard(item); - }); - }; - - const renderGroup = () => { - return ( - - {c.state.groups.map((group, index) => { - return ( - - {group.children.map(item => { - return renderCard(item); - })} - - ); - })} - - ); - }; - // 绘制卡片内容 - const renderMDContent = () => { - const model: IDEDataView = c.model; return ( c.loadMore()} > - {model.groupMode !== 'NONE' ? renderGroup() : renderDefault()} + {c.state.items.map(item => { + return renderCard(item); + })} ); }; + // 绘制卡片内容 + const renderMDContent = () => { + const model: IDEDataView = c.model; + if (model.groupMode !== 'NONE') { + return ( + + {c.state.groups.map((group, index) => { + return ( + + {renderContent(group.children)} + + ); + })} + + ); + } + return renderContent(c.state.items); + }; + // 加载更多 const loadMoreIcon = () => { return ( @@ -311,10 +320,7 @@ export const DataViewControl = defineComponent({ controller={this.c} >
- {this.c.state.isCreated && - (this.c.state.items.length > 0 - ? this.renderMDContent() - : this.renderNoData())} + {this.c.state.isCreated && this.renderMDContent()}
{enablePagingBar ? ( Date: Fri, 17 Oct 2025 20:02:54 +0800 Subject: [PATCH 6/7] =?UTF-8?q?feat:=20=E4=BF=AE=E5=A4=8D=E5=A4=9A?= =?UTF-8?q?=E9=A1=B9=E9=80=89=E6=8B=A9=E8=A7=86=E5=9B=BE=E6=A0=91=E8=8A=82?= =?UTF-8?q?=E7=82=B9=E6=95=B0=E6=8D=AE=E6=8A=A5=E9=94=99=EF=BC=8C=E8=B0=83?= =?UTF-8?q?=E6=95=B4=E4=B8=BA=E6=8A=9B=E5=87=BA=E6=A0=91=E8=8A=82=E7=82=B9?= =?UTF-8?q?=E5=AE=9E=E4=BD=93=E6=95=B0=E6=8D=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 1 + src/editor/data-picker/ibiz-mpicker/ibiz-mpicker.tsx | 4 ---- src/view-engine/mob-mpickup-view-engine.ts | 4 +--- src/view-engine/mob-pickup-tree-view.engine.ts | 10 +++++++--- 4 files changed, 9 insertions(+), 10 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 78474252a..a70a46f39 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -36,6 +36,7 @@ - 修复多数据部件宽度溢出异常 - 修复多数据部件配置分页后，独占一屏绘制时滚动导致分页样式偏移 - 修复开关编辑器在面板项中绘制时高度未生效 +- 修复多项选择视图树节点数据报错，调整为抛出树节点实体数据 ## [0.7.41-alpha.19] - 2025-10-16 diff --git a/src/editor/data-picker/ibiz-mpicker/ibiz-mpicker.tsx b/src/editor/data-picker/ibiz-mpicker/ibiz-mpicker.tsx index 2f8b7063b..8ee02f228 100644 --- a/src/editor/data-picker/ibiz-mpicker/ibiz-mpicker.tsx +++ b/src/editor/data-picker/ibiz-mpicker/ibiz-mpicker.tsx @@ -128,10 +128,6 @@ export const IBizMPicker = defineComponent({ if (result && Array.isArray(result)) { const calcPromises = result.map(async select => { const item = formatter(select); - // 选择树视图特殊处理 - if (select.srfnodeid) { - Object.assign(item, select._deData); - } const dataItems = await c.calcFillDataItems(item); const res = {}; dataItems.forEach(dataItem => { diff --git a/src/view-engine/mob-mpickup-view-engine.ts b/src/view-engine/mob-mpickup-view-engine.ts index 088ba220a..51b3b63d7 100644 --- a/src/view-engine/mob-mpickup-view-engine.ts +++ b/src/view-engine/mob-mpickup-view-engine.ts @@ -9,7 +9,6 @@ import { } from '@ibiz-template/runtime'; // todo 缺失 IAppDEMobMPickupView import { IAppDEMobPickupView } from '@ibiz/model-core'; -import { clone } from 'ramda'; import { MobPickupViewEngine } from './mob-pickup-view.engine'; /** @@ -98,8 +97,7 @@ export class MobMPickupViewEngine extends MobPickupViewEngine { async onMounted(): Promise { await super.onMounted(); this.pickupViewPanel.evt.on('onSelectionChange', event => { - // 需要clone一下数据，防止数据被修改 - this.pickupViewPanelSelectionChange(clone(event.data)); + this.pickupViewPanelSelectionChange(event.data); }); // 列表激活取消选中 diff --git a/src/view-engine/mob-pickup-tree-view.engine.ts b/src/view-engine/mob-pickup-tree-view.engine.ts index df6a2ea84..d4c554217 100644 --- a/src/view-engine/mob-pickup-tree-view.engine.ts +++ b/src/view-engine/mob-pickup-tree-view.engine.ts @@ -8,7 +8,7 @@ import { IAppDEMobTreeView } from '@ibiz/model-core'; import { MobTreeViewEngine } from './mob-tree-view.engine'; export class MobPickupTreeViewEngine extends MobTreeViewEngine { - protected declare view: ViewController< + declare protected view: ViewController< IAppDEMobTreeView, IPickupTreeViewState, IPickupTreeViewEvent @@ -40,10 +40,14 @@ export class MobPickupTreeViewEngine extends MobTreeViewEngine { async onMounted(): Promise { const { model } = this.view; this.xdataControl.evt.on('onSelectionChange', async event => { - this.view.evt.emit('onSelectionChange', { ...event }); + // 使用树节点实体数据，防止后台界面行为传参时JSON.stringify失败 + const tempData = event.data.map(x => x._deData); + this.view.evt.emit('onSelectionChange', { ...event, data: tempData }); }); this.xdataControl.evt.on('onActive', async event => { - this.view.evt.emit('onDataActive', { ...event }); + // 使用树节点实体数据，防止后台界面行为传参时JSON.stringify失败 + const tempData = event.data.map(x => x._deData); + this.view.evt.emit('onDataActive', { ...event, data: tempData }); }); // 默认加载 if (model.loadDefault) { -- Gitee From b925244ca4f1b94201d1ee6c5bc05066193e6cfa Mon Sep 17 00:00:00 2001 From: Cano1997 <1978141412@qq.com> Date: Fri, 17 Oct 2025 20:03:45 +0800 Subject: [PATCH 7/7] =?UTF-8?q?feat:=20=E5=88=86=E9=A1=B5=E5=AF=BC?= =?UTF-8?q?=E8=88=AA=E8=A7=86=E5=9B=BE=E4=B8=8Bdrtab=E9=BB=98=E8=AE=A4?= =?UTF-8?q?=E9=9A=90=E8=97=8F=E7=BC=96=E8=BE=91=E9=A1=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- CHANGELOG.md | 1 + src/view-engine/mob-tab-exp-view.engine.ts | 2 ++ 2 files changed, 3 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index a70a46f39..b3a90c3d3 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -28,6 +28,7 @@ - 主题支持配置多个主题 - 分页导航、drtab分页样式跟随主题 - 卡片部件样式调整，默认卡片项宽度撑满 +- 分页导航视图下drtab默认隐藏编辑项 ### Fixed diff --git a/src/view-engine/mob-tab-exp-view.engine.ts b/src/view-engine/mob-tab-exp-view.engine.ts index 5c03dabdb..eee7f7b50 100644 --- a/src/view-engine/mob-tab-exp-view.engine.ts +++ b/src/view-engine/mob-tab-exp-view.engine.ts @@ -182,6 +182,8 @@ export class MobTabExpViewEngine extends ViewEngineBase { this.view.model.appId, ); } + // 分页导航视图默认隐藏编辑项 + this.view.slotProps.tabexppanel.hideEditItem = true; } /** -- Gitee