feat(frontend): Add RadioGroup, calculate highest compliance status

legalconsenthub/pages/create.vue

@@ -33,12 +33,12 @@
 </template>
 
 <script setup lang="ts">
-import type { ComplianceStatus, PagedApplicationFormDto } from '~/.api-client'
+import { ComplianceStatus, type PagedApplicationFormDto } from '~/.api-client'
 import { useApplicationFormValidator } from '~/composables/useApplicationFormValidator'
 import type { FormElementId } from '~/types/FormElement'
 
 const { getAllApplicationForms } = useApplicationForm()
-const { validateFormElements } = useApplicationFormValidator()
+const { validateFormElements, getHighestComplianceStatus } = useApplicationFormValidator()
 
 const { data } = await useAsyncData<PagedApplicationFormDto>(async () => {
   return await getAllApplicationForms()
@@ -52,12 +52,14 @@ const formElements = computed({
     }
   }
 })
-const validationStatus = ref<Map<FormElementId, ComplianceStatus> | undefined>()
+const validationMap = ref<Map<FormElementId, ComplianceStatus> | undefined>()
+const validationStatus = ref<ComplianceStatus>(ComplianceStatus.NonCritical)
 
 watch(
   () => formElements,
   (updatedFormElements) => {
-    validationStatus.value = validateFormElements(updatedFormElements.value)
+    validationMap.value = validateFormElements(updatedFormElements.value)
+    validationStatus.value = getHighestComplianceStatus()
   },
   { deep: true }
 )