mirror of https://github.com/halo-dev/halo
3be91fcb6f
#### What type of PR is this?
/kind feature
/area ui
/milestone 2.19.x
#### What this PR does / why we need it:
此 PR 使用自定义的 Select 组件替换了原有的 Formkit Select 组件，原 Select 组件类型变为 `nativeSelect`。
新的 Select 组件具有如下功能：
- 增加多选、单选两种模式。
- 支持对内容进行搜索、过滤。
- 可使用接口远程加载，并可自定义数据获取。
- 支持扩展远程加载方式。
- 可创建新选项。
- 支持清空所有已选择项。
- 多选状态下可控制最大选择数量。
- 多选状态下可进行排序。
重构后的 Select 组件将自动兼容旧版组件。
使用方式如下：
```vue
<FormKit
type="select"
label="What country makes the best food?"
name="countries"
placeholder="Select a country"
allow-create
clearable
sortable
multiple
searchable
:max-count="3"
:options="[
{ label: 'France', value: 'fr'},
{ label: 'Germany', value: 'de'},
{ label: 'Spain', value: 'es'},
{ label: 'Italy', value: 'ie' },
{ label: 'Greece', value: 'gr'},
]"
help="Don’t worry, you can’t get this one wrong."
/>
```
#### How to test it?
1. 需要测试已使用的 Select 组件功能是否发生了变化。
测试在多选、单选状态下，Select 组件的功能是否可以正常使用。
测试在远程加载时，数据获取是否正常，是否可正常分页，加载状态是否显示。
#### Which issue(s) this PR fixes:
see https://github.com/halo-dev/halo/issues/4931#issuecomment-2060637101
see #6369
#### Does this PR introduce a user-facing change?
```release-note
重构 FormKit 选择器组件以支持更多功能
```
|
||
|---|---|---|
| .. | ||
| components | ||
| custom-formkit-input | ||
| extension-points | ||
| project-structure | ||
| routes-generation | ||