feat:添加日历

src/components/DetailForm/index.js

@@ -21,7 +21,7 @@ export default () => {
         // Dialog.alert({
         //     content: <pre>{JSON.stringify(values, null, 2)}</pre>,
         // })
-        console.log(values)
+        console.log("提交：",values)
         if (values.pidArray===undefined){
             values.pid='0'
         }else {
@@ -54,9 +54,9 @@ export default () => {
                 >
                     <Input onChange={console.log} placeholder='任务名称'/>
                 </Form.Item>
-                <Form.Item name='address' label='任务描述'>
+                <Form.Item name='description' label='任务描述'>
                     <TextArea
-                        placeholder='请输入地址'
+                        placeholder='请输入任务描述'
                         maxLength={100}
                         rows={2}
                         showCount

src/components/DetailSearchBar/index.js

@@ -11,12 +11,12 @@ const DetailSearchBar = (props) => {
     // const searchUpdate = location.state?.search;
     // 父子传值从搜索框传来的search
     const {search,updateSearch,pName} = props;
-    console.log("DetailSearchBar.search", search.data)
+    console.log("DetailSearchBar.search", search)
     const [tags, setTags] = useState([]);
     useEffect(() => {
         if (search && search.data) {
             Promise.all(
-                search.data.map(async (searchObj) => {
+                search.data.andList.map(async (searchObj) => {
                     console.log("DetailSearchContext.search", searchObj)
                     if (searchObj.name === "pid") {
                         return <Tag>{pName}</Tag>
@@ -60,7 +60,10 @@ const DetailSearchBar = (props) => {
                 {tags}
             </div>
             {search && <div className="CloseOutline-CloseOutline" onClick={() => {
-                updateSearch(null);
+                updateSearch({
+                    "pageSize": 20,
+                    "pageNumber": 1,
+                });
                 setTags([]);
             }}>
                 <CloseOutline style={{float: "right"}}/>

src/pages/DetailSearchContext/index.js

@@ -72,7 +72,14 @@ const DetailSearchContext = () => {
                 if (todoDay !== undefined) {
                     searchCondition.push({"name": "todoDay", "value": todoDay, "operateType": "IN"})
                 }
-                navigate("/home/listTask", {state: {search: JSON.stringify(searchCondition)}})
+                navigate("/home/listTask", {state: {search:{
+                            "pageSize": 12,
+                            "pageNumber": 1,
+                            "data":{
+                                "andList":searchCondition
+                            }
+                        }}}
+                )
             }}
             footer={
                 <Button block type='submit' color='primary' size='large'>

src/pages/Home/index.js

@@ -3,6 +3,7 @@ import Bottom from './../Bottom/index'
 import './index.css'
 import {Outlet, useLocation} from 'react-router-dom'
 import DetailSearchBar from "../../components/DetailSearchBar";
+import dayjs from "dayjs";
 
 
 const Home = () => {
@@ -12,16 +13,30 @@ const Home = () => {
     const searchUrl = location?.state?.search;
     const [pName, setName] = React.useState("");
     const [search, setSearch] = React.useState({
-        "pageSize": 12,
+        "pageSize": 20,
         "pageNumber": 1,
-        "data": searchUrl ? JSON.parse(searchUrl) : [
+        "data": searchUrl ? searchUrl : {
-            {"name": "state", "value": "8,9", "operateType": "IN"},
+            "andList": [
-            {"name": "expectedStartTime", "value": "2024-12-29T16:00:00.000Z", "operateType": ">="},
+                {"name": "state", "value": "8,9", "operateType": "IN"}
-            {"name": "expectedStartTime", "value": "2024-12-29T16:00:00.000Z", "operateType": "<="}
+                ,
-        ]
+                {
+                    "name": "expectedStartTime",
+                    "value": dayjs().add(1, "d").set('h', 0).set('m', 0).set('s', 0).set('ms', 0),
+                    "operateType": "<"
+                },
+                {
+                    "name": "expectedEndTime",
+                    "value": dayjs().set('h', 0).set('m', 0).set('s', 0).set('ms', 0),
+                    "operateType": ">"
+                }
+            ],
+            "orList": [
+                {"name": "state", "value": "10", "operateType": "="}
+            ]
+        }
     })
     const updateSearch = (values) => {
-        this.setState({search: values});
+        setSearch( values);
     };
     return (
         <div className='body'>
@@ -29,7 +44,7 @@ const Home = () => {
                              updateSearch={updateSearch}
                              pName={pName}/>
             <div style={{marginTop: "40px", marginBottom: "49px", width: "100%"}}>
-                <Outlet/>
+                <Outlet context={{"search": search}}/>
             </div>
             <Bottom/>
         </div>

src/pages/TaskCount/index.js

@@ -0,0 +1,28 @@
+import React,{useMemo} from "react";
+import {getTaskCount} from "../../utils";
+import dayjs from "dayjs";
+
+const TaskCount = (props) => {
+    let currentDay = props.currentDay;
+    const [taskCount, setTaskCount] = React.useState([]);
+    useMemo(() => {
+        if (!currentDay){
+            return;
+        }
+        console.log('currentDay',dayjs(currentDay).set('h', 0).set('m', 0).set('s', 0).set('ms', 0))
+        console.log("currentDay",currentDay?"true":"false")
+        getTaskCount(dayjs(currentDay).set('h', 0).set('m', 0).set('s', 0).set('ms', 0),
+            dayjs(currentDay).add(1, "d").set('h', 0).set('m', 0).set('s', 0).set('ms', 0))
+            .then(taskCount => {
+                console.log("taskCount",taskCount)
+            })
+    }, [props]);
+    return (
+        <div>
+            <h2>今天代办：</h2>
+            <h4>任务状态</h4>
+            <h4>优先级</h4>
+        </div>
+    )
+}
+export {TaskCount};

src/pages/ToDoCal/index.jsx

@@ -1,23 +1,27 @@
 import {Calendar} from "antd-mobile";
 import dayjs from "dayjs";
-
+import {TaskCount} from "../TaskCount";
+import React,{Fragment} from "react";
 const ToDoCal = (props) => {
-    const defaultSingle = new Date()
+    const [currentDay, setCurrentDay] = React.useState(new Date())
     const today = dayjs()
     return (
-        <Calendar
+        <Fragment>
-            selectionMode='single'
+            <Calendar
-            renderLabel={date => {
+                selectionMode='single'
-                if (dayjs(date).isSame(today, 'day')) return '今天'
+                renderLabel={date => {
-                if (date.getDay() === 0 || date.getDay() === 6) {
+                    if (dayjs(date).isSame(today, 'day')) return '今天'
-                    return '周末'
+                    if (date.getDay() === 0 || date.getDay() === 6) {
-                }
+                        return '周末'
-            }}
+                    }
-            defaultValue={defaultSingle}
+                }}
-            onChange={val => {
+                defaultValue={currentDay}
-                console.log(val)
+                onChange={val => {
-            }}
+                    setCurrentDay(val)
-        />
+                }}
+            />
+            <TaskCount currentDay={currentDay}/>
+        </Fragment>
     )
 }
 export default ToDoCal;

src/pages/ToDoList/index.js

@@ -8,7 +8,9 @@ import {
 } from 'react-beautiful-dnd'
 import {getTaskList} from "../../utils";
 import "./index.css"
-import {useLocation} from "react-router-dom";
+import {useLocation, useOutletContext} from "react-router-dom";
+import dayjs from "dayjs";
+import {DATE_TIME_FORMAT} from "../../utils/timeFormatUtil";
 
 const reorder = (
     list,
@@ -24,21 +26,30 @@ const reorder = (
 
 const ToDoList = () => {
     const [taskList, setTaskList] = useState([])
-    const [hasMore, setHasMore] = useState(true)
+    const [hasMore, setHasMore] = useState(false)
     const [pageNumber, setPageNumber] = useState(1)
+    let loading = false;
     const location = useLocation();
-    const search = location.state?.search;
+    const {search: outletSearch} = useOutletContext()
-    console.log("ToDoList.search",search)
+    const search = location.state ? location.state.search : outletSearch;
+    console.log("ToDoList.search", location, outletSearch)
+
     async function loadMore() {
-        getTaskList(pageNumber+1).then(result => {
+        if (loading) {
+            return
+        }
+        loading = true;
+        console.log("loadMore", loading)
+        getTaskList({...search, "pageNumber": pageNumber + 1}).then(result => {
             setTaskList(val => [...val, ...result.content])
-            setHasMore(result.content.length > 0)
+            setHasMore(result.page.number < result.page.totalPages)
         })
         setPageNumber(pageNumber + 1)
+        loading = false;
     }
 
     useEffect(() => {
-        getTaskList(pageNumber).then(result => {
+        getTaskList({...search, "pageNumber": pageNumber}).then(result => {
             setTaskList(result.content)
         })
     }, [])
@@ -50,19 +61,17 @@ const ToDoList = () => {
     const ref = useRef(null)
     return (
         <Fragment>
+            {/* 下拉刷新 */}
             <PullToRefresh
                 onRefresh={async () => {
-                    getTaskList(1).then(result => {
+                    getTaskList({...search, "pageNumber": 1}).then(result => {
-                        console.log("getTaskList()", result)
                         setTaskList(result.content)
                         setPageNumber(1)
-                        setHasMore(true)
+                        setHasMore(result.page.number < result.page.totalPages)
                     })
                 }}
             >
-                <List
+                <List>
-                    // header='任务清单'
-                >
                     <DragDropContext onDragEnd={onDragEnd}>
                         <Droppable droppableId='droppable'>
                             {droppableProvided => (
@@ -161,7 +170,7 @@ const ToDoList = () => {
                                                                 }}>
                                                                     <span>{item.name}</span>
                                                                     {item.expectedEndTime && <span>
-                                                                    结束时间:{item.expectedEndTime}</span>}
+                                                                    结束时间:{dayjs(item.expectedEndTime).format(DATE_TIME_FORMAT)}</span>}
                                                                 </div>}
                                                             description={item.description}
                                                         >
@@ -193,6 +202,7 @@ const ToDoList = () => {
                         </Droppable>
                     </DragDropContext>
                 </List>
+                {/*无限滚动*/}
                 <InfiniteScroll loadMore={loadMore} hasMore={hasMore}/>
             </PullToRefresh>
         </Fragment>

src/utils/index.js

@@ -24,15 +24,19 @@ export const getCurrentCity=()=>{
     return Promise.resolve(localCity)
 }
 
-export const getTaskList=  (pageNumber) => {
+export const getTaskList=  (data) => {
-    let request = encodeURI('{"pageSize":20,"pageNumber":'+pageNumber+',"data":[{"name":"tree","value":"TRUE","operateType":"TREE-FILTER"},{"name":"state","value":"8,9","operateType":"IN"}]}')
+    let request = encodeURI(JSON.stringify(data))
-    return requestUtil.get('/todo-server/search/task_message_tree?search='+request);
+    return requestUtil.get('http://localhost:8092/V2/search/task_message_tree?search='+request);
 }
 // 根据pid获取未完成的任务
 export const getTaskByPid = (pid) => {
     return requestUtil.get('/todo-server/search/task_message_tree?search=%7B%22pageSize%22%3A1000%2C%22pageNumber%22%3A1%2C%22data%22%3A%5B%7B%22name%22%3A%22pid%22%2C%22value%22%3A%22'+pid+'%22%2C%22operateType%22%3A%22%3D%22%7D%5D%7D');
 }
 
+export const getTaskCount = (startDate,endDate)=>{
+    return requestUtil.get(`http://localhost:8092/task/taskCount?startDate=${startDate}&endDate=${endDate}`);
+}
+
 export const getTaskById=  (id) => {
     let request = encodeURI(`{"data":[{"name":"id","value":"${id}","operateType":"="}]}`)
     return requestUtil.get('/todo-server/search/task_message_tree?search='+request);

src/utils/requestUtil.js

@@ -3,7 +3,7 @@ import axios from "axios";
 export const requestUtil = axios.create({
     baseURL: 'http://www.huaruyu.com/',
     timeout: 1000,
-    headers: {'Authorization': 'Bearer eyJraWQiOiIwNzdlYzBjMi1iZDQwLTRjODktOGE5OC05OTI1YmZkNzJlZjAiLCJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJpc3MiOiJzaGl4aWFvaHVhIiwic3ViIjoie1wiaWRcIjpcIjM2OTg0Nzc3MTAxODAzNTIwXCIsXCJuaWNrbmFtZVwiOlwi5biI5pmT5Y2OXCIsXCJ1c2VybmFtZVwiOlwic2hpeGlhb2h1YVwifSJ9.WiNGZYbWlIdu3WL7ujtlKsGa42IblW93SG-Mf4jDOuECWrDHFNA0gJBKUQkWKQfpWWRaIzcBmUC78WkIM5yFIHiB2_wBXyywHyjVCWBYC3sTJghtWogLB9ceR69eNfCZanm_ZlrcIEWJ9rqCk-hmMEuWwIk9xJ-M4hFGHkoAr_ftYJiBkGqgKpXOeVE_Tish6SqYZtN-V6Dcnyny3k7T6lG1jzXGyhokEzg_0B5hYpRvvA-GJx14Q1RO6Sv3vgMFOX63bhKX3L7KCSwLO2NJ5GkFHXqcDCf_-pnbiHUtP1JrchzXGWpI_Blrlf_65CdrMWuyVSGtDJ6_Z-Ef4Uq_tQ'}
+    headers: {'Authorization': 'Bearer eyJraWQiOiJmNWUyYjA5MC04OGFlLTQ0OWUtOGVjYi02OGU2MDc3NjZjYmYiLCJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJpc3MiOiJzaGl4aWFvaHVhIiwic3ViIjoie1wiaWRcIjpcIjM2OTg0Nzc3MTAxODAzNTIwXCIsXCJuaWNrbmFtZVwiOlwi5biI5pmT5Y2OXCIsXCJ1c2VybmFtZVwiOlwic2hpeGlhb2h1YVwifSJ9.czZQu3TQauvyZ0Qy_6rVjK-5iH9Jh4NKrOL2-sNpfmsM9T_5rmDuOrLZ8OCblMHIh9rU9PIIml4Sq14jTr0iiSyHxRyzxtQShIKfxaJKOKNrNhrsGQWv7AD067CJ-kiSP4qeTFIS9SIjPlWJq29l5PieEdU381MXpZS2GJ2_0kr5rKQbHcr4GkSSPY0FhTrTKtnvxqB32Bs3BDPncjwV_0w_YKrQaNl5vmJ7jZIEs_cc7CgLBzOA9001xeENGsAG8yxVGYrDA4fSu2BsUdx-YtWnv5apCFVRoMfY82_I5Yjg9CWWpY6zHcgDoyNCQ-nBPgCcVbMJFlooG8ipt1SGKQ'}
 });
 // 添加响应拦截器
 requestUtil.interceptors.response.use(function (response) {

src/utils/timeFormatUtil.js

@@ -0,0 +1,4 @@
+const DATE_FORMAT = "YYYY-MM-DD"
+const DATE_TIME_FORMAT = "YYYY-MM-DD HH:mm:ss"
+
+export {DATE_TIME_FORMAT,DATE_FORMAT}