assistant-todo-mobile/src/pages/TaskCount/index.js

import React, {Fragment, useContext, useEffect, useMemo} from "react";
import {getTaskCount} from "../../utils";
import dayjs from "dayjs";
import {DATE_FORMAT, dayStartUtcFormat, nextDayStartUtcFormat} from "../../utils/timeFormatUtil";
import {getDictionary} from "../../utils/dictUtil";
import {Divider, Tag} from "antd-mobile";
import {useNavigate} from "react-router-dom";
import {MyRootContext, UPDATE_SEARCH} from "../../components/MyRootContext";


const TaskCount = (props) => {
    const {currentDay, taskCount, today, backToToday, currentMonth} = props;
    const navigate = useNavigate();
    const [stateMap, setStateMap] = React.useState(new Map);
    const [priorityMap, setPriorityMap] = React.useState(new Map);
    const {dispatch} = useContext(MyRootContext);

    const todoDayDetail = () => {
        let andSearchModel = {}
        let orSearchModel = {andSearchModel}
        if (currentDay) {
            andSearchModel.andList = [{
                "name": "expectedStartTime",
                "value": nextDayStartUtcFormat(currentDay),
                "operateType": "<"
            }, {
                "name": "expectedEndTime",
                "value": dayStartUtcFormat(currentDay),
                "operateType": ">"
            }]
            andSearchModel.orSearchModel = {
                "andList": [
                    {
                        "name": "expectedStartTime",
                        "value": nextDayStartUtcFormat(currentDay),
                        "operateType": "<"
                    }, {
                        "name": "expectedStartTime",
                        "value": dayStartUtcFormat(currentDay),
                        "operateType": ">"
                    }, {
                        "name": "expectedEndTime",
                        "operateType": "NULL"
                    }
                ], orSearchModel: {
                    "andList": [
                        {
                            "name": "expectedEndTime",
                            "value": nextDayStartUtcFormat(currentDay),
                            "operateType": "<"
                        }, {
                            "name": "expectedEndTime",
                            "value": dayStartUtcFormat(currentDay),
                            "operateType": ">"
                        }, {
                            "name": "expectedStartTime",
                            "operateType": "NULL"
                        }
                    ]
                }
            }
        }
        console.log({orSearchModel})
        dispatch({
            type: UPDATE_SEARCH, search: {
                "pageSize": 12,
                "pageNumber": 1,
                "data": {
                    orSearchModel
                }
            }
        })
        navigate("/home/listTask")
    }
    useEffect(() => {
        getDictionary("2").then(state => {
            setStateMap(state)
        })
        getDictionary("1").then(priority => {
            setPriorityMap(priority)
        })
    }, [])

    return (
        <div style={{margin: "20px"}}>
            <h2>TODO日{currentDay && dayjs(currentDay).format(DATE_FORMAT)}代办：
                {currentDay && <a onClick={todoDayDetail}>详情</a>}
                {!dayjs(currentMonth).isSame(today, 'months') &&
                    <Fragment><Divider direction='vertical'/><a onClick={() => backToToday()}>回到当月</a></Fragment>}
            </h2>
            {taskCount?.filter(taskC => dayjs(taskC.todoDay).isSame(dayjs(currentDay), 'date'))?.map(taskC => {
                return <Fragment>
                    <h3>任务状态</h3>
                    {
                        Object.keys(taskC.state).map(ob => {
                            return <div style={{marginBottom: "20px"}} key={ob}><Tag color={
                                stateMap.get(ob).jsonValue ? stateMap.get(ob).jsonValue.color : "default"
                            }>{stateMap.get(ob).itemName}</Tag> 共
                                {taskC.state[ob]} 项代办;</div>;
                        })}
                    <h3>优先级</h3>
                    {
                        Object.keys(taskC.priority).map(ob => {
                            console.log("stateMap.get(ob).jsonValue?.color", priorityMap.get(ob))
                            return <div style={{marginBottom: "20px"}} key={ob}><Tag
                                color={priorityMap.get(ob).jsonValue.color}>{priorityMap.get(ob).itemName}</Tag> 共
                                {taskC.priority[ob]} 项代办;</div>;
                        })
                    }
                </Fragment>
            })
            }
        </div>
    )
}
export {TaskCount};