fixes
This commit is contained in:
Muhammad Shahzad
parent
cff094174e
commit
a924bd603e
@ -73,132 +73,237 @@ const getStatusColor = (status) => {
|
||||
return 'grey'; // Use Vuetify's grey color for any other status
|
||||
}
|
||||
};
|
||||
const resolveStatusVariant = status => {
|
||||
if (status === 1)
|
||||
return {
|
||||
color: 'primary',
|
||||
text: 'Current',
|
||||
}
|
||||
else if (status === 2)
|
||||
return {
|
||||
color: 'success',
|
||||
text: 'Professional',
|
||||
}
|
||||
else if (status === 3)
|
||||
return {
|
||||
color: 'error',
|
||||
text: 'Rejected',
|
||||
}
|
||||
else if (status === 4)
|
||||
return {
|
||||
color: 'warning',
|
||||
text: 'Resigned',
|
||||
}
|
||||
else
|
||||
return {
|
||||
color: 'info',
|
||||
text: 'Applied',
|
||||
}
|
||||
}
|
||||
const headers = [
|
||||
{
|
||||
title: '',
|
||||
key: 'id',
|
||||
sortable: false,
|
||||
},
|
||||
{
|
||||
title: 'Name',
|
||||
key: 'name',
|
||||
},
|
||||
{
|
||||
title: 'Date',
|
||||
key: 'date',
|
||||
},
|
||||
{
|
||||
title: 'Status',
|
||||
key: 'status',
|
||||
},
|
||||
]
|
||||
const prescriptionIndex = ref([]);
|
||||
const prescriptionItem = ref(-1)
|
||||
const prescriptionDialog = ref(false)
|
||||
const showDetail = item => {
|
||||
// console.log("id",item);
|
||||
prescriptionIndex.value = item
|
||||
// console.log("index",prescriptionIndex.value);
|
||||
// prescriptionItem.value = { ...item }
|
||||
prescriptionDialog.value = true
|
||||
}
|
||||
const close = () => {
|
||||
prescriptionDialog.value = false
|
||||
prescriptionIndex.value = -1
|
||||
prescriptionItem.value = { ...defaultItem.value }
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<template v-if="itemsPrescriptions">
|
||||
<VExpansionPanels variant="accordion" v-if="prescription">
|
||||
<VExpansionPanel v-for="item in itemsPrescriptions" :key="item">
|
||||
<VExpansionPanelTitle collapse-icon="ri-arrow-down-s-line" expand-icon="ri-arrow-right-s-line">
|
||||
<p class=""><b> {{ item.name }}</b>
|
||||
<br />
|
||||
<div class=" pt-2">#{{ appointmentId }} By {{ item.doctor }}</div>
|
||||
<div class=" pt-2">{{ item.date }}</div>
|
||||
</p>
|
||||
|
||||
|
||||
<v-row>
|
||||
<v-col cols="12" md="12" v-if="itemsPrescriptions">
|
||||
<v-card title="Prescriptions" v-if="prescription">
|
||||
<VCardText >
|
||||
<VRow>
|
||||
<VCol
|
||||
cols="12"
|
||||
offset-md="8"
|
||||
md="4"
|
||||
>
|
||||
<VTextField
|
||||
v-model="search"
|
||||
label="Search"
|
||||
placeholder="Search ..."
|
||||
append-inner-icon="ri-search-line"
|
||||
single-line
|
||||
hide-details
|
||||
dense
|
||||
outlined
|
||||
/>
|
||||
</VCol>
|
||||
</VRow>
|
||||
</VCardText>
|
||||
<VDataTable
|
||||
:headers="headers"
|
||||
:items="itemsPrescriptions"
|
||||
:search="search"
|
||||
:items-per-page="5"
|
||||
class="text-no-wrap"
|
||||
>
|
||||
<!-- <template #item.id="{ item }">
|
||||
{{ item.id }}
|
||||
</template> -->
|
||||
<!-- full name -->
|
||||
<!-- status -->
|
||||
<template #item.status="{ item }">
|
||||
<VChip
|
||||
:color="getStatusColor(item.status)"
|
||||
density="comfortable"
|
||||
>
|
||||
{{ getStatusColor(item.status) }}
|
||||
</VChip>
|
||||
</template>
|
||||
|
||||
</v-row>
|
||||
<span class="v-expansion-panel-title__icon badge text-warning"
|
||||
v-if="item.status == null">Pending</span>
|
||||
<span class="v-expansion-panel-title__icon badge" v-else>
|
||||
<v-chip :color="getStatusColor(item.status)" label size="small" variant="text">
|
||||
{{ item.status }}
|
||||
</v-chip></span>
|
||||
</VExpansionPanelTitle>
|
||||
<VExpansionPanelText class="pt-0">
|
||||
<!-- Actions -->
|
||||
<template #item.id="{ item }">
|
||||
<div class="d-flex gap-1">
|
||||
<IconBtn
|
||||
size="small"
|
||||
@click="showDetail(item)"
|
||||
>
|
||||
<VIcon icon="ri-time-line" />
|
||||
</IconBtn>
|
||||
|
||||
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Brand:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p>{{ item.brand }}</p>
|
||||
</div>
|
||||
</template>
|
||||
</VDataTable>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row class='mt-1'>
|
||||
<VDialog
|
||||
v-model="prescriptionDialog"
|
||||
max-width="600px"
|
||||
>
|
||||
<VCard :title=prescriptionIndex.name>
|
||||
<DialogCloseBtn
|
||||
variant="text"
|
||||
size="default"
|
||||
@click="prescriptionDialog = false"
|
||||
/>
|
||||
<VCardText>
|
||||
<v-row class='mt-0'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>From:</b></p>
|
||||
<p class='heading mb-0'><b>Brand:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p>{{ item.from }}</p>
|
||||
<p>{{ prescriptionIndex.brand }}</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Dosage:</b></p>
|
||||
<p class='heading mb-0'><b>From:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p>{{ item.dosage }}</p>
|
||||
<p>{{ prescriptionIndex.from }}</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Quantity:</b></p>
|
||||
<p class='heading mb-0'><b>Dosage:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p>{{ item.quantity }}</p>
|
||||
<p>{{ prescriptionIndex.dosage }}</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Direction Quantity:</b></p>
|
||||
<p class='heading mb-0 '><b>Quantity:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p>{{ prescriptionIndex.quantity }}</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading mb-0'><b>Direction Quantity:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="8" sm="6">
|
||||
<p>{{ item.direction_quantity }}</p>
|
||||
<p>{{ prescriptionIndex.direction_quantity }}</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Direction One:</b></p>
|
||||
<p class='heading mb-0'><b>Direction One:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="8" sm="6">
|
||||
<p>{{ item.direction_one }} </p>
|
||||
<p>{{ prescriptionIndex.direction_one }} </p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Direction Two:</b></p>
|
||||
<p class='heading mb-0'><b>Direction Two:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="8" sm="6">
|
||||
<p>{{ item.direction_two }} </p>
|
||||
<p>{{ prescriptionIndex.direction_two }} </p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Refill Quantity:</b></p>
|
||||
<p class='heading mb-0'><b>Refill Quantity:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="8" sm="6">
|
||||
<p>{{ item.refill_quantity }}</p>
|
||||
<p>{{ prescriptionIndex.refill_quantity }}</p>
|
||||
</v-col>
|
||||
|
||||
</v-row>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Status:</b></p>
|
||||
<p class='heading mb-0'><b>Status:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="8" sm="6">
|
||||
<p v-if="item.status == null" class="text-warning">Pending</p>
|
||||
<p v-else>{{ item.status }}</p>
|
||||
<p v-if="prescriptionIndex.status == null" class="text-warning">Pending</p>
|
||||
<p v-else>{{ prescriptionIndex.status }}</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row class='mt-1'>
|
||||
<VDivider></VDivider>
|
||||
<v-row class='mt-1 pb-0'>
|
||||
<v-col cols="12" md="4" sm="6">
|
||||
<p class='heading'><b>Comments:</b></p>
|
||||
<p class='heading mb-0'><b>Comments:</b></p>
|
||||
</v-col>
|
||||
<v-col cols="12" md="8" sm="8">
|
||||
<p>{{ item.comments }} </p>
|
||||
<p>{{ prescriptionIndex.comments }} </p>
|
||||
</v-col>
|
||||
|
||||
</v-row>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</VExpansionPanelText>
|
||||
</VExpansionPanel>
|
||||
</VExpansionPanels>
|
||||
</template>
|
||||
<template v-else>
|
||||
<VCard>
|
||||
<VAlert border="start" color="#003152" variant="tonal">
|
||||
<div class="text-center">No data found</div>
|
||||
</VAlert>
|
||||
|
||||
</VCardText>
|
||||
</VCard>
|
||||
</template>
|
||||
|
||||
</VDialog>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
@ -35,9 +35,9 @@ const refVForm = ref(null);
|
||||
|
||||
// Headers
|
||||
const headers = [
|
||||
{ title: 'Appointment Id', key: 'id' },
|
||||
// { title: 'Appointment Id', key: 'id' },
|
||||
{ title: 'Patient', key: 'patient_name' },
|
||||
{ key: 'appointment_date', sortable: false, title: 'Date' },
|
||||
// { key: 'appointment_date', sortable: false, title: 'Date' },
|
||||
{ key: 'start_time', title: 'Start Time' },
|
||||
{ key: 'end_time', title: 'End Time' },
|
||||
{ key: 'duration', title: 'Duration' },
|
||||
@ -101,10 +101,27 @@ onMounted(async () => {
|
||||
|
||||
});
|
||||
onUnmounted(() => {});
|
||||
const historyDetail = (item) => {
|
||||
console.log('item', item)
|
||||
const historyDetail = (item, value) => {
|
||||
console.log('item',item.id ,value)
|
||||
if(value == 'notes')
|
||||
router.push('/admin/patient/meeting-details/' + route.params.id + '/' + item.id);
|
||||
if(value == 'prescription')
|
||||
router.push('/admin/patient/meeting/prescription/' + route.params.id + '/' + item.id);
|
||||
}
|
||||
const menusVariant = [
|
||||
'primary'
|
||||
];
|
||||
const options = [
|
||||
{
|
||||
title: 'Notes',
|
||||
key: 'notes',
|
||||
},
|
||||
{
|
||||
title: 'Prescription',
|
||||
key: 'prescription',
|
||||
},
|
||||
|
||||
]
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -138,10 +155,36 @@ const historyDetail = (item) => {
|
||||
<template #item.duration="{ item }">{{ item.duration }}</template>
|
||||
<!-- Actions -->
|
||||
<template #item.actions="{ item }">
|
||||
<div class="d-flex gap-1">
|
||||
<div class="demo-space-x">
|
||||
<VMenu
|
||||
v-for="menu in menusVariant"
|
||||
:key="menu"
|
||||
>
|
||||
<template #activator="{ props }">
|
||||
<VBtn
|
||||
:color="menu"
|
||||
v-bind="props"
|
||||
|
||||
>
|
||||
Detail
|
||||
</VBtn>
|
||||
</template>
|
||||
|
||||
<v-list>
|
||||
<v-list-item
|
||||
v-for="opt in options"
|
||||
:key="opt.value"
|
||||
@click="historyDetail(item, opt.key)"
|
||||
>
|
||||
{{ opt.title }}
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</VMenu>
|
||||
</div>
|
||||
<!-- <div class="d-flex gap-1">
|
||||
<VBtn class="text-capitalize text-white" @click="historyDetail(item)"> Detail
|
||||
</VBtn>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-card>
|
||||
|
||||
@ -72,10 +72,10 @@ const formatPhoneNumber = () => {
|
||||
};
|
||||
// headers
|
||||
const headers = [
|
||||
{
|
||||
title: 'ID',
|
||||
key: 'id',
|
||||
},
|
||||
// {
|
||||
// title: 'ID',
|
||||
// key: 'id',
|
||||
// },
|
||||
{
|
||||
title: 'NAME',
|
||||
key: 'name',
|
||||
@ -352,7 +352,7 @@ function changeFormat(dateFormat) {
|
||||
|
||||
<VCol cols="12" sm="6" md="12">
|
||||
<VTextField
|
||||
v-model="editedItem.dob"
|
||||
v-model="editedItem.dob" type="date"
|
||||
label="Date Of Birth"
|
||||
/>
|
||||
</VCol>
|
||||
|
||||
@ -53,6 +53,11 @@ export const routes = [
|
||||
name: 'admin-patient-meeitng-details',
|
||||
component: () => import('@/pages/patients/meeting-details.vue'),
|
||||
},
|
||||
{
|
||||
path: '/admin/patient/meeting/prescription/:patient_id/:id',
|
||||
name: 'admin-patient-meeitng-prescription',
|
||||
component: () => import('@/pages/pages/patient-meetings/prescription.vue'),
|
||||
},
|
||||
{
|
||||
path: '/admin/providers',
|
||||
name: 'admin-providers',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user