diff --git a/src/views/Community/components/IndustryCascader.js b/src/views/Community/components/IndustryCascader.js new file mode 100644 index 00000000..abd742ec --- /dev/null +++ b/src/views/Community/components/IndustryCascader.js @@ -0,0 +1,75 @@ +// src/views/Community/components/IndustryCascader.js +import React, { useState } from 'react'; +import { Card, Form, Cascader } from 'antd'; +import { useIndustry } from '../../../contexts/IndustryContext'; +import { logger } from '../../../utils/logger'; + +const IndustryCascader = ({ onFilterChange, loading }) => { + const [industryCascaderValue, setIndustryCascaderValue] = useState([]); + + // 使用全局行业数据 + const { industryData, loadIndustryData, loading: industryLoading } = useIndustry(); + + // Cascader 获得焦点时加载数据 + const handleCascaderFocus = async () => { + if (!industryData || industryData.length === 0) { + logger.debug('IndustryCascader', 'Cascader 获得焦点,开始加载行业数据'); + await loadIndustryData(); + } + }; + + // Cascader 选择变化 + const handleIndustryCascaderChange = (value, selectedOptions) => { + setIndustryCascaderValue(value); + + if (value && value.length > 0) { + // value[0] = 分类体系名称 + // value[1...n] = 行业代码(一级~四级) + const industryCode = value[value.length - 1]; // 最后一级的 code + const classification = value[0]; // 分类体系名称 + + onFilterChange('industry_classification', classification); + onFilterChange('industry_code', industryCode); + + logger.debug('IndustryCascader', 'Cascader 选择变化', { + value, + classification, + industryCode, + path: selectedOptions.map(o => o.label).join(' > ') + }); + } else { + // 清空 + onFilterChange('industry_classification', ''); + onFilterChange('industry_code', ''); + } + }; + + return ( + +
+ + labels.join(' > ')} + showSearch={{ + filter: (inputValue, path) => + path.some(option => option.label.toLowerCase().includes(inputValue.toLowerCase())) + }} + style={{ width: '100%' }} + /> + +
+
+ ); +}; + +export default IndustryCascader;