From 3aef247fa94fcd27fda6a4d918db1b6a47b198ac Mon Sep 17 00:00:00 2001
From: MartialBE <me@xiao5.info>
Date: Sun, 31 Dec 2023 02:48:18 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20ui:=20change=20the=20precision?=
 =?UTF-8?q?=20and=20color=20scheme=20of=20the=20bar=20card.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../component/StatisticalBarChart.js          | 41 ++++++++++++++++++-
 web/src/views/Dashboard/index.js              |  2 +-
 2 files changed, 41 insertions(+), 2 deletions(-)

diff --git a/web/src/views/Dashboard/component/StatisticalBarChart.js b/web/src/views/Dashboard/component/StatisticalBarChart.js
index 380da442..8b0f8a19 100644
--- a/web/src/views/Dashboard/component/StatisticalBarChart.js
+++ b/web/src/views/Dashboard/component/StatisticalBarChart.js
@@ -10,6 +10,7 @@ import Chart from 'react-apexcharts';
 import SkeletonTotalGrowthBarChart from 'ui-component/cards/Skeleton/TotalGrowthBarChart';
 import MainCard from 'ui-component/cards/MainCard';
 import { gridSpacing } from 'store/constant';
+import { Box } from '@mui/material';
 
 // ==============================|| DASHBOARD DEFAULT - TOTAL GROWTH BAR CHART ||============================== //
 
@@ -32,7 +33,22 @@ const StatisticalBarChart = ({ isLoading, chartDatas }) => {
               </Grid>
             </Grid>
             <Grid item xs={12}>
-              <Chart {...chartData} />
+              {chartData.series ? (
+                <Chart {...chartData} />
+              ) : (
+                <Box
+                  sx={{
+                    minHeight: '490px',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center'
+                  }}
+                >
+                  <Typography variant="h3" color={'#697586'}>
+                    暂无数据
+                  </Typography>
+                </Box>
+              )}
             </Grid>
           </Grid>
         </MainCard>
@@ -51,6 +67,29 @@ const chartData = {
   height: 480,
   type: 'bar',
   options: {
+    colors: [
+      '#008FFB',
+      '#00E396',
+      '#FEB019',
+      '#FF4560',
+      '#775DD0',
+      '#55efc4',
+      '#81ecec',
+      '#74b9ff',
+      '#a29bfe',
+      '#00b894',
+      '#00cec9',
+      '#0984e3',
+      '#6c5ce7',
+      '#ffeaa7',
+      '#fab1a0',
+      '#ff7675',
+      '#fd79a8',
+      '#fdcb6e',
+      '#e17055',
+      '#d63031',
+      '#e84393'
+    ],
     chart: {
       id: 'bar-chart',
       stacked: true,
diff --git a/web/src/views/Dashboard/index.js b/web/src/views/Dashboard/index.js
index 71e81270..0c2062f2 100644
--- a/web/src/views/Dashboard/index.js
+++ b/web/src/views/Dashboard/index.js
@@ -160,7 +160,7 @@ function getBarDataGroup(data) {
     }
     const index = lastSevenDays.indexOf(item.Day);
     if (index !== -1) {
-      map.get(item.ModelName).data[index] = calculateQuota(item.Quota);
+      map.get(item.ModelName).data[index] = calculateQuota(item.Quota, 3);
     }
   }