feat: enhance SEP entry and detail handling with new link mode and save functionality

app/components/app/sep/action-history.vue

@@ -14,7 +14,7 @@ const recSepId = inject('rec_sep_id') as Ref<string>
 
 function handleSelection() {
   recSepId.value = record.sepNumber || ''
-  const pathUrl = `/integration/bpjs-vclaim/sep/${record.sepNumber || ''}/detail`
+  const pathUrl = `/integration/bpjs-vclaim/sep/${record.sepNumber || ''}/link`
   router.push({ path: pathUrl })
 }
 </script>

app/components/app/sep/entry-form.vue

@@ -47,6 +47,7 @@ const props = defineProps<{
   cities: any[]
   districts: any[]
   specialists?: TreeItem[]
+  sepNumber?: string
   objects?: any
   values?: any
 }>()
@@ -129,6 +130,14 @@ async function onFetchChildren(parentId: string): Promise<void> {
   console.log('onFetchChildren', parentId)
 }
 
+const onBack = () => {
+  emit('event', 'back')
+}
+
+const onSaveNumber = () => {
+  emit('event', 'save-sep-number', { sepNumber: props.sepNumber})
+}
+
 // Submit handler
 const onSubmit = handleSubmit((values) => {
   console.log('✅ Validated form values:', JSON.stringify(values, null, 2))
@@ -966,6 +975,7 @@ onMounted(() => {
       <!-- Actions -->
       <div class="mt-6 flex justify-end gap-2">
         <Button
+           v-if="props.mode === 'detail'"
           variant="ghost"
           type="button"
           class="h-[40px] min-w-[120px] text-orange-400 hover:bg-green-50"
@@ -978,6 +988,7 @@ onMounted(() => {
           Riwayat SEP
         </Button>
         <Button
+          v-if="props.mode === 'detail'"
           variant="outline"
           type="button"
           class="h-[40px] min-w-[120px] rounded-md border-orange-400 text-orange-400 hover:bg-green-50 hover:text-orange-400"
@@ -989,6 +1000,7 @@ onMounted(() => {
           Preview
         </Button>
         <Button
+          v-if="props.mode === 'add'"
           type="button"
           class="h-[40px] min-w-[120px] text-white"
           :disabled="isLoading"
@@ -1000,6 +1012,32 @@ onMounted(() => {
           />
           Simpan
         </Button>
+        <Button
+          v-if="props.mode === 'detail'"
+          type="button"
+          class="h-[40px] min-w-[120px] text-white"
+          :disabled="isLoading"
+          @click="onBack"
+        >
+          <Icon
+            name="i-lucide-chevron-left"
+            class="h-5 w-5"
+          />
+          Kembali
+        </Button>
+        <Button
+          v-if="props.mode === 'link'"
+          type="button"
+          class="h-[40px] min-w-[120px] text-white"
+          :disabled="isLoading"
+          @click="onSaveNumber"
+        >
+          <Icon
+            name="i-lucide-save"
+            class="h-5 w-5"
+          />
+          Terapkan
+        </Button>
       </div>
     </form>
   </div>

app/components/content/sep/entry.vue

@@ -9,6 +9,7 @@ import AppViewLetter from '~/components/app/sep/view-letter.vue'
 
 // Handler
 import { useIntegrationSepEntry } from '~/handlers/integration-sep-entry.handler'
+import { useIntegrationSepDetail } from '~/handlers/integration-sep-detail.handler'
 
 const {
   histories,
@@ -55,8 +56,18 @@ const {
   handleInit,
 } = useIntegrationSepEntry()
 
+const { valueObjects, getSepDetail } = useIntegrationSepDetail()
+
+const props = defineProps<{
+  mode: 'add' | 'edit' | 'detail' | 'link'
+}>()
+
 onMounted(async () => {
   await handleInit()
+  if (['detail', 'link'].includes(props.mode)) {
+    await getSepDetail()
+    selectedObjects.value = { ...selectedObjects.value, ...valueObjects.value }
+  }
 })
 </script>
 
@@ -66,10 +77,10 @@ onMounted(async () => {
       name="i-lucide-panel-bottom"
       class="me-2"
     />
-    <span class="font-semibold">Tambah</span>
-    SEP
+    <span class="font-semibold">{{ ['detail', 'link'].includes(props.mode) ? 'Detail' : 'Tambah' }} SEP</span>
   </div>
   <AppSepEntryForm
+    :mode="props.mode"
     :is-save-loading="isSaveLoading"
     :is-service="isServiceHidden"
     :doctors="doctors"