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('month'); + const [view, setView] = useState('week'); const [date, setDate] = useState(new Date()); const clickRef = useRef(null) // 展示在页面的任务,默认获取当前月的信息。 @@ -36,6 +36,10 @@ const CalShow: React.FC = () => { const [itemId, setItemId] = useState(-1); const [expectedStartTime, setExpectedStartTime] = useState(); const [expectedEndTime, setExpectedEndTime] = useState(); + 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,start:rangeLet[0]}) + } + if (range.end.valueOf()rangeLet.start.valueOf()){ + setRange({...range,start:rangeLet.start}) + } + if (range.end.valueOf() {open&& { view={view} // 界面改变 onView={handleViewChange} - // onRangeChange={rangeChange} + onRangeChange={rangeChange} // 时间 date={date} // 条目信息改变