mirror of https://github.com/halo-dev/halo
55 lines
1.3 KiB
Markdown
55 lines
1.3 KiB
Markdown
# 主题管理界面选项卡扩展点
|
|
|
|
## 原由
|
|
|
|
目前在 Halo 的主题管理中原生支持本地上传和远程下载的方式安装主题，此扩展点用于扩展主题管理界面的选项卡，以支持更多的安装方式。
|
|
|
|
## 定义方式
|
|
|
|
> 此示例为添加一个安装选项卡用于从 GitHub 上下载主题。
|
|
|
|
```ts
|
|
import { definePlugin } from "@halo-dev/console-shared";
|
|
import { markRaw } from "vue";
|
|
import GitHubDownloadTab from "./components/GitHubDownloadTab.vue";
|
|
|
|
export default definePlugin({
|
|
extensionPoints: {
|
|
"theme:list:tabs:create": () => {
|
|
return [
|
|
{
|
|
id: "github",
|
|
label: "GitHub",
|
|
component: markRaw(GitHubDownload),
|
|
props: {
|
|
foo: "bar",
|
|
},
|
|
priority: 11,
|
|
},
|
|
];
|
|
},
|
|
},
|
|
});
|
|
```
|
|
|
|
扩展点类型：
|
|
|
|
```ts
|
|
"theme:list:tabs:create"?: () =>
|
|
| ThemeListTab[]
|
|
| Promise<ThemeListTab[]>;
|
|
```
|
|
|
|
`ThemeListTab`:
|
|
|
|
```ts
|
|
export interface ThemeListTab {
|
|
id: string; // 选项卡的唯一标识
|
|
label: string; // 选项卡的名称
|
|
component: Raw<Component>; // 选项卡面板的组件
|
|
props?: Record<string, unknown>; // 选项卡组件的 props
|
|
permissions?: string[]; // 权限
|
|
priority: number; // 优先级
|
|
}
|
|
```
|