评论数据列表操作菜单
此扩展点用于扩展评论数据列表的操作菜单项。
定义方式
export default definePlugin({
extensionPoints: {
"comment:list-item:operation:create": (
comment: Ref<ListedComment>
): OperationItem<ListedComment>[] | Promise<OperationItem<ListedComment>[]> => {
return [
{
priority: 10,
component: markRaw(VDropdownItem),
props: {},
action: (item?: ListedComment) => {
// do something
},
label: "foo",
hidden: false,
permissions: [],
children: [],
},
];
},
},
});
OperationItem
export interface OperationItem<T> {
priority: number; // 排序优先级
component: Raw<Component>; // 菜单项组件
props?: Record\<string, unknown\>; // 菜单项组件属性
action?: (item?: T) => void; // 菜单项点击事件
label?: string; // 菜单项标题
hidden?: boolean; // 菜单项是否隐藏
permissions?: string[]; // 菜单项 UI 权限
children?: OperationItem<T>[]; // 子菜单项
}
示例
此示例将实现一个操作菜单项。
import type { ListedComment } from "@halo-dev/api-client";
import { VDropdownItem } from "@halo-dev/components";
import { definePlugin } from "@halo-dev/console-shared";
import { markRaw } from "vue";
export default definePlugin({
extensionPoints: {
"comment:list-item:operation:create": () => {
return [
{
priority: 21,
component: markRaw(VDropdownItem),
label: "测试评论菜单",
visible: true,
permissions: [],
action: async (comment: ListedComment) => {
console.log(comment)
},
},
];
},
},
});