Merge branch 'dev' of https://github.com/dikstub-rssa/simrs-fe into feat/user

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

@@ -2,23 +2,26 @@
 // types
 import type z from 'zod'
 import type { MaterialFormData } from '~/schemas/material'
+<<<<<<< HEAD:app/components/app/equipment/entry-form.vue
+=======
 // helpers
 import { toTypedSchema } from '@vee-validate/zod'
 import { useForm } from 'vee-validate'
 // components
 import Label from '~/components/pub/custom-ui/form/label.vue'
+>>>>>>> 266d5f740b15942ca7b8845c00573640fdc9a3b2:app/components/app/material/entry-form.vue
 
 interface Props {
-  isLoading: boolean
   schema: z.ZodSchema<any>
   uoms: any[]
   items: any[]
 }
 
+const isLoading = ref(false)
 const props = defineProps<Props>()
 const emit = defineEmits<{
-  back: []
+  submit: [values: MaterialFormData, resetForm: () => void]
-  submit: [data: any]
+  cancel: [resetForm: () => void]
 }>()
 
 const { handleSubmit, defineField, errors } = useForm({
@@ -38,19 +41,36 @@ const [uom, uomAttrs] = defineField('uom_code')
 const [item, itemAttrs] = defineField('item_id')
 const [stock, stockAttrs] = defineField('stock')
 
-const onSubmit = handleSubmit(async (values) => {
+const resetForm = () => {
-  try {
+  code.value = ''
-    emit('submit', values)
+  name.value = ''
-  } catch (error) {
+  uom.value = ''
-    console.error('Submission failed:', error)
+  item.value = ''
+  stock.value = 0
+}
+
+// Form submission handler
+function onSubmitForm(values: any) {
+  const formData: MaterialFormData = {
+    name: values.name || '',
+    code: values.code || '',
+    uom_code: values.uom_code || '',
+    item_id: values.item_id || '',
+    stock: values.stock || 0,
   }
-})
+  emit('submit', formData, resetForm)
+}
+
+// Form cancel handler
+function onCancelForm() {
+  emit('cancel', resetForm)
+}
 </script>
 
 <template>
-  <form class="grid gap-2" @submit="onSubmit">
+  <form class="grid gap-2" @submit="handleSubmit(onSubmitForm)">
     <div class="grid gap-2">
-      <Label for="code">Kode</Label>
+      <label for="code">Kode</label>
       <Input
         id="code"
         v-model="code"
@@ -63,7 +83,7 @@ const onSubmit = handleSubmit(async (values) => {
       </span>
     </div>
     <div class="grid gap-2">
-      <Label for="name">Nama</Label>
+      <label for="name">Nama</label>
       <Input
         id="name"
         v-model="name"
@@ -76,7 +96,7 @@ const onSubmit = handleSubmit(async (values) => {
       </span>
     </div>
     <div class="grid gap-2">
-      <Label for="uom">Satuan</Label>
+      <label for="uom">Satuan</label>
       <Select
         id="uom"
         v-model="uom"
@@ -92,7 +112,7 @@ const onSubmit = handleSubmit(async (values) => {
       </span>
     </div>
     <div class="grid gap-2">
-      <Label for="item">Item</Label>
+      <label for="item">Item</label>
       <Select
         id="item"
         v-model="item"
@@ -108,7 +128,7 @@ const onSubmit = handleSubmit(async (values) => {
       </span>
     </div>
     <div class="grid gap-2">
-      <Label for="stock">Stok</Label>
+      <label for="stock">Stok</label>
       <Input
         id="stock"
         v-model="stock"
@@ -122,7 +142,7 @@ const onSubmit = handleSubmit(async (values) => {
       </span>
     </div>
     <div class="my-2 flex justify-end gap-2 py-2">
-      <Button variant="secondary" class="w-[120px]" @click="emit('back')"> Kembali </Button>
+      <Button variant="secondary" class="w-[120px]" @click="onCancelForm"> Kembali </Button>
       <Button type="submit" class="w-[120px]">
         <Loader2 v-if="isLoading" class="mr-2 h-4 w-4 animate-spin" />
         Simpan

app/components/app/equipment/list.vue

@@ -0,0 +1,38 @@
+<script setup lang="ts">
+import type { PaginationMeta } from '~/components/pub/custom-ui/pagination/pagination.type'
+import { cols, funcComponent, funcHtml, funcParsed, header, keys } from './list-cfg'
+
+interface Props {
+  data: any[]
+  paginationMeta?: PaginationMeta
+}
+
+defineProps<Props>()
+
+const emit = defineEmits<{
+  pageChange: [page: number]
+}>()
+
+function handlePageChange(page: number) {
+  emit('pageChange', page)
+}
+</script>
+
+<template>
+  <div class="space-y-4">
+    <PubBaseDataTable
+      :rows="data"
+      :cols="cols"
+      :header="header"
+      :keys="keys"
+      :func-parsed="funcParsed"
+      :func-html="funcHtml"
+      :func-component="funcComponent"
+    />
+    <template v-if="paginationMeta">
+      <div v-if="paginationMeta.totalPage > 1">
+        <PubCustomUiPagination :pagination-meta="paginationMeta" @page-change="handlePageChange" />
+      </div>
+    </template>
+  </div>
+</template>

app/components/app/material/list.vue

@@ -1,19 +0,0 @@
-<script setup lang="ts">
-import { cols, funcComponent, funcHtml, funcParsed, header, keys } from './list-cfg'
-
-defineProps<{
-  data: any[]
-}>()
-</script>
-
-<template>
-  <PubBaseDataTable
-    :rows="data"
-    :cols="cols"
-    :header="header"
-    :keys="keys"
-    :func-parsed="funcParsed"
-    :func-html="funcHtml"
-    :func-component="funcComponent"
-  />
-</template>

app/components/content/equipment/list.vue

@@ -0,0 +1,211 @@
+<script setup lang="ts">
+import { MaterialSchema, type MaterialFormData } from '~/schemas/material'
+import { usePaginatedList } from '~/composables/usePaginatedList'
+import { ActionEvents, type HeaderPrep } from '~/components/pub/custom-ui/data/types'
+import Dialog from '~/components/pub/base/modal/dialog.vue'
+import Header from '~/components/pub/custom-ui/nav-header/prep.vue'
+import AppEquipmentEntryForm from '~/components/app/equipment/entry-form.vue'
+import RecordConfirmation from '~/components/pub/custom-ui/confirmation/record-confirmation.vue'
+
+const isFormEntryDialogOpen = ref(false)
+const isRecordConfirmationOpen = ref(false)
+const recId = ref<number>(0)
+const recAction = ref<string>('')
+const recItem = ref<any>(null)
+
+const uoms = [
+  { value: 'uom-1', label: 'Satuan 1' },
+  { value: 'uom-2', label: 'Satuan 2' },
+  { value: 'uom-3', label: 'Satuan 3' },
+]
+const items = [
+  { value: 'item-1', label: 'Item 1' },
+  { value: 'item-2', label: 'Item 2' },
+  { value: 'item-3', label: 'Item 3' },
+]
+
+// Fungsi untuk fetch data division
+async function fetchEquipmentData(params: any) {
+  // Prepare query parameters for pagination and search
+  const urlParams = new URLSearchParams({
+    'page-number': params.page.toString(),
+    'page-size': params.pageSize.toString(),
+  })
+
+  if (params.q) {
+    urlParams.append('search', params.q)
+  }
+
+  return await xfetch(`/api/v1/equipment?${urlParams.toString()}`)
+}
+
+// Menggunakan composable untuk pagination
+const {
+  data,
+  isLoading,
+  paginationMeta,
+  searchInput,
+  handlePageChange,
+  handleSearch,
+  fetchData: getEquipmentList,
+} = usePaginatedList({
+  fetchFn: fetchEquipmentData,
+  entityName: 'equipment',
+})
+
+const headerPrep: HeaderPrep = {
+  title: 'Perlengkapan (BMHP)',
+  icon: 'i-lucide-layout-dashboard',
+  refSearchNav: {
+    placeholder: 'Cari (min. 3 karakter)...',
+    minLength: 3,
+    debounceMs: 500,
+    showValidationFeedback: true,
+    onInput: (_val: string) => {
+      // Handle search input - this will be triggered by the header component
+    },
+    onClick: () => {
+      // Handle search button click if needed
+    },
+    onClear: () => {
+      // Handle search clear
+    },
+  },
+  addNav: {
+    label: 'Tambah Perlengkapan',
+    icon: 'i-lucide-plus',
+    onClick: () => {
+      isFormEntryDialogOpen.value = true
+    },
+  },
+}
+
+provide('rec_id', recId)
+provide('rec_action', recAction)
+provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
+
+// Watch for row actions
+watch(recId, () => {
+  switch (recAction.value) {
+    case ActionEvents.showEdit:
+      // TODO: Handle edit action
+      // isFormEntryDialogOpen.value = true
+      break
+    case ActionEvents.showConfirmDelete:
+      // Trigger confirmation modal open
+      isRecordConfirmationOpen.value = true
+      break
+  }
+})
+
+const handleDeleteRow = async (record: any) => {
+  try {
+    // TODO : hit backend request untuk delete
+    console.log('Deleting record:', record)
+    // Simulate API call
+    // const response = await xfetch(`/api/v1/division/${record.id}`, {
+    //   method: 'DELETE'
+    // })
+
+    // Refresh data setelah berhasil delete
+    await getEquipmentList()
+
+    // TODO: Show success message
+    console.log('Record deleted successfully')
+  } catch (error) {
+    console.error('Error deleting record:', error)
+    // TODO: Show error message
+  } finally {
+    // Reset record state
+    recId.value = 0
+    recAction.value = ''
+    recItem.value = null
+  }
+}
+
+const onCancelForm = (resetForm: () => void) => {
+  isFormEntryDialogOpen.value = false
+  setTimeout(() => {
+    resetForm()
+  }, 500)
+}
+
+const onSubmitForm = async (values: any, resetForm: () => void) => {
+  let isSuccess = false
+  try {
+    // TODO: Implement form submission logic
+    console.log('Form submitted:', values)
+
+    // Simulate API call
+    // const response = await xfetch('/api/v1/division', {
+    //   method: 'POST',
+    //   body: JSON.stringify(values)
+    // })
+
+    // If successful, mark as success and close dialog
+    isFormEntryDialogOpen.value = false
+    isSuccess = true
+
+    // Refresh data after successful submission
+    await getEquipmentList()
+
+    // TODO: Show success message
+    console.log('Division created successfully')
+  } catch (error: unknown) {
+    console.warn('Error submitting form:', error)
+    isSuccess = false
+    // Don't close dialog or reset form on error
+    // TODO: Show error message to user
+  } finally {
+    if (isSuccess) {
+      setTimeout(() => {
+        resetForm()
+      }, 500)
+    }
+  }
+}
+
+// Handle confirmation result
+const handleConfirmDelete = (record: any, action: string) => {
+  console.log('Confirmed action:', action, 'for record:', record)
+  handleDeleteRow(record)
+}
+
+const handleCancelConfirmation = () => {
+  // Reset record state when cancelled
+  recId.value = 0
+  recAction.value = ''
+  recItem.value = null
+}
+</script>
+
+<template>
+  <div class="rounded-md border p-4">
+    <Header v-model="searchInput" :prep="headerPrep" @search="handleSearch" />
+    <div class="rounded-md border p-4">
+      <AppEquipmentList :data="data" :pagination-meta="paginationMeta" @page-change="handlePageChange" />
+    </div>
+
+    <Dialog v-model:open="isFormEntryDialogOpen" title="Tambah Perlengkapan" size="lg" prevent-outside>
+      <AppEquipmentEntryForm :schema="MaterialSchema" :uoms="uoms" :items="items" @back="onCancelForm" @submit="onSubmitForm" />
+    </Dialog>
+
+    <!-- Record Confirmation Modal -->
+    <RecordConfirmation
+      v-model:open="isRecordConfirmationOpen"
+      action="delete"
+      :record="recItem"
+      @confirm="handleConfirmDelete"
+      @cancel="handleCancelConfirmation"
+    >
+      <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>
+  </div>
+</template>

app/pages/(features)/tools-equipment-src/equipment/index.vue

@@ -27,13 +27,17 @@ if (!hasAccess) {
 }
 
 // Define permission-based computed properties
-const canRead = hasReadAccess(roleAccess)
+const canRead = true // hasReadAccess(roleAccess)
 </script>
 
 <template>
   <div>
     <div v-if="canRead">
+<<<<<<< HEAD
+      <ContentEquipmentList />
+=======
       <ContentMaterialList />
+>>>>>>> 266d5f740b15942ca7b8845c00573640fdc9a3b2
     </div>
     <Error v-else :status-code="403" />
   </div>

public/side-menu-items/sys.json

@@ -35,7 +35,7 @@
       },
       {
         "title": "IGD",
-        "icon": "i-lucide-stethoscope",
+        "icon": "i-lucide-zap",
         "children": [
           {
             "title": "Triase",
@@ -77,7 +77,7 @@
       },
       {
         "title": "Rehabilitasi Medik",
-        "icon": "i-lucide-heart",
+        "icon": "i-lucide-bike",
         "link": "/rehabilitasi",
         "children": [
           {
@@ -103,34 +103,44 @@
         ]
       },
       {
-        "title": "Farmasi",
+        "title": "Obat - Order",
-        "icon": "i-lucide-users",
+        "icon": "i-lucide-briefcase-medical",
         "children": [
           {
             "title": "Permintaan",
             "icon": "i-lucide-user",
-            "link": "/pharmacy/request"
+            "link": "/medication/order"
           },
           {
             "title": "Standing Order",
             "icon": "i-lucide-user",
-            "link": "/pharmacy/standing-order"
+            "link": "/medication/standing-order"
           }
         ]
       },
       {
-        "title": "Lab",
+        "title": "Lab - Order",
-        "icon": "i-lucide-briefcase",
+        "icon": "i-lucide-microscope",
         "link": "/lab-order"
       },
       {
-        "title": "Radiologi",
+        "title": "Lab Mikro - Order",
+        "icon": "i-lucide-microscope",
+        "link": "/micro-lab-order"
+      },
+      {
+        "title": "Lab PA - Order",
+        "icon": "i-lucide-microscope",
+        "link": "/pa-lab-order"
+      },
+      {
+        "title": "Radiologi - Order",
         "icon": "i-lucide-radio",
         "link": "/radiology-order"
       },
       {
         "title": "Gizi",
-        "icon": "i-lucide-briefcase",
+        "icon": "i-lucide-egg-fried",
         "link": "/nutrition-order"
       },
       {
@@ -160,7 +170,7 @@
     "items": [
       {
         "title": "BPJS",
-        "icon": "i-lucide-refresh-cw",
+        "icon": "i-lucide-circuit-board",
         "link": "/integration/bpjs",
         "badge": "Live"
       },
@@ -177,7 +187,7 @@
     "items": [
       {
         "title": "Peralatan dan Perlengkapan",
-        "icon": "i-lucide-radius",
+        "icon": "i-lucide-layout-dashboard",
         "children": [
           {
             "title": "Obat",
@@ -192,7 +202,7 @@
           {
             "title": "Perlengkapan (BMHP)",
             "icon": "i-lucide-stethoscope",
-            "link": "/tools-equipment-src/material"
+            "link": "/tools-equipment-src/equipment"
           },
           {
             "title": "Metode Obat",
@@ -209,36 +219,88 @@
       {
         "title": "Pengguna",
         "icon": "i-lucide-user",
-        "link": "/human-src/employee"
+        "children": [
+          {
+            "title": "Pegawai",
+            "icon": "i-lucide-stethoscope",
+            "link": "/human-src/employee"
+          },
+          {
+            "title": "PPDS",
+            "icon": "i-lucide-user",
+            "link": "/human-src/specialist-intern"
+          }
+        ]
       },
       {
         "title": "Layanan",
-        "icon": "i-lucide-card-sim",
+        "icon": "i-lucide-layout-list",
         "children": [
           {
             "title": "Counter",
             "icon": "i-lucide-stethoscope",
-            "link": "/tools-equipment-src/medicine"
+            "link": "/service-src/counter"
           },
           {
-            "title": "Bed",
+            "title": "Public Screen (Big Screen)",
             "icon": "i-lucide-tools",
-            "link": "/tools-equipment-src/device"
+            "link": "/service-src/public-screen"
+          },
+          {
+            "title": "Kasur",
+            "icon": "i-lucide-tools",
+            "link": "/service-src/bed"
           },
           {
             "title": "Kamar",
             "icon": "i-lucide-stethoscope",
-            "link": "/tools-equipment-src/medical-device"
+            "link": "/service-src/chamber"
           },
           {
             "title": "Lantai",
             "icon": "i-lucide-user",
-            "link": "/tools-equipment-src/medicine-method"
+            "link": "/service-src/floor"
           },
           {
             "title": "Gedung",
             "icon": "i-lucide-user",
-            "link": "/tools-equipment-src/medicine-type"
+            "link": "/service-src/building"
+          }
+        ]
+      },
+      {
+        "title": "Item & Item Price",
+        "icon": "i-lucide-shopping-basket",
+        "link": "/item-src/item"
+      },
+      {
+        "title": "Organisasi",
+        "icon": "i-lucide-network",
+        "children": [
+          {
+            "title": "Divisi",
+            "icon": "i-lucide-stethoscope",
+            "link": "/org-src/division"
+          },
+          {
+            "title": "Instalasi",
+            "icon": "i-lucide-tools",
+            "link": "/org-src/installation"
+          },
+          {
+            "title": "Unit",
+            "icon": "i-lucide-tools",
+            "link": "/org-src/unit"
+          },
+          {
+            "title": "Specialist",
+            "icon": "i-lucide-stethoscope",
+            "link": "/org-src/specialist"
+          },
+          {
+            "title": "Sub Specialist",
+            "icon": "i-lucide-user",
+            "link": "/org-src/subspecialist"
           }
         ]
       }