Fix: Refactor Organization CRUD {id} to {code}

app/components/content/installation/detail.vue

@@ -47,7 +47,7 @@ const title = ref('')
 
 // #region Props & Emits
 const props = defineProps<{
-  installationId: number
+  installationId: string
 }>()
 const installation = ref<Installation>({} as Installation)
 // #endregion
@@ -153,7 +153,7 @@ watch([recId, recAction], () => {
   console.log(recId, recAction)
   switch (recAction.value) {
     case ActionEvents.showEdit:
-      getDetailInstallationPosition(recId.value)
+      getDetailInstallationPosition(recItem.value.code)
       title.value = 'Edit Jabatan'
       isReadonly.value = false
       isFormEntryDialogOpen.value = true
@@ -202,8 +202,8 @@ watch([recId, recAction], () => {
       @submit="
         (values: InstallationPositionFormData | Record<string, any>, resetForm: () => void) => {
           console.log(values)
-          if (recId > 0) {
-            handleActionEdit(recId, values, getInstallationPositionList, onResetState, toast)
+          if (recItem?.code.length > 0) {
+            handleActionEdit(recItem.code, values, getInstallationPositionList, onResetState, toast)
             return
           }
           handleActionSave(values, getInstallationPositionList, onResetState, toast)
@@ -216,7 +216,7 @@ watch([recId, recAction], () => {
     v-model:open="isRecordConfirmationOpen"
     action="delete"
     :record="recItem"
-    @confirm="() => handleActionRemove(recId, getInstallationPositionList, toast)"
+    @confirm="() => handleActionRemove(recItem.code, getInstallationPositionList, toast)"
     @cancel=""
   >
     <template #default="{ record }">

app/components/content/installation/list.vue

@@ -102,26 +102,23 @@ const getCurrentInstallationDetail = async (id: number | string) => {
 watch([recId, recAction], () => {
   switch (recAction.value) {
     case ActionEvents.showDetail:
-      if (Number(recId.value) > 0) {
-        const id = Number(recId.value)
+      if (recItem.value.code.length > 0) {
+        navigateTo({
+          name: 'org-src-installation-id',
+          params: {
+            id: recItem.value.code,
+          },
+        })
 
         recAction.value = ''
         recItem.value = null
         recId.value = 0
         isFormEntryDialogOpen.value = false
         isReadonly.value = false
-
-        navigateTo({
-          name: 'org-src-installation-id',
-          params: {
-            id,
-          },
-        })
       }
-
       break
     case ActionEvents.showEdit:
-      getCurrentInstallationDetail(recId.value)
+      getCurrentInstallationDetail(recItem.value.code)
       title.value = 'Edit Instalasi'
       isReadonly.value = false
       break
@@ -171,8 +168,8 @@ onMounted(async () => {
       :is-readonly="isReadonly"
       @submit="
         (values: InstallationFormData | Record<string, any>, resetForm: () => void) => {
-          if (recId > 0) {
-            handleActionEdit(recId, values, getInstallationList, resetForm, toast)
+          if (recItem?.code.length > 0) {
+            handleActionEdit(recItem.code, values, getInstallationList, resetForm, toast)
             return
           }
           handleActionSave(values, getInstallationList, resetForm, toast)
@@ -187,7 +184,7 @@ onMounted(async () => {
     v-model:open="isRecordConfirmationOpen"
     action="delete"
     :record="recItem"
-    @confirm="() => handleActionRemove(recId, getInstallationList, toast)"
+    @confirm="() => handleActionRemove(recItem.code, getInstallationList, toast)"
     @cancel=""
   >
     <template #default="{ record }">