50 lines
1.4 KiB
Vue
50 lines
1.4 KiB
Vue
|
<template>
|
||
|
<f-switch
|
||
|
id="fieldrequired"
|
||
|
v-model="modelValue.required"
|
||
|
label="Erforderlich"
|
||
|
size="sm"
|
||
|
name="fieldrequired"
|
||
|
inline
|
||
|
@update:modelValue="$emit('update:modelValue', {...modelValue, required: $event})"
|
||
|
></f-switch>
|
||
|
<f-select
|
||
|
id="parent_field"
|
||
|
:options="fieldOptions"
|
||
|
size="sm"
|
||
|
name="parent_field"
|
||
|
label="Übergeordnetes Feld"
|
||
|
:model-value="modelValue.parent_field"
|
||
|
@update:modelValue="$emit('update:modelValue', {...props.modelValue, parent_field: $event})"
|
||
|
></f-select>
|
||
|
<f-select
|
||
|
id="parent_group"
|
||
|
:options="meta.groups"
|
||
|
size="sm"
|
||
|
name="parent_group"
|
||
|
label="Übergeordnete Gruppe"
|
||
|
:model-value="modelValue.parent_group"
|
||
|
@update:modelValue="$emit('update:modelValue', {...props.modelValue, parent_group: $event})"
|
||
|
></f-select>
|
||
|
</template>
|
||
|
|
||
|
<script setup>
|
||
|
import {computed} from 'vue';
|
||
|
|
||
|
const props = defineProps({
|
||
|
modelValue: {},
|
||
|
meta: {},
|
||
|
payload: {},
|
||
|
});
|
||
|
|
||
|
const fieldOptions = computed(() => {
|
||
|
return props.payload.reduce((carry, section) => {
|
||
|
return section.fields.reduce((fcarry, field) => {
|
||
|
return field.type === 'GroupField' ? fcarry.concat({id: field.key, name: field.name}) : fcarry;
|
||
|
}, carry);
|
||
|
}, []);
|
||
|
});
|
||
|
|
||
|
const emit = defineEmits(['update:modelValue']);
|
||
|
</script>
|