Files
radicall/resources/js/Client/Pages/Dashboard/Dashboard.vue
T

99 lines
3.8 KiB
Vue

<script setup>
import ClientLayout from '../../layouts/ClientLayout.vue';
import ActivitiesWidget from '../../components/dashboard/ActivitiesWidget.vue';
import ActivitiesChart from '../../components/dashboard/ActivitiesChart.vue';
import TableGeneric from '../../components/ui/TableGeneric.vue';
import UiButton from '../../components/ui/UiButton.vue';
import EyeSvg from '../../components/svg/eye.svg';
import UiCard from '../../components/ui/UiCard.vue';
import RequestCard from '../../components/dashboard/RequestCard.vue';
import { onMounted, ref } from 'vue';
import { Link, usePage } from '@inertiajs/inertia-vue3';
import FastRequestModal from '../../components/dashboard/FastRequestModal.vue';
import PaymentResultModal from '../../components/dashboard/PaymentResultModal.vue';
import { useFastRequestStore } from '../../store/FastRequest';
import { modalities } from '../../data/fastRequestOptions';
import { caseColumns } from '../../data/casesTableColumns';
const fastRequestStore = useFastRequestStore();
const fastRequestModalVisible = ref(false);
const openFastRequestModal = (type) => {
fastRequestModalVisible.value = true;
fastRequestStore.requestType = type;
}
const paymentResultVisible = ref(false);
const paymentResult = ref(null);
onMounted(() => {
const result = usePage().props.value.flash?.payment_result;
if (result) {
paymentResult.value = result;
paymentResultVisible.value = true;
}
})
defineProps({
user: {
type: Object,
required: true
},
cases: {
type: Object,
required: true
},
stats: {
type: Object,
required: true
}
})
</script>
<template>
<ClientLayout>
<ActivitiesWidget :stats="stats" />
<UiCard title="ثبت آنی درخواست جدید" variant="default" class="mt-4">
<p class="w-full flex items-center justify-start font-[400] text-[11px]">فقط چند قدم ساده برای ثبت درخواست کافیه.</p>
<div class="w-full h-[179px] grid grid-cols-5 gap-3 justify-start pt-[10px]">
<RequestCard
v-for="modality in modalities"
:key="modality.code"
:value="modality.code"
:title="modality.title"
:icon="modality.icon"
severity="primary"
@click="openFastRequestModal(modality.code)"
/>
</div>
</UiCard>
<UiCard title="آخرین کیس‌های در انتظار بررسی" variant="default" class="mt-4">
<TableGeneric
class="bg-white !rounded-2xl"
:data="cases.data"
customStyle="!text-[11px] !font-normal"
:searchable="false"
:columns="caseColumns"
:selectable="false"
:pagination="null"
:model-value="[]"
>
<template #column-actions="{ data }" class="">
<div class="flex items-center justify-end">
<Link :href="`/dashboard/cases/${data.id}`"
class="text-primary-500 bg-complement-100 flex items-center justify-end p-1.5 rounded-md"
>
<EyeSvg class="w-4 h-4 text-primary-500" />
</Link>
</div>
</template>
</TableGeneric>
</UiCard>
<UiCard title="خلاصه عملکرد شما" variant="default" class="mt-4">
<ActivitiesChart />
</UiCard>
<fast-request-modal v-model:visible="fastRequestModalVisible"></fast-request-modal>
<payment-result-modal v-model:visible="paymentResultVisible" :result="paymentResult"></payment-result-modal>
</ClientLayout>
</template>