fix: radio value type is incorrect in the form defined by formkit schema (#3668)

#### What type of PR is this?

/kind bug
/area console
/milestone 2.5.x
/cherry-pick release-2.4

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

修复使用了 FormKit Schema 生成的表单中,Radio 输入类型如果值的类型定义为 boolean 类型,但得到的结果为 string 类型的问题。

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

Fixes #3666 

#### Special notes for your reviewer:

测试方式:

1. 安装一个主题设置使用了 Radio 输入类型的主题,比如 https://github.com/halo-dev/halo-theme-anatole
2. 测试保存其中包含了 Radio 输入类型的表单。
3. 刷新页面,检查值回显是否正确。

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

```release-note
修复 Console 端 FormKit Schema 生成的表单中,Radio 输入类型值类型为 boolean 但结果为 string 的问题。
```
pull/3682/head
Ryan Wang 2023-04-03 11:48:13 +08:00 committed by GitHub
parent 14d7175443
commit ffeeaa231a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 12 additions and 11 deletions

View File

@ -3,7 +3,7 @@ import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
import SubmitButton from "@/components/button/SubmitButton.vue"; import SubmitButton from "@/components/button/SubmitButton.vue";
import type { Policy, PolicyTemplate } from "@halo-dev/api-client"; import type { Policy, PolicyTemplate } from "@halo-dev/api-client";
import cloneDeep from "lodash.clonedeep"; import cloneDeep from "lodash.clonedeep";
import { computed, ref, watch, watchEffect } from "vue"; import { computed, ref, toRaw, watch, watchEffect } from "vue";
import { useSettingForm } from "@/composables/use-setting-form"; import { useSettingForm } from "@/composables/use-setting-form";
import { apiClient } from "@/utils/api-client"; import { apiClient } from "@/utils/api-client";
import { import {
@ -230,7 +230,7 @@ const onVisibleChange = (visible: boolean) => {
validation="required|length:0,50" validation="required|length:0,50"
></FormKit> ></FormKit>
<FormKitSchema <FormKitSchema
:schema="formSchema" :schema="toRaw(formSchema)"
:data="configMapFormData['default']" :data="configMapFormData['default']"
/> />
</FormKit> </FormKit>

View File

@ -1,6 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
// core libs // core libs
import { inject, ref, computed } from "vue"; import { inject, ref, computed, toRaw } from "vue";
// components // components
import { Toast, VButton } from "@halo-dev/components"; import { Toast, VButton } from "@halo-dev/components";
@ -85,7 +85,7 @@ await suspense();
@submit="handleSaveConfigMap" @submit="handleSaveConfigMap"
> >
<FormKitSchema <FormKitSchema
:schema="formSchema" :schema="toRaw(formSchema)"
:data="configMapFormData[group]" :data="configMapFormData[group]"
/> />
</FormKit> </FormKit>

View File

@ -24,7 +24,7 @@ import {
Toast, Toast,
} from "@halo-dev/components"; } from "@halo-dev/components";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
import { computed, markRaw, ref, watch } from "vue"; import { computed, markRaw, ref, toRaw, watch } from "vue";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { OverlayScrollbarsComponent } from "overlayscrollbars-vue"; import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
import { useQuery } from "@tanstack/vue-query"; import { useQuery } from "@tanstack/vue-query";
@ -361,7 +361,7 @@ const iframeClasses = computed(() => {
@submit="handleSaveConfigMap" @submit="handleSaveConfigMap"
> >
<FormKitSchema <FormKitSchema
:schema="formSchema" :schema="toRaw(formSchema)"
:data="configMapFormData[tab.id]" :data="configMapFormData[tab.id]"
/> />
</FormKit> </FormKit>

View File

@ -1,5 +1,5 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, ref } from "vue"; import { computed, ref, toRaw } from "vue";
import { apiClient } from "@/utils/api-client"; import { apiClient } from "@/utils/api-client";
import { useQuery } from "@tanstack/vue-query"; import { useQuery } from "@tanstack/vue-query";
import type { AuthProvider, Setting } from "@halo-dev/api-client"; import type { AuthProvider, Setting } from "@halo-dev/api-client";
@ -257,7 +257,7 @@ const handleSaveConfigMap = async () => {
@submit="handleSaveConfigMap" @submit="handleSaveConfigMap"
> >
<FormKitSchema <FormKitSchema
:schema="formSchema" :schema="toRaw(formSchema)"
:data="configMapFormData[group]" :data="configMapFormData[group]"
/> />
</FormKit> </FormKit>

View File

@ -14,6 +14,7 @@ import type { ConfigMap, Plugin, Setting } from "@halo-dev/api-client";
import { useRouteParams } from "@vueuse/router"; import { useRouteParams } from "@vueuse/router";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { useQuery, useQueryClient } from "@tanstack/vue-query"; import { useQuery, useQueryClient } from "@tanstack/vue-query";
import { toRaw } from "vue";
const { t } = useI18n(); const { t } = useI18n();
const queryClient = useQueryClient(); const queryClient = useQueryClient();
@ -81,7 +82,7 @@ await suspense();
@submit="handleSaveConfigMap" @submit="handleSaveConfigMap"
> >
<FormKitSchema <FormKitSchema
:schema="formSchema" :schema="toRaw(formSchema)"
:data="configMapFormData[group]" :data="configMapFormData[group]"
/> />
</FormKit> </FormKit>

View File

@ -1,6 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
// core libs // core libs
import { computed, ref, type Ref, inject } from "vue"; import { computed, ref, type Ref, inject, toRaw } from "vue";
// components // components
import { Toast, VButton } from "@halo-dev/components"; import { Toast, VButton } from "@halo-dev/components";
@ -83,7 +83,7 @@ await suspense();
@submit="handleSaveConfigMap" @submit="handleSaveConfigMap"
> >
<FormKitSchema <FormKitSchema
:schema="formSchema" :schema="toRaw(formSchema)"
:data="configMapFormData[group]" :data="configMapFormData[group]"
/> />
</FormKit> </FormKit>