From d128f2d9a38987f4e12ca4fc9a060b6a02f04b92 Mon Sep 17 00:00:00 2001 From: wangdan-fit2cloud Date: Mon, 2 Nov 2026 19:34:58 +0800 Subject: [PATCH] feat: portal style --- ui/src/assets/iconfont.js | 2 +- ui/src/components.d.ts | 12 +- ui/src/components/COMPONENT_README.md | 3 +- .../select-application-dialog/index.vue | 4 +- .../business/select-tool-dialog/index.vue | 4 +- .../components/global/mk-list-item/index.vue | 5 +- .../MkResourceCardAction.vue} | 2 +- .../MkResourceCardActionDropdown.vue} | 2 +- .../index.vue | 20 +-- .../components/header/portal/index.vue | 20 ++- .../portal-application-cards/index.vue | 37 ++---- ui/src/conversation-panel/index.scss | 8 +- .../left-sidebar/conversation-list/index.vue | 15 ++- .../SelectApplicationDrawer.vue | 20 ++- .../portal-conversation-list/index.vue | 117 +++++++++++------- .../main/portal-application-panel/index.vue | 15 +-- .../conversation-panel/view/portal/index.ts | 12 +- .../conversation-panel/view/portal/index.vue | 1 + ui/src/layout/LayoutHeader.vue | 21 +++- ui/src/router/ROUTE_README.md | 5 +- ui/src/router/chat/routes.ts | 115 +++++++++-------- ui/src/styles/STYLE_README.md | 2 +- ui/src/views/VIEW_README.md | 4 +- .../application-detail/overview/index.vue | 19 +-- .../components/ButtonLongTermSetting.vue | 4 +- .../application-card/ApplicationCard.vue | 4 +- .../AdvancedCreateDialog.vue | 4 +- .../views/knowledge-detail/hit-test/index.vue | 4 +- .../components/DocumentStrategyForm.vue | 4 +- .../knowledge-card/KnowledgeCard.vue | 4 +- ui/src/views/model/model-card/ModelCard.vue | 4 +- .../components/PortalPreview.vue | 6 +- .../chat-management/portal-setting/index.vue | 5 +- ui/src/views/tool/tool-card/ToolCard.vue | 4 +- .../tool-store/component/ToolStoreCard.vue | 4 +- .../ExecutionDetailDrawer.vue | 10 +- .../trigger-form/TriggerFormDrawer.vue | 4 +- .../components/TemplateCard.vue | 4 +- ui/src/workflow-canvas/WORKFLOW_README.md | 2 +- .../base-node/component/LongTermSetting.vue | 4 +- .../nodes/reranker-node/details/index.vue | 8 +- .../search-knowledge-node/details/index.vue | 4 +- 42 files changed, 290 insertions(+), 258 deletions(-) rename ui/src/components/global/{mk-source-card/MkSourceCardAction.vue => mk-resource-card/MkResourceCardAction.vue} (82%) rename ui/src/components/global/{mk-source-card/MkSourceCardActionDropdown.vue => mk-resource-card/MkResourceCardActionDropdown.vue} (92%) rename ui/src/components/global/{mk-source-card => mk-resource-card}/index.vue (84%) diff --git a/ui/src/assets/iconfont.js b/ui/src/assets/iconfont.js index 9384323d861..a90129fc01b 100644 --- a/ui/src/assets/iconfont.js +++ b/ui/src/assets/iconfont.js @@ -1 +1 @@ -window._iconfont_svg_string_5200172='',(h=>{var a=(l=(l=document.getElementsByTagName("script"))[l.length-1]).getAttribute("data-injectcss"),l=l.getAttribute("data-disable-injectsvg");if(!l){var o,v,t,i,c,d=function(a,l){l.parentNode.insertBefore(a,l)};if(a&&!h.__iconfont__svg__cssinject__){h.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(a){console&&console.log(a)}}o=function(){var a,l=document.createElement("div");l.innerHTML=h._iconfont_svg_string_5200172,(l=l.getElementsByTagName("svg")[0])&&(l.setAttribute("aria-hidden","true"),l.style.position="absolute",l.style.width=0,l.style.height=0,l.style.overflow="hidden",l=l,(a=document.body).firstChild?d(l,a.firstChild):a.appendChild(l))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(o,0):(v=function(){document.removeEventListener("DOMContentLoaded",v,!1),o()},document.addEventListener("DOMContentLoaded",v,!1)):document.attachEvent&&(t=o,i=h.document,c=!1,e(),i.onreadystatechange=function(){"complete"==i.readyState&&(i.onreadystatechange=null,m())})}function m(){c||(c=!0,t())}function e(){try{i.documentElement.doScroll("left")}catch(a){return void setTimeout(e,50)}m()}})(window); \ No newline at end of file +window._iconfont_svg_string_5200172='',(h=>{var a=(l=(l=document.getElementsByTagName("script"))[l.length-1]).getAttribute("data-injectcss"),l=l.getAttribute("data-disable-injectsvg");if(!l){var o,v,t,i,c,d=function(a,l){l.parentNode.insertBefore(a,l)};if(a&&!h.__iconfont__svg__cssinject__){h.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(a){console&&console.log(a)}}o=function(){var a,l=document.createElement("div");l.innerHTML=h._iconfont_svg_string_5200172,(l=l.getElementsByTagName("svg")[0])&&(l.setAttribute("aria-hidden","true"),l.style.position="absolute",l.style.width=0,l.style.height=0,l.style.overflow="hidden",l=l,(a=document.body).firstChild?d(l,a.firstChild):a.appendChild(l))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(o,0):(v=function(){document.removeEventListener("DOMContentLoaded",v,!1),o()},document.addEventListener("DOMContentLoaded",v,!1)):document.attachEvent&&(t=o,i=h.document,c=!1,e(),i.onreadystatechange=function(){"complete"==i.readyState&&(i.onreadystatechange=null,m())})}function m(){c||(c=!0,t())}function e(){try{i.documentElement.doScroll("left")}catch(a){return void setTimeout(e,50)}m()}})(window); \ No newline at end of file diff --git a/ui/src/components.d.ts b/ui/src/components.d.ts index 479856cc62f..8c06ac46455 100644 --- a/ui/src/components.d.ts +++ b/ui/src/components.d.ts @@ -37,11 +37,11 @@ declare module 'vue' { MkListItem: typeof import('./components/global/mk-list-item/index.vue')['default'] MkMediaPreview: typeof import('./components/global/mk-media-preview/index.vue')['default'] MkQuickCreate: typeof import('./components/global/mk-table/MkQuickCreate.vue')['default'] + MkResourceCard: typeof import('./components/global/mk-resource-card/index.vue')['default'] + MkResourceCardAction: typeof import('./components/global/mk-resource-card/MkResourceCardAction.vue')['default'] + MkResourceCardActionDropdown: typeof import('./components/global/mk-resource-card/MkResourceCardActionDropdown.vue')['default'] MkSearchInput: typeof import('./components/global/mk-search-input/index.vue')['default'] MkSlider: typeof import('./components/global/mk-slider/index.vue')['default'] - MkSourceCard: typeof import('./components/global/mk-source-card/index.vue')['default'] - MkSourceCardAction: typeof import('./components/global/mk-source-card/MkSourceCardAction.vue')['default'] - MkSourceCardActionDropdown: typeof import('./components/global/mk-source-card/MkSourceCardActionDropdown.vue')['default'] MkStatusLabel: typeof import('./components/global/mk-status-label/index.vue')['default'] MkTable: typeof import('./components/global/mk-table/index.vue')['default'] MkTableFilter: typeof import('./components/global/mk-table/mk-table-filter/index.vue')['default'] @@ -89,11 +89,11 @@ declare global { const MkListItem: typeof import('./components/global/mk-list-item/index.vue')['default'] const MkMediaPreview: typeof import('./components/global/mk-media-preview/index.vue')['default'] const MkQuickCreate: typeof import('./components/global/mk-table/MkQuickCreate.vue')['default'] + const MkResourceCard: typeof import('./components/global/mk-resource-card/index.vue')['default'] + const MkResourceCardAction: typeof import('./components/global/mk-resource-card/MkResourceCardAction.vue')['default'] + const MkResourceCardActionDropdown: typeof import('./components/global/mk-resource-card/MkResourceCardActionDropdown.vue')['default'] const MkSearchInput: typeof import('./components/global/mk-search-input/index.vue')['default'] const MkSlider: typeof import('./components/global/mk-slider/index.vue')['default'] - const MkSourceCard: typeof import('./components/global/mk-source-card/index.vue')['default'] - const MkSourceCardAction: typeof import('./components/global/mk-source-card/MkSourceCardAction.vue')['default'] - const MkSourceCardActionDropdown: typeof import('./components/global/mk-source-card/MkSourceCardActionDropdown.vue')['default'] const MkStatusLabel: typeof import('./components/global/mk-status-label/index.vue')['default'] const MkTable: typeof import('./components/global/mk-table/index.vue')['default'] const MkTableFilter: typeof import('./components/global/mk-table/mk-table-filter/index.vue')['default'] diff --git a/ui/src/components/COMPONENT_README.md b/ui/src/components/COMPONENT_README.md index 5eab41a004f..90ec99fe9e4 100644 --- a/ui/src/components/COMPONENT_README.md +++ b/ui/src/components/COMPONENT_README.md @@ -234,6 +234,7 @@ Element Plus 的 `v-infinite-scroll`。组件通过 `v-model` 管理已经加载 数据驱动时传 `row`，`labelField` 默认 `name`，`index` 默认 0；默认插槽提供 `{ row, index, active }`。 `action`、`action-dropdown` 提供 `{ row, index }`，有可渲染下拉项时优先下拉，否则显示普通操作。 下拉插槽直接放 `MkDropdownItem`，组件提供 More 触发器并隔离行点击；空菜单不显示入口。 +操作区在选中时常显，未选中时悬停或内部聚焦显示。 ### MkSearchInput @@ -404,7 +405,7 @@ Dialog、Drawer、Popover、嵌套区域等其他大、小表格均禁止开启 `size` 沿用 Element Plus Tag 的尺寸类型，统一作用于首个标签、`+N` 和浮层内标签； 传入 `size="small"` 显示小尺寸标签，不传时沿用 Element Plus 的默认尺寸继承行为。 -### MkSourceCard +### MkResourceCard 等高资源卡片，`title` 必填，`nick_name`、`create_time` 提供创建信息； `icon`、`title`（透出 `{ title }`）、`subtitle`、`tag` 插槽可覆盖头部，默认插槽放详情。 diff --git a/ui/src/components/business/select-application-dialog/index.vue b/ui/src/components/business/select-application-dialog/index.vue index 08e9a3353b1..4cac7f6b424 100644 --- a/ui/src/components/business/select-application-dialog/index.vue +++ b/ui/src/components/business/select-application-dialog/index.vue @@ -151,10 +151,10 @@ defineExpose({ open }) diff --git a/ui/src/components/business/select-tool-dialog/index.vue b/ui/src/components/business/select-tool-dialog/index.vue index 6ff7acdc0e8..08514b5d3e2 100644 --- a/ui/src/components/business/select-tool-dialog/index.vue +++ b/ui/src/components/business/select-tool-dialog/index.vue @@ -155,10 +155,10 @@ defineExpose({ open }) diff --git a/ui/src/components/global/mk-list-item/index.vue b/ui/src/components/global/mk-list-item/index.vue index a4de4c2b98f..d5ff0270b2d 100644 --- a/ui/src/components/global/mk-list-item/index.vue +++ b/ui/src/components/global/mk-list-item/index.vue @@ -36,10 +36,11 @@ const hasActionDropdown = computed(() => hasRenderableSlotContent(slots['action- {{ itemLabel }} - +
diff --git a/ui/src/components/global/mk-source-card/MkSourceCardAction.vue b/ui/src/components/global/mk-resource-card/MkResourceCardAction.vue similarity index 82% rename from ui/src/components/global/mk-source-card/MkSourceCardAction.vue rename to ui/src/components/global/mk-resource-card/MkResourceCardAction.vue index c2c9e199d0c..b47fab52079 100644 --- a/ui/src/components/global/mk-source-card/MkSourceCardAction.vue +++ b/ui/src/components/global/mk-resource-card/MkResourceCardAction.vue @@ -1,5 +1,5 @@ diff --git a/ui/src/components/global/mk-source-card/MkSourceCardActionDropdown.vue b/ui/src/components/global/mk-resource-card/MkResourceCardActionDropdown.vue similarity index 92% rename from ui/src/components/global/mk-source-card/MkSourceCardActionDropdown.vue rename to ui/src/components/global/mk-resource-card/MkResourceCardActionDropdown.vue index 39dec4daa9c..8ce91090cc0 100644 --- a/ui/src/components/global/mk-source-card/MkSourceCardActionDropdown.vue +++ b/ui/src/components/global/mk-resource-card/MkResourceCardActionDropdown.vue @@ -2,7 +2,7 @@ import { computed, useSlots } from 'vue' import { hasRenderableSlotContent } from '@/utils/vnode' -defineOptions({ name: 'MkSourceCardActionDropdown' }) +defineOptions({ name: 'MkResourceCardActionDropdown' }) defineSlots<{ default: () => unknown }>() diff --git a/ui/src/components/global/mk-source-card/index.vue b/ui/src/components/global/mk-resource-card/index.vue similarity index 84% rename from ui/src/components/global/mk-source-card/index.vue rename to ui/src/components/global/mk-resource-card/index.vue index c88e2ade722..152c1f9d5b4 100644 --- a/ui/src/components/global/mk-source-card/index.vue +++ b/ui/src/components/global/mk-resource-card/index.vue @@ -2,8 +2,8 @@ import { computed, h, type FunctionalComponent } from 'vue' import { dateFormat } from '@/utils/time' import { hasRenderableSlotContent } from '@/utils/vnode' -import MkSourceCardAction from './MkSourceCardAction.vue' -import MkSourceCardActionDropdown from './MkSourceCardActionDropdown.vue' +import MkResourceCardAction from './MkResourceCardAction.vue' +import MkResourceCardActionDropdown from './MkResourceCardActionDropdown.vue' /** @@ -27,7 +27,7 @@ import MkSourceCardActionDropdown from './MkSourceCardActionDropdown.vue' * * */ -defineOptions({ name: 'MkSourceCard' }) +defineOptions({ name: 'MkResourceCard' }) const props = withDefaults( defineProps<{ @@ -45,15 +45,17 @@ const emit = defineEmits<{ selected: [selected: boolean] }>() const slots = defineSlots<{ default?: () => unknown - footer?: (props: { Action: FunctionalComponent; ActionDropdown: typeof MkSourceCardActionDropdown }) => unknown + footer?: (props: { Action: FunctionalComponent; ActionDropdown: typeof MkResourceCardActionDropdown }) => unknown icon?: () => unknown subtitle?: () => unknown tag?: () => unknown title?: (props: { title: string }) => unknown }>() -const SourceCardAction: FunctionalComponent = (_, { slots }) => (props.selectable ? null : h(MkSourceCardAction, null, slots)) -const hasFooter = computed(() => hasRenderableSlotContent(slots.footer?.({ Action: SourceCardAction, ActionDropdown: MkSourceCardActionDropdown }))) +const ResourceCardAction: FunctionalComponent = (_, { slots }) => (props.selectable ? null : h(MkResourceCardAction, null, slots)) +const hasFooter = computed(() => + hasRenderableSlotContent(slots.footer?.({ Action: ResourceCardAction, ActionDropdown: MkResourceCardActionDropdown })), +) function handleSelect() { if (props.selectable) emit('selected', !props.selected) @@ -70,7 +72,7 @@ function handleSelectedChange(selected: boolean | string | number) { :role="props.selectable ? 'checkbox' : undefined" :tabindex="props.selectable ? 0 : undefined" :shadow="props.disabled ? 'never' : 'hover'" - class="mk-source-card group relative" + class="mk-resource-card group relative" body-class="flex-column h-full" @click="handleSelect" > @@ -108,13 +110,13 @@ function handleSelectedChange(selected: boolean | string | number) {
+ diff --git a/ui/src/conversation-panel/index.scss b/ui/src/conversation-panel/index.scss index 4758ced54c8..a010387ab98 100644 --- a/ui/src/conversation-panel/index.scss +++ b/ui/src/conversation-panel/index.scss @@ -127,5 +127,11 @@ width: fit-content; } -.mk-conversation-message-footer { +/* 门户 */ +.portal { + .mk-conversation-side-panel { + &.left { + background: var(--mk-N100); + } + } } diff --git a/ui/src/conversation-panel/left-sidebar/conversation-list/index.vue b/ui/src/conversation-panel/left-sidebar/conversation-list/index.vue index ca97dd89485..f7d752db136 100644 --- a/ui/src/conversation-panel/left-sidebar/conversation-list/index.vue +++ b/ui/src/conversation-panel/left-sidebar/conversation-list/index.vue @@ -49,18 +49,17 @@ const conversationTime = (conversation: Conversation) => relativeTimeFormat(conv
暂无历史记录
diff --git a/ui/src/views/model/model-card/ModelCard.vue b/ui/src/views/model/model-card/ModelCard.vue index 7d6ce358c28..af2e8946beb 100644 --- a/ui/src/views/model/model-card/ModelCard.vue +++ b/ui/src/views/model/model-card/ModelCard.vue @@ -33,7 +33,7 @@ const errMessage = computed(() => { - + diff --git a/ui/src/views/system/chat-management/portal-setting/components/PortalPreview.vue b/ui/src/views/system/chat-management/portal-setting/components/PortalPreview.vue index f71818dcdad..a26179b181e 100644 --- a/ui/src/views/system/chat-management/portal-setting/components/PortalPreview.vue +++ b/ui/src/views/system/chat-management/portal-setting/components/PortalPreview.vue @@ -10,11 +10,11 @@ defineProps<{ name: string; logo: string | null }>()

{{ name }}

-
+
-
全部智能体
+
智能体
-
+
新建对话
diff --git a/ui/src/views/system/chat-management/portal-setting/index.vue b/ui/src/views/system/chat-management/portal-setting/index.vue index cbf8d351359..04eebaf7b65 100644 --- a/ui/src/views/system/chat-management/portal-setting/index.vue +++ b/ui/src/views/system/chat-management/portal-setting/index.vue @@ -1,6 +1,7 @@ - + diff --git a/ui/src/views/tool/tool-store/component/ToolStoreCard.vue b/ui/src/views/tool/tool-store/component/ToolStoreCard.vue index bab48083e0c..04e4834815a 100644 --- a/ui/src/views/tool/tool-store/component/ToolStoreCard.vue +++ b/ui/src/views/tool/tool-store/component/ToolStoreCard.vue @@ -39,7 +39,7 @@ function handleApply(tool = props.tool) { - + diff --git a/ui/src/views/trigger/execution-record/ExecutionDetailDrawer.vue b/ui/src/views/trigger/execution-record/ExecutionDetailDrawer.vue index c4c3dd8ec13..513c2564f70 100644 --- a/ui/src/views/trigger/execution-record/ExecutionDetailDrawer.vue +++ b/ui/src/views/trigger/execution-record/ExecutionDetailDrawer.vue @@ -23,7 +23,15 @@ const detail = ref() const isTool = computed(() => props.record.source_type === RESOURCE_TYPE.TOOL) const triggerFailed = computed(() => detail.value?.state === STATE_TYPES.TRIGGER_ERROR) const runTime = computed(() => detail.value?.run_time ?? props.record.run_time) -const nodeDetails = computed(() => Object.values((isTool.value ? detail.value?.meta?.details : detail.value?.details) ?? {})) +const nodeDetails = computed(() => { + const executionDetails = Object.fromEntries(Object.entries(detail.value?.details ?? {})) + if (!isTool.value) return Object.values(executionDetails) + + return Object.values({ + ...executionDetails, + tool_call: { ...executionDetails.tool_call, name: 'ssss' }, + }) +}) function loadDetail() { loading.value = true diff --git a/ui/src/views/trigger/trigger-form/TriggerFormDrawer.vue b/ui/src/views/trigger/trigger-form/TriggerFormDrawer.vue index b8bdb94272e..37d28764f1c 100644 --- a/ui/src/views/trigger/trigger-form/TriggerFormDrawer.vue +++ b/ui/src/views/trigger/trigger-form/TriggerFormDrawer.vue @@ -317,7 +317,7 @@ defineExpose({ open })
- - +
diff --git a/ui/src/views/workflow/components/template-store/components/TemplateCard.vue b/ui/src/views/workflow/components/template-store/components/TemplateCard.vue index 46aa897220b..22faa01719a 100644 --- a/ui/src/views/workflow/components/template-store/components/TemplateCard.vue +++ b/ui/src/views/workflow/components/template-store/components/TemplateCard.vue @@ -30,7 +30,7 @@ function handleUseTemplate() {
diff --git a/ui/src/workflow-canvas/nodes/reranker-node/details/index.vue b/ui/src/workflow-canvas/nodes/reranker-node/details/index.vue index 83c8be1d7f3..c48e3205b82 100644 --- a/ui/src/workflow-canvas/nodes/reranker-node/details/index.vue +++ b/ui/src/workflow-canvas/nodes/reranker-node/details/index.vue @@ -28,7 +28,7 @@ defineProps<{
重排内容
@@ -82,7 +82,7 @@ defineProps<{
重排结果
diff --git a/ui/src/workflow-canvas/nodes/search-knowledge-node/details/index.vue b/ui/src/workflow-canvas/nodes/search-knowledge-node/details/index.vue index b1889952d5a..35f5d20c635 100644 --- a/ui/src/workflow-canvas/nodes/search-knowledge-node/details/index.vue +++ b/ui/src/workflow-canvas/nodes/search-knowledge-node/details/index.vue @@ -57,7 +57,7 @@ function getParagraphImageUrl(paragraph: SearchParagraph) {
检索结果