feat: analytic

2025-08-08 17:59:39 +07:00
parent 7beee4c3a1
commit 67b747f0ff
34 changed files with 1227 additions and 2834 deletions
@@ -0,0 +1,98 @@
+'use client'
+
+// MUI Imports
+import Grid from '@mui/material/Grid2'
+
+// Component Imports
+import DistributedBarChartOrder from '@views/dashboards/crm/DistributedBarChartOrder'
+import EarningReportsWithTabs from '@views/dashboards/crm/EarningReportsWithTabs'
+
+// Server Action Imports
+import Loading from '../../../../../../components/layout/shared/Loading'
+import { usePaymentAnalytics } from '../../../../../../services/queries/analytics'
+import { PaymentDataItem } from '../../../../../../types/services/analytic'
+
+const DashboardPayment = () => {
+  const { data, isLoading } = usePaymentAnalytics()
+
+  const transformSalesData = (data: PaymentDataItem[]) => {
+    return [
+      {
+        type: 'payment',
+        avatarIcon: 'tabler-package',
+        date: data.map((d: PaymentDataItem) => d.payment_method_name),
+        series: [{ data: data.map((d: PaymentDataItem) => d.total_amount) }]
+      }
+    ]
+  }
+
+  if (isLoading) return <Loading />
+
+  return (
+    <Grid container spacing={6}>
+      <Grid size={{ xs: 12, sm: 6, md: 4, lg: 3 }}>
+        <DistributedBarChartOrder
+          isLoading={isLoading}
+          title='Total Orders'
+          value={data?.summary.total_orders as number}
+          avatarIcon={'tabler-shopping-cart'}
+          avatarColor='primary'
+          avatarSkin='light'
+        />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, md: 4, lg: 3 }}>
+        <DistributedBarChartOrder
+          isLoading={isLoading}
+          title='Total Payment'
+          value={data?.summary.total_payments as number}
+          avatarIcon={'tabler-package'}
+          avatarColor='info'
+          avatarSkin='light'
+        />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, md: 4, lg: 3 }}>
+        <DistributedBarChartOrder
+          isLoading={isLoading}
+          title='Average Orders'
+          value={data?.summary.average_order_value as number}
+          avatarIcon={'tabler-trending-up'}
+          avatarColor='warning'
+          avatarSkin='light'
+        />
+      </Grid>
+      <Grid size={{ xs: 12, sm: 6, md: 4, lg: 3 }}>
+        <DistributedBarChartOrder
+          isLoading={isLoading}
+          title='Total Amount'
+          value={data?.summary.total_amount as number}
+          avatarIcon={'tabler-currency-dollar'}
+          avatarColor='success'
+          avatarSkin='light'
+        />
+      </Grid>
+      <Grid size={{ xs: 12, lg: 12 }}>
+        <EarningReportsWithTabs data={transformSalesData(data!.data)} />
+      </Grid>
+      {/* <Grid size={{ xs: 12, md: 6, lg: 4 }}>
+        <RadarSalesChart />
+      </Grid>
+      <Grid size={{ xs: 12, md: 6, lg: 4 }}>
+        <SalesByCountries />
+      </Grid>
+      <Grid size={{ xs: 12, md: 6, lg: 4 }}>
+        <ProjectStatus />
+      </Grid>
+      <Grid size={{ xs: 12, md: 6, lg: 4 }}>
+        <ActiveProjects />
+      </Grid>
+      <Grid size={{ xs: 12, md: 6 }}>
+        <LastTransaction />
+      </Grid>
+      <Grid size={{ xs: 12, md: 6 }}>
+        <ActivityTimeline />
+      </Grid> */}
+    </Grid>
+  )
+}
+
+export default DashboardPayment