feat: Add textarea form element

This commit is contained in:
2025-12-06 18:00:27 +01:00
parent f1b66c184b
commit 4b06f68265
5 changed files with 52 additions and 18 deletions

View File

@@ -99,7 +99,7 @@ Application Form
└── Form Elements (FormElement)
├── id (UUID - generated by backend)
├── reference (string - custom key like "art_der_massnahme")
├── type (SELECT, CHECKBOX, RADIOBUTTON, TEXTFIELD, SWITCH, TITLE_BODY_TEXTFIELDS)
├── type (SELECT, CHECKBOX, RADIOBUTTON, TEXTFIELD, TEXTAREA, SWITCH, TITLE_BODY_TEXTFIELDS, DATE)
├── title, description
├── options (FormOption[])
│ ├── value, label
@@ -227,7 +227,7 @@ Form elements can be conditionally shown or hidden based on the values of other
"reference": "testphase_zeitraum",
"title": "Testphase Zeitraum",
"description": "Zeitraum der Testphase",
"type": "TEXTFIELD",
"type": "TEXTAREA",
"options": [
{
"value": "",

View File

@@ -1457,6 +1457,7 @@ components:
- CHECKBOX
- RADIOBUTTON
- TEXTFIELD
- TEXTAREA
- SWITCH
- TITLE_BODY_TEXTFIELDS
- DATE

View File

@@ -89,6 +89,8 @@ function getResolvedComponent(formElement: FormElementDto) {
return resolveComponent('TheSwitch')
case 'TEXTFIELD':
return resolveComponent('TheInput')
case 'TEXTAREA':
return resolveComponent('TheTextarea')
case 'TITLE_BODY_TEXTFIELDS':
return resolveComponent('TheTitleBodyInput')
case 'DATE':

View File

@@ -0,0 +1,31 @@
<template>
<UFormField :label="label">
<UTextarea v-model="modelValue" class="w-full" autoresize />
</UFormField>
</template>
<script setup lang="ts">
import type { FormOptionDto } from '~~/.api-client'
const props = defineProps<{
label?: string
formOptions: FormOptionDto[]
}>()
const emit = defineEmits<{
(e: 'update:formOptions', value: FormOptionDto[]): void
}>()
const modelValue = computed({
get: () => props.formOptions[0]?.value ?? '',
set: (val) => {
const firstOption = props.formOptions[0]
if (val && firstOption) {
const updatedModelValue = [...props.formOptions]
updatedModelValue[0] = { ...firstOption, value: val.toString() }
emit('update:formOptions', updatedModelValue)
}
}
})
</script>

View File

@@ -107,7 +107,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "testphase_findet_statt",
@@ -153,7 +153,7 @@
"employeeDataCategory": "SENSITIVE"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "verwendung_anonymisierter_daten",
@@ -173,7 +173,7 @@
"employeeDataCategory": "REVIEW_REQUIRED"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "verwendung_anonymisierter_daten",
@@ -193,7 +193,7 @@
"employeeDataCategory": "SENSITIVE"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "verwendung_anonymisierter_daten",
@@ -233,7 +233,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "abgeloestes_system",
@@ -273,7 +273,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "geaendertes_system",
@@ -299,7 +299,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "HIDE",
"sourceFormElementReference": "art_der_massnahme",
@@ -319,7 +319,7 @@
"employeeDataCategory": "REVIEW_REQUIRED"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "HIDE",
"sourceFormElementReference": "art_der_massnahme",
@@ -339,7 +339,7 @@
"employeeDataCategory": "REVIEW_REQUIRED"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "HIDE",
"sourceFormElementReference": "art_der_massnahme",
@@ -365,7 +365,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "HIDE",
"sourceFormElementReference": "art_der_massnahme",
@@ -385,7 +385,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "HIDE",
"sourceFormElementReference": "art_der_massnahme",
@@ -405,7 +405,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "HIDE",
"sourceFormElementReference": "art_der_massnahme",
@@ -535,7 +535,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "modulbasiertes_system",
@@ -555,7 +555,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "modulbasiertes_system",
@@ -575,7 +575,7 @@
"employeeDataCategory": "NON_CRITICAL"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "modulbasiertes_system",
@@ -647,7 +647,7 @@
"employeeDataCategory": "REVIEW_REQUIRED"
}
],
"type": "TEXTFIELD",
"type": "TEXTAREA",
"visibilityCondition": {
"conditionType": "SHOW",
"sourceFormElementReference": "wirtschaftliche_auswirkungen",