feat(uom): crate form, list and integrate

This commit is contained in:
riefive
2025-09-26 16:04:19 +07:00
parent 867f93af31
commit ca1b0f4cb7
3 changed files with 35 additions and 77 deletions

No files matched your search

+26 -26
View File
@@ -2,7 +2,7 @@
// Components // Components
import Dialog from '~/components/pub/base/modal/dialog.vue' import Dialog from '~/components/pub/base/modal/dialog.vue'
import Header from '~/components/pub/custom-ui/nav-header/prep.vue' import Header from '~/components/pub/custom-ui/nav-header/prep.vue'
import AppMedicineMethodEntryForm from '~/components/app/medicine-method/entry-form.vue' import AppUomEntryForm from '~/components/app/uom/entry-form.vue'
import RecordConfirmation from '~/components/pub/custom-ui/confirmation/record-confirmation.vue' import RecordConfirmation from '~/components/pub/custom-ui/confirmation/record-confirmation.vue'
// Helpers // Helpers
@@ -11,7 +11,7 @@ import { toast } from '~/components/pub/ui/toast'
// Types // Types
import { ActionEvents, type HeaderPrep } from '~/components/pub/custom-ui/data/types' import { ActionEvents, type HeaderPrep } from '~/components/pub/custom-ui/data/types'
import { MedicineBaseSchema, type MedicineBaseFormData } from '~/schemas/medicine.schema' import { UomSchema, type UomFormData } from '~/schemas/uom.schema'
// Handlers // Handlers
import { import {
@@ -26,10 +26,10 @@ import {
handleActionEdit, handleActionEdit,
handleActionRemove, handleActionRemove,
handleCancelForm, handleCancelForm,
} from '~/handlers/medicine-method.handler' } from '~/handlers/uom.handler'
// Services // Services
import { getMedicineMethods, getMedicineMethodDetail } from '~/services/medicine-method.service' import { getUoms, getUomDetail } from '~/services/uom.service'
const title = ref('') const title = ref('')
@@ -40,18 +40,18 @@ const {
searchInput, searchInput,
handlePageChange, handlePageChange,
handleSearch, handleSearch,
fetchData: getMedicineMethodList, fetchData: getUomList,
} = usePaginatedList({ } = usePaginatedList({
fetchFn: async ({ page, search }) => { fetchFn: async ({ page, search }) => {
const result = await getMedicineMethods({ search, page }) const result = await getUoms({ search, page })
return { success: result.success || false, body: result.body || {} } return { success: result.success || false, body: result.body || {} }
}, },
entityName: 'medicine-method', entityName: 'uom',
}) })
const headerPrep: HeaderPrep = { const headerPrep: HeaderPrep = {
title: 'Metode Obat', title: 'Uom',
icon: 'i-lucide-medicine-bottle', icon: 'i-lucide-layout-dashboard',
refSearchNav: { refSearchNav: {
placeholder: 'Cari (min. 3 karakter)...', placeholder: 'Cari (min. 3 karakter)...',
minLength: 3, minLength: 3,
@@ -78,11 +78,11 @@ provide('rec_action', recAction)
provide('rec_item', recItem) provide('rec_item', recItem)
provide('table_data_loader', isLoading) provide('table_data_loader', isLoading)
const getCurrentMedicineMethodDetail = async (id: number | string) => { const getCurrentUomDetail = async (id: number | string) => {
const result = await getMedicineMethodDetail(id) const result = await getUomDetail(id)
if (result.success) { if (result.success) {
const currentMaterial = result.body?.data || {} const currentValue = result.body?.data || {}
recItem.value = currentMaterial recItem.value = currentValue
isFormEntryDialogOpen.value = true isFormEntryDialogOpen.value = true
} }
} }
@@ -91,13 +91,13 @@ const getCurrentMedicineMethodDetail = async (id: number | string) => {
watch([recId, recAction], () => { watch([recId, recAction], () => {
switch (recAction.value) { switch (recAction.value) {
case ActionEvents.showDetail: case ActionEvents.showDetail:
getCurrentMedicineMethodDetail(recId.value) getCurrentUomDetail(recId.value)
title.value = 'Detail Metode Obat' title.value = 'Detail Uom'
isReadonly.value = true isReadonly.value = true
break break
case ActionEvents.showEdit: case ActionEvents.showEdit:
getCurrentMedicineMethodDetail(recId.value) getCurrentUomDetail(recId.value)
title.value = 'Edit Metode Obat' title.value = 'Edit Uom'
isReadonly.value = false isReadonly.value = false
break break
case ActionEvents.showConfirmDelete: case ActionEvents.showConfirmDelete:
@@ -107,7 +107,7 @@ watch([recId, recAction], () => {
}) })
onMounted(async () => { onMounted(async () => {
await getMedicineMethodList() await getUomList()
}) })
</script> </script>
@@ -115,27 +115,27 @@ onMounted(async () => {
<div class="p-4"> <div class="p-4">
<Header v-model="searchInput" :prep="headerPrep" @search="handleSearch" /> <Header v-model="searchInput" :prep="headerPrep" @search="handleSearch" />
<div class="rounded-md border p-4"> <div class="rounded-md border p-4">
<AppMedicineMethodList :data="data" :pagination-meta="paginationMeta" @page-change="handlePageChange" /> <AppUomList :data="data" :pagination-meta="paginationMeta" @page-change="handlePageChange" />
</div> </div>
<Dialog <Dialog
v-model:open="isFormEntryDialogOpen" v-model:open="isFormEntryDialogOpen"
:title="!!recItem ? title : 'Tambah Metode Obat'" :title="!!recItem ? title : 'Tambah Uom'"
size="lg" size="lg"
prevent-outside prevent-outside
> >
<AppMedicineMethodEntryForm <AppUomEntryForm
:schema="MedicineBaseSchema" :schema="UomSchema"
:values="recItem" :values="recItem"
:is-loading="isProcessing" :is-loading="isProcessing"
:is-readonly="isReadonly" :is-readonly="isReadonly"
@submit=" @submit="
(values: MedicineBaseFormData | Record<string, any>, resetForm: () => void) => { (values: UomFormData | Record<string, any>, resetForm: () => void) => {
if (recId > 0) { if (recId > 0) {
handleActionEdit(recId, values, getMedicineMethodList, resetForm, toast) handleActionEdit(recId, values, getUomList, resetForm, toast)
return return
} }
handleActionSave(values, getMedicineMethodList, resetForm, toast) handleActionSave(values, getUomList, resetForm, toast)
} }
" "
@cancel="handleCancelForm" @cancel="handleCancelForm"
@@ -147,7 +147,7 @@ onMounted(async () => {
v-model:open="isRecordConfirmationOpen" v-model:open="isRecordConfirmationOpen"
action="delete" action="delete"
:record="recItem" :record="recItem"
@confirm="() => handleActionRemove(recId, getMedicineMethodList, toast)" @confirm="() => handleActionRemove(recId, getUomList, toast)"
@cancel="" @cancel=""
> >
<template #default="{ record }"> <template #default="{ record }">
@@ -6,7 +6,7 @@ import { PAGE_PERMISSIONS } from '~/lib/page-permission'
definePageMeta({ definePageMeta({
middleware: ['rbac'], middleware: ['rbac'],
roles: ['doctor', 'nurse', 'admisi', 'pharmacy', 'billing', 'management'], roles: ['doctor', 'nurse', 'admisi', 'pharmacy', 'billing', 'management'],
title: 'Tambah User', title: 'Daftar User',
contentFrame: 'cf-full-width', contentFrame: 'cf-full-width',
}) })
@@ -18,24 +18,23 @@ useHead({
const roleAccess: PagePermission = PAGE_PERMISSIONS['/doctor'] const roleAccess: PagePermission = PAGE_PERMISSIONS['/doctor']
const { checkRole, hasCreateAccess } = useRBAC() const { checkRole, hasReadAccess } = useRBAC()
// Check if user has access to this page // Check if user has access to this page
const hasAccess = checkRole(roleAccess) const hasAccess = checkRole(roleAccess)
if (!hasAccess) { if (!hasAccess) {
throw createError({ navigateTo('/403')
statusCode: 403,
statusMessage: 'Access denied',
})
} }
// Define permission-based computed properties // Define permission-based computed properties
const canCreate = hasCreateAccess(roleAccess) const canRead = true // hasReadAccess(roleAccess)
</script> </script>
<template> <template>
<div v-if="canCreate"> <div>
<ContentDeviceEntry /> <div v-if="canRead">
<ContentUomList />
</div>
<Error v-else :status-code="403" />
</div> </div>
<Error v-else :status-code="403" />
</template> </template>
@@ -1,41 +0,0 @@
<script setup lang="ts">
import type { PagePermission } from '~/models/role'
import Error from '~/components/pub/base/error/error.vue'
import { PAGE_PERMISSIONS } from '~/lib/page-permission'
definePageMeta({
middleware: ['rbac'],
roles: ['doctor', 'nurse', 'admisi', 'pharmacy', 'billing', 'management'],
title: 'Tambah User',
contentFrame: 'cf-full-width',
})
const route = useRoute()
useHead({
title: () => route.meta.title as string,
})
const roleAccess: PagePermission = PAGE_PERMISSIONS['/doctor']
const { checkRole, hasCreateAccess } = useRBAC()
// Check if user has access to this page
const hasAccess = checkRole(roleAccess)
if (!hasAccess) {
throw createError({
statusCode: 403,
statusMessage: 'Access denied',
})
}
// Define permission-based computed properties
const canCreate = hasCreateAccess(roleAccess)
</script>
<template>
<div v-if="canCreate">
<ContentMaterialEntry />
</div>
<Error v-else :status-code="403" />
</template>