From 413a3c2b2952780ffe8c3aadf93096e2e6aa934b Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Thu, 4 Dec 2025 14:40:59 +0700
Subject: [PATCH] feat: Add item and item price list components with their
 respective configurations.

---
 app/components/app/item-price/list-cfg.ts     | 24 +++++--------
 app/components/app/item-price/list.vue        | 35 ++++++++++++++++---
 app/components/app/item-price/picker.vue      |  0
 app/components/app/item-price/search.vue      |  0
 .../app/item-price/status-badge.vue           | 29 ---------------
 app/components/app/item/list-cfg.ts           | 19 ++++------
 app/components/app/item/list.vue              | 35 ++++++++++++++++---
 app/components/app/item/picker.vue            |  0
 app/components/app/item/search.vue            |  0
 app/components/app/item/status-badge.vue      | 29 ---------------
 10 files changed, 75 insertions(+), 96 deletions(-)
 delete mode 100644 app/components/app/item-price/picker.vue
 delete mode 100644 app/components/app/item-price/search.vue
 delete mode 100644 app/components/app/item-price/status-badge.vue
 delete mode 100644 app/components/app/item/picker.vue
 delete mode 100644 app/components/app/item/search.vue
 delete mode 100644 app/components/app/item/status-badge.vue

diff --git a/app/components/app/item-price/list-cfg.ts b/app/components/app/item-price/list-cfg.ts
index c3db4f50..f1ebbd13 100644
--- a/app/components/app/item-price/list-cfg.ts
+++ b/app/components/app/item-price/list-cfg.ts
@@ -3,27 +3,23 @@ import { defineAsyncComponent } from 'vue'
 
 const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-dud.vue'))
 
-const _doctorStatus = {
-  0: 'Tidak Aktif',
-  1: 'Aktif',
-}
-
 export const config: Config = {
-  cols: [{}, {}, { width: 50 }],
+  cols: [{}, {}, {}, { width: 50 }],
 
   headers: [
     [
-      { label: 'Kode' },
-      { label: 'Nama' },
+      { label: 'Item' },
+      { label: 'Harga' },
+      { label: 'Perusahaan Asuransi' },
       { label: 'Aksi' },
     ],
   ],
 
-  keys: ['code', 'name', 'action'],
+  keys: ['item_code', 'price', 'insuranceCompany_code', 'action'],
 
   delKeyNames: [
-    { key: 'code', label: 'Kode' },
-    { key: 'name', label: 'Nama' },
+    { key: 'item_code', label: 'Item' },
+    { key: 'insuranceCompany_code', label: 'Perusahaan Asuransi' },
   ],
 
   parses: {},
@@ -39,9 +35,5 @@ export const config: Config = {
     },
   },
 
-  htmls: {
-    patient_address(_rec) {
-      return '-'
-    },
-  },
+  htmls: {},
 }
diff --git a/app/components/app/item-price/list.vue b/app/components/app/item-price/list.vue
index 96697bde..2f7908cb 100644
--- a/app/components/app/item-price/list.vue
+++ b/app/components/app/item-price/list.vue
@@ -1,14 +1,39 @@
 <script setup lang="ts">
+// Components
+import PaginationView from '~/components/pub/my-ui/pagination/pagination-view.vue'
+
+// Types
+import type { PaginationMeta } from '~/components/pub/my-ui/pagination/pagination.type'
+
+// Configs
 import { config } from './list-cfg'
 
-defineProps<{
+interface Props {
   data: any[]
+  paginationMeta: PaginationMeta
+}
+
+defineProps<Props>()
+
+const emit = defineEmits<{
+  pageChange: [page: number]
 }>()
+
+function handlePageChange(page: number) {
+  emit('pageChange', page)
+}
 </script>
 
 <template>
-  <PubMyUiDataTable
-    v-bind="config"
-    :rows="data"
-  />
+  <div class="space-y-4">
+    <PubMyUiDataTable
+      v-bind="config"
+      :rows="data"
+      :skeleton-size="paginationMeta?.pageSize"
+    />
+    <PaginationView
+      :pagination-meta="paginationMeta"
+      @page-change="handlePageChange"
+    />
+  </div>
 </template>
diff --git a/app/components/app/item-price/picker.vue b/app/components/app/item-price/picker.vue
deleted file mode 100644
index e69de29b..00000000
diff --git a/app/components/app/item-price/search.vue b/app/components/app/item-price/search.vue
deleted file mode 100644
index e69de29b..00000000
diff --git a/app/components/app/item-price/status-badge.vue b/app/components/app/item-price/status-badge.vue
deleted file mode 100644
index 32cdfbca..00000000
--- a/app/components/app/item-price/status-badge.vue
+++ /dev/null
@@ -1,29 +0,0 @@
-<script setup lang="ts">
-import { Badge } from '~/components/pub/ui/badge'
-
-const props = defineProps<{
-  rec: any
-  idx?: number
-}>()
-
-const doctorStatus = {
-  0: 'Tidak Aktif',
-  1: 'Aktif',
-}
-
-const statusText = computed(() => {
-  return doctorStatus[props.rec.status_code as keyof typeof doctorStatus]
-})
-
-const badgeVariant = computed(() => {
-  return props.rec.status_code === 1 ? 'default' : 'destructive'
-})
-</script>
-
-<template>
-  <div class="flex justify-center">
-    <Badge :variant="badgeVariant">
-      {{ statusText }}
-    </Badge>
-  </div>
-</template>
diff --git a/app/components/app/item/list-cfg.ts b/app/components/app/item/list-cfg.ts
index c3db4f50..d781dc79 100644
--- a/app/components/app/item/list-cfg.ts
+++ b/app/components/app/item/list-cfg.ts
@@ -3,23 +3,22 @@ import { defineAsyncComponent } from 'vue'
 
 const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-dud.vue'))
 
-const _doctorStatus = {
-  0: 'Tidak Aktif',
-  1: 'Aktif',
-}
-
 export const config: Config = {
-  cols: [{}, {}, { width: 50 }],
+  cols: [{}, {}, {}, {}, {}, {}, { width: 50 }],
 
   headers: [
     [
       { label: 'Kode' },
       { label: 'Nama' },
+      { label: 'Item Group' },
+      { label: 'UOM' },
+      { label: 'Infra' },
+      { label: 'Stok' },
       { label: 'Aksi' },
     ],
   ],
 
-  keys: ['code', 'name', 'action'],
+  keys: ['code', 'name', 'itemGroup_code', 'uom_code', 'infra_code', 'stock', 'action'],
 
   delKeyNames: [
     { key: 'code', label: 'Kode' },
@@ -39,9 +38,5 @@ export const config: Config = {
     },
   },
 
-  htmls: {
-    patient_address(_rec) {
-      return '-'
-    },
-  },
+  htmls: {},
 }
diff --git a/app/components/app/item/list.vue b/app/components/app/item/list.vue
index 96697bde..2f7908cb 100644
--- a/app/components/app/item/list.vue
+++ b/app/components/app/item/list.vue
@@ -1,14 +1,39 @@
 <script setup lang="ts">
+// Components
+import PaginationView from '~/components/pub/my-ui/pagination/pagination-view.vue'
+
+// Types
+import type { PaginationMeta } from '~/components/pub/my-ui/pagination/pagination.type'
+
+// Configs
 import { config } from './list-cfg'
 
-defineProps<{
+interface Props {
   data: any[]
+  paginationMeta: PaginationMeta
+}
+
+defineProps<Props>()
+
+const emit = defineEmits<{
+  pageChange: [page: number]
 }>()
+
+function handlePageChange(page: number) {
+  emit('pageChange', page)
+}
 </script>
 
 <template>
-  <PubMyUiDataTable
-    v-bind="config"
-    :rows="data"
-  />
+  <div class="space-y-4">
+    <PubMyUiDataTable
+      v-bind="config"
+      :rows="data"
+      :skeleton-size="paginationMeta?.pageSize"
+    />
+    <PaginationView
+      :pagination-meta="paginationMeta"
+      @page-change="handlePageChange"
+    />
+  </div>
 </template>
diff --git a/app/components/app/item/picker.vue b/app/components/app/item/picker.vue
deleted file mode 100644
index e69de29b..00000000
diff --git a/app/components/app/item/search.vue b/app/components/app/item/search.vue
deleted file mode 100644
index e69de29b..00000000
diff --git a/app/components/app/item/status-badge.vue b/app/components/app/item/status-badge.vue
deleted file mode 100644
index 32cdfbca..00000000
--- a/app/components/app/item/status-badge.vue
+++ /dev/null
@@ -1,29 +0,0 @@
-<script setup lang="ts">
-import { Badge } from '~/components/pub/ui/badge'
-
-const props = defineProps<{
-  rec: any
-  idx?: number
-}>()
-
-const doctorStatus = {
-  0: 'Tidak Aktif',
-  1: 'Aktif',
-}
-
-const statusText = computed(() => {
-  return doctorStatus[props.rec.status_code as keyof typeof doctorStatus]
-})
-
-const badgeVariant = computed(() => {
-  return props.rec.status_code === 1 ? 'default' : 'destructive'
-})
-</script>
-
-<template>
-  <div class="flex justify-center">
-    <Badge :variant="badgeVariant">
-      {{ statusText }}
-    </Badge>
-  </div>
-</template>