Add intro for field
This commit is contained in:
parent
ca9511270d
commit
3907395506
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<v-checkbox :id="innerId" v-model="inner" :name="field.key" :label="field.description" :required="field.required" :hint="field.hint"></v-checkbox>
|
||||
<v-checkbox :id="innerId" v-model="inner" :name="field.key" :label="field.description" :required="field.required" :intro="field.intro" :hint="field.hint"></v-checkbox>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
<div class="relative">
|
||||
<field-label :name="field.name" :required="false" :hint="field.hint" inline></field-label>
|
||||
<div class="grid grid-cols-1 gap-2 pt-1">
|
||||
<div class="text-sm text-gray-600" v-text="field.intro" v-if="field.intro"></div>
|
||||
<label v-for="(option, index) in field.options" :key="index" :for="`${innerId}-${index}`" class="block relative flex items-start">
|
||||
<input :id="`${innerId}-${index}`" v-model="inner" type="checkbox" :name="field.key" :value="option" class="peer absolute invisible" />
|
||||
<span class="border-neutral-400 border-4 border-solid peer-checked:border-primary absolute left-0 w-6 h-6 rounded block"></span>
|
||||
|
|
|
@ -50,6 +50,7 @@
|
|||
:name="`${field.key}-memberselect-${member.id}`"
|
||||
:id="`${field.key}-memberselect-${member.id}`"
|
||||
:label="member.name"
|
||||
intro=""
|
||||
v-for="member in searchResults.data"
|
||||
></v-checkbox>
|
||||
</div>
|
||||
|
@ -89,6 +90,7 @@
|
|||
:name="`${field.key}-memberattr-${member.id}-${memberField.key}`"
|
||||
:id="`${field.key}-memberattr-${member.id}-${memberField.key}`"
|
||||
:label="memberField.name"
|
||||
intro=""
|
||||
></v-checkbox>
|
||||
<v-dropdown
|
||||
v-if="memberField.type === 'DropdownField'"
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
<div class="relative">
|
||||
<field-label :name="field.name" :required="field.required" :hint="field.hint" :button="modelValue === null ? '' : 'Option löschen'" @buttonclick="selected = null" inline></field-label>
|
||||
<div class="grid grid-cols-1 gap-2 pt-1">
|
||||
<div class="text-sm text-gray-600" v-text="field.intro" v-if="field.intro"></div>
|
||||
<label v-for="(option, index) in field.options" :key="index" :for="`${innerId}-${index}`" class="block relative flex items-center">
|
||||
<input :id="`${innerId}-${index}`" v-model="selected" type="radio" :name="field.key" :value="option" class="peer absolute invisible" />
|
||||
<span class="border-neutral-400 border-4 border-solid peer-checked:border-primary absolute left-0 w-6 h-6 rounded-full block"></span>
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
<template>
|
||||
<div class="relative">
|
||||
<div class="grid grid-cols-1 gap-2">
|
||||
<div class="text-sm text-gray-600" v-text="intro" v-if="intro"></div>
|
||||
<label :for="id" class="p-0 block leading-none relative flex items-start">
|
||||
<input :id="id" v-model="inner" type="checkbox" :name="name" class="peer absolute invisible" />
|
||||
<span
|
||||
|
@ -50,6 +51,11 @@ const props = defineProps({
|
|||
validator: (value) => value === null || typeof value === 'string',
|
||||
default: () => null,
|
||||
},
|
||||
intro: {
|
||||
required: false,
|
||||
validator: (value) => value === null || typeof value === 'string',
|
||||
default: () => null,
|
||||
},
|
||||
});
|
||||
|
||||
const inner = computed({
|
||||
|
|
|
@ -33,7 +33,7 @@ window.hasKeys = function (object, expected) {
|
|||
};
|
||||
|
||||
window.globalFieldRules = function () {
|
||||
return ['value', 'special_type', 'nami_type', 'for_members', 'key', 'columns', 'name', 'type', 'hint'];
|
||||
return ['value', 'special_type', 'nami_type', 'for_members', 'key', 'columns', 'name', 'type', 'hint', 'intro'];
|
||||
};
|
||||
|
||||
EventForm.styles = [classes, carousel, carouselStyle];
|
||||
|
|
Loading…
Reference in New Issue