feat: implement media download functionality and enhance case handling in reports

resources/js/Client/Pages/Dashboard/Reports/Index.vue

@@ -2,41 +2,69 @@
 import ClientLayout from '../../../layouts/ClientLayout.vue';
 import TableGeneric from '../../../components/ui/TableGeneric.vue';
 import UiCard from '../../../components/ui/UiCard.vue';
+import UiButton from '../../../components/ui/UiButton.vue';
 import EyeSvg from '../../../components/svg/eye.svg';
 import { Link } from '@inertiajs/inertia-vue3';
+import { Inertia } from '@inertiajs/inertia';
 import { reportColumns } from '../../../data/reportsTableColumns';
+import { caseColumns } from '../../../data/casesTableColumns';
 
 defineProps({
     reports: {
         type: Object,
         required: true
+    },
+    pendingCases: {
+        type: Object,
+        default: null
     }
 })
 </script>
 
 <template>
     <ClientLayout>
-        <UiCard title="گزارشات" variant="default">
-            <TableGeneric
-                class="bg-white !rounded-2xl"
-                :data="reports.data"
-                customStyle="!text-[11px] !font-normal"
-                :searchable="false"
-                :columns="reportColumns"
-                :selectable="false"
-                :pagination="reports.meta"
-                :model-value="[]"
-            >
-                <template #column-actions="{ data }">
-                    <div class="flex items-center justify-end">
-                            <Link :href="`/dashboard/cases/${data.document?.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>
+        <div class="flex flex-col gap-4">
+            <UiCard v-if="pendingCases" title="پرونده‌های در انتظار گزارش" variant="default">
+                <TableGeneric
+                    class="bg-white !rounded-2xl"
+                    :data="pendingCases.data"
+                    customStyle="!text-[11px] !font-normal"
+                    :searchable="false"
+                    :columns="caseColumns"
+                    :selectable="false"
+                    :pagination="null"
+                    :model-value="[]"
+                >
+                    <template #column-actions="{ data }">
+                        <div class="flex items-center justify-end">
+                            <UiButton label="ثبت گزارش" severity="success" size="small" @click="Inertia.visit(`/dashboard/cases/${data.id}`)" />
+                        </div>
+                    </template>
+                </TableGeneric>
+            </UiCard>
+
+            <UiCard title="گزارشات" variant="default">
+                <TableGeneric
+                    class="bg-white !rounded-2xl"
+                    :data="reports.data"
+                    customStyle="!text-[11px] !font-normal"
+                    :searchable="false"
+                    :columns="reportColumns"
+                    :selectable="false"
+                    :pagination="reports.meta"
+                    :model-value="[]"
+                >
+                    <template #column-actions="{ data }">
+                        <div class="flex items-center justify-end">
+                                <Link :href="`/dashboard/cases/${data.document?.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>
+        </div>
     </ClientLayout>
 </template>