From f629546f139291c6bc7df00c55b5a88dc209fe70 Mon Sep 17 00:00:00 2001
From: Abizrh <abizarah857@gmail.com>
Date: Thu, 13 Nov 2025 21:29:16 +0700
Subject: [PATCH 1/8] =?UTF-8?q?=E2=9C=A8=20feat=20(cprj):=20implement=20cp?=
 =?UTF-8?q?rj=20(patient=20note)=20functionality?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/app/cprj/entry.vue             | 146 +++++++++++++++
 app/components/app/cprj/list.cfg.ts           |  56 ++++++
 app/components/app/cprj/list.vue              |  34 ++++
 app/components/content/cprj/entry.vue         |  36 ++++
 app/components/content/cprj/form.vue          |  74 ++++++++
 app/components/content/cprj/list.vue          | 175 ++++++++++++++++++
 .../encounter/assesment-function/add.vue      |   3 -
 .../encounter/assesment-function/list.vue     |  64 -------
 app/components/content/encounter/process.vue  |   3 +-
 app/components/content/soapi/list.vue         |   9 +-
 app/schemas/soapi.schema.ts                   |   8 +
 11 files changed, 537 insertions(+), 71 deletions(-)
 create mode 100644 app/components/app/cprj/entry.vue
 create mode 100644 app/components/app/cprj/list.cfg.ts
 create mode 100644 app/components/app/cprj/list.vue
 create mode 100644 app/components/content/cprj/entry.vue
 create mode 100644 app/components/content/cprj/form.vue
 create mode 100644 app/components/content/cprj/list.vue
 delete mode 100644 app/components/content/encounter/assesment-function/add.vue
 delete mode 100644 app/components/content/encounter/assesment-function/list.vue

diff --git a/app/components/app/cprj/entry.vue b/app/components/app/cprj/entry.vue
new file mode 100644
index 00000000..d03bbf77
--- /dev/null
+++ b/app/components/app/cprj/entry.vue
@@ -0,0 +1,146 @@
+<script setup lang="ts">
+import Block from '~/components/pub/my-ui/doc-entry/block.vue'
+import Cell from '~/components/pub/my-ui/doc-entry/cell.vue'
+import Field from '~/components/pub/my-ui/doc-entry/field.vue'
+import Label from '~/components/pub/my-ui/doc-entry/label.vue'
+
+// Helpers
+import type z from 'zod'
+import { toTypedSchema } from '@vee-validate/zod'
+import { useForm } from 'vee-validate'
+import { genBase } from '~/models/_base'
+
+const props = defineProps<{
+  modelValue: any
+  schema: z.ZodSchema<any>
+  excludeFields?: string[]
+  isReadonly?: boolean
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', val: any): void
+  (e: 'submit', val: any): void
+}>()
+
+// Setup form
+const {
+  validate: _validate,
+  defineField,
+  handleSubmit,
+  errors,
+  values,
+} = useForm({
+  validationSchema: toTypedSchema(props.schema),
+  initialValues: props.modelValue,
+})
+
+watch(values, (val) => emit('update:modelValue', val), { deep: true })
+
+const [subjective, subjectiveAttrs] = defineField('subjective')
+const [objective, objectiveAttrs] = defineField('objective')
+const [assesment, assesmentAttrs] = defineField('assesment')
+const [plan, planAttrs] = defineField('plan')
+const [review, reviewAttrs] = defineField('review')
+
+const validate = async () => {
+  const result = await _validate()
+  console.log('Component validate() result:', result)
+
+  return {
+    valid: true,
+    data: result.values,
+    errors: result.errors,
+  }
+}
+
+defineExpose({ validate })
+</script>
+
+<template>
+  <form id="entry-form">
+    <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
+      <div class="my-2">
+        <h1 class="font-semibold">Data Petugas</h1>
+      </div>
+
+      <div class="my-2 rounded-md border border-slate-300 p-4">
+        <Block :colCount="2">
+          <Cell>
+            <Label dynamic>PPA</Label>
+            <Field>
+              <Input disabled />
+            </Field>
+          </Cell>
+
+          <Cell>
+            <Label dynamic>Nama PPA</Label>
+            <Field>
+              <Input disabled />
+            </Field>
+          </Cell>
+        </Block>
+      </div>
+
+      <div class="my-2">
+        <h1 class="font-semibold">Data S.O.A.P</h1>
+      </div>
+
+      <div class="my-2 rounded-md border border-slate-300 p-4">
+        <Block :colCount="2">
+          <Cell>
+            <Label dynamic>Subjektif</Label>
+            <Field>
+              <Textarea
+                v-model="subjective"
+                v-bind="subjectiveAttrs"
+              />
+            </Field>
+          </Cell>
+
+          <Cell>
+            <Label dynamic>Objektif</Label>
+            <Field>
+              <Textarea
+                v-model="objective"
+                v-bind="objectiveAttrs"
+              />
+            </Field>
+          </Cell>
+        </Block>
+        <Block :colCount="2">
+          <Cell>
+            <Label dynamic>Assesmen</Label>
+            <Field>
+              <Textarea
+                v-model="assesment"
+                v-bind="assesmentAttrs"
+              />
+            </Field>
+          </Cell>
+
+          <Cell>
+            <Label dynamic>Plan</Label>
+            <Field>
+              <Textarea
+                v-model="plan"
+                v-bind="planAttrs"
+              />
+            </Field>
+          </Cell>
+        </Block>
+        <Block>
+          <Cell>
+            <Label dynamic>Review</Label>
+            <Field>
+              <Textarea
+                v-model="review"
+                v-bind="reviewAttrs"
+              />
+            </Field>
+          </Cell>
+        </Block>
+      </div>
+      <Separator class="mt-8" />
+    </div>
+  </form>
+</template>
diff --git a/app/components/app/cprj/list.cfg.ts b/app/components/app/cprj/list.cfg.ts
new file mode 100644
index 00000000..a394e81d
--- /dev/null
+++ b/app/components/app/cprj/list.cfg.ts
@@ -0,0 +1,56 @@
+import type { Config, RecComponent, RecStrFuncComponent, RecStrFuncUnknown } from '~/components/pub/my-ui/data-table'
+import { defineAsyncComponent } from 'vue'
+import type { GeneralConsent } from '~/models/general-consent'
+
+type SmallDetailDto = any
+
+const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-ud.vue'))
+export const config: Config = {
+  cols: [{ width: 100 }, {}, {}, {}, { width: 50 }],
+  headers: [
+    [
+      { label: 'Tanggal' },
+      { label: 'PPA' },
+      { label: 'Hasil' },
+      { label: 'Review & Verifikasi' },
+      { label: 'Status' },
+      { label: 'Aksi' },
+    ],
+  ],
+  keys: ['date', 'ppa', 'result', 'review', 'status', 'action'],
+  delKeyNames: [
+    { key: 'data', label: 'Tanggal' },
+    { key: 'dstDoctor.name', label: 'Dokter' },
+  ],
+  parses: {
+    action(rec, idx) {
+      const res: RecComponent = {
+        idx,
+        rec: rec as object,
+        component: action,
+        props: {
+          size: 'sm',
+        },
+      }
+      return res
+    },
+    date(rec) {
+      const recX = rec as GeneralConsent
+      return recX.date?.substring(0, 10) || '-'
+    },
+  },
+  components: {
+    action(rec, idx) {
+      const res: RecComponent = {
+        idx,
+        rec: rec as object,
+        component: action,
+        props: {
+          size: 'sm',
+        },
+      }
+      return res
+    },
+  } as RecStrFuncComponent,
+  htmls: {} as RecStrFuncUnknown,
+}
diff --git a/app/components/app/cprj/list.vue b/app/components/app/cprj/list.vue
new file mode 100644
index 00000000..46f595f5
--- /dev/null
+++ b/app/components/app/cprj/list.vue
@@ -0,0 +1,34 @@
+<script setup lang="ts">
+import type { PaginationMeta } from '~/components/pub/my-ui/pagination/pagination.type'
+import PaginationView from '~/components/pub/my-ui/pagination/pagination-view.vue'
+import { config } from './list.cfg'
+
+interface Props {
+  data: any[]
+  paginationMeta: PaginationMeta
+}
+const props = defineProps<Props>()
+
+const emit = defineEmits<{
+  pageChange: [page: number]
+}>()
+
+function handlePageChange(page: number) {
+  emit('pageChange', page)
+}
+</script>
+
+<template>
+  <div class="space-y-4">
+    <PubMyUiDataTable
+      v-bind="config"
+      :rows="data"
+      :skeleton-size="paginationMeta?.pageSize"
+    />
+    <!-- FIXME: pindahkan ke content/division/list.vue   -->
+    <PaginationView
+      :pagination-meta="paginationMeta"
+      @page-change="handlePageChange"
+    />
+  </div>
+</template>
diff --git a/app/components/content/cprj/entry.vue b/app/components/content/cprj/entry.vue
new file mode 100644
index 00000000..5769e967
--- /dev/null
+++ b/app/components/content/cprj/entry.vue
@@ -0,0 +1,36 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+import { useQueryMode } from '@/composables/useQueryMode'
+
+import List from './list.vue'
+import Form from './form.vue'
+
+// Models
+import type { Encounter } from '~/models/encounter'
+
+// Props
+interface Props {
+  encounter: Encounter
+}
+
+const props = defineProps<Props>()
+const route = useRoute()
+
+const { mode, goToEntry, backToList } = useQueryCRUDMode('mode')
+</script>
+
+<template>
+  <div>
+    <List
+      v-if="mode === 'list'"
+      :encounter="props.encounter"
+      @add="goToEntry"
+      @edit="goToEntry"
+    />
+    <Form
+      v-else
+      @back="backToList"
+    />
+  </div>
+</template>
diff --git a/app/components/content/cprj/form.vue b/app/components/content/cprj/form.vue
new file mode 100644
index 00000000..e24418a8
--- /dev/null
+++ b/app/components/content/cprj/form.vue
@@ -0,0 +1,74 @@
+<script setup lang="ts">
+import { z } from 'zod'
+import Entry from '~/components/app/cprj/entry.vue'
+import Action from '~/components/pub/my-ui/nav-footer/ba-dr-su.vue'
+import ActionDialog from '~/components/pub/my-ui/nav-footer/ba-su.vue'
+import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
+import { CprjSoapiSchema } from '~/schemas/soapi.schema'
+import { toast } from '~/components/pub/ui/toast'
+import { handleActionSave, handleActionEdit } from '~/handlers/soapi-early.handler'
+const { backToList } = useQueryMode('mode')
+
+const route = useRoute()
+const fungsional = ref([])
+const schema = CprjSoapiSchema
+const payload = ref({
+  encounter_id: 0,
+  time: '',
+  typeCode: 'cprj',
+  value: '',
+})
+const model = ref({
+  ppa: '',
+  ppa_name: '',
+  subjective: '',
+  objective: '',
+  assesment: '',
+  plan: '',
+  review: '',
+})
+
+const isLoading = reactive<DataTableLoader>({
+  isTableLoading: false,
+})
+
+onMounted(() => {})
+
+const cprjRef = ref()
+async function actionHandler(type: string) {
+  if (type === 'back') {
+    backToList()
+    return
+  }
+  const result = await cprjRef.value?.validate()
+  console.log('result', result)
+  if (result?.valid) {
+    console.log('data', result.data)
+    handleActionSave(
+      {
+        ...payload.value,
+        value: JSON.stringify(result.data),
+        encounter_id: +route.params.id,
+        time: new Date().toISOString(),
+      },
+      {},
+      toast,
+    )
+  } else {
+    console.log('Ada error di form', result)
+  }
+}
+
+provide('table_data_loader', isLoading)
+</script>
+<template>
+  <Entry
+    ref="cprjRef"
+    v-model="model"
+    :schema="schema"
+    type="function"
+  />
+  <div class="my-2 flex justify-end py-2">
+    <Action @click="actionHandler" />
+  </div>
+</template>
diff --git a/app/components/content/cprj/list.vue b/app/components/content/cprj/list.vue
new file mode 100644
index 00000000..fcc3dbfa
--- /dev/null
+++ b/app/components/content/cprj/list.vue
@@ -0,0 +1,175 @@
+<script setup lang="ts">
+// Components
+import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
+import Header from '~/components/pub/my-ui/nav-header/prep.vue'
+import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
+import List from '~/components/app/cprj/list.vue'
+import Entry from '~/components/app/cprj/entry.vue'
+
+// Helpers
+import { usePaginatedList } from '~/composables/usePaginatedList'
+import { toast } from '~/components/pub/ui/toast'
+
+// Types
+import { ActionEvents, type HeaderPrep } from '~/components/pub/my-ui/data/types'
+
+// Handlers
+import {
+  recId,
+  recAction,
+  recItem,
+  isReadonly,
+  isProcessing,
+  isFormEntryDialogOpen,
+  isRecordConfirmationOpen,
+  onResetState,
+  handleActionSave,
+  handleActionEdit,
+  handleActionRemove,
+  handleCancelForm,
+} from '~/handlers/consultation.handler'
+
+// Services
+import { getList, getDetail } from '~/services/soapi-early.service'
+
+// Models
+import type { Encounter } from '~/models/encounter'
+
+// Props
+interface Props {
+  encounter: Encounter
+}
+const props = defineProps<Props>()
+const emits = defineEmits(['add', 'edit'])
+
+const { recordId } = useQueryCRUDRecordId()
+const { goToEntry, backToList } = useQueryCRUDMode('mode')
+
+let units = ref<{ value: string; label: string }[]>([])
+const encounterId = ref<number>(props?.encounter?.id || 0)
+const title = ref('')
+
+const {
+  data,
+  isLoading,
+  paginationMeta,
+  searchInput,
+  handlePageChange,
+  handleSearch,
+  fetchData: getMyList,
+} = usePaginatedList({
+  fetchFn: async ({ page, search }) => {
+    const result = await getList({ 'encounter-id': props.encounter.id, includes: 'encounter', search, page })
+    if (result.success) {
+      data.value = result.body.data
+    }
+    return { success: result.success || false, body: result.body || {} }
+  },
+  entityName: 'cprj',
+})
+
+const headerPrep: HeaderPrep = {
+  title: 'CPRJ',
+  icon: 'i-lucide-box',
+  refSearchNav: {
+    placeholder: 'Cari (min. 3 karakter)...',
+    minLength: 3,
+    debounceMs: 500,
+    showValidationFeedback: true,
+    onInput: (value: string) => {
+      searchInput.value = value
+    },
+    onClick: () => {},
+    onClear: () => {},
+  },
+  addNav: {
+    label: 'Tambah',
+    icon: 'i-lucide-plus',
+    onClick: () => {
+      goToEntry()
+      emits('add')
+    },
+  },
+}
+
+const today = new Date()
+
+provide('rec_id', recId)
+provide('rec_action', recAction)
+provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
+
+const getMyDetail = async (id: number | string) => {
+  const result = await getDetail(id)
+  if (result.success) {
+    const currentValue = result.body?.data || {}
+    recItem.value = currentValue
+    isFormEntryDialogOpen.value = true
+  }
+}
+
+// Watch for row actions when recId or recAction changes
+watch([recId, recAction], () => {
+  switch (recAction.value) {
+    case ActionEvents.showDetail:
+      getMyDetail(recId.value)
+      title.value = 'Detail Konsultasi'
+      isReadonly.value = true
+      break
+    case ActionEvents.showEdit:
+      emits('edit')
+      recordId.value = recId.value
+      console.log('recordId', recId.value)
+      break
+    case ActionEvents.showConfirmDelete:
+      isRecordConfirmationOpen.value = true
+      break
+  }
+})
+
+onMounted(async () => {
+  await getMyList()
+})
+</script>
+
+<template>
+  <Header
+    v-model="searchInput"
+    :prep="headerPrep"
+    :ref-search-nav="headerPrep.refSearchNav"
+    @search="handleSearch"
+    class="mb-4 xl:mb-5"
+  />
+
+  <List
+    :data="data"
+    :pagination-meta="paginationMeta"
+    @page-change="handlePageChange"
+  />
+
+  <!-- Record Confirmation Modal -->
+  <RecordConfirmation
+    v-model:open="isRecordConfirmationOpen"
+    action="delete"
+    :record="recItem"
+    @confirm="() => handleActionRemove(recId, getMyList, toast)"
+    @cancel=""
+  >
+    <template #default="{ record }">
+      <div class="text-sm">
+        <p>
+          <strong>ID:</strong>
+          {{ record?.id }}
+        </p>
+        <p v-if="record?.name">
+          <strong>Nama:</strong>
+          {{ record.name }}
+        </p>
+        <p v-if="record?.code">
+          <strong>Kode:</strong>
+          {{ record.code }}
+        </p>
+      </div>
+    </template>
+  </RecordConfirmation>
+</template>
diff --git a/app/components/content/encounter/assesment-function/add.vue b/app/components/content/encounter/assesment-function/add.vue
deleted file mode 100644
index 128cf74a..00000000
--- a/app/components/content/encounter/assesment-function/add.vue
+++ /dev/null
@@ -1,3 +0,0 @@
-<template>
-  <div>halo</div>
-</template>
diff --git a/app/components/content/encounter/assesment-function/list.vue b/app/components/content/encounter/assesment-function/list.vue
deleted file mode 100644
index 48d50bc9..00000000
--- a/app/components/content/encounter/assesment-function/list.vue
+++ /dev/null
@@ -1,64 +0,0 @@
-<script setup lang="ts">
-import type { DataTableLoader } from '~/components/pub/my-ui/data-table/type'
-import type { HeaderPrep, RefSearchNav } from '~/components/pub/my-ui/data/types'
-import AssesmentFunctionList from '~/components/app/encounter/assesment-function/list.vue'
-import Header from '~/components/pub/my-ui/nav-header/prep.vue'
-
-const props = defineProps<{
-  label: string
-}>()
-
-const data = ref([])
-
-const refSearchNav: RefSearchNav = {
-  onClick: () => {
-    // open filter modal
-  },
-  onInput: (_val: string) => {
-    // filter patient list
-  },
-  onClear: () => {
-    // clear url param
-  },
-}
-
-// Loading state management
-const isLoading = reactive<DataTableLoader>({
-  isTableLoading: false,
-})
-const recId = ref<number>(0)
-const recAction = ref<string>('')
-const recItem = ref<any>(null)
-
-const hreaderPrep: HeaderPrep = {
-  title: props.label,
-  icon: 'i-lucide-users',
-  addNav: {
-    label: 'Tambah',
-    onClick: () => navigateTo('/rehab/registration-queue/sep-prosedur/add'),
-  },
-}
-
-async function getPatientList() {
-  const resp = await xfetch('/api/v1/patient')
-  if (resp.success) {
-    data.value = (resp.body as Record<string, any>).data
-  }
-}
-
-onMounted(() => {
-  getPatientList()
-})
-
-provide('rec_id', recId)
-provide('rec_action', recAction)
-provide('rec_item', recItem)
-provide('table_data_loader', isLoading)
-</script>
-
-<template>
-  <Header :prep="{ ...hreaderPrep }" :ref-search-nav="refSearchNav" />
-  <div class="my-4 flex flex-1 flex-col gap-4 md:gap-8">
-    <AssesmentFunctionList :data="data" />
-  </div>
-</template>
diff --git a/app/components/content/encounter/process.vue b/app/components/content/encounter/process.vue
index 71c7fe3d..d7f79064 100644
--- a/app/components/content/encounter/process.vue
+++ b/app/components/content/encounter/process.vue
@@ -16,6 +16,7 @@ import EarlyMedicalAssesmentList from '~/components/content/soapi/entry.vue'
 import EarlyMedicalRehabList from '~/components/content/soapi/entry.vue'
 import PrescriptionList from '~/components/content/prescription/list.vue'
 import Consultation from '~/components/content/consultation/list.vue'
+import Cprj from '~/components/content/cprj/entry.vue'
 
 const route = useRoute()
 const router = useRouter()
@@ -48,7 +49,7 @@ const tabs: TabItem[] = [
   { value: 'therapy-protocol', label: 'Protokol Terapi' },
   { value: 'education-assessment', label: 'Asesmen Kebutuhan Edukasi' },
   { value: 'consent', label: 'General Consent' },
-  { value: 'patient-note', label: 'CPRJ' },
+  { value: 'patient-note', label: 'CPRJ', component: Cprj, props: { encounter: data } },
   { value: 'prescription', label: 'Order Obat', component: PrescriptionList },
   { value: 'device', label: 'Order Alkes' },
   { value: 'mcu-radiology', label: 'Order Radiologi' },
diff --git a/app/components/content/soapi/list.vue b/app/components/content/soapi/list.vue
index a240a65f..b1198fcc 100644
--- a/app/components/content/soapi/list.vue
+++ b/app/components/content/soapi/list.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { DataTableLoader } from '~/components/pub/my-ui/data-table/type'
 import type { HeaderPrep, RefSearchNav } from '~/components/pub/my-ui/data/types'
-import AssesmentFunctionList from '~/components/app/soapi/list.vue'
+import List from '~/components/app/soapi/list.vue'
 import Header from '~/components/pub/my-ui/nav-header/prep.vue'
 
 const props = defineProps<{
@@ -59,7 +59,10 @@ provide('table_data_loader', isLoading)
 </script>
 
 <template>
-  <Header :prep="{ ...hreaderPrep }" :ref-search-nav="refSearchNav" />
+  <Header
+    :prep="{ ...hreaderPrep }"
+    :ref-search-nav="refSearchNav"
+  />
 
-  <AssesmentFunctionList :data="data" />
+  <List :data="data" />
 </template>
diff --git a/app/schemas/soapi.schema.ts b/app/schemas/soapi.schema.ts
index 50ade93e..2f5f8667 100644
--- a/app/schemas/soapi.schema.ts
+++ b/app/schemas/soapi.schema.ts
@@ -179,6 +179,14 @@ const InstructionSchema = z.object({
   other: z.string().default(''),
 })
 
+export const CprjSoapiSchema = z.object({
+  subjective: z.string().default(''),
+  objective: z.string().default(''),
+  assesment: z.string().default(''),
+  plan: z.string().default(''),
+  review: z.string().default(''),
+})
+
 export const SoapSchema = z.object({
   subject: SubjectSchema,
   object: ObjectSchema,

From 6ca03f562d9be01121dab4d8faaa98861a8d226d Mon Sep 17 00:00:00 2001
From: Abizrh <abizarah857@gmail.com>
Date: Mon, 17 Nov 2025 08:46:01 +0700
Subject: [PATCH 2/8] =?UTF-8?q?=F0=9F=90=9B=20fix=20(cprj):=20update=20def?=
 =?UTF-8?q?ault=20type=20code=20to=20dev-record?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/content/cprj/form.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/components/content/cprj/form.vue b/app/components/content/cprj/form.vue
index e24418a8..ef2a51d7 100644
--- a/app/components/content/cprj/form.vue
+++ b/app/components/content/cprj/form.vue
@@ -15,7 +15,7 @@ const schema = CprjSoapiSchema
 const payload = ref({
   encounter_id: 0,
   time: '',
-  typeCode: 'cprj',
+  typeCode: 'dev-record',
   value: '',
 })
 const model = ref({

From a8696284d73113ffcf4f6dba5427e60982d9dc35 Mon Sep 17 00:00:00 2001
From: Abizrh <abizarah857@gmail.com>
Date: Mon, 17 Nov 2025 20:57:13 +0700
Subject: [PATCH 3/8] =?UTF-8?q?=E2=9A=A0=EF=B8=8F=20refactor=20(soapi):=20?=
 =?UTF-8?q?refactor=20form=20component=20to=20use=20usequerycrudmode=20and?=
 =?UTF-8?q?=20update=20api=20call?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/app/soapi/early-entry.vue |  5 ++---
 app/components/app/soapi/list-cfg.ts     | 17 ++-------------
 app/components/content/soapi/entry.vue   |  7 ++----
 app/components/content/soapi/form.vue    |  9 +++++++-
 app/components/content/soapi/list.vue    | 27 +++++++++++++++++++++---
 5 files changed, 38 insertions(+), 27 deletions(-)

diff --git a/app/components/app/soapi/early-entry.vue b/app/components/app/soapi/early-entry.vue
index 146a25d4..3570a9d4 100644
--- a/app/components/app/soapi/early-entry.vue
+++ b/app/components/app/soapi/early-entry.vue
@@ -69,7 +69,6 @@ const isExcluded = (key: string) => props.excludeFields?.includes(key)
 
 <template>
   <form id="entry-form">
-    {{ errors }}
     <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
       <Block>
         <Cell>
@@ -285,7 +284,7 @@ const isExcluded = (key: string) => props.excludeFields?.includes(key)
             <Button
               class="rounded bg-orange-100 px-3 py-1 text-orange-600"
               type="button"
-              @click="emits('modal', 'diagnosa')"
+              @click="emit('modal', 'diagnosa')"
             >
               + Pilih Diagnosa
             </Button>
@@ -298,7 +297,7 @@ const isExcluded = (key: string) => props.excludeFields?.includes(key)
             <Button
               class="rounded bg-orange-100 px-3 py-1 text-orange-600"
               type="button"
-              @click="emits('modal', 'prosedur')"
+              @click="emit('modal', 'prosedur')"
             >
               + Pilih Prosedur
             </Button>
diff --git a/app/components/app/soapi/list-cfg.ts b/app/components/app/soapi/list-cfg.ts
index 6fa11bda..0c9d6067 100644
--- a/app/components/app/soapi/list-cfg.ts
+++ b/app/components/app/soapi/list-cfg.ts
@@ -3,23 +3,10 @@ import { defineAsyncComponent } from 'vue'
 
 type SmallDetailDto = any
 
-const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-dud.vue'))
+const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-ud.vue'))
 
 export const config: Config = {
-  cols: [
-    {},
-    {},
-    {},
-    { width: 100 },
-    { width: 120 },
-    {},
-    {},
-    {},
-    { width: 100 },
-    { width: 100 },
-    {},
-    { width: 50 },
-  ],
+  cols: [{}, {}, {}, { width: 100 }, { width: 120 }, {}, {}, {}, { width: 100 }, { width: 100 }, {}, { width: 50 }],
 
   headers: [
     [
diff --git a/app/components/content/soapi/entry.vue b/app/components/content/soapi/entry.vue
index 7b4ab9d4..eb07c4b4 100644
--- a/app/components/content/soapi/entry.vue
+++ b/app/components/content/soapi/entry.vue
@@ -11,7 +11,7 @@ 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 { mode, goToEntry, backToList } = useQueryCRUDMode('mode')
 
 const formMap = {
   'early-medical-assessment': EarlyForm,
@@ -24,10 +24,7 @@ const ActiveForm = computed(() => formMap[type.value] || EarlyForm)
 
 <template>
   <div>
-    <SoapiList
-      v-if="mode === 'list'"
-      @add="openForm"
-    />
+    <SoapiList v-if="mode === 'list'" />
 
     <component
       v-else
diff --git a/app/components/content/soapi/form.vue b/app/components/content/soapi/form.vue
index 794daef9..3afd8533 100644
--- a/app/components/content/soapi/form.vue
+++ b/app/components/content/soapi/form.vue
@@ -7,6 +7,8 @@ import { EarlySchema } from '~/schemas/soapi.schema'
 import { toast } from '~/components/pub/ui/toast'
 import { handleActionSave, handleActionEdit } from '~/handlers/soapi-early.handler'
 
+const { goToEntry, backToList } = useQueryCRUDMode('mode')
+const { recordId } = useQueryCRUDMode('record-id')
 const route = useRoute()
 const isOpen = ref(false)
 const data = ref([])
@@ -40,7 +42,7 @@ const isLoading = reactive<DataTableLoader>({
 
 async function getPatientList() {
   isLoading.isTableLoading = true
-  const resp = await xfetch('/api/v1/patient')
+  const resp = await xfetch(`/api/v1/soapi/${recordId}`)
   if (resp.success) {
     data.value = (resp.body as Record<string, any>).data
   }
@@ -59,6 +61,11 @@ function handleOpen(type: string) {
 const entryRef = ref()
 async function actionHandler(type: string) {
   console.log(type)
+  // if(type === ''
+  if (type === 'back') {
+    backToList()
+    return
+  }
   const result = await entryRef.value?.validate()
   if (result?.valid) {
     console.log('data', result.data)
diff --git a/app/components/content/soapi/list.vue b/app/components/content/soapi/list.vue
index b1198fcc..4f9d4288 100644
--- a/app/components/content/soapi/list.vue
+++ b/app/components/content/soapi/list.vue
@@ -8,7 +8,9 @@ const props = defineProps<{
   label: string
 }>()
 
-const emits = defineEmits(['add', 'edit'])
+const { goToEntry } = useQueryCRUDMode('mode')
+const router = useRouter()
+const route = useRoute()
 
 const data = ref([])
 
@@ -37,21 +39,40 @@ const hreaderPrep: HeaderPrep = {
   icon: 'i-lucide-users',
   addNav: {
     label: 'Tambah',
-    onClick: () => emits('add'),
+    onClick: () => goToEntry(),
   },
 }
 
 async function getPatientList() {
-  const resp = await xfetch('/api/v1/patient')
+  const resp = await xfetch(`/api/v1/soapi?encounter_id=${route.params.id}?include=encounter`)
   if (resp.success) {
     data.value = (resp.body as Record<string, any>).data
   }
 }
 
+const goEdit = (id: string) => {
+  router.replace({
+    path: route.path,
+    query: {
+      ...route.query,
+      mode: 'entry',
+      'record-id': id,
+    },
+  })
+}
+
 onMounted(() => {
   getPatientList()
 })
 
+watch(recId, () => {
+  console.log('recId', recId.value)
+  console.log('recIdaacin', recAction.value)
+  if (recAction.value === 'showEdit') {
+    goEdit(recId.value)
+  }
+})
+
 provide('rec_id', recId)
 provide('rec_action', recAction)
 provide('rec_item', recItem)

From c4eaa72aec0f15b88ea50b6477bb99cda75d6ec9 Mon Sep 17 00:00:00 2001
From: hasyim_kai <muhammad.hasyim.c.a@gmail.com>
Date: Fri, 21 Nov 2025 10:20:23 +0700
Subject: [PATCH 4/8] Fix: debug Uplaod Doc List table

---
 app/components/content/document-upload/list.vue | 16 ++++------------
 1 file changed, 4 insertions(+), 12 deletions(-)

diff --git a/app/components/content/document-upload/list.vue b/app/components/content/document-upload/list.vue
index d1f6fbad..7f7631d9 100644
--- a/app/components/content/document-upload/list.vue
+++ b/app/components/content/document-upload/list.vue
@@ -20,8 +20,8 @@ const roleAccess: PagePermission = PAGE_PERMISSIONS['/rehab/encounter']
 const { getPagePermissions } = useRBAC()
 const pagePermission = getPagePermissions(roleAccess)
 
-const {user,userRole} = useUserStore()
-const {getUserPermissions} = useRBAC()
+// const {user,userRole} = useUserStore()
+// const {getUserPermissions} = useRBAC()
 // #endregion
 
 // #region State
@@ -121,6 +121,7 @@ watch([recId, recAction, timestamp], () => {
     case ActionEvents.showDetail:
       isDocPreviewDialogOpen.value = true
       break
+
     case ActionEvents.showEdit:
       if(pagePermission.canUpdate){
         navigateTo({
@@ -131,22 +132,13 @@ watch([recId, recAction, timestamp], () => {
         unauthorizedToast()
       }
       break
+
     case ActionEvents.showConfirmDelete:
       if(pagePermission.canDelete){
         isRecordConfirmationOpen.value = true
       } else {
         unauthorizedToast()
       }
-      navigateTo(recItem.value.filePath, { external: true, open: { target: '_blank' } })
-      break
-    case ActionEvents.showEdit:
-      navigateTo({
-        name: 'rehab-encounter-id-document-upload-document_id-edit',
-        params: { id: encounterId, "document_id": recId.value },
-      })
-      break
-    case ActionEvents.showConfirmDelete:
-      isRecordConfirmationOpen.value = true
       break
   }
 })

From 671390f159f9a2965399ed5c8325edd3a8fd4f37 Mon Sep 17 00:00:00 2001
From: Abizrh <abizarah857@gmail.com>
Date: Fri, 21 Nov 2025 14:29:57 +0700
Subject: [PATCH 5/8] =?UTF-8?q?=E2=9A=A0=EF=B8=8F=20refactor=20(cprj):=20r?=
 =?UTF-8?q?ename=20cprj=20list=20to=20soapi=20list?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/content/cprj/list.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/components/content/cprj/list.vue b/app/components/content/cprj/list.vue
index fcc3dbfa..2e55b328 100644
--- a/app/components/content/cprj/list.vue
+++ b/app/components/content/cprj/list.vue
@@ -3,7 +3,7 @@
 import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
 import Header from '~/components/pub/my-ui/nav-header/prep.vue'
 import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
-import List from '~/components/app/cprj/list.vue'
+import List from '~/components/app/soapi/list.vue'
 import Entry from '~/components/app/cprj/entry.vue'
 
 // Helpers

From 2da2961f0376ba5e33d3df93a10d30f497a48960 Mon Sep 17 00:00:00 2001
From: Abizrh <abizarah857@gmail.com>
Date: Fri, 21 Nov 2025 15:34:48 +0700
Subject: [PATCH 6/8] =?UTF-8?q?=E2=9A=A1=20enhance=20(soapi):=20adjust=20t?=
 =?UTF-8?q?ype-code?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/content/cprj/list.vue  | 8 +++++++-
 app/components/content/soapi/form.vue | 2 +-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/app/components/content/cprj/list.vue b/app/components/content/cprj/list.vue
index 2e55b328..3ad22d6a 100644
--- a/app/components/content/cprj/list.vue
+++ b/app/components/content/cprj/list.vue
@@ -59,7 +59,13 @@ const {
   fetchData: getMyList,
 } = usePaginatedList({
   fetchFn: async ({ page, search }) => {
-    const result = await getList({ 'encounter-id': props.encounter.id, includes: 'encounter', search, page })
+    const result = await getList({
+      'encounter-id': props.encounter.id,
+      'type-code': 'dev-record',
+      includes: 'encounter',
+      search,
+      page,
+    })
     if (result.success) {
       data.value = result.body.data
     }
diff --git a/app/components/content/soapi/form.vue b/app/components/content/soapi/form.vue
index 21ade93a..4ec0d85e 100644
--- a/app/components/content/soapi/form.vue
+++ b/app/components/content/soapi/form.vue
@@ -21,7 +21,7 @@ const schema = EarlySchema
 const payload = ref({
   encounter_id: 0,
   time: '',
-  typeCode: 'early',
+  typeCode: 'early-medic',
   value: '',
 })
 

From 4f8407f978a7930b07ea95679c6e6a40a96df2a6 Mon Sep 17 00:00:00 2001
From: Abizrh <abizarah857@gmail.com>
Date: Fri, 21 Nov 2025 15:43:27 +0700
Subject: [PATCH 7/8] =?UTF-8?q?=F0=9F=90=9B=20fix=20(cprj):=20fix=20encoun?=
 =?UTF-8?q?ter-id=20prop=20for=20getlist=20function?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/content/cprj/list.vue  | 4 +++-
 app/components/content/soapi/list.vue | 4 ++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/app/components/content/cprj/list.vue b/app/components/content/cprj/list.vue
index 3ad22d6a..6da61716 100644
--- a/app/components/content/cprj/list.vue
+++ b/app/components/content/cprj/list.vue
@@ -41,6 +41,7 @@ interface Props {
 }
 const props = defineProps<Props>()
 const emits = defineEmits(['add', 'edit'])
+const route = useRoute()
 
 const { recordId } = useQueryCRUDRecordId()
 const { goToEntry, backToList } = useQueryCRUDMode('mode')
@@ -48,6 +49,7 @@ const { goToEntry, backToList } = useQueryCRUDMode('mode')
 let units = ref<{ value: string; label: string }[]>([])
 const encounterId = ref<number>(props?.encounter?.id || 0)
 const title = ref('')
+const id = route.params.id
 
 const {
   data,
@@ -60,7 +62,7 @@ const {
 } = usePaginatedList({
   fetchFn: async ({ page, search }) => {
     const result = await getList({
-      'encounter-id': props.encounter.id,
+      'encounter-id': id,
       'type-code': 'dev-record',
       includes: 'encounter',
       search,
diff --git a/app/components/content/soapi/list.vue b/app/components/content/soapi/list.vue
index bc2a39d0..00f2a5ad 100644
--- a/app/components/content/soapi/list.vue
+++ b/app/components/content/soapi/list.vue
@@ -71,7 +71,7 @@ onMounted(async () => {
 })
 
 async function getMyList() {
-  const url = `/api/v1/soapi?type-code=${typeCode.value}?includes=encounter`
+  const url = `/api/v1/soapi?type-code=${typeCode.value}&includes=encounter&encounter-id=${route.params.id}`
   const resp = await xfetch(url)
   if (resp.success) {
     data.value = (resp.body as Record<string, any>).data
@@ -103,7 +103,7 @@ watch(
   (val) => {
     if (val) {
       if (val === 'early-medical-assessment') {
-        typeCode.value = 'early'
+        typeCode.value = 'early-medic'
       } else if (val === 'rehab-medical-assessment') {
         typeCode.value = 'early-rehab'
       } else if (val === 'function-assessment') {

From 6e42bb5283083664fc83045b17f32e09ce3dda54 Mon Sep 17 00:00:00 2001
From: Abizrh <abizarah857@gmail.com>
Date: Fri, 21 Nov 2025 16:00:52 +0700
Subject: [PATCH 8/8] =?UTF-8?q?=E2=9C=A8=20feat=20(soapi):=20display=20enc?=
 =?UTF-8?q?ounter=20class=20code=20in=20soapi=20list?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/app/soapi/list-cfg.ts  | 6 +++++-
 app/components/content/cprj/list.vue  | 2 +-
 app/components/content/soapi/list.vue | 2 +-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/app/components/app/soapi/list-cfg.ts b/app/components/app/soapi/list-cfg.ts
index 5a46bb8b..3db1b24a 100644
--- a/app/components/app/soapi/list-cfg.ts
+++ b/app/components/app/soapi/list-cfg.ts
@@ -20,7 +20,7 @@ export const config: Config = {
     ],
   ],
 
-  keys: ['time', 'employee_id', 'main_complaint', 'encounter_id', 'diagnose', 'status', 'action'],
+  keys: ['time', 'employee_id', 'main_complaint', 'encounter', 'diagnose', 'status', 'action'],
 
   delKeyNames: [
     { key: 'code', label: 'Kode' },
@@ -44,6 +44,10 @@ export const config: Config = {
         return '-'
       }
     },
+    encounter(rec: any) {
+      const data = rec?.encounter ?? {}
+      return data?.class_code || '-'
+    },
     diagnose(rec: any) {
       const { value } = rec ?? {}
 
diff --git a/app/components/content/cprj/list.vue b/app/components/content/cprj/list.vue
index 6da61716..109bea6b 100644
--- a/app/components/content/cprj/list.vue
+++ b/app/components/content/cprj/list.vue
@@ -63,7 +63,7 @@ const {
   fetchFn: async ({ page, search }) => {
     const result = await getList({
       'encounter-id': id,
-      'type-code': 'dev-record',
+      typeCode: 'dev-record',
       includes: 'encounter',
       search,
       page,
diff --git a/app/components/content/soapi/list.vue b/app/components/content/soapi/list.vue
index 00f2a5ad..a23d8434 100644
--- a/app/components/content/soapi/list.vue
+++ b/app/components/content/soapi/list.vue
@@ -71,7 +71,7 @@ onMounted(async () => {
 })
 
 async function getMyList() {
-  const url = `/api/v1/soapi?type-code=${typeCode.value}&includes=encounter&encounter-id=${route.params.id}`
+  const url = `/api/v1/soapi?typeCode=${typeCode.value}&includes=encounter,employee&encounter-id=${route.params.id}`
   const resp = await xfetch(url)
   if (resp.success) {
     data.value = (resp.body as Record<string, any>).data