diff --git a/src/views/Community/components/EventFilters.js b/src/views/Community/components/EventFilters.js index 40bde007..7efc6788 100644 --- a/src/views/Community/components/EventFilters.js +++ b/src/views/Community/components/EventFilters.js @@ -1,6 +1,6 @@ // src/views/Community/components/EventFilters.js import React, { useState, useEffect } from 'react'; -import { Card, Row, Col, DatePicker, Button, Select, Form, Cascader } from 'antd'; +import { Card, Row, Col, DatePicker, Button, Select, Form, Input, Cascader } from 'antd'; import { FilterOutlined } from '@ant-design/icons'; import moment from 'moment'; import locale from 'antd/es/date-picker/locale/zh_CN'; @@ -12,29 +12,38 @@ const { Option } = Select; const EventFilters = ({ filters, onFilterChange, loading }) => { const [form] = Form.useForm(); - const [industryCascaderValue, setIndustryCascaderValue] = useState([]); - - // 使用全局行业数据 - const { industryData, loadIndustryData, loading: industryLoading } = useIndustry(); + const [industryOptions, setIndustryOptions] = useState([]); // 初始化表单值 useEffect(() => { const initialValues = { date_range: filters.date_range ? filters.date_range.split(' 至 ').map(d => moment(d)) : null, sort: filters.sort, - importance: filters.importance + importance: filters.importance, + industry_code: filters.industry_code ? filters.industry_code.split(',') : [] }; form.setFieldsValue(initialValues); }, [filters, form]); - // Cascader 获得焦点时加载数据 - const handleCascaderFocus = async () => { - if (!industryData || industryData.length === 0) { - logger.debug('EventFilters', 'Cascader 获得焦点,开始加载行业数据'); - await loadIndustryData(); + // 加载申银万国行业分类树形数据 + const loadIndustryClassifications = async () => { + try { + const response = await industryService.getClassifications(); + if (response.success && response.data) { + setIndustryOptions(response.data); + logger.debug('EventFilters', '申银万国行业分类加载成功', { + count: response.data?.length || 0 + }); + } + } catch (error) { + logger.error('EventFilters', 'loadIndustryClassifications', error); } }; + useEffect(() => { + loadIndustryClassifications(); + }, []); + const handleDateRangeChange = (dates) => { if (dates && dates.length === 2) { const dateRange = `${dates[0].format('YYYY-MM-DD')} 至 ${dates[1].format('YYYY-MM-DD')}`; @@ -52,29 +61,60 @@ const EventFilters = ({ filters, onFilterChange, loading }) => { onFilterChange('importance', value); }; - // Cascader 选择变化 - const handleIndustryCascaderChange = (value, selectedOptions) => { - setIndustryCascaderValue(value); + // 收集所有叶子节点的 value(递归) + const collectLeafValues = (node) => { + // 如果没有子节点,说明是叶子节点 + if (!node.children || node.children.length === 0) { + return [node.value]; + } - if (value && value.length > 0) { - // value[0] = 分类体系名称 - // value[1...n] = 行业代码(一级~四级) - const industryCode = value[value.length - 1]; // 最后一级的 code - const classification = value[0]; // 分类体系名称 + // 有子节点,递归收集所有子节点的叶子节点 + let leafValues = []; + node.children.forEach(child => { + leafValues = leafValues.concat(collectLeafValues(child)); + }); + return leafValues; + }; - onFilterChange('industry_classification', classification); - onFilterChange('industry_code', industryCode); + // 根据级联路径找到对应的节点 + const findNodeByPath = (options, path) => { + let current = options; + let node = null; - logger.debug('EventFilters', 'Cascader 选择变化', { - value, - classification, - industryCode, - path: selectedOptions.map(o => o.label).join(' > ') - }); - } else { - // 清空 - onFilterChange('industry_classification', ''); + for (let i = 0; i < path.length; i++) { + node = current.find(item => item.value === path[i]); + if (!node) return null; + if (i < path.length - 1) { + current = node.children || []; + } + } + return node; + }; + + // 行业级联选择变化 + const handleIndustryChange = (value, selectedOptions) => { + if (!value || value.length === 0) { onFilterChange('industry_code', ''); + return; + } + + // 获取选中的节点 + const selectedNode = findNodeByPath(industryOptions, value); + + if (!selectedNode) { + // 如果找不到节点,使用最后一个值 + onFilterChange('industry_code', value[value.length - 1]); + return; + } + + // 如果选中的节点有子节点,收集所有叶子节点的 value + // 这样可以匹配该级别下的所有事件 + if (selectedNode.children && selectedNode.children.length > 0) { + const leafValues = collectLeafValues(selectedNode); + onFilterChange('industry_code', leafValues.join(',')); + } else { + // 叶子节点,直接使用该 value + onFilterChange('industry_code', selectedNode.value); } }; @@ -123,24 +163,20 @@ const EventFilters = ({ filters, onFilterChange, loading }) => { {/* 行业分类级联选择器 - 替换原来的 5 个独立 Select */} - + labels.join(' > ')} showSearch={{ filter: (inputValue, path) => - path.some(option => option.label.toLowerCase().includes(inputValue.toLowerCase())) + path.some(option => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1) }} + disabled={loading} + allowClear style={{ width: '100%' }} + displayRender={(labels) => labels.join(' / ')} />