151 lines
4.3 KiB
Vue
151 lines
4.3 KiB
Vue
<script setup>
|
|
import { onMounted, ref } from 'vue';
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
import { useStore } from 'vuex';
|
|
const store = useStore();
|
|
const router = useRouter();
|
|
const route = useRoute();
|
|
const patientId = route.params.patient_id;
|
|
const appointmentId = route.params.id;
|
|
const notes = ref([]);
|
|
|
|
const loadHistoryNotes = async () => {
|
|
console.log('Calling loadHistoryNotes');
|
|
store.dispatch('updateIsLoading', true);
|
|
console.log('Dispatching getHistoryPatientNotes action with', { patient_id: patientId, appointment_id: appointmentId });
|
|
// try {
|
|
// console.log('Dispatching getHistoryPatientNotes action with', { patient_id: patientId, appointment_id: appointmentId });
|
|
await store.dispatch('getHistoryPatientNotes', {
|
|
patient_id: patientId,
|
|
appointment_id: appointmentId,
|
|
});
|
|
let notesData = store.getters.getPatientNotes;
|
|
if (Array.isArray(notesData)) {
|
|
console.log('Fetched notesData:', notesData);
|
|
const formattedNotes = notesData
|
|
.filter(data => data.note_type === 'Notes')
|
|
.map(data => ({
|
|
file_url: data.file_url,
|
|
note: data.note,
|
|
doctor: data.telemedPro.name,
|
|
date: formatDateDate(data.created_at),
|
|
id: data.id,
|
|
}))
|
|
.sort((a, b) => b.id - a.id);
|
|
notes.value = formattedNotes;
|
|
} else {
|
|
console.error("getPatientNotes did not return an array", notesData);
|
|
}
|
|
// } catch (error) {
|
|
// console.error("Error loading patient notes:", error);
|
|
// } finally {
|
|
// store.dispatch('updateIsLoading', false);
|
|
// }
|
|
};
|
|
|
|
onMounted(() => {
|
|
loadHistoryNotes();
|
|
});
|
|
|
|
const formatDateDate = (date) => {
|
|
const messageDate = new Date(date);
|
|
const options = {
|
|
year: 'numeric',
|
|
month: 'long',
|
|
day: 'numeric',
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
};
|
|
return messageDate.toLocaleDateString('en-US', options).replace(/\//g, '-');
|
|
};
|
|
const breadcrums = [
|
|
{
|
|
title: 'Meeting',
|
|
disabled: false,
|
|
to: '/admin/patient/meetings/'+patientId,
|
|
},
|
|
{
|
|
title: 'Notes',
|
|
disabled: false,
|
|
}
|
|
|
|
];
|
|
const downloadFile = (fileUrl) => {
|
|
const link = document.createElement('a');
|
|
link.href = fileUrl;
|
|
link.download = 'noteFile.png';
|
|
document.body.appendChild(link);
|
|
link.click();
|
|
document.body.removeChild(link);
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<v-breadcrumbs :items="breadcrums" class="text-primary pt-0 pb-0 mb-5">
|
|
<template v-slot:divider style="padding-top:0px; padding-bottom:0px">
|
|
>
|
|
</template>
|
|
</v-breadcrumbs>
|
|
|
|
<VCard title="Notes">
|
|
<VCardText>
|
|
<VTimeline
|
|
side="end"
|
|
align="start"
|
|
line-inset="8"
|
|
truncate-line="both"
|
|
density="compact"
|
|
>
|
|
|
|
<!-- SECTION Timeline Item: Flight -->
|
|
<template v-for="(p_note, index) in notes" :key="index">
|
|
<VTimelineItem
|
|
dot-color="primary"
|
|
size="x-small"
|
|
>
|
|
<!-- 👉 Header -->
|
|
<div class="d-flex justify-space-between align-center gap-2 flex-wrap">
|
|
<span class="app-timeline-title">
|
|
{{p_note.note}}
|
|
</span>
|
|
<span class="app-timeline-meta">{{ p_note.date }}</span>
|
|
<!-- <span></span> -->
|
|
</div>
|
|
|
|
<!-- 👉 Content -->
|
|
<div class="app-timeline-text mb-1">
|
|
<span>{{ p_note.doctor }}</span>
|
|
<VIcon
|
|
size="20"
|
|
icon="tabler-arrow-right"
|
|
class="mx-2 flip-in-rtl"
|
|
/>
|
|
<!-- <span>Heathrow Airport, London</span> -->
|
|
</div>
|
|
|
|
<!-- <p class="app-timeline-meta mb-2">
|
|
6:30 AM
|
|
</p> -->
|
|
|
|
<!-- <div class="app-timeline-text d-flex align-center gap-2">
|
|
<div>
|
|
<VImg
|
|
:src="pdf"
|
|
:width="22"
|
|
/>
|
|
</div>
|
|
|
|
<span>booking-card.pdf</span>
|
|
</div> -->
|
|
</VTimelineItem>
|
|
</template>
|
|
|
|
|
|
<!-- !SECTION -->
|
|
|
|
<!-- !SECTION -->
|
|
</VTimeline>
|
|
</VCardText>
|
|
</VCard>
|
|
</template>
|