Commit Graph

6 Commits (2ef02f2e80235eb4cb476d4fc352e5ba6fb587e9)

Author SHA1 Message Date
Ryan Wang a396aad87f
feat: add editor extension point (#781)
#### What type of PR is this?

/kind feature

#### What this PR does / why we need it:

添加编辑器的扩展点,用于扩展集成其他编辑器。

定义一个扩展点的方式:

```ts
export default definePlugin({
  extensionPoints: {
    "editor:create": () => {
      return [
        {
          name: "stackedit",
          displayName: "StackEdit",
          component: markRaw(StackEdit),
          rawType: "markdown",
        },
      ];
    },
  },
});
```

其中 `component` 字段即编辑器组件对象,需要包含 `raw`、`content` 的 prop。

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/2881

#### Screenshots:

<img width="1664" alt="image" src="https://user-images.githubusercontent.com/21301288/208406097-60258cba-cff6-436f-bd50-6d8c27ea9a53.png">
<img width="1662" alt="image" src="https://user-images.githubusercontent.com/21301288/208406174-d4649365-3448-4581-a452-f9781502eac6.png">
<img width="1920" alt="image" src="https://user-images.githubusercontent.com/21301288/208407570-db10e956-cd6a-4e0d-801e-b794ad0261bc.png">
<img width="1920" alt="image" src="https://user-images.githubusercontent.com/21301288/208407607-fd595957-5278-40c2-a3b5-fb73c1de429c.png">

#### Special notes for your reviewer:

目前可用于测试的插件:

1. [plugin-stackedit-1.0.0-SNAPSHOT.jar.zip](https://github.com/halo-dev/console/files/10258488/plugin-stackedit-1.0.0-SNAPSHOT.jar.zip)
2. [plugin-bytemd-1.0.0-SNAPSHOT.jar.zip](https://github.com/halo-dev/console/files/10258490/plugin-bytemd-1.0.0-SNAPSHOT.jar.zip)

测试方式:

1. Console 需要 `pnpm build:packages`。
2. 在 Console 的插件管理上传以上插件。
3. 新建若干文章,使用不同的编辑器。
4. 检查是否能够正常发布和编辑。
5. 检查编辑的时候,是否正确使用了之前的编辑器。
6. 检查主题端是否渲染正常。

一些实现细节:

1. 为了支持更新文章时能够选择发布时的编辑器,会在 post 的 `metadata.annotations` 添加一条 `content.halo.run/preferred-editor` 用于标记使用的什么编辑器。如果编辑器不存在,会使用 content 的 `rawType` 来匹配。
2. 目前没有全局默认编辑器设置,只能在新建文章的时候选择。

#### Does this PR introduce a user-facing change?

```release-note
Console 端支持扩展集成其他编辑器
```
2022-12-22 04:14:29 +00:00
Ryan Wang 8386e14301
feat: add formkit custom input of repeater (#692)
#### What type of PR is this?

/kind feature
/milestone 2.0

#### What this PR does / why we need it:

为 FormKit 添加 Repeater 输入类型,用于让用户动态操作一个对象数组。

使用方式可以查阅:https://github.com/ruibaby/halo-console/tree/feat/formkit-repeater/docs/custom-formkit-input#repeater

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/2529

#### Screenshots:

<img width="635" alt="image" src="https://user-images.githubusercontent.com/21301288/201640327-5eb0489a-2193-445d-9dfe-7405ae75a297.png">

#### Special notes for your reviewer:

/cc @halo-dev/sig-halo-console 

测试方式:

1. 按照 https://github.com/ruibaby/halo-console/tree/feat/formkit-repeater/docs/custom-formkit-input#repeater 文档,在主题或者插件中使用 FormKit Schema 的形式定义设置表单,然后对表单进行保存等设置,检查是否符合预期。
2. 或者使用 https://github.com/halo-sigs/theme-earth/tree/refactor/setting-spec 主题进行测试,这个分支已经对社交媒体和侧边栏进行了适配。可以在主题设置中测试社交媒体和侧边栏配置,检查在主题端的效果。

#### Does this PR introduce a user-facing change?

```release-note
为 FormKit 添加 Repeater 输入类型。
```
2022-11-15 07:48:17 +00:00
Ryan Wang 28c95c199f
feat: add formkit custom input of attachment (#674)
#### What type of PR is this?

/kind feature
/milestone 2.0

#### What this PR does / why we need it:

添加选择附件类型的 FormKit 输入框。

在 Vue 单组件中使用:

```vue
<script lang="ts" setup>
const logo = ref("")
</script>

<template>
  <FormKit
    v-model="logo"
    label="Logo"
    type="attachment"
    validation="required"
  />
</template>
```

在 FormKit Schema 中使用(插件 / 主题设置表单定义):

```yaml
- $formkit: attachment
  name: logo
  label: Logo
```


#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/2558

#### Screenshots:

<img width="671" alt="image" src="https://user-images.githubusercontent.com/21301288/198980581-ba90ec32-f205-4d03-8546-3c93238298e7.png">


#### Special notes for your reviewer:

/cc @halo-dev/sig-halo-console 

#### Does this PR introduce a user-facing change?

```release-note
添加选择附件类型的 FormKit 输入框。
```
2022-11-01 03:06:18 +00:00
Ryan Wang 2de0b1f505
feat: add formkit custom input of codemirror (#672)
#### What type of PR is this?

/kind feature
/milestone 2.0

#### What this PR does / why we need it:

添加 Codemirror 类型的 FormKit 输入框。

在 Vue 单组件中使用:

```vue
<script lang="ts" setup>
const code = ref("")
</script>

<template>
  <FormKit
    v-model="code"
    label="页脚代码"
    type="code"
    validation="required"
  />
</template>
```

在 FormKit Schema 中使用(插件 / 主题设置表单定义):

```yaml
- $formkit: code
  name: code
  label: 页脚代码
```

#### Screenshots:

<img width="1331" alt="image" src="https://user-images.githubusercontent.com/21301288/198954003-02ce1972-8f7f-4959-a349-5650d166f3ae.png">

#### Special notes for your reviewer:

/cc @halo-dev/sig-halo-console 

#### Does this PR introduce a user-facing change?


```release-note
添加 Codemirror 类型的 FormKit 输入框。
```
2022-11-01 02:56:16 +00:00
Ryan Wang 54755c5842
refactor: router and menu generation (#651)
#### What type of PR is this?

/kind api-change
/kind improvement
/milestone 2.0

#### What this PR does / why we need it:

Ref https://github.com/halo-dev/halo/issues/2595

重构路由和侧边菜单生成的逻辑,**注意,此 PR 对插件的 Console 入口文件中的路由和菜单定义包含破坏性更新。**

1. 移除 `definePlugin` 方法的 `menus` 字段,改为在 route 的 meta 中定义。
2. 将 `RoutesMenu` 组件从 `@halo-dev/components` 包中移出。
3. 将 `BasicLayout` 组件从 `@halo-dev/console-shared` 包中移出。

定义路由的方式:

```ts
import { definePlugin } from "@halo-dev/console-shared";
import BasicLayout from "@/layouts/BasicLayout.vue";
import AttachmentList from "./AttachmentList.vue";
import AttachmentSelectorModal from "./components/AttachmentSelectorModal.vue";
import { IconFolder } from "@halo-dev/components";
import { markRaw } from "vue";

export default definePlugin({
  name: "attachmentModule",
  components: [AttachmentSelectorModal],
  routes: [
    {
      path: "/attachments",
      component: BasicLayout,
      children: [
        {
          path: "",
          name: "Attachments",
          component: AttachmentList,
          meta: {
            title: "附件",
            permissions: ["system:attachments:view"],
            menu: {
              name: "附件",
              group: "内容",
              icon: markRaw(IconFolder),
              priority: 4,
              mobile: true,
            },
          },
        },
      ],
    },
  ],
});
```

menu 字段类型:

```ts
interface RouteMeta {
  title?: string;
  searchable?: boolean;
  permissions?: string[];
  menu?: {
    name: string;
    group?: string;
    icon?: Component;
    priority: number;
    mobile?: true;
  };
}
```

插件适配需要做的改动:

1. 移除 `definePlugin` 中的 menus 字段。
2. 在需要添加到菜单的 route 中提供 `meta.menu` 对象,可参考上方的 menu 字段类型。

详细文档可查阅:https://github.com/ruibaby/halo-console/tree/refactor/route-map-setting/docs/routes-generation

todolist:

- [x] 完善预设的菜单分组定义。
- [x] 绑定权限,根据权限决定是否需要将路由添加到菜单。
- [x] 优化菜单排序的定义方式。

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/2595

#### Special notes for your reviewer:

/cc @halo-dev/sig-halo-console 

测试方式:

1. 需要 `pnpm build:packages`
2. 测试后台的菜单及路由是否有异常。
3. 新建角色测试路由和菜单对权限的绑定。
4. 按照 https://github.com/ruibaby/halo-console/tree/refactor/route-map-setting/docs/routes-generation 文档,创建插件,测试插件添加路由和菜单是否正常。

#### Does this PR introduce a user-facing change?

```release-note
重构路由和侧边菜单生成的逻辑。
```
2022-10-19 08:54:13 +00:00
Ryan Wang edef11cc12
feat: add some formkit custom input for the system core extensions (#643)
#### What type of PR is this?

/kind feature
/milestone 2.0

#### What this PR does / why we need it:

Ref https://github.com/halo-dev/halo/issues/2526#issuecomment-1273094868

FormKit 文档:https://formkit.com/advanced/custom-inputs

通过扩展 FormKit 的自定义 Input,提供系统常用资源的选择组件。

目前提供如下类型:

- menuCheckbox
- menuRadio
- menuItemSelect
- postSelect
- categorySelect
- tagSelect
- singlePageSelect
- categoryCheckbox
- tagCheckbox

FormKit 组件的使用方式:

```vue
<FormKit
        placeholder="请选择文章"
        label="文章"
        type="postSelect"
        validation="required"
/>
```

FormKit Schema 的使用方式:

```yaml
- $formkit: menuRadio
    name: menus
    label: 底部菜单组
```

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/2526

#### Screenshots:

<!--
如果此 PR 有 UI 的改动,最好截图说明这个 PR 的改动。
If there are UI changes to this PR, it is best to take a screenshot to illustrate the changes to this PR.
eg.
Before:
![screenshot-before](https://user-images.githubusercontent.com/screenshot.png)
After:
![screenshot-after](https://user-images.githubusercontent.com/screenshot.png)
-->

#### Special notes for your reviewer:

/cc @halo-dev/sig-halo-console 

测试方式:

1. 检查后台文章设置弹框的选择分类和标签功能是否正常。
2. 检查后台添加菜单项的功能是否正常。
3. 使用主题或者插件定义 settings.yaml,使用上述任意 input 类型,检查得到的效果和值是否正常。

#### Does this PR introduce a user-facing change?

```release-note
通过扩展 FormKit 的自定义 Input,提供系统常用资源的选择组件。
```
2022-10-18 03:32:09 +00:00