From 2a741906916ebf21dbf4eeb70b98bbceef61a7fa Mon Sep 17 00:00:00 2001
From: sijinhui <sijinhui@qq.com>
Date: Wed, 21 Feb 2024 13:30:14 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E6=9C=80=E5=A4=A7=E6=97=A5?=
 =?UTF-8?q?=E6=9C=9Fbug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../(admin)/admin/usage-by-model-chart.tsx    | 37 ++++++++++++++-----
 1 file changed, 27 insertions(+), 10 deletions(-)

diff --git a/app/app/(admin)/admin/usage-by-model-chart.tsx b/app/app/(admin)/admin/usage-by-model-chart.tsx
index 03bcbf574..a6b5edd0d 100644
--- a/app/app/(admin)/admin/usage-by-model-chart.tsx
+++ b/app/app/(admin)/admin/usage-by-model-chart.tsx
@@ -1,6 +1,12 @@
 "use client";
 
-import React, { useEffect, useState, Dispatch, SetStateAction } from "react";
+import React, {
+  useEffect,
+  useState,
+  useCallback,
+  Dispatch,
+  SetStateAction,
+} from "react";
 
 import * as echarts from "echarts";
 import { DatePicker } from "@tremor/react";
@@ -17,24 +23,35 @@ interface ComponentProps {
 const maxDate = new Date();
 
 function DateSelectComponent({ currentDate, setCurrentDate }: ComponentProps) {
+  const changeCurrentDate = useCallback(
+    (d: Date) => {
+      const new_d = new Date(
+        d.getFullYear(),
+        d.getMonth(),
+        d.getDate(),
+        0,
+        0,
+        0,
+      );
+      if (new_d <= maxDate) {
+        setCurrentDate(d);
+      }
+    },
+    [setCurrentDate],
+  );
   // 增加键盘监听修改日期
   useEffect(() => {
     const keydownEvent = (e: KeyboardEvent) => {
       switch (e.key) {
         case "ArrowLeft":
           if (currentDate) {
-            setCurrentDate(subDays(currentDate, 1));
+            changeCurrentDate(subDays(currentDate, 1));
           }
-          // console.log(currentDate)
           break;
         case "ArrowRight":
           if (currentDate) {
-            const temp_date = addDays(currentDate, 1);
-            if (temp_date <= maxDate) {
-              setCurrentDate(temp_date);
-            }
+            changeCurrentDate(addDays(currentDate, 1));
           }
-          // console.log(currentDate)
           break;
         default:
           break;
@@ -44,7 +61,7 @@ function DateSelectComponent({ currentDate, setCurrentDate }: ComponentProps) {
     return () => {
       document.removeEventListener("keydown", keydownEvent);
     };
-  }, [currentDate, setCurrentDate]);
+  }, [changeCurrentDate, currentDate]);
 
   return (
     <DatePicker
@@ -52,7 +69,7 @@ function DateSelectComponent({ currentDate, setCurrentDate }: ComponentProps) {
       value={currentDate}
       locale={zhCN}
       defaultValue={new Date()}
-      onValueChange={(d) => d && setCurrentDate(d)}
+      onValueChange={(d) => d && changeCurrentDate(d)}
       maxDate={maxDate}
     />
   );