initial commit

2025-08-05 12:35:40 +07:00
commit fffa2ead5c
1069 changed files with 118056 additions and 0 deletions
@@ -0,0 +1,76 @@
+// MUI Imports
+import Card from '@mui/material/Card'
+import CardHeader from '@mui/material/CardHeader'
+import CardContent from '@mui/material/CardContent'
+import Typography from '@mui/material/Typography'
+
+// Third-party Imports
+import classnames from 'classnames'
+
+// Components Imports
+import OptionMenu from '@core/components/option-menu'
+import CustomAvatar from '@core/components/mui/Avatar'
+
+// Types Imports
+import type { ThemeColor } from '@core/types'
+
+type dataTypes = {
+  title: string
+  value: string
+  change: number
+  icon: string
+  color: ThemeColor
+}
+
+const deliveryData: dataTypes[] = [
+  { title: 'Packages in transit', value: '10k', change: 25.8, icon: 'tabler-box', color: 'primary' },
+  { title: 'Packages out for delivery', value: '5k', change: 4.3, icon: 'tabler-truck', color: 'info' },
+  { title: 'Packages delivered', value: '15k', change: -12.5, icon: 'tabler-circle-check', color: 'success' },
+  { title: 'Delivery success rate', value: '95%', change: 35.6, icon: 'tabler-percentage', color: 'warning' },
+  { title: 'Average delivery time', value: '2.5 Days', change: -2.15, icon: 'tabler-clock', color: 'secondary' },
+  { title: 'Customer satisfaction', value: '4.5/5', change: 5.7, icon: 'tabler-users', color: 'error' }
+]
+
+const LogisticsDeliveryPerformance = () => {
+  return (
+    <Card>
+      <CardHeader
+        title='Delivery Performance'
+        subheader='12% increase in this month'
+        action={<OptionMenu options={['Select All', 'Refresh', 'Share']} />}
+      />
+      <CardContent className='flex flex-col gap-[30px]'>
+        {deliveryData.map((data, index) => (
+          <div key={index} className='flex items-center gap-4'>
+            <CustomAvatar skin='light' color={data.color} variant='rounded' size={38}>
+              <i className={classnames(data.icon, 'text-[26px]')} />
+            </CustomAvatar>
+            <div className='flex justify-between items-center gap-4 is-full'>
+              <div>
+                <Typography color='text.primary' className='line-clamp-1'>
+                  {data.title}
+                </Typography>
+                <div className='flex items-center gap-1'>
+                  <i
+                    className={classnames(
+                      'text-xl',
+                      data.change > 0 ? 'tabler-chevron-up text-success' : 'tabler-chevron-down text-error'
+                    )}
+                  />
+                  <Typography variant='body2' color={data.change > 0 ? 'success.main' : 'error.main'}>
+                    {data.change}%
+                  </Typography>
+                </div>
+              </div>
+              <Typography color='text.primary' className='font-medium'>
+                {data.value}
+              </Typography>
+            </div>
+          </div>
+        ))}
+      </CardContent>
+    </Card>
+  )
+}
+
+export default LogisticsDeliveryPerformance