Commit Graph

6 Commits (e3e0ddc95a5de2501f48848c388efead5646e06f)

Author SHA1 Message Date
Ryan Wang 9d5529b827
feat: add full-functional post category select component for formkit (#818)
#### What type of PR is this?

/kind feature

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

添加功能更为全面的文章分类选择器,支持以下特性:

1. 按层级展示分类
2. 支持搜索
3. 选中结果支持显示层级

todo list:

- [x] 样式整理
- [x] 支持创建新分类

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

Fixes https://github.com/halo-dev/halo/issues/2670
Fixes https://github.com/halo-dev/halo/issues/2485

#### Screenshots:

<img width="832" alt="image" src="https://user-images.githubusercontent.com/21301288/211768419-087d9727-1468-41a1-868a-62d90eef9cca.png">
<img width="858" alt="image" src="https://user-images.githubusercontent.com/21301288/211768478-dcc70d79-127b-42b0-ae44-e48a6a22273a.png">


#### Special notes for your reviewer:

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

```release-note
重构 Console 端的文章分类选择器。
```
2023-01-16 08:02:13 +00:00
Ryan Wang fffbd4aa51
feat: add full-functional post tag select component for formkit (#817)
#### What type of PR is this?

/kind feature

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

添加功能更为全面的文章标签选择器,解决在标签过多场景下的适用性问题,支持以下特性:

1. 支持搜索标签。
2. 支持没有搜索结果的时候创建新标签。
3. 支持单选和多选。

> 当前并未考虑实现一个通用的标签创建组件,仅为文章考虑。

todo list:

- [x] 样式整理
- [x] 重命名组件名

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

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

#### Screenshots:

<img width="796" alt="image" src="https://user-images.githubusercontent.com/21301288/211768172-b8dbf1c2-5f7c-4411-b8cc-f0070320649d.png">
<img width="725" alt="image" src="https://user-images.githubusercontent.com/21301288/211768235-8d587374-abad-40c9-b9e0-ea2b27e58495.png">


#### Special notes for your reviewer:

1. 创建若干文章,并进行标签设置的操作。
2. 测试标签选择,搜索,创建,删除,取消选择等操作。

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


```release-note
重构 Console 端的文章标签选择器。
```
2023-01-16 02:58:13 +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 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