munawwirul_jamal/simrsx-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'dev' into feat/surat-kontrol-135

Browse Source
This commit is contained in:
Muhammad Hasyim Chaidir Ali
2025-11-07 09:11:10 +07:00
committed by GitHub
parent 99a61a0bf2 db15ec9445
commit 59b44b5729
58 changed files with 1777 additions and 509 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/content/encounter/assesment-function/add.vue
-3
View File
@@ -1,3 +0,0 @@
<template>
<div>halo</div>
</template>
app/components/content/encounter/assesment-function/list.vue
-64
View File
@@ -1,64 +0,0 @@
<script setup lang="ts">
import type { DataTableLoader } from '~/components/pub/my-ui/data-table/type'
import type { HeaderPrep, RefSearchNav } from '~/components/pub/my-ui/data/types'
import AssesmentFunctionList from '~/components/app/encounter/assesment-function/list.vue'
import Header from '~/components/pub/my-ui/nav-header/prep.vue'
const props = defineProps<{
label: string
}>()
const data = ref([])
const refSearchNav: RefSearchNav = {
onClick: () => {
// open filter modal
},
onInput: (_val: string) => {
// filter patient list
},
onClear: () => {
// clear url param
},
}
// Loading state management
const isLoading = reactive<DataTableLoader>({
isTableLoading: false,
})
const recId = ref<number>(0)
const recAction = ref<string>('')
const recItem = ref<any>(null)
const hreaderPrep: HeaderPrep = {
title: props.label,
icon: 'i-lucide-users',
addNav: {
label: 'Tambah',
onClick: () => navigateTo('/rehab/registration-queue/sep-prosedur/add'),
},
}
async function getPatientList() {
const resp = await xfetch('/api/v1/patient')
if (resp.success) {
data.value = (resp.body as Record<string, any>).data
}
}
onMounted(() => {
getPatientList()
})
provide('rec_id', recId)
provide('rec_action', recAction)
provide('rec_item', recItem)
provide('table_data_loader', isLoading)
</script>
<template>
<Header :prep="{ ...hreaderPrep }" :ref-search-nav="refSearchNav" />
<div class="my-4 flex flex-1 flex-col gap-4 md:gap-8">
<AssesmentFunctionList :data="data" />
</div>
</template>
app/components/content/encounter/process.vue
+17 -5
View File
@@ -5,15 +5,16 @@ import { useRoute, useRouter } from 'vue-router'
import { getDetail } from '~/services/encounter.service'
// Components
import type { Encounter } from '~/models/encounter'
//
import type { TabItem } from '~/components/pub/my-ui/comp-tab/type'
import CompTab from '~/components/pub/my-ui/comp-tab/comp-tab.vue'
// PLASE ORDER BY TAB POSITION
import Status from '~/components/content/encounter/status.vue'
import AssesmentFunctionList from '~/components/content/soapi/entry.vue'
import EarlyMedicalAssesmentList from '~/components/content/soapi/entry.vue'
import EarlyMedicalRehabList from '~/components/content/soapi/entry.vue'
import PrescriptionList from '~/components/content/prescription/list.vue'
import Status from '~/components/app/encounter/status.vue'
import Consultation from '~/components/content/consultation/list.vue'
import EncounterList from '~/components/content/outpatient/encounter/list.vue'
@@ -38,13 +39,24 @@ const data = dataResBody?.data ?? null
const tabs: TabItem[] = [
{ value: 'status', label: 'Status Masuk/Keluar', component: Status, props: { encounter: data } },
{ value: 'early-medical-assessment', label: 'Pengkajian Awal Medis', component: EarlyMedicalAssesmentList },
{
value: 'early-medical-assessment',
label: 'Pengkajian Awal Medis',
component: EarlyMedicalAssesmentList,
props: { encounter: data, type: 'early-medic', label: 'Pengkajian Awal Medis' },
},
{
value: 'rehab-medical-assessment',
label: 'Pengkajian Awal Medis Rehabilitasi Medis',
component: EarlyMedicalRehabList,
props: { encounter: data, type: 'early-rehab', label: 'Pengkajian Awal Medis Rehabilitasi Medis' },
},
{
value: 'function-assessment',
label: 'Asesmen Fungsi',
component: AssesmentFunctionList,
props: { encounter: data, type: 'function', label: 'Asesmen Fungsi' },
},
{ value: 'function-assessment', label: 'Asesmen Fungsi', component: AssesmentFunctionList },
{ value: 'therapy-protocol', label: 'Protokol Terapi' },
{ value: 'education-assessment', label: 'Asesmen Kebutuhan Edukasi' },
{ value: 'consent', label: 'General Consent' },
app/components/content/encounter/status.vue
+125
View File
@@ -0,0 +1,125 @@
<script setup lang="ts">
//
import { getValueLabelList as getDoctorValueLabelList } from '~/services/doctor.service'
import { getValueLabelList as getEmployeeValueLabelList } from '~/services/employee.service'
import { getValueLabelList as getUnitValueLabelList } from '~/services/unit.service'
import type { CheckInFormData, CheckOutFormData } from '~/schemas/encounter.schema'
import { CheckInSchema, CheckOutSchema } from '~/schemas/encounter.schema'
//
import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
import CheckInView from '~/components/app/encounter/check-in-view.vue'
import CheckInEntry from '~/components/app/encounter/check-in-entry.vue'
import CheckOutView from '~/components/app/encounter/check-out-view.vue'
import CheckOutEntry from '~/components/app/encounter/check-out-entry.vue'
import type { Encounter } from '~/models/encounter'
import { checkIn } from '~/services/encounter.service'
//
const props = defineProps<{
encounter: Encounter
}>()
// doctors
const doctors = await getDoctorValueLabelList({'includes': 'employee,employee-person'})
const employees = await getEmployeeValueLabelList({'includes': 'person', 'position-code': 'reg'})
const units = await getUnitValueLabelList()
// check in
const checkInValues = ref<any>({
discharge_method_code: '',
responsible_doctor_id: 0,
// registeredAt: '',
})
const checkInIsLoading = ref(false)
const checkInIsReadonly = ref(false)
const checkInDialogOpen = ref(false)
// check out
const checkOutValues = ref<any>({
dischargeMethod_code: '',
unit_id: 0,
responsibleDoctor_id: 0,
})
const checkOutIsLoading = ref(false)
const checkOutIsReadonly = ref(false)
const checkOutDialogOpen = ref(false)
function editCheckIn() {
checkInDialogOpen.value = true
}
function submitCheckIn(values: CheckInFormData) {
checkIn(props.encounter.id, values)
}
function editCheckOut() {
checkOutDialogOpen.value = true
}
function submitCheckOut(values: CheckOutFormData) {
console.log(values)
}
</script>
<template>
<div class="lg:grid grid-cols-2">
<div class="border-r lg:pe-4 xl:pe-5 mb-10">
<div class="mb-4 xl:mb-5 text-base text-center font-semibold">Informasi Masuk</div>
<CheckInView
:encounter="encounter"
:is-loading="checkInIsLoading"
:is-readonly="checkInIsReadonly"
@edit="editCheckIn"
/>
</div>
<div class="lg:ps-4 xl:ps-5">
<Separator class="lg:hidden my-4 xl:my-5" />
<div class="mb-4 xl:mb-5 text-base text-center font-semibold">Informasi Keluar</div>
<CheckOutView
:encounter="encounter"
:is-loading="checkOutIsLoading"
:is-readonly="checkOutIsReadonly"
@edit="editCheckOut"
/>
</div>
</div>
<Dialog
v-model:open="checkInDialogOpen"
title="Ubah Informasi Masuk"
size="md"
prevent-outside
>
<CheckInEntry
:schema="CheckInSchema"
:values="checkInValues"
:encounter="encounter"
:doctors="doctors"
:employees="employees"
:is-loading="checkInIsLoading"
:is-readonly="checkInIsReadonly"
@submit="submitCheckIn"
@cancel="checkInDialogOpen = false"
/>
</Dialog>
<Dialog
v-model:open="checkOutDialogOpen"
title="Ubah Informasi Keluar"
size="lg"
prevent-outside
>
<CheckOutEntry
:schema="CheckOutSchema"
:values="checkOutValues"
:encounter="encounter"
:units="units"
:doctors="doctors"
:is-loading="checkInIsLoading"
:is-readonly="checkInIsReadonly"
@submit="submitCheckOut"
@cancel="checkInDialogOpen = false"
/>
</Dialog>
</template>
app/components/content/soapi/entry.vue
+3 -2
View File
@@ -11,7 +11,7 @@ import FunctionForm from './form-function.vue'
const route = useRoute()
const type = computed(() => (route.query.tab as string) || 'early-medical-assessment')
const { mode, openForm, backToList } = useQueryMode('mode')
const { mode, goToEntry, backToList } = useQueryCRUDMode('mode')
const formMap = {
'early-medical-assessment': EarlyForm,
@@ -26,7 +26,8 @@ const ActiveForm = computed(() => formMap[type.value] || EarlyForm)
<div>
<SoapiList
v-if="mode === 'list'"
@add="openForm"
@add="goToEntry"
@edit="goToEntry"
/>
<component
app/components/content/soapi/form-function.vue
+100 -14
View File
@@ -2,14 +2,23 @@
import { z } from 'zod'
import Entry from '~/components/app/soapi/entry.vue'
import Action from '~/components/pub/my-ui/nav-footer/ba-dr-su.vue'
import ActionDialog from '~/components/pub/my-ui/nav-footer/ba-su.vue'
import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
import { FunctionSoapiSchema } from '~/schemas/soapi.schema'
import { toast } from '~/components/pub/ui/toast'
import { handleActionSave, handleActionEdit } from '~/handlers/soapi-early.handler'
const { backToList } = useQueryMode('mode')
const route = useRoute()
const isOpen = ref(false)
const data = ref([])
const isOpenProcedure = ref(false)
const isOpenDiagnose = ref(false)
const isOpenFungsional = ref(false)
const procedures = ref([])
const diagnoses = ref([])
const fungsional = ref([])
const selectedProcedure = ref<any>(null)
const selectedDiagnose = ref<any>(null)
const selectedFungsional = ref<any>(null)
const schema = FunctionSoapiSchema
const payload = ref({
encounter_id: 0,
@@ -60,29 +69,55 @@ const isLoading = reactive<DataTableLoader>({
isTableLoading: false,
})
async function getPatientList() {
async function getDiagnoses() {
isLoading.isTableLoading = true
const resp = await xfetch('/api/v1/patient')
const resp = await xfetch('/api/v1/diagnose-src')
if (resp.success) {
data.value = (resp.body as Record<string, any>).data
diagnoses.value = (resp.body as Record<string, any>).data
}
isLoading.isTableLoading = false
}
async function getProcedures() {
isLoading.isTableLoading = true
const resp = await xfetch('/api/v1/procedure-src')
if (resp.success) {
procedures.value = (resp.body as Record<string, any>).data
}
isLoading.isTableLoading = false
}
onMounted(() => {
getPatientList()
getProcedures()
getDiagnoses()
})
function handleOpen(type: string) {
console.log(type)
isOpen.value = true
function handleClick(type: string) {
if (type === 'prosedur') {
isOpenProcedure.value = true
} else if (type === 'diagnosa') {
isOpenDiagnose.value = true
} else if (type === 'fungsional') {
isOpenDiagnose.value = true
}
}
const entryRehabRef = ref()
async function actionHandler(type: string) {
console.log(type)
if (type === 'back') {
backToList()
return
}
const result = await entryRehabRef.value?.validate()
if (result?.valid) {
if (
selectedProcedure.value?.length > 0 ||
selectedDiagnose.value?.length > 0 ||
selectedFungsional.value?.length > 0
) {
result.data.procedure = selectedProcedure.value || []
result.data.diagnose = selectedDiagnose.value || []
result.data.fungsional = selectedFungsional.value || []
}
console.log('data', result.data)
handleActionSave(
{
@@ -99,7 +134,23 @@ async function actionHandler(type: string) {
}
}
const icdPreview = ref({
procedures: [],
diagnoses: [],
})
function actionDialogHandler(type: string) {
if (type === 'submit') {
icdPreview.value.procedures = selectedProcedure.value || []
icdPreview.value.diagnoses = selectedDiagnose.value || []
icdPreview.value.fungsional = selectedFungsional.value || []
}
isOpenProcedure.value = false
isOpenDiagnose.value = false
}
provide('table_data_loader', isLoading)
provide('icdPreview', icdPreview)
</script>
<template>
<Entry
@@ -107,17 +158,52 @@ provide('table_data_loader', isLoading)
v-model="model"
:schema="schema"
type="function"
@modal="handleOpen"
@click="handleClick"
/>
<div class="my-2 flex justify-end py-2">
<Action @click="actionHandler" />
</div>
<Dialog
v-model:open="isOpen"
v-model:open="isOpenProcedure"
title="Pilih Prosedur"
size="xl"
prevent-outside
>
<AppIcdMultiselectPicker :data="data" />
<AppIcdMultiselectPicker
v-model:model-value="selectedProcedure"
:data="procedures"
/>
<div class="my-2 flex justify-end py-2">
<ActionDialog @click="actionDialogHandler" />
</div>
</Dialog>
<Dialog
v-model:open="isOpenDiagnose"
title="Pilih Diagnosa"
size="xl"
prevent-outside
>
<AppIcdMultiselectPicker
v-model:model-value="selectedDiagnose"
:data="diagnoses"
/>
<div class="my-2 flex justify-end py-2">
<ActionDialog @click="actionDialogHandler" />
</div>
</Dialog>
<Dialog
v-model:open="isOpenFungsional"
title="Pilih Fungsional"
size="xl"
prevent-outside
>
<AppIcdMultiselectPicker
v-model:model-value="selectedFungsional"
:data="diagnoses"
/>
<div class="my-2 flex justify-end py-2">
<ActionDialog @click="actionDialogHandler" />
</div>
</Dialog>
</template>
app/components/content/soapi/form-rehab.vue
+57 -13
View File
@@ -2,14 +2,20 @@
import { z } from 'zod'
import Entry from '~/components/app/soapi/entry.vue'
import Action from '~/components/pub/my-ui/nav-footer/ba-dr-su.vue'
import ActionDialog from '~/components/pub/my-ui/nav-footer/ba-su.vue'
import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
import { EarlyRehabSchema } from '~/schemas/soapi.schema'
import { toast } from '~/components/pub/ui/toast'
import { handleActionSave, handleActionEdit } from '~/handlers/soapi-early.handler'
const { backToList } = useQueryMode('mode')
const route = useRoute()
const isOpen = ref(false)
const data = ref([])
const isOpenProcedure = ref(false)
const isOpenDiagnose = ref(false)
const procedures = ref([])
const diagnoses = ref([])
const selectedProcedure = ref<any>(null)
const selectedDiagnose = ref<any>(null)
const schema = EarlyRehabSchema
const payload = ref({
encounter_id: 0,
@@ -65,29 +71,46 @@ const isLoading = reactive<DataTableLoader>({
isTableLoading: false,
})
async function getPatientList() {
async function getDiagnoses() {
isLoading.isTableLoading = true
const resp = await xfetch('/api/v1/patient')
const resp = await xfetch('/api/v1/diagnose-src')
if (resp.success) {
data.value = (resp.body as Record<string, any>).data
diagnoses.value = (resp.body as Record<string, any>).data
}
isLoading.isTableLoading = false
}
async function getProcedures() {
isLoading.isTableLoading = true
const resp = await xfetch('/api/v1/procedure-src')
if (resp.success) {
procedures.value = (resp.body as Record<string, any>).data
}
isLoading.isTableLoading = false
}
onMounted(() => {
getPatientList()
getProcedures()
getDiagnoses()
})
function handleOpen(type: string) {
console.log(type)
isOpen.value = true
if (type === 'fungsional') {
isOpenDiagnose.value = true
}
}
const entryRehabRef = ref()
async function actionHandler(type: string) {
console.log(type)
if (type === 'back') {
backToList()
return
}
const result = await entryRehabRef.value?.validate()
if (result?.valid) {
if (selectedDiagnose.value?.length > 0) {
result.data.diagnose = selectedDiagnose.value || []
}
console.log('data', result.data)
handleActionSave(
{
@@ -104,7 +127,22 @@ async function actionHandler(type: string) {
}
}
const icdPreview = ref({
procedures: [],
diagnoses: [],
})
function actionDialogHandler(type: string) {
if (type === 'submit') {
icdPreview.value.procedures = selectedProcedure.value || []
icdPreview.value.diagnoses = selectedDiagnose.value || []
}
isOpenProcedure.value = false
isOpenDiagnose.value = false
}
provide('table_data_loader', isLoading)
provide('icdPreview', icdPreview)
</script>
<template>
<Entry
@@ -112,17 +150,23 @@ provide('table_data_loader', isLoading)
v-model="model"
:schema="schema"
type="early-rehab"
@modal="handleOpen"
@click="handleOpen"
/>
<div class="my-2 flex justify-end py-2">
<Action @click="actionHandler" />
</div>
<Dialog
v-model:open="isOpen"
title="Pilih Prosedur"
v-model:open="isOpenDiagnose"
title="Pilih Fungsional"
size="xl"
prevent-outside
>
<AppIcdMultiselectPicker :data="data" />
<AppIcdMultiselectPicker
v-model:model-value="selectedDiagnose"
:data="diagnoses"
/>
<div class="my-2 flex justify-end py-2">
<ActionDialog @click="actionDialogHandler" />
</div>
</Dialog>
</template>
app/components/content/soapi/form.vue
+74 -11
View File
@@ -2,14 +2,20 @@
import { z } from 'zod'
import Entry from '~/components/app/soapi/entry.vue'
import Action from '~/components/pub/my-ui/nav-footer/ba-dr-su.vue'
import ActionDialog from '~/components/pub/my-ui/nav-footer/ba-su.vue'
import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
import { EarlySchema } from '~/schemas/soapi.schema'
import { toast } from '~/components/pub/ui/toast'
import { handleActionSave, handleActionEdit } from '~/handlers/soapi-early.handler'
const { backToList } = useQueryMode('mode')
const route = useRoute()
const isOpen = ref(false)
const data = ref([])
const isOpenProcedure = ref(false)
const isOpenDiagnose = ref(false)
const procedures = ref([])
const diagnoses = ref([])
const selectedProcedure = ref<any>(null)
const selectedDiagnose = ref<any>(null)
const schema = EarlySchema
const payload = ref({
encounter_id: 0,
@@ -38,29 +44,50 @@ const isLoading = reactive<DataTableLoader>({
isTableLoading: false,
})
async function getPatientList() {
async function getDiagnoses() {
isLoading.isTableLoading = true
const resp = await xfetch('/api/v1/patient')
const resp = await xfetch('/api/v1/diagnose-src')
if (resp.success) {
data.value = (resp.body as Record<string, any>).data
diagnoses.value = (resp.body as Record<string, any>).data
}
isLoading.isTableLoading = false
}
async function getProcedures() {
isLoading.isTableLoading = true
const resp = await xfetch('/api/v1/procedure-src')
if (resp.success) {
procedures.value = (resp.body as Record<string, any>).data
}
isLoading.isTableLoading = false
}
onMounted(() => {
getPatientList()
getProcedures()
getDiagnoses()
})
function handleOpen(type: string) {
console.log(type)
isOpen.value = true
if (type === 'prosedur') {
isOpenProcedure.value = true
} else if (type === 'diagnosa') {
isOpenDiagnose.value = true
}
}
const entryRef = ref()
async function actionHandler(type: string) {
console.log(type)
if (type === 'back') {
backToList()
return
}
const result = await entryRef.value?.validate()
if (result?.valid) {
if (selectedProcedure.value?.length > 0 || selectedDiagnose.value?.length > 0) {
result.data.procedure = selectedProcedure.value || []
result.data.diagnose = selectedDiagnose.value || []
}
console.log('data', result.data)
handleActionSave(
{
@@ -77,7 +104,22 @@ async function actionHandler(type: string) {
}
}
const icdPreview = ref({
procedures: [],
diagnoses: [],
})
function actionDialogHandler(type: string) {
if (type === 'submit') {
icdPreview.value.procedures = selectedProcedure.value || []
icdPreview.value.diagnoses = selectedDiagnose.value || []
}
isOpenProcedure.value = false
isOpenDiagnose.value = false
}
provide('table_data_loader', isLoading)
provide('icdPreview', icdPreview)
</script>
<template>
<Entry
@@ -91,11 +133,32 @@ provide('table_data_loader', isLoading)
<Action @click="actionHandler" />
</div>
<Dialog
v-model:open="isOpen"
v-model:open="isOpenProcedure"
title="Pilih Prosedur"
size="xl"
prevent-outside
>
<AppIcdMultiselectPicker :data="data" />
<AppIcdMultiselectPicker
v-model:model-value="selectedProcedure"
:data="procedures"
/>
<div class="my-2 flex justify-end py-2">
<ActionDialog @click="actionDialogHandler" />
</div>
</Dialog>
<Dialog
v-model:open="isOpenDiagnose"
title="Pilih Diagnosa"
size="xl"
prevent-outside
>
<AppIcdMultiselectPicker
v-model:model-value="selectedDiagnose"
:data="diagnoses"
/>
<div class="my-2 flex justify-end py-2">
<ActionDialog @click="actionDialogHandler" />
</div>
</Dialog>
</template>
app/components/content/soapi/list.vue
+140 -18
View File
@@ -1,16 +1,41 @@
<script setup lang="ts">
import type { DataTableLoader } from '~/components/pub/my-ui/data-table/type'
import type { HeaderPrep, RefSearchNav } from '~/components/pub/my-ui/data/types'
import AssesmentFunctionList from '~/components/app/soapi/list.vue'
import type { PaginationMeta } from '~/components/pub/my-ui/pagination/pagination.type'
import { ActionEvents, type HeaderPrep, type RefSearchNav } from '~/components/pub/my-ui/data/types'
import RecordConfirmation from '~/components/pub/my-ui/confirmation/record-confirmation.vue'
import List from '~/components/app/soapi/list.vue'
import Header from '~/components/pub/my-ui/nav-header/prep.vue'
const props = defineProps<{
label: string
}>()
// Helpers
import { usePaginatedList } from '~/composables/usePaginatedList'
import { toast } from '~/components/pub/ui/toast'
import { handleActionRemove } from '~/handlers/soapi-early.handler'
// Services
import { getList, getDetail } from '~/services/soapi-early.service'
// Models
import type { Encounter } from '~/models/encounter'
// Props
interface Props {
encounter: Encounter
label: string
}
const route = useRoute()
const props = defineProps<Props>()
const emits = defineEmits(['add', 'edit'])
const data = ref([])
const encounterId = ref<number>(props?.encounter?.id || 0)
const title = ref('')
const recId = ref<number>(0)
const recAction = ref<string>('')
const recItem = ref<any>(null)
const isLoading = ref(false)
const isReadonly = ref(false)
const isRecordConfirmationOpen = ref(false)
const paginationMeta = ref<PaginationMeta>(null)
const refSearchNav: RefSearchNav = {
onClick: () => {
@@ -24,13 +49,7 @@ const refSearchNav: RefSearchNav = {
},
}
// Loading state management
const isLoading = reactive<DataTableLoader>({
isTableLoading: false,
})
const recId = ref<number>(0)
const recAction = ref<string>('')
const recItem = ref<any>(null)
const typeCode = ref('')
const hreaderPrep: HeaderPrep = {
title: props.label,
@@ -41,15 +60,86 @@ const hreaderPrep: HeaderPrep = {
},
}
async function getPatientList() {
const resp = await xfetch('/api/v1/patient')
const { recordId } = useQueryCRUDRecordId()
const { goToEntry, backToList } = useQueryCRUDMode('mode')
const type = computed(() => (route.query.tab as string) || 'early-medical-assessment')
onMounted(async () => {
await getMyList()
})
async function getMyList() {
const url = `/api/v1/soapi?type-code=${typeCode.value}?includes=encounter`
const resp = await xfetch(url)
if (resp.success) {
data.value = (resp.body as Record<string, any>).data
}
}
onMounted(() => {
getPatientList()
function handlePageChange(page: number) {
emits('pageChange', page)
}
function handleBack() {
recordId.value = ''
backToList()
}
watch(
() => type.value,
(val) => {
if (val) {
if (val === 'early-medical-assessment') {
typeCode.value = 'early-medic'
} else if (val === 'rehab-medical-assessment') {
typeCode.value = 'early-rehab'
} else if (val === 'function-assessment') {
typeCode.value = 'function'
}
getMyList()
}
},
)
watch([recId, recAction], () => {
switch (recAction.value) {
case ActionEvents.showEdit:
emits('edit')
isReadonly.value = false
router.replace({
path: route.path,
query: {
...route.query,
mode: 'entry',
'record-id': recId.value,
},
})
break
case ActionEvents.showDetail:
emits('edit')
isReadonly.value = true
router.replace({
path: route.path,
query: {
...route.query,
mode: 'entry',
'record-id': recId.value,
},
})
break
case ActionEvents.showConfirmDelete:
isRecordConfirmationOpen.value = true
break
case ActionEvents.showAdd:
recordId.value = ''
goToEntry()
emits('add')
break
}
})
provide('rec_id', recId)
@@ -59,7 +149,39 @@ provide('table_data_loader', isLoading)
</script>
<template>
<Header :prep="{ ...hreaderPrep }" :ref-search-nav="refSearchNav" />
<Header
:prep="{ ...hreaderPrep }"
:ref-search-nav="refSearchNav"
/>
<List :data="data" />
<AssesmentFunctionList :data="data" />
<PaginationView
:pagination-meta="paginationMeta"
@page-change="handlePageChange"
/>
<RecordConfirmation
v-model:open="isRecordConfirmationOpen"
action="delete"
:record="recItem"
@confirm="() => handleActionRemove(recId, getMyList, toast)"
@cancel=""
>
<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>
</template>