import React from 'react' import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout' import { Head } from '@inertiajs/react' import { formatIDR } from '@/utils' import { Chart as ChartJS, CategoryScale, LinearScale, BarElement, Title, Tooltip, ArcElement, Legend, } from 'chart.js' import { Bar, Doughnut } from 'react-chartjs-2' import moment from 'moment' ChartJS.register( CategoryScale, LinearScale, BarElement, Title, Tooltip, ArcElement, Legend ) export default function Dashboard(props) { const { total_sale_today, total_item_today, total_item_price_today, total_customer, sale_days, list_favorite_product, list_customer, favorite_categories, month, total_sale_month, targets, target, } = props const options = { responsive: true, scales: { x: {}, x2: { display: false, }, }, } const data = { labels: sale_days.map((item) => moment(item.date).format('DD MMM YYYY') ), datasets: [ { label: 'Penjualan', data: sale_days.map((item) => item.stotal), backgroundColor: ['rgba(255, 205, 86, 1)'], }, { label: 'Target', data: targets, backgroundColor: ['rgba(200, 30, 30, 1)'], xAxisID: 'x2', }, ], } const names = favorite_categories.map( (c) => `${c.product.category.name} - ${c.qty}` ) const count = favorite_categories.map((c) => c.qty) const dataDounat = { labels: names, datasets: [ { label: '# Jumlah', data: count, backgroundColor: [ 'rgba(255, 99, 132, 1)', 'rgba(54, 162, 235, 1)', 'rgba(255, 206, 86, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', 'rgba(255, 159, 64, 1)', '#b91c1c', '#c2410c', '#b45309', '#15803d', '#047857', '#0f766e', '#0369a1', '#1d4ed8', '#6d28d9', '#a21caf', ], borderColor: [ 'rgba(255, 99, 132, 1)', 'rgba(54, 162, 235, 1)', 'rgba(255, 206, 86, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', 'rgba(255, 159, 64, 1)', '#b91c1c', '#c2410c', '#b45309', '#15803d', '#047857', '#0f766e', '#0369a1', '#1d4ed8', '#6d28d9', '#a21caf', ], borderWidth: 1, }, ], } const optionsDounat = { responsive: true, plugins: { legend: { display: true, position: 'right', }, }, } return (

Target Penjualan
Bulan {month}

Rp. {formatIDR(target)}

Total Penjualan
Bulan {month}

Rp. {formatIDR(total_sale_month)}

Total Penjualan
Hari Ini

Rp. {formatIDR(total_item_price_today)}

Jumlah Produk Terjual
Hari Ini

{total_item_today}

{/* Chart : jumlah transaksi 7 hari terkahir */}

Penjualan 7 Hari Terakhir

Kategori Produk yang laku Terjual pada Bulan{' '} {month}

{/* list produk paling laris dengan jumlah penjualan */}

Produk Terlaris

{list_favorite_product.map((product) => ( ))}

Kode	Produk	Jumlah
{product.product.code}	{product.product.name}	{formatIDR(product.qty)}

{/* list customer yang bertransaksi dengan total transaksi */}

Pelanggan Hari Ini

{list_customer.map((customer) => ( ))}

Pelanggan	Total Belanja
{customer.customer !== null ? customer.customer.name : 'Umum'}	Rp. {formatIDR(customer.stotal)}

) }