feat: tool

Author: wangdan-fit2cloud

ui/src/components.d.ts

@@ -20,7 +20,7 @@ declare module 'vue' {
     MdEditor: typeof import('./components/global/markdown-editor/MdEditor.vue')['default']
     MdEditorMagnify: typeof import('./components/global/markdown-editor/MdEditorMagnify.vue')['default']
     MdPreview: typeof import('./components/global/markdown-editor/MdPreview.vue')['default']
-    MkAction: typeof import('./components/global/mk-action/index.vue')['default']
+    MkAction: typeof import('./components/global/mk-table/MkAction.vue')['default']
     MkCollapse: typeof import('./components/global/mk-collapse/index.vue')['default']
     MkComplexSearch: typeof import('./components/global/mk-complex-search/index.vue')['default']
     MkDialog: typeof import('./components/global/mk-dialog/index.vue')['default']
@@ -42,7 +42,6 @@ declare module 'vue' {
     MkTable: typeof import('./components/global/mk-table/index.vue')['default']
     MkTableFilter: typeof import('./components/global/mk-table/MkTableFilter.vue')['default']
     MkTableMoreDropdown: typeof import('./components/global/mk-table/MkTableMoreDropdown.vue')['default']
-    MkTableOperationGroup: typeof import('./components/global/mk-action/MkTableOperationGroup.vue')['default']
     MkTagGroup: typeof import('./components/global/mk-tag-group/index.vue')['default']
     MkTooltip: typeof import('./components/global/mk-tooltip/index.vue')['default']
     MkViewLayout: typeof import('./components/global/mk-view-layout/index.vue')['default']
@@ -64,7 +63,7 @@ declare global {
   const MdEditor: typeof import('./components/global/markdown-editor/MdEditor.vue')['default']
   const MdEditorMagnify: typeof import('./components/global/markdown-editor/MdEditorMagnify.vue')['default']
   const MdPreview: typeof import('./components/global/markdown-editor/MdPreview.vue')['default']
-  const MkAction: typeof import('./components/global/mk-action/index.vue')['default']
+  const MkAction: typeof import('./components/global/mk-table/MkAction.vue')['default']
   const MkCollapse: typeof import('./components/global/mk-collapse/index.vue')['default']
   const MkComplexSearch: typeof import('./components/global/mk-complex-search/index.vue')['default']
   const MkDialog: typeof import('./components/global/mk-dialog/index.vue')['default']
@@ -86,7 +85,6 @@ declare global {
   const MkTable: typeof import('./components/global/mk-table/index.vue')['default']
   const MkTableFilter: typeof import('./components/global/mk-table/MkTableFilter.vue')['default']
   const MkTableMoreDropdown: typeof import('./components/global/mk-table/MkTableMoreDropdown.vue')['default']
-  const MkTableOperationGroup: typeof import('./components/global/mk-action/MkTableOperationGroup.vue')['default']
   const MkTagGroup: typeof import('./components/global/mk-tag-group/index.vue')['default']
   const MkTooltip: typeof import('./components/global/mk-tooltip/index.vue')['default']
   const MkViewLayout: typeof import('./components/global/mk-view-layout/index.vue')['default']

ui/src/components/COMPONENT_README.md

@@ -293,23 +293,12 @@ Dialog、Drawer、Popover、嵌套区域等其他大、小表格均禁止开启
 `clearSelection()`。操作栏与 `MkViewLayout` 复用 `LayoutBatchFooter`，统一全选、半选、数量和
 取消行为；它在主内容滚动区域内吸附于页面底部，不随表格内容滚出可视区域。
 
-### MkTableOperationGroup、MkAction
-
-`MkTableOperationGroup` 与 `MkAction`、`context.ts` 统一维护在 `global/mk-action/`。
-表格操作列使用 `MkTableOperationGroup` 默认插槽声明操作，按模板顺序将前 `maxVisible` 个操作
-（默认 2）显示为图标按钮，其余自动进入 More；没有剩余操作时不显示 More。
-每个直接子组件代表一个操作，业务 Action 内使用 `MkAction` 作为展示入口。
-整个操作的显隐条件必须写在直接子组件的 `v-if` 上；不通过 `v-show` 或子组件内部条件控制计数。
-支持展开 `template` Fragment，忽略注释和文本；循环操作提供稳定且唯一的 key。
-禁用操作仍占位。开关等独立控件放在操作栏外，页面按实际入口数量设置操作列宽。
-
-`MkAction` 位于 `global/mk-action/index.vue`，适用于表格和卡片，接收 `label`、SVG Symbol 名称
-`icon`、`disabled`、`divided`，发出 `click`。
-通过上下文自动选择图标按钮加 Tooltip 或图标加文字菜单项；独立使用默认显示按钮，
-放入 `MkDropdownMenu` 时显示菜单项。点击阻止冒泡，`divided` 在按钮模式和自动 More 首项中不生效。
-业务 Action 保留自己的请求与浮层生命周期，不需要传递展示模式或维护操作配置数组。
-操作栏内部复用 `MkTableMoreDropdown` 并开启 `persistent`，菜单收起时保留业务 Action 与已打开浮层。
-操作跨越外露和 More 边界时会重新挂载，业务浮层打开期间不要重排入口或改变 `maxVisible`。
+### MkAction
+
+`global/mk-table/MkAction.vue` 统一单个操作的两种外观，通过 `display="menu"`（默认）或
+`display="button"` 显式选择菜单项或带 Tooltip 的图标按钮，不注入或推断展示上下文。
+接收 `label`、SVG Symbol 名称 `icon`、`disabled`、`divided`，发出 `click` 并阻止点击冒泡。
+`divided` 仅用于菜单模式。页面自行组合外露操作与 `MkTableMoreDropdown`，不自动分配位置。
 
 ### MkTagGroup
 

ui/src/components/global/mk-action/MkTableOperationGroup.vue

@@ -1,13 +1,8 @@
 <script setup lang="ts">
-import { provide, ref } from 'vue'
-import { actionContextKey, type ActionContext } from '../mk-action/context'
-
 defineOptions({ name: 'MkDropdownMenu', inheritAttrs: false })
 
-provide(actionContextKey, ref<ActionContext>({ display: 'menu' }))
-
 defineSlots<{
-  /** 菜单项，使用 MkDropdownItem 或以 MkAction 为入口的业务 Action */
+  /** 菜单项，仅使用 MkDropdownItem */
   default(): unknown
 }>()
 </script>

ui/src/components/global/mk-action/context.ts

@@ -1,28 +1,18 @@
 <script setup lang="ts">
-import { inject } from 'vue'
-import { actionContextKey } from './context'
-
 defineOptions({ name: 'MkAction', inheritAttrs: false })
-defineProps<{ label: string; icon: string; disabled?: boolean; divided?: boolean }>()
+withDefaults(defineProps<{ display?: 'menu' | 'button'; label: string; icon: string; disabled?: boolean; divided?: boolean }>(), { display: 'menu' })
 const emit = defineEmits<{ click: [event: MouseEvent] }>()
-const context = inject(actionContextKey, undefined)
 </script>
 
 <template>
   <!-- 菜单操作 -->
-  <MkDropdownItem
-    v-if="context?.display === 'menu'"
-    v-bind="$attrs"
-    :disabled="disabled"
-    :divided="divided && !context.first"
-    @click.stop="emit('click', $event)"
-  >
+  <MkDropdownItem v-if="display === 'menu'" v-bind="$attrs" :disabled="disabled" :divided="divided" @click.stop="emit('click', $event)">
     <template #icon><MkIcon :name="icon" /></template>
     {{ label }}
   </MkDropdownItem>
   <MkTooltip v-else :content="label" placement="top">
     <!-- 图标操作 -->
-    <el-button v-bind="$attrs" type="primary" text :disabled="disabled" @click.stop="emit('click', $event)">
+    <el-button v-bind="$attrs" text type="primary" :disabled="disabled" @click.stop="emit('click', $event)">
       <MkIcon :name="icon" />
     </el-button>
   </MkTooltip>

ui/src/components/global/mk-dropdown/MkDropdownMenu.vue

@@ -16,7 +16,7 @@ const hasDropdownItems = computed(() => hasRenderableSlotContent(slots.default?.
 </script>
 
 <template>
-  <MkDropdown v-if="hasDropdownItems" trigger="click" placement="bottom-end" v-bind="$attrs">
+  <MkDropdown v-if="hasDropdownItems" class="mk-table-more-dropdown [button+&]:ml-1" trigger="click" placement="bottom-end" v-bind="$attrs">
     <el-button type="primary" text @click.stop>
       <MkIcon name="icon_more_outlined" />
     </el-button>

…rc/components/global/mk-action/index.vue …/components/global/mk-table/MkAction.vueui/src/components/global/mk-action/index.vue renamed to ui/src/components/global/mk-table/MkAction.vue ui/src/components/global/mk-action/index.vue renamed to ui/src/components/global/mk-table/MkAction.vue

@@ -804,18 +804,13 @@ application、tool、knowledge 的 WorkflowView 统一使用一个 `loading` 控
 
 `system/resource-management/ModelResourceView.vue` 与 `ToolResourceView.vue` 使用
 `MkViewLayout`、`MkComplexSearch` 和 `MkTable` 展示跨工作空间资源。
-模型操作列通过 `MkTableOperationGroup` 按插槽顺序外露编辑与资源授权，其余操作自动进入 More；
-参数设置的显隐条件直接写在 Action 上，业务 Action 复用 `MkAction` 适配按钮与菜单。
-模型 `action-dropdown` 中的编辑、删除、参数设置、授权和关联资源入口统一使用 `MkAction`。
-资源管理页复用 `EditModelAction`，传入 System API、供应商和禁用状态；该 Action 内聚编辑抽屉，
-保存后发送 `refresh`。共享模型页继续组合相同业务 Action，在卡片菜单中自动显示为菜单项。
-资源管理删除保留页面专属确认、引用数量提示、加载状态和分页回退，通过 `MkAction` 展示，
-不强行复用卡片的 `DeleteModelAction`。
-工具操作列同样使用 `MkTableOperationGroup`，按现有模板顺序和显隐条件外露前两个操作；
-启停开关位于操作组外，不计入两个操作。商店工具改名、System 工作流跳转和带引用提示、
-分页回退的删除继续由资源管理页维护，通过 `MkAction` 展示。
-工具 `action-dropdown` 内的各操作统一使用 `MkAction`，Workspace 和共享工具卡片仍通过
-`MkDropdownMenu` 自动显示菜单项，保留原有 API、权限条件、事件和浮层生命周期。
+模型操作列使用 `EditModelAction display="button"` 展示编辑按钮，其余操作放入 `MkTableMoreDropdown`；
+`EditModelAction` 透传 `display` 给 `MkAction`，默认保持菜单模式，内部管理编辑抽屉，保存后发出 `refresh`。
+模型和工具仅编辑、资源授权四个 Action 使用 `MkAction` 并透传显式 `display`，默认菜单模式；
+其他业务 Action 继续使用 `MkDropdownItem`，页面按现有布局显式选择按钮或菜单。
+工具操作列保留独立启停开关，
+其余操作放入 `MkTableMoreDropdown`。菜单开启 `persistent`，业务 Action 使用 `MkDropdownItem`，
+保留各自 API、权限条件、事件和浮层生命周期。资源管理页保留带引用提示和分页回退的独立删除流程。
 名称、类型、创建者（工具另含来源）筛选和工作空间表头筛选变化后回到第一页；分页大小变化由
 `MkTable` 重置页码。工作空间列及选项查询只在企业版开启，`workspace_ids` 沿用 JSON 数组字符串。
 页面使用 v3 的 System 权限方法保留迁移前已有的操作权限，不增加创建、导入、批量或复制入口。

ui/src/components/global/mk-table/MkTableMoreDropdown.vue

@@ -5,7 +5,7 @@ import { RESOURCE_TYPE } from '@/api/enums'
 import ResourceAuthorizationDrawer from '@/components/business/resource-authorization-drawer/index.vue'
 
 defineOptions({ name: 'AuthorizeModelAction' })
-const props = defineProps<{ model: ModelItem; label: string }>()
+const props = defineProps<{ model: ModelItem; label: string; display?: 'menu' | 'button' }>()
 
 const drawerMounted = ref(false)
 const authorizationDrawerRef = useTemplateRef<InstanceType<typeof ResourceAuthorizationDrawer>>('authorizationDrawerRef')
@@ -22,7 +22,7 @@ function handleDrawerClosed() {
 
 <template>
   <!-- 资源授权 -->
-  <MkAction :label="label" icon="icon_passkeys_outlined" @click="handleOpenAuthorization" />
+  <MkAction :display="display" :label="label" icon="icon_passkeys_outlined" @click="handleOpenAuthorization" />
   <ResourceAuthorizationDrawer
     v-if="drawerMounted"
     ref="authorizationDrawerRef"

ui/src/views/VIEW_README.md

@@ -24,5 +24,8 @@ function handleDeleteModel() {
 
 <template>
   <!-- 删除模型 -->
-  <MkAction :label="label" icon="icon_delete-trash_outlined" divided @click="handleDeleteModel" />
+  <MkDropdownItem divided @click="handleDeleteModel">
+    <template #icon><MkIcon name="icon_delete-trash_outlined" /></template>
+    <span>{{ label }}</span>
+  </MkDropdownItem>
 </template>