From 577571cf9fc97e004e00d67113bb56242b3aaf60 Mon Sep 17 00:00:00 2001
From: lonewolfyx <877085893@qq.com>
Date: Mon, 13 Jan 2025 15:55:05 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BC=98=E5=8C=96=E4=B8=AD=E6=8E=A7?=
 =?UTF-8?q?=E5=8F=B0=E9=A6=96=E9=A1=B5=E7=9A=84=E4=BB=8A=E6=97=A5=E5=B0=8F?=
 =?UTF-8?q?=E6=97=B6=E8=B6=8B=E5=8A=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/RegistVisitApi/RegistVisitApi.js      |   8 +
 .../IndexComponents/TodayVisitTrend.vue       | 161 ++++++++++--------
 2 files changed, 95 insertions(+), 74 deletions(-)

diff --git a/src/api/RegistVisitApi/RegistVisitApi.js b/src/api/RegistVisitApi/RegistVisitApi.js
index 802084b..5a80627 100644
--- a/src/api/RegistVisitApi/RegistVisitApi.js
+++ b/src/api/RegistVisitApi/RegistVisitApi.js
@@ -132,4 +132,12 @@ export const getIdCardVisitHistory = (data) => {
         data,
         isEncrypt: false
     })
+}
+
+// 获取当天小时来访趋势
+export const getVisitHourTrend = () => {
+    return request({
+        method: 'get',
+        url: '/visiting/visit/stat_hour',
+    })
 }
\ No newline at end of file
diff --git a/src/components/IndexComponents/TodayVisitTrend.vue b/src/components/IndexComponents/TodayVisitTrend.vue
index b1a0643..4891aef 100644
--- a/src/components/IndexComponents/TodayVisitTrend.vue
+++ b/src/components/IndexComponents/TodayVisitTrend.vue
@@ -9,16 +9,11 @@
 <script setup>
 import Vechart from 'vue-echarts'
 import * as echarts from 'echarts/core';
-import {
-    TitleComponent,
-    ToolboxComponent,
-    TooltipComponent,
-    GridComponent,
-    LegendComponent
-} from 'echarts/components';
-import { LineChart } from 'echarts/charts';
-import { UniversalTransition } from 'echarts/features';
-import { CanvasRenderer } from 'echarts/renderers';
+import {GridComponent, LegendComponent, TitleComponent, ToolboxComponent, TooltipComponent} from 'echarts/components';
+import {LineChart} from 'echarts/charts';
+import {UniversalTransition} from 'echarts/features';
+import {CanvasRenderer} from 'echarts/renderers';
+import {getVisitHourTrend} from '@/api/RegistVisitApi/RegistVisitApi.js';
 
 
 defineOptions({
@@ -37,73 +32,91 @@ echarts.use([
 ]);
 
 
-const times = Array.from({length: 24}, (_, i) => `${i}:00`)
-const data = Array.from({length: 24}, (_, i) => Math.floor(Math.random() * 100))
-const options = {
-    tooltip: {
-        trigger: 'axis',
-        axisPointer: {
-            type: 'cross',
-            crossStyle: {
-                color: '#999'
+const options = ref({})
+
+onMounted(() => {
+    getData()
+})
+
+const getData = async () => {
+    const res = await getVisitHourTrend()
+    const data = res.data.map(item => {
+        return {
+            ...item,
+            name: item.hour,
+            value: item.count
+        }
+    })
+    setChartOptions(data)
+}
+
+const setChartOptions = (data) => {
+    options.value = {
+        tooltip: {
+            trigger: 'axis',
+            axisPointer: {
+                type: 'cross',
+                crossStyle: {
+                    color: '#999'
+                }
             }
-        }
-    },
-    grid: {
-        top: '10%',
-        left: '3%',
-        right: '3%',
-        bottom: '10%',
-    },
-    xAxis: {
-        type: 'category',
-        data: times,
-        axisTick: {
-            show: false
         },
-        axisLine: {
-            show: false
-        }
-    },
-    yAxis: {
-        type: 'value'
-    },
-    series: [
-        {
-            name: 'Line 1',
-            type: 'line',
-            stack: 'Total',
-            smooth: true,
-            lineStyle: {
-                width: 0
+        grid: {
+            top: '10%',
+            left: '3%',
+            right: '3%',
+            bottom: '10%',
+        },
+        xAxis: {
+            type: 'category',
+            data: times,
+            axisTick: {
+                show: false
             },
-            showSymbol: false,
-            areaStyle: {
-                opacity: 0.8,
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                    {
-                        offset: 0,
-                        color: '#004564'
-                    },
-                    {
-                        offset: 1,
-                        color: '#00a0df'
-                    }
-                ])
-            },
-            emphasis: {
-                focus: 'series'
-            },
-            // name: '今日来访',
-            data: data,
-            // type: 'line',
-            // smooth: true
-            // barWidth: '35%',
-            // itemStyle: {
-            //     color: '#004564'
-            // }
-        }
-    ]
+            axisLine: {
+                show: false
+            }
+        },
+        yAxis: {
+            type: 'value'
+        },
+        series: [
+            {
+                name: '今日来访',
+                type: 'line',
+                stack: 'Total',
+                smooth: true,
+                lineStyle: {
+                    width: 0
+                },
+                showSymbol: false,
+                areaStyle: {
+                    opacity: 0.8,
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                        {
+                            offset: 0,
+                            color: '#004564'
+                        },
+                        {
+                            offset: 1,
+                            color: '#00a0df'
+                        }
+                    ])
+                },
+                emphasis: {
+                    focus: 'series'
+                },
+                // name: '今日来访',
+                data: data,
+                // type: 'line',
+                // smooth: true
+                // barWidth: '35%',
+                // itemStyle: {
+                //     color: '#004564'
+                // }
+            }
+        ]
+    }
 }
 </script>