112 lines
2.8 KiB
Vue
112 lines
2.8 KiB
Vue
<script setup>
|
|
import { 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 props = defineProps({
|
|
notesData: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
})
|
|
|
|
|
|
|
|
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 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>
|
|
|
|
|
|
<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 props.notesData.notes" :key="index" v-if="props.notesData.notes.length>0">
|
|
<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" v-if="p_note.note_type=='Notes'">
|
|
{{p_note.note}}
|
|
</span>
|
|
<span class="app-timeline-title" v-if="p_note.note_type=='file'">
|
|
<img :src="p_note.note"/>
|
|
</span>
|
|
|
|
<span class="app-timeline-meta">{{ formatDateDate(p_note.created_at) }}</span>
|
|
<!-- <span></span> -->
|
|
</div>
|
|
|
|
<!-- 👉 Content -->
|
|
<div class="app-timeline-text mb-1">
|
|
<span>{{ p_note.provider_name }}</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>
|