feat/prescription: integrated non-mix

app/components/app/prescription-item/list-entry.cfg.ts

@@ -20,7 +20,7 @@ export const config: Config = {
     ],
   ],
 
-  keys: ['name', 'uom_code', 'frequency', 'multiplier', 'interval', 'total', 'action'],
+  keys: ['medicine.name', 'medicine.medicineForm.name', 'frequency', 'dose', 'interval', 'total', 'action'],
 
   delKeyNames: [
     { key: 'code', label: 'Kode' },

app/components/app/prescription-item/mix-entry.vue

@@ -1,29 +1,37 @@
 <script setup lang="ts">
-import { LucidePlus } from 'lucide-vue-next';
-
 import * as DE from '~/components/pub/my-ui/doc-entry'
 import Separator from '~/components/pub/ui/separator/Separator.vue';
 import * as Table from '~/components/pub/ui/table'
 import Nav from '~/components/pub/my-ui/nav-footer/cl-sa.vue'
-
+import * as CB from '~/components/pub/my-ui/combobox'
 
 import { genBase } from '~/models/_base';
-import { genMedicine } from '~/models/medicine';
+import { type Medicine, genMedicine } from '~/models/medicine';
 import type { MedicinemixItem } from '~/models/medicinemix-item';
 import type { PrescriptionItem } from '~/models/prescription-item';
 
 const props = defineProps<{
   data: PrescriptionItem
   items: MedicinemixItem[]
+  medicines: Medicine[]
 }>()
 
+const { medicines } = toRefs(props)
+const medicineItems = ref<CB.Item[]>([])
+const selectedMedicine_code = ref<string>(props.data.medicine?.code || '')
+
 type ClickType = 'close' | 'save'
 
 const emit = defineEmits<{
   close: [],
   save: [data: PrescriptionItem, items: MedicinemixItem[]],
+  'update:searchText': [value: string]
 }>()
 
+watch(medicines, (data) => {
+  medicineItems.value = CB.objectsToItem(data, 'code', 'name')
+})
+
 function navClick(type: ClickType) {
   if (type === 'close') {
     emit('close')
@@ -42,13 +50,19 @@ function addItem() {
     uom_code: '',
   })
 }
+
+function searchMedicineText(value: string) {
+  emit('update:searchText', value)
+}
 </script>
 
 <template>
-  <DE.Block :colCount="5" :cellFlex="false">
-    <DE.Cell :colSpan="5">
+  <DE.Block :colCount="4" :cellFlex="false">
+    <DE.Cell :colSpan="4">
         <DE.Label>Nama</DE.Label>
-        <DE.Field><Input :value="data.medicineMix?.name" /></DE.Field>
+        <DE.Field>
+          <Input :value="data.medicineMix?.name" />
+        </DE.Field>
     </DE.Cell>
     <DE.Cell>
         <DE.Label>Frequensi</DE.Label>
@@ -66,7 +80,7 @@ function addItem() {
         <DE.Label>Total</DE.Label>
         <DE.Field><Input /></DE.Field>
     </DE.Cell>
-    <DE.Cell :colSpan="5">
+    <DE.Cell :colSpan="4">
         <DE.Label>Cara Pakai</DE.Label>
         <DE.Field><Input /></DE.Field>
     </DE.Cell>
@@ -102,7 +116,7 @@ function addItem() {
   </Table.Table>
   <div>
     <Button @click="addItem">
-      <LucidePlus />
+      <Icon name="i-lucide-plus" class="me-2" />
       Tambah
     </Button>
   </div>

app/components/app/prescription-item/non-mix-entry.vue

@@ -2,15 +2,26 @@
 import * as DE from '~/components/pub/my-ui/doc-entry'
 import Separator from '~/components/pub/ui/separator/Separator.vue'
 import Nav from '~/components/pub/my-ui/nav-footer/cl-sa.vue'
+import * as CB from '~/components/pub/my-ui/combobox'
 
-import { bigTimeUnitCodes } from '~/lib/constants'
+// import { bigTimeUnitCodes } from '~/lib/constants'
 
+import { type Medicine, genMedicine } from '~/models/medicine';
 import type { PrescriptionItem } from '~/models/prescription-item'
 
 const props = defineProps<{
   data: PrescriptionItem
+  medicines: Medicine[]
 }>()
 
+const { medicines } = toRefs(props)
+const medicineItems = ref<CB.Item[]>([])
+const medicineForm = computed(() => {
+  const medicine = props.medicines.find(m => m.code === props.data.medicine_code)
+  return medicine ? medicine.medicineForm?.name : '--tidak diketahui--'
+})
+// const selectedMedicine_code = ref<string>(props.data.medicine_code || '')
+
 type ClickType = 'close' | 'save'
 type Item = {
   value: string
@@ -23,19 +34,23 @@ if(!props.data.intervalUnit_code) {
   props.data.intervalUnit_code = 'day'
 }
 
-Object.keys(bigTimeUnitCodes).forEach((key) => {
-  bigTimeUnitCodeItems.push({
-    value: key,
-    label: bigTimeUnitCodes[key] || '',
-  })
-})
-
+// Object.keys(bigTimeUnitCodes).forEach((key) => {
+//   bigTimeUnitCodeItems.push({
+//     value: key,
+//     label: bigTimeUnitCodes[key] || '',
+//   })
+// })
 
 const emit = defineEmits<{
   close: [],
   save: [data: PrescriptionItem],
+  'update:searchText': [value: string]
 }>()
 
+watch(medicines, (data) => {
+  medicineItems.value = CB.objectsToItem(data, 'code', 'name')
+})
+
 function navClick(type: ClickType) {
   if (type === 'close') {
     emit('close')
@@ -43,13 +58,23 @@ function navClick(type: ClickType) {
     emit('save', props.data)
   }
 }
+
+function searchMedicineText(value: string) {
+  emit('update:searchText', value)
+}
 </script>
 
 <template>
-  <DE.Block :colCount="5" :cellFlex="false">
-    <DE.Cell :colSpan="5">
-        <DE.Label>Nama</DE.Label>
-        <DE.Field><Input :value="data.medicineMix?.name" /></DE.Field>
+  <DE.Block :colCount="4" :cellFlex="false">
+    <DE.Cell :colSpan="4">
+      <DE.Label>Nama</DE.Label>
+      <DE.Field>
+        <CB.Combobox
+          v-model="data.medicine_code"
+          :items="medicineItems"
+          @update:searchText="searchMedicineText"
+        />
+      </DE.Field>
     </DE.Cell>
     <DE.Cell>
       <DE.Label>Frequensi</DE.Label>
@@ -59,11 +84,7 @@ function navClick(type: ClickType) {
       <DE.Label>Dosis</DE.Label>
       <DE.Field><Input type="number" v-model.number="data.dose" /></DE.Field>
     </DE.Cell>
-    <DE.Cell>
-        <DE.Label>Sediaan</DE.Label>
-        <DE.Field><Input :value="data.medicineMix?.uom_code" readonly /></DE.Field>
-    </DE.Cell>
-    <DE.Cell>
+    <!-- <DE.Cell>
       <DE.Label>Interval</DE.Label>
       <DE.Field>
         <Select
@@ -71,14 +92,18 @@ function navClick(type: ClickType) {
           :items="bigTimeUnitCodeItems"
         />
       </DE.Field>
-    </DE.Cell>
+    </DE.Cell> -->
     <DE.Cell>
       <DE.Label>Total</DE.Label>
       <DE.Field>
-        <Input v-model="data.quantity" />
+        <Input type="number" v-model="data.quantity" />
       </DE.Field>
     </DE.Cell>
-    <DE.Cell :colSpan="5">
+    <DE.Cell>
+        <DE.Label>Sediaan</DE.Label>
+        <DE.Field><Input :value="medicineForm" readonly /></DE.Field>
+    </DE.Cell>
+    <DE.Cell :colSpan="4">
         <DE.Label>Cara Pakai</DE.Label>
         <DE.Field><Input /></DE.Field>
     </DE.Cell>