feat(medicine): finishing form + list

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

@@ -92,55 +92,75 @@ function onCancelForm() {
       <Cell>
         <Label height="">Kode</Label>
         <Field :errMessage="errors.code">
-          <input id="code" v-model="code" v-bind="codeAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full" />
+          <Input id="code" v-model="code" v-bind="codeAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full" />
         </Field>
       </Cell>
       <Cell>
         <Label height="compact">Nama</Label>
         <Field :errMessage="errors.name">
-          <input id="name" v-model="name" v-bind="nameAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full" />
+          <Input id="name" v-model="name" v-bind="nameAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full" />
         </Field>
       </Cell>
       <Cell>
         <Label height="compact">Kelompok Obat</Label>
         <Field :errMessage="errors.medicineGroup_code">
-          <select id="medicineGroup_code" v-model="medicineGroup_code" v-bind="medicineGroupAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full">
-            <option value="">Pilih kelompok obat</option>
-            <option v-for="item in props.medicineGroups || []" :key="item.value" :value="item.value">{{ item.label }}</option>
-          </select>
+          <Select
+            id="medicineGroup_code"
+            v-model="medicineGroup_code"
+            icon-name="i-lucide-chevron-down"
+            placeholder="Pilih kelompok obat"
+            v-bind="medicineGroupAttrs"
+            :items="props.medicineGroups || []"
+            :disabled="isLoading || isReadonly"
+          />
         </Field>
       </Cell>
       <Cell>
         <Label height="compact">Metode Pemberian</Label>
         <Field :errMessage="errors.medicineMethod_code">
-          <select id="medicineMethod_code" v-model="medicineMethod_code" v-bind="medicineMethodAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full">
-            <option value="">Pilih metode pemberian</option>
-            <option v-for="item in props.medicineMethods || []" :key="item.value" :value="item.value">{{ item.label }}</option>
-          </select>
+          <Select
+            id="medicineMethod_code"
+            v-model="medicineMethod_code"
+            icon-name="i-lucide-chevron-down"
+            placeholder="Pilih metode pemberian"
+            v-bind="medicineMethodAttrs"
+            :items="props.medicineMethods || []"
+            :disabled="isLoading || isReadonly"
+          />
         </Field>
       </Cell>
       <Cell>
         <Label height="compact">Satuan</Label>
         <Field :errMessage="errors.uom_code">
-          <select id="uom_code" v-model="uom_code" v-bind="uomAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full">
-            <option value="">Pilih satuan</option>
-            <option v-for="item in props.uoms || []" :key="item.value" :value="item.value">{{ item.label }}</option>
-          </select>
+          <Select
+            id="uom_code"
+            v-model="uom_code"
+            icon-name="i-lucide-chevron-down"
+            placeholder="Pilih satuan"
+            v-bind="uomAttrs"
+            :items="props.uoms || []"
+            :disabled="isLoading || isReadonly"
+          />
         </Field>
       </Cell>
-      <Cell>
+      <!-- <Cell>
         <Label height="compact">Infra</Label>
         <Field :errMessage="errors.infra_id">
-          <select id="infra_id" v-model="infra_id" v-bind="infraAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full">
-            <option value="">Tidak ada</option>
-            <option v-for="item in props.infras || []" :key="String(item.value)" :value="item.value">{{ item.label }}</option>
-          </select>
+          <Select
+            id="infra_id"
+            v-model="infra_id"
+            icon-name="i-lucide-chevron-down"
+            placeholder="Tidak ada"
+            v-bind="infraAttrs"
+            :items="props.infras || []"
+            :disabled="isLoading || isReadonly"
+          />
         </Field>
-      </Cell>
+      </Cell> -->
       <Cell>
         <Label height="compact">Stok</Label>
         <Field :errMessage="errors.stock">
-          <input id="stock" v-model="stock" type="number" v-bind="stockAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full" />
+          <Input id="stock" v-model="stock" type="number" v-bind="stockAttrs" :disabled="isLoading || isReadonly" class="input input-bordered w-full" />
         </Field>
       </Cell>
     </Block>

app/components/app/medicine/list-cfg.ts

@@ -18,16 +18,15 @@ export const header: Th[][] = [
   [
     { label: 'Kode' },
     { label: 'Name' },
-    { label: 'Kategori' },
     { label: 'Golongan' },
     { label: 'Metode Pemberian' },
-    { label: 'Bentuk' },
+    { label: "Satuan" },
     { label: 'Stok' },
     { label: 'Aksi' },
   ],
 ]
 
-export const keys = ['code', 'name', 'category', 'group', 'method', 'unit', 'total', 'action']
+export const keys = ['code', 'name', 'group', 'method', 'unit', 'stock', 'action']
 
 export const delKeyNames: KeyLabel[] = [
   { key: 'code', label: 'Kode' },
@@ -35,17 +34,14 @@ export const delKeyNames: KeyLabel[] = [
 ]
 
 export const funcParsed: RecStrFuncUnknown = {
-  cateogry: (rec: unknown): unknown => {
-    return (rec as SmallDetailDto).medicineCategory?.name || '-'
-  },
   group: (rec: unknown): unknown => {
-    return (rec as SmallDetailDto).medicineGroup?.name || '-'
+    return (rec as SmallDetailDto).medicineGroup_code || '-'
   },
   method: (rec: unknown): unknown => {
-    return (rec as SmallDetailDto).medicineMethod?.name || '-'
+    return (rec as SmallDetailDto).medicineMethod_code || '-'
   },
   unit: (rec: unknown): unknown => {
-    return (rec as SmallDetailDto).medicineUnit?.name || '-'
+    return (rec as SmallDetailDto).uom_code || '-'
   },
 }
 
@@ -60,8 +56,4 @@ export const funcComponent: RecStrFuncComponent = {
   },
 }
 
-export const funcHtml: RecStrFuncUnknown = {
-  // (_rec) {
-  //   return '-'
-  // },
-}
+export const funcHtml: RecStrFuncUnknown = {}

app/components/content/medicine/list.vue

@@ -10,7 +10,7 @@ import { usePaginatedList } from '~/composables/usePaginatedList'
 import { toast } from '~/components/pub/ui/toast'
 
 // Types
-import { ActionEvents, type HeaderPrep } from '~/components/pub/custom-ui/data/types'
+import { ActionEvents, type HeaderPrep, type RefSearchNav } from '~/components/pub/custom-ui/data/types'
 import { MedicineSchema, type MedicineFormData } from '~/schemas/medicine.schema'
 import type { MedicineGroup } from '~/models/medicine-group'
 import type { MedicineMethod } from '~/models/medicine-method'
@@ -82,6 +82,18 @@ const headerPrep: HeaderPrep = {
   },
 }
 
+const refSearchNav: RefSearchNav = {
+  onClick: () => {
+    // open filter modal
+  },
+  onInput: (_val: string) => {
+    // filter patient list
+  },
+  onClear: () => {
+    // clear url param
+  },
+}
+
 provide('rec_id', recId)
 provide('rec_action', recAction)
 provide('rec_item', recItem)
@@ -153,14 +165,22 @@ onMounted(async () => {
 </script>
 
 <template>
-  <!-- <Header :prep="{ ...hreaderPrep }" :ref-search-nav="refSearchNav" /> -->
-  <Header v-model="searchInput" :prep="headerPrep" @search="handleSearch" class="mb-4 xl:mb-5" />
+  <Header
+    v-model="searchInput"
+    :prep="headerPrep"
+    @search="handleSearch"
+    :ref-search-nav="refSearchNav"
+    class="mb-4 xl:mb-5"
+  />
   <AppMedicineList :data="data" :pagination-meta="paginationMeta" @page-change="handlePageChange" />
 
   <Dialog v-model:open="isFormEntryDialogOpen" :title="!!recItem ? title : 'Tambah Obat'" size="lg" prevent-outside>
     <AppMedicineEntryForm
       :schema="MedicineSchema"
       :values="recItem"
+      :medicineGroups="medicineGroups"
+      :medicineMethods="medicineMethods"
+      :uoms="uoms"
       :is-loading="isProcessing"
       :is-readonly="isReadonly"
       @submit="