feat: 时间筛选重置调整

This commit is contained in:
zdl
2025-11-06 12:41:32 +08:00
parent c6b3b56cb8
commit 8b25d5d91c

View File

@@ -1,6 +1,6 @@
// src/views/Community/components/TradingTimeFilter.js
// 交易时段智能筛选组件
import React, { useState, useMemo } from 'react';
import React, { useState, useMemo, useEffect } from 'react';
import { Space, Button, Tag, Tooltip, DatePicker, Popover } from 'antd';
import { ClockCircleOutlined, CalendarOutlined } from '@ant-design/icons';
import dayjs from 'dayjs';
@@ -11,13 +11,27 @@ const { RangePicker } = DatePicker;
/**
* 交易时段筛选组件
* @param {string} value - 当前选中的 key受控
* @param {Function} onChange - 时间范围变化回调 (timeConfig) => void
*/
const TradingTimeFilter = ({ onChange }) => {
const TradingTimeFilter = ({ value, onChange }) => {
const [selectedKey, setSelectedKey] = useState(null);
const [customRangeVisible, setCustomRangeVisible] = useState(false);
const [customRange, setCustomRange] = useState(null);
// 监听外部 value 变化,同步内部状态
useEffect(() => {
if (value === null || value === undefined) {
// 外部重置,清空内部状态
setSelectedKey(null);
setCustomRange(null);
logger.debug('TradingTimeFilter', '外部重置,清空选中状态');
} else if (value !== selectedKey) {
// 外部选中值变化,同步内部状态
setSelectedKey(value);
}
}, [value, selectedKey]);
// 获取当前交易时段
const getCurrentTradingSession = () => {
const now = dayjs();
@@ -322,7 +336,7 @@ const TradingTimeFilter = ({ onChange }) => {
>
<Tag color="gold" style={{ margin: 0, fontSize: 13, padding: '2px 8px', cursor: 'pointer' }}>
<CalendarOutlined style={{ marginRight: 4 }} />
自定义
{customRange ? `${customRange[0].format('MM-DD HH:mm')} - ${customRange[1].format('MM-DD HH:mm')}` : '自定义'}
</Tag>
</Tooltip>
) : (