huayu-web
/
assistant-todo-mobile
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:cal添加列表

This commit is contained in:
1708-huayu 2025-02-05 19:10:17 +08:00
parent 0f7dd9095f
commit 51924e5031
8 changed files with 324 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/DetailForm/index.js
View File

@ -5,7 +5,7 @@ import {
Button,
Dialog,
TextArea,
Space, Tag, Radio, Checkbox
Space, Tag, Radio
} from 'antd-mobile'
import ParentTask from "../ParentTask";
import "./index.css"
@ -143,9 +143,9 @@ const DetailForm = () => {
values.pid = '0'
}
if (currentPath === "addTask") {
addTask(values).then(values => {
addTask(values).then(res => {
Dialog.show({
content: `添加任务${values}成功`,
content: `添加任务${res}成功`,
closeOnAction: true,
actions: [
[
@ -161,11 +161,15 @@ const DetailForm = () => {
text: '创建下一条',
onClick: () => {
// 清空值
console.log("1",{pName})
form.resetFields();
console.log("reset",values)
form.setFieldValue("pidArray", values.pidArray);
form.setFieldValue("pid",values.pid)
setPidArray(values.pidArray)
window.scrollTo(0, 0);
setRemovePid(values.pid);
console.log("2",{pName})
}
},
],

2
src/components/ParentTask/index.js
View File

@ -83,7 +83,7 @@ const ParentTask = (props) => {
console.log({value})
if (value && value.length > 0) {
changeSelectValue(value)
changeTaskId(value[value.length - 1])
changeTaskId(value)
}
}}
>

217
src/components/TaskItemList/index.js Normal file
View File

@ -0,0 +1,217 @@
import React, {Fragment, useCallback, useEffect, useRef, useState} from "react";
import {Dialog, InfiniteScroll, List, PullToRefresh, SwipeAction} from "antd-mobile";
import {deleteTaskById, getTaskList, updateTaskStateById} from "../../utils";
import dayjs from "dayjs";
import {DATE_TIME_FORMAT_SIMPLE} from "../../utils/timeFormatUtil";
import {useNavigate} from "react-router-dom";
import {getDictionary} from "../../utils/dictUtil";
const TaskItemList = (prop)=>{
let search = prop.search.value
console.log("TaskItemList",search)
const [taskList, setTaskList] = useState([])
const [hasMore, setHasMore] = useState(true)
const [pageNumber, setPageNumber] = useState(1)
const [priorityMap, setPriorityMap] = useState([]);
const [stateMap, setStateMap] = useState([])
const navigate = useNavigate();
let loading = false;
const loadMore = async () => {
console.log("loading:", pageNumber, loading)
if (loading || !search) {
return
}
loading = true;
console.log("loadMore", loading)
const taskRes = await getTaskList({...search, "pageNumber": pageNumber});
console.log({taskRes})
setTaskList([...taskList, ...taskRes.content])
if (taskRes.page.number < taskRes.page.totalPages) {
setHasMore(true)
setPageNumber(pageNumber + 1)
} else {
setHasMore(false)
setPageNumber(1)
}
loading = false;
}
/**
* 根据查询条件筛选本地列表，不触发接口?
*/
const localRefresh = () => {
console.log("refresh",loading,!search)
if (loading||!search){
return
}
const refreshSearch = {...search, "pageNumber": 1};
if (pageNumber>1){
refreshSearch.pageSize = 20*pageNumber;
}
loading = true;
getTaskList({...search, "pageNumber": 1}).then(result => {
setTaskList(result.content)
if (result.page.number < result.page.totalPages) {
setHasMore(true)
setPageNumber(pageNumber + 1)
} else {
setHasMore(false)
setPageNumber(1)
}
})
loading = false;
}
useEffect(() => {
getDictionary("2").then(res => {
setStateMap(res)
})
getDictionary("1").then(res => {
setPriorityMap(res)
})
}, [])
useEffect(() => {
localRefresh()
}, [search])
// 创建一个用于存储当前激活的 SwipeAction ref 的变量
const activeSwipeActionRef = useRef(null);
// 定义一个回调函数来更新当前激活的 SwipeAction ref
const setActiveSwipeAction = useCallback((ref) => {
if (activeSwipeActionRef.current && ref !== activeSwipeActionRef.current) {
activeSwipeActionRef.current.close();
}else {
activeSwipeActionRef.current = ref;
}
}, []);
// 定义一个函数来关闭当前激活的 SwipeAction
const closeActiveSwipeAction = useCallback(() => {
console.log({activeSwipeActionRef})
if (activeSwipeActionRef.current) {
activeSwipeActionRef.current.close();
}
}, []);
return (
<Fragment>
{/* 下拉刷新 */}
<PullToRefresh
onRefresh={localRefresh}
>
<List>
{taskList.map((item) => (
<SwipeAction
key={item.id+'SwipeAction'}
ref={(ref) => setActiveSwipeAction(ref)}
closeOnAction={true}
closeOnTouchOutside={false}
rightActions={[
{
key: `delete${item.id}`,
text: '删除',
color: 'danger',
onClick: async () => {
const result = await Dialog.confirm({
content: '确定要删除吗？',
})
if (result){
await deleteTaskById(item.id)
}
// 关闭当前激活的 SwipeAction
closeActiveSwipeAction();
localRefresh()
},
},
{
key: `close${item.id}`,
text: '关闭',
color: 'warning',
onClick: () => {
Dialog.confirm({
content: '确定要关闭吗？',
onConfirm: () => {
updateTaskStateById('6', item.id).then(res => {
// 关闭当前激活的 SwipeAction
closeActiveSwipeAction();
localRefresh()
})
},
})
},
},
{
key: `update${item.id}`,
text: '修改',
color: 'primary',
onClick: () => {
// 关闭当前激活的 SwipeAction
closeActiveSwipeAction();
// 跳转
navigate(`/detail/updateTask?id=${item.id}`)
},
},
{
key: `complete${item.id}`,
text: '完成',
color: 'success',
onClick: () => {
Dialog.confirm({
content: '确定要完成吗？',
onConfirm: () => {
updateTaskStateById('7', item.id).then(res => {
// 关闭当前激活的 SwipeAction
closeActiveSwipeAction();
localRefresh()
})
},
})
},
},
]}
>
<List.Item
key={item.id}
onClick={
() => {
console.log("click/detail")
navigate(`/detail/selectTask?id=${item.id}`)
}
}
title={
<div style={{
display: "flex",
justifyContent: "space-between",
alignItems: "center",
flexDirection: "row",
flexWrap: "nowrap",
fontSize: "large",
color: "black"
}}>
{(priorityMap.get(item.priority)?.jsonValue?.color) ?
(<span
style={{color: priorityMap.get(item.priority)?.jsonValue?.color}}>{item.name}</span>) : (
<span>{item.name}</span>)}
{item.expectedStartTime && (stateMap.get(item.state)?.jsonValue?.color ?
(<span style={{color: stateMap.get(item.state)?.jsonValue?.color}}>
{dayjs(item.expectedStartTime).format(DATE_TIME_FORMAT_SIMPLE)}</span>) :
(
<span>{dayjs(item.expectedStartTime).format(DATE_TIME_FORMAT_SIMPLE)}</span>))
}
</div>}
description={item.description}
>
</List.Item>
</SwipeAction>
))}
</List>
{/*无限滚动*/}
<InfiniteScroll loadMore={loadMore} hasMore={hasMore}/>
</PullToRefresh>
</Fragment>
)
}
export default TaskItemList;

8
src/hooks/useChildList.js
View File

@ -117,8 +117,12 @@ export function useChildList() {
}
function removeTaskId(taskId) {
childList.delete(taskId);
setChildList(...childList)
delete childList[taskId];
setChildList({...childList})
fetchOptionsForValue(taskId,undefined)
// console.log({taskId,childList})
// const {[taskId]:deleteTaskId,...newChildList} = childList
// setChildList({...newChildList})
}
return {

34
src/pages/DetailLogTask/index.js
View File

@ -1,4 +1,4 @@
import {ActionSheet, Button, Dialog, Divider, Tabs, TextArea, Toast} from "antd-mobile";
import {ActionSheet, Button, Dialog, Divider, Tabs, TextArea} from "antd-mobile";
import React, {Fragment, useEffect, useMemo, useRef, useState} from "react";
import "./index.css"
import {useNavigate, useOutletContext, useSearchParams} from "react-router-dom";
@ -27,10 +27,8 @@ export function DetailLogTask() {
const [sendValue, setSendValue] = useState('');
const [hasMore, setHasMore] = useState(true);
const [pageTime, setPageTime] = useState(new Date());
// 记录上一次的滚动高度
const previousScrollHeight = useRef(0);
const loading = useRef(false)
const [pageNumber, setPageNumber] = useState(1);
// 点击操作面板
const [actionSheetVisible, setActionSheetVisible] = useState(false)
@ -55,7 +53,13 @@ export function DetailLogTask() {
if (!map.has(dayjs(taskLog.createdDate).format("YYYY-MM-DD"))) {
map.set(dayjs(taskLog.createdDate).format("YYYY-MM-DD"), []);
}
map.get(dayjs(taskLog.createdDate).format("YYYY-MM-DD"))?.push(taskLog);
if (currentShow === 'all' && taskLog.enableFlag === '0') {
map.get(dayjs(taskLog.createdDate).format("YYYY-MM-DD"))?.push({
...taskLog, description: <s>{taskLog.description}</s>
});
} else {
map.get(dayjs(taskLog.createdDate).format("YYYY-MM-DD"))?.push(taskLog);
}
return map;
}, new Map());
}, [taskLogList, currentShow])
@ -66,15 +70,20 @@ export function DetailLogTask() {
"enableFlag": '1'
}).then(res => {
// 加入当前集合中
setTaskLogList([...taskLogList, res]);
setTaskLogList([res, ...taskLogList]);
})
setSendValue('')
textAreaRef.current.focus();
};
async function fetchMessages() {
if (loading.current) {
return
}
loading.current = true;
// 获取之前的日志信息，根据日期分组排序，遍历map
const res = await listTaskLog(JSON.stringify({
"pageNumber": pageNumber,
"pageSize": 20,
"sortList": [{"direction": "DESC", "property": "createdDate"}],
"data": {
@ -82,24 +91,21 @@ export function DetailLogTask() {
"name": "taskId",
"operateType": "=",
"value": params.get('id')
}, {
"name": "createdDate",
"operateType": "<",
"value": pageTime
}]
}
}))
console.log({res})
if (res.content.length > 0) {
setPageTime(res.content[res.content.length - 1].createdDate)
setTaskLogList([...taskLogList, ...res.content]);
} else if (res.page.totalElements === 0) {
}
if (pageNumber >= res.page.totalPages) {
setHasMore(false);
}
setPageNumber(pageNumber + 1)
loading.current = false;
}
useEffect(() => {
setPageTime(new Date())
textAreaRef.current.focus();
fetchMessages()
}, [])

16
src/pages/PersonalCenter/index.js
View File

@ -1,5 +1,5 @@
import React, {Fragment, useContext, useEffect, useState} from "react";
import {Button, Form, List, Picker, Space, Switch} from "antd-mobile";
import {Button, List, Picker, Switch,} from "antd-mobile";
import Cookies from "js-cookie";
import {columnSortConstant} from "./columnSortConstant";
import {MyRootContext, UPDATE_SEARCH} from "../../components/MyRootContext";
@ -57,6 +57,20 @@ export function PersonalCenter() {
{/* localStorage.setItem('huayu-todo-setting', setting);*/}
{/* }*/}
{/*}/>}>新建任务时父任务只展示未完成任务</List.Item>*/}
<List.Item extra={<Switch checked={parentCheck} onChange={
(checked) => {
let setting = localStorage.getItem('huayu-todo-setting');
if (setting) {
let parseObj = JSON.parse(setting);
parseObj.calDetail = checked
setting = JSON.stringify(parseObj)
setParentCheck(checked);
} else {
setting = JSON.stringify({calDetail: checked})
}
localStorage.setItem('huayu-todo-setting', setting);
}
}/>}>日历页面默认展示详情</List.Item>
<Picker
columns={columnSortConstant}
value={columnSort}

2
src/pages/TaskCount/index.js
View File

@ -98,7 +98,7 @@ const TaskCount = (props) => {
return (
<div style={{margin: "20px"}}>
<h2>TODO日{currentDay && dayjs(currentDay).format(DATE_FORMAT)}代办：
{currentDay && <a onClick={todoDayDetail}>详情</a>}
{/*{currentDay && <a onClick={todoDayDetail}>详情</a>}*/}
{!dayjs(currentMonth).isSame(today, 'months') &&
<Fragment><Divider direction='vertical'/><a onClick={() => backToToday()}>回到当月</a></Fragment>}
</h2>

61
src/pages/ToDoCal/index.jsx
View File

@ -2,14 +2,14 @@ import {Calendar, Cascader, SwipeAction, Tag} from "antd-mobile";
import dayjs from "dayjs";
import {TaskCount} from "../TaskCount";
import React, {Fragment, useEffect, useLayoutEffect, useMemo, useRef, useState} from "react";
import {getTaskByPid, getTaskCount} from "../../utils";
import {FrownFill, SmileFill} from "antd-mobile-icons";
import {getTaskCount} from "../../utils";
import {NEW, OVERDUE, UNDER_WAY} from "../../utils/commonConstant";
import {dateStartUtcFormat} from "../../utils/timeFormatUtil";
import {dateStartUtcFormat, dayStartUtcFormat, nextDayStartUtcFormat} from "../../utils/timeFormatUtil";
import './index.css'
import TaskItemList from "../../components/TaskItemList";
const ToDoCal = (props) => {
const ToDoCal = () => {
const today = new Date()
const calRef = useRef(null);
const refSwip = useRef(null);
@ -22,8 +22,10 @@ const ToDoCal = (props) => {
console.log("getCurrentShowDay", getCurrentShowDay())
const {startDay, endDay} = getCurrentShowDay();
listTaskCount(startDay, endDay);
todoDayDetail(new Date())
}, [currentMonth])
let loading = false
const currentDaySearch =useRef()
async function listTaskCount(start, end) {
if (loading) {
@ -55,6 +57,54 @@ const ToDoCal = (props) => {
setCurrentDay(today)
}
const todoDayDetail = (searchDay) => {
let andSearchModel = {}
let orSearchModel = {andSearchModel}
if (searchDay) {
andSearchModel.andList = [{
"name": "expectedStartTime",
"value": nextDayStartUtcFormat(searchDay),
"operateType": "<"
}, {
"name": "expectedEndTime",
"value": dayStartUtcFormat(searchDay),
"operateType": ">"
}]
andSearchModel.orSearchModel = {
"andList": [
{
"name": "expectedStartTime",
"value": nextDayStartUtcFormat(searchDay),
"operateType": "<"
}, {
"name": "expectedStartTime",
"value": dayStartUtcFormat(searchDay),
"operateType": ">"
}, {
"name": "expectedEndTime",
"operateType": "NULL"
}
], orSearchModel: {
"andList": [
{
"name": "expectedEndTime",
"value": nextDayStartUtcFormat(searchDay),
"operateType": "<"
}, {
"name": "expectedEndTime",
"value": dayStartUtcFormat(searchDay),
"operateType": ">"
}, {
"name": "expectedStartTime",
"operateType": "NULL"
}
]
}
}
}
currentDaySearch.value = {data:orSearchModel}
}
return (
<Fragment>
@ -145,6 +195,7 @@ const ToDoCal = (props) => {
defaultValue={currentDay}
onChange={val => {
setCurrentDay(val)
todoDayDetail(val)
}}
onPageChange={(year, month) => {
console.log(year, month)
@ -156,6 +207,8 @@ const ToDoCal = (props) => {
<TaskCount currentDay={currentDay} taskCount={listTaskMap?.get(currentMonth)} today={today}
currentMonth={currentMonth}
backToToday={backToToday}/>
<TaskItemList search={currentDaySearch}/>
</Fragment>
)
}