fix: configpanels form + validation

This commit is contained in:
axolotle 2024-08-18 10:19:30 +02:00
parent eb0597b544
commit 457225b980
2 changed files with 6 additions and 5 deletions

View file

@ -3,6 +3,8 @@
lang="ts" lang="ts"
generic="NestedMV extends Obj, MV extends Obj<NestedMV>" generic="NestedMV extends Obj, MV extends Obj<NestedMV>"
> >
import { useRoute } from 'vue-router'
import type { FormValidation } from '@/composables/form' import type { FormValidation } from '@/composables/form'
import type { KeyOfStr, Obj } from '@/types/commons' import type { KeyOfStr, Obj } from '@/types/commons'
import type { ConfigPanel, ConfigPanels } from '@/types/configPanels' import type { ConfigPanel, ConfigPanels } from '@/types/configPanels'
@ -11,8 +13,8 @@ defineOptions({
inheritAttrs: false, inheritAttrs: false,
}) })
const currentRoute = useRoute()
const props = defineProps<{ const props = defineProps<{
// modelValue: MV[keyof MV]
panel: ConfigPanel<NestedMV, MV> panel: ConfigPanel<NestedMV, MV>
routes: ConfigPanels<NestedMV, MV>['routes'] routes: ConfigPanels<NestedMV, MV>['routes']
validations: FormValidation<NestedMV> validations: FormValidation<NestedMV>
@ -20,7 +22,6 @@ const props = defineProps<{
const emit = defineEmits<{ const emit = defineEmits<{
apply: [action?: KeyOfStr<typeof props.panel.fields>] apply: [action?: KeyOfStr<typeof props.panel.fields>]
'update:modelValue': [modelValue: MV[keyof MV]]
}>() }>()
const slots = defineSlots<{ const slots = defineSlots<{
@ -41,7 +42,7 @@ const modelValue = defineModel<NestedMV>({ required: true })
v-for="route in routes" v-for="route in routes"
:key="route.text" :key="route.text"
:to="route.to" :to="route.to"
:active="$route.params.tabId === route.to.params?.tabId" :active="currentRoute.params.tabId === route.to.params?.tabId"
> >
<!-- FIXME added :active="" because `exact-active-class` not working https://github.com/bootstrap-vue-next/bootstrap-vue-next/issues/1754 --> <!-- FIXME added :active="" because `exact-active-class` not working https://github.com/bootstrap-vue-next/bootstrap-vue-next/issues/1754 -->
<!-- exact-active-class="active" --> <!-- exact-active-class="active" -->
@ -52,7 +53,7 @@ const modelValue = defineModel<NestedMV>({ required: true })
</BCardHeader> </BCardHeader>
<CardForm <CardForm
v-model="modelValue" v-model="modelValue.value"
:fields="panel.fields" :fields="panel.fields"
:no-footer="!panel.hasApplyButton" :no-footer="!panel.hasApplyButton"
:sections="panel.sections" :sections="panel.sections"

View file

@ -37,7 +37,7 @@ export function useTouch(
const v = toValue(validation) const v = toValue(validation)
if (v) { if (v) {
// For fields that have multiple elements // For fields that have multiple elements
if (key) { if (key && v[key]) {
v[key].$touch() v[key].$touch()
clear?.(v[key].$path) clear?.(v[key].$path)
} else { } else {