From 4dc8e84f5cee4f9ffa1660e6eb62398d3028405d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=8E=E7=91=9E?= Date: Fri, 27 Mar 2026 22:30:46 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=97=A5=E6=9C=9F=E7=AD=9B?= =?UTF-8?q?=E9=80=89=E4=BA=A4=E4=BA=92?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/FilterPopup/index.tsx | 64 +++++++++++++++++----------- 1 file changed, 40 insertions(+), 24 deletions(-) diff --git a/src/components/FilterPopup/index.tsx b/src/components/FilterPopup/index.tsx index 1891814..02f800f 100644 --- a/src/components/FilterPopup/index.tsx +++ b/src/components/FilterPopup/index.tsx @@ -32,36 +32,52 @@ const FilterPopup = (props: FilterPopupProps) => { const { timeBubbleData, gamesNum } = store; /** - * @description 处理字典选项 - * @param dictionaryValue 字典选项 - * @returns 选项列表 + * @description 日期排序 + * @param a 日期字符串 + * @param b 日期字符串 + * @returns 日期差值 */ - // const [selectedDates, setSelectedDates] = useState([]) + const sortByDate = (a: string, b: string) => { + return new Date(a).getTime() - new Date(b).getTime(); + } const handleDateChange = (dates: Date[]) => { - let times: String[] = []; - if (dates.length > 1) { - times = [dayjs(dates[0]).format('YYYY-MM-DD'), dayjs(dates[dates.length - 1]).format('YYYY-MM-DD')] - onChange({ - 'dateRange': times, - }) + // ================================ 日期处理 ================================ + // 默认是是当前日期为开始日期,结束日期为当前日期 + 30天 + const defaultDateRange = [dayjs().format('YYYY-MM-DD'), dayjs().add(1, 'M').format('YYYY-MM-DD')]; + // 处理空数组的情况 + if (!dates.length) { + onChange({ dateRange: defaultDateRange }); return; } - if (Array.isArray(dates)) { - - const currentDay = dayjs(dates[0]).format('YYYY-MM-DD'); - if (filterOptions.dateRange.length === 0 || filterOptions.dateRange.length === 2) { - times.push(currentDay); - } else { - times = [...filterOptions.dateRange, currentDay].sort( - (a, b) => new Date(a).getTime() - new Date(b).getTime() - ) - } + // 处理多日期范围选择(超过1个日期) + if (dates.length > 1) { + const dateRange = [ + dayjs(dates[0]).format('YYYY-MM-DD'), + dayjs(dates[dates.length - 1]).format('YYYY-MM-DD') + ]; + onChange({ dateRange }); + return; } - - onChange({ - 'dateRange': times, - }) + // 处理单个日期选择 + const currentFilterOptionsDateRange = Array.isArray(filterOptions?.dateRange) + ? filterOptions.dateRange + : defaultDateRange; + // 当前选择的日期 + const currentDay = dayjs(dates?.[0]).format('YYYY-MM-DD'); + // 当 dates 每次只返回单个日期时,使用已选范围判断是“第一次点”还是“第二次点” + let dateRange: string[]; + if ( + currentFilterOptionsDateRange.length === 2 && + currentFilterOptionsDateRange?.[0] === currentFilterOptionsDateRange?.[1] + ) { + // 已是单日,点击当前日期扩展为日期范围 + dateRange = [currentFilterOptionsDateRange[0], currentDay].sort(sortByDate); + } else { + // 默认区间/已选区间/异常状态,点击当前日期统一收敛为单日 + dateRange = [currentDay, currentDay]; + } + onChange({ dateRange }); } const handleOptions = (dictionaryValue: []) => {