From 6cca06d4be863e52adbe5f344a2099a2481d1eb8 Mon Sep 17 00:00:00 2001
From: shixiaohua <shi_xiaohua@qq.com>
Date: Fri, 31 May 2024 14:00:16 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E8=AE=BE=E7=BD=AE=E6=9F=A5=E8=AF=A2?=
 =?UTF-8?q?=E8=8C=83=E5=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/ui/task/calendar/CalShow.tsx | 52 +++++++++++++++++++++++++-------
 1 file changed, 41 insertions(+), 11 deletions(-)

diff --git a/src/ui/task/calendar/CalShow.tsx b/src/ui/task/calendar/CalShow.tsx
index 6f3ccbc..66db200 100644
--- a/src/ui/task/calendar/CalShow.tsx
+++ b/src/ui/task/calendar/CalShow.tsx
@@ -25,7 +25,7 @@ const localizer = dayjsLocalizer(dayjs)
 const DragAndDropCalendar = withDragAndDrop(Calendar)
 const CalShow: React.FC = () => {
     dayjs.locale('zh-cn')
-    const [view, setView] = useState<View>('month');
+    const [view, setView] = useState<View>('week');
     const [date, setDate] = useState<Date>(new Date());
     const clickRef = useRef<number|undefined|null>(null)
     // 展示在页面的任务,默认获取当前月的信息。
@@ -36,6 +36,10 @@ const CalShow: React.FC = () => {
     const [itemId, setItemId] = useState(-1);
     const [expectedStartTime, setExpectedStartTime] = useState<Dayjs>();
     const [expectedEndTime, setExpectedEndTime] = useState<Dayjs>();
+    const [range, setRange] = useState<{start: Date; end: Date}>({
+        start: dayjs(date).startOf('week').toDate(),
+        end: dayjs(date).endOf('week').toDate()
+    });
 
     let state: string = useContext(LocalContext).taskState
     const handleViewChange = (newView: View) => {
@@ -56,12 +60,13 @@ const CalShow: React.FC = () => {
                 operateType: "TREE"
             });
         }
-        searchList.push({name: "expectedStartTime", value: dayjs(newDate).startOf('month'), operateType: ">="})
-        searchList.push({name: 'expectedStartTime', value: dayjs(newDate).endOf('month'), operateType: "<="})
+        searchList.push({name: "expectedStartTime", value: range.start, operateType: ">="})
+        searchList.push({name: 'expectedStartTime', value: range.end, operateType: "<="})
         loadData(searchList);
     };
 
     useEffect(() => {
+        console.log("CalShow:useEffect:range",range)
         const searchListE = []
         if (pid != null) {
             searchListE.push({name: "pid", value: pid, operateType: "="}, {
@@ -70,13 +75,8 @@ const CalShow: React.FC = () => {
                 operateType: "TREE"
             });
         }
-        if (view === 'month') {
-            searchListE.push({name: 'expectedStartTime', value: dayjs(date).startOf('month'), operateType: ">="})
-            searchListE.push({name: 'expectedStartTime', value: dayjs(date).endOf('month'), operateType: "<="})
-        } else {
-            searchListE.push({name: 'expectedStartTime', value: dayjs(date).startOf('week'), operateType: ">="})
-            searchListE.push({name: 'expectedStartTime', value: dayjs(date).endOf('week'), operateType: "<="})
-        }
+        searchListE.push({name: 'expectedStartTime', value: range.start, operateType: ">="})
+        searchListE.push({name: 'expectedStartTime', value: range.end, operateType: "<="})
         loadData(searchListE);
         /**
          * What Is This?
@@ -243,6 +243,36 @@ const CalShow: React.FC = () => {
         }),
         [setEvents]
     )
+    const rangeChange = (rangeLet: Date[]|{ start: Date; end: Date })=>{
+        console.log("rangeChange:",rangeLet)
+        // view 为天的时候类型为数组，index:0为当天
+        if (view==="day"&&Array.isArray(rangeLet)) {
+            if (range.start.valueOf()>rangeLet[0].valueOf()){
+                setRange({...range,start:rangeLet[0]})
+            }else if (range.end.valueOf()<rangeLet[0].valueOf()){
+                setRange({...range,end:rangeLet[0]})
+            }
+        }
+        //      为周的时候类型为数组，周一到周日七天
+        if (view==="week"&&Array.isArray(rangeLet)){
+            if (range.start.valueOf()>rangeLet[0].valueOf()){
+                setRange({...range,start:rangeLet[0]})
+            }
+            if (range.end.valueOf()<rangeLet[6].valueOf()){
+                setRange({...range,end:rangeLet[6]})
+            }
+        }
+        //      为周的时候类型为对象
+        if (view==="month"&& rangeLet && !Array.isArray(rangeLet)){
+            if (range.start.valueOf()>rangeLet.start.valueOf()){
+                setRange({...range,start:rangeLet.start})
+            }
+            if (range.end.valueOf()<rangeLet.end.valueOf()){
+                setRange({...range,end:rangeLet.end})
+            }
+        }
+
+    }
     return <div className="App" style={{height: '90vh'}}>
         {open&&<DetailModelForm operationId={operationId} description={description} open={open} haveButton={false}
                          itemId={itemId} pid={pid?Number(pid):0}
@@ -259,7 +289,7 @@ const CalShow: React.FC = () => {
             view={view}
             // 界面改变
             onView={handleViewChange}
-            // onRangeChange={rangeChange}
+            onRangeChange={rangeChange}
             // 时间
             date={date}
             // 条目信息改变