initial commit

2025-08-05 12:35:40 +07:00
commit fffa2ead5c
1069 changed files with 118056 additions and 0 deletions
@@ -0,0 +1,95 @@
+'use client'
+
+// Next Imports
+import dynamic from 'next/dynamic'
+
+// MUI Imports
+import Card from '@mui/material/Card'
+import Typography from '@mui/material/Typography'
+import CardContent from '@mui/material/CardContent'
+import CardHeader from '@mui/material/CardHeader'
+import { useTheme } from '@mui/material/styles'
+
+// Third-party Imports
+import type { ApexOptions } from 'apexcharts'
+
+// Styled Component Imports
+const AppReactApexCharts = dynamic(() => import('@/libs/styles/AppReactApexCharts'))
+
+const series = [{ data: [40, 20, 65, 50] }]
+
+const LineAreaDailySalesChart = () => {
+  // Hook
+  const theme = useTheme()
+
+  // Vars
+  const options: ApexOptions = {
+    chart: {
+      parentHeightOffset: 0,
+      toolbar: { show: false },
+      sparkline: { enabled: true }
+    },
+    tooltip: { enabled: false },
+    dataLabels: { enabled: false },
+    stroke: {
+      width: 2,
+      curve: 'smooth'
+    },
+    grid: {
+      show: false,
+      padding: {
+        bottom: 20
+      }
+    },
+    fill: {
+      type: 'gradient',
+      gradient: {
+        opacityTo: 0,
+        opacityFrom: 1,
+        shadeIntensity: 1,
+        stops: [0, 100],
+        colorStops: [
+          [
+            {
+              offset: 0,
+              opacity: 0.4,
+              color: theme.palette.success.main
+            },
+            {
+              opacity: 0,
+              offset: 100,
+              color: 'var(--mui-palette-background-paper)'
+            }
+          ]
+        ]
+      }
+    },
+    theme: {
+      monochrome: {
+        enabled: true,
+        shadeTo: 'light',
+        shadeIntensity: 1,
+        color: theme.palette.success.main
+      }
+    },
+    xaxis: {
+      labels: { show: false },
+      axisTicks: { show: false },
+      axisBorder: { show: false }
+    },
+    yaxis: { show: false }
+  }
+
+  return (
+    <Card className='pbe-6'>
+      <CardHeader title='Average Daily Sales' className='pbe-3' />
+      <CardContent>
+        <Typography>Total Sales This Month</Typography>
+        <Typography variant='h4'>$28,450</Typography>
+      </CardContent>
+      <AppReactApexCharts type='area' height={90} width='100%' series={series} options={options} />
+    </Card>
+  )
+}
+
+export default LineAreaDailySalesChart