✨ feat (soapi): introduce early rehab and function forms

app/components/content/soapi/entry.vue

@@ -1,16 +1,38 @@
 <script setup lang="ts">
 import { computed } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
+import { useRoute } from 'vue-router'
+import { useQueryMode } from '@/composables/useQueryMode' // asumsikan ini ada
 
-import EarlyMedicalAssesmentList from './list.vue'
-import EarlyMedicalAssesmentForm from './form.vue'
+import SoapiList from './list.vue'
+import EarlyForm from './form.vue'
+import RehabForm from './form-rehab.vue'
+import FunctionForm from './form-function.vue'
+
+const route = useRoute()
+const type = computed(() => (route.query.tab as string) || 'early-medical-assessment')
 
 const { mode, openForm, backToList } = useQueryMode('mode')
+
+const formMap = {
+  'early-medical-assessment': EarlyForm,
+  'rehab-medical-assessment': RehabForm,
+  'function-assessment': FunctionForm,
+}
+
+const ActiveForm = computed(() => formMap[type.value] || EarlyForm)
 </script>
 
 <template>
   <div>
-    <EarlyMedicalAssesmentList v-if="mode === 'list'" @add="openForm" />
-    <EarlyMedicalAssesmentForm v-else @back="backToList" />
+    <SoapiList
+      v-if="mode === 'list'"
+      @add="openForm"
+    />
+
+    <component
+      v-else
+      :is="ActiveForm"
+      @back="backToList"
+    />
   </div>
 </template>