Add intro for field

This commit is contained in:
philipp lang 2024-06-07 00:46:31 +02:00
parent ca9511270d
commit 3907395506
6 changed files with 12 additions and 2 deletions

View File

@ -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>

View File

@ -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>

View File

@ -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'"

View File

@ -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>

View File

@ -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({

View File

@ -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];