Files
ntspi-app/resources/js/Components/PersonCards/ClientFacultyWorkerCard.vue
T
2024-09-19 16:06:49 +05:00

69 lines
1.6 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div class="flex flex-col rounded-xl p-4 md:p-6 bg-white border border-gray-200 dark:bg-slate-900 dark:border-gray-700">
<div class="flex items-center gap-y-4 gap-x-4 flex-wrap">
<img @click="toggler = !toggler" loading="lazy" class="rounded-xl md:w-[150px]" :src="'/storage/' + worker.photo" alt="Image Description">
<div class="grow">
<Link :href="route('client.person.show', worker.id)" class="font-medium text-gray-800 hover:text-gray-500 underline">
{{ worker.position }}: {{ worker.name }}
</Link>
<p v-if="worker.academicTitle !== null" class="text-xs text-gray-500 mt-2">
Ученая степень: {{ worker.academicTitle }}
</p>
<p class="text-xs text-gray-500 mt-2">
Контактный телефон: {{ worker.contactPhone }}
</p>
<p class="text-xs text-gray-500 mt-2">
Электронная почта: {{ worker.contactEmail }}
</p>
<p class="text-xs text-gray-500 mt-2">
Кабинет: 207В
</p>
</div>
</div>
</div>
<FsLightbox class="" :toggler="toggler" :sources="['/storage/' + worker.photo]"/>
</template>
<script>
import {Head, Link} from "@inertiajs/vue3";
import ClientFooterDown from "@/Components/ClientFooterDown.vue";
import MainNavbar from "@/Navbars/MainNavbar.vue";
import FsLightbox from "fslightbox-vue/v3";
export default {
name: "ClientFacultyWorkerCard",
data() {
return {
toggler: false,
}
},
props: {
worker: {
type: Object,
},
},
components: {
ClientFooterDown,
MainNavbar,
Link,
FsLightbox,
Head
},
}
</script>
<style scoped>
</style>