feat: 将难度筛选改为多选模式，支持easy/medium/hard特定字符串筛选

Author: CC11001100

src/components/ChallengeListPage/ChallengeControls.tsx

@@ -27,7 +27,7 @@ interface ChallengeControlsProps {
     /**
      * 选中的难度
      */
-    selectedDifficulty: string;
+    selectedDifficulty: string[];
 
     /**
      * 选中的平台
@@ -110,8 +110,9 @@ const ChallengeControls: React.FC<ChallengeControlsProps> = ({
     // 难度过滤菜单
     const difficultyMenu = (
         <Menu
-            selectedKeys={[selectedDifficulty]}
+            selectedKeys={selectedDifficulty}
             onClick={({ key }) => onDifficultyChange(key)}
+            multiple={false}
         >
             <Menu.Item key="all">{t('challenges.filters.allDifficulties')}</Menu.Item>
             <Menu.Item key="1">

src/components/ChallengeListPage/ChallengeFilters.tsx

@@ -14,7 +14,7 @@ interface ChallengeFiltersProps {
     /**
      * 选中的难度
      */
-    selectedDifficulty: string;
+    selectedDifficulty: string[];
 
     /**
      * 选中的平台
@@ -92,7 +92,7 @@ const ChallengeFilters: React.FC<ChallengeFiltersProps> = ({
                 <Row gutter={[8, 8]} style={{ marginBottom: isMobile ? '8px' : '16px' }}>
                     <Col span={24}>
                         <Space wrap size={isMobile ? 4 : 8} style={{ width: '100%' }}>
-                            {selectedDifficulty !== 'all' && (
+                            {selectedDifficulty.length > 0 && (
                                 <Tag
                                     closable
                                     onClose={onRemoveDifficulty}
@@ -105,7 +105,11 @@ const ChallengeFilters: React.FC<ChallengeFiltersProps> = ({
                                     }}
                                 >
                                     {isMobile ? '' : `${t('challenges.sort.difficulty')}: `}
-                                    <StarRating difficulty={parseInt(selectedDifficulty)} />
+                                    <Space size={2}>
+                                        {selectedDifficulty.map(diff => (
+                                            <StarRating key={diff} difficulty={parseInt(diff)} />
+                                        ))}
+                                    </Space>
                                 </Tag>
                             )}
 

src/components/ChallengeListPage/index.tsx

@@ -23,7 +23,7 @@ const ChallengeListPage = () => {
     const { t } = useTranslation();
     const isMobile = useMediaQuery({ maxWidth: 768 });
     const [filters, setFilters] = useState({
-        difficulty: 'all',
+        difficulty: [] as string[],
         tags: [] as string[],
         platform: 'all'
     });
@@ -64,8 +64,10 @@ const ChallengeListPage = () => {
                     const newSearchParams = new URLSearchParams(searchParams);
 
                     // 设置难度
-                    if (parsedFilters.difficulty && parsedFilters.difficulty !== 'all') {
-                        newSearchParams.set('difficulty', parsedFilters.difficulty);
+                    if (parsedFilters.difficulty && parsedFilters.difficulty.length > 0) {
+                        parsedFilters.difficulty.forEach((difficulty: string) => {
+                            newSearchParams.append('difficulty', difficulty);
+                        });
                     }
 
                     // 设置平台
@@ -120,11 +122,33 @@ const ChallengeListPage = () => {
     // 处理难度点击
     const handleDifficultyClick = (difficulty: string) => {
         const newSearchParams = new URLSearchParams(searchParams);
-        newSearchParams.set('difficulty', difficulty);
+        const currentDifficulties = filters.difficulty;
+        
+        // 检查是否已选中该难度
+        const isSelected = currentDifficulties.includes(difficulty);
+        
+        if (difficulty === 'all') {
+            // 如果选择"全部"，则清除所有难度筛选
+            newSearchParams.delete('difficulty');
+            filters.difficulty = [];
+        } else if (isSelected) {
+            // 如果已选中，则取消选中
+            const newDifficulties = currentDifficulties.filter(d => d !== difficulty);
+            newSearchParams.delete('difficulty');
+            newDifficulties.forEach(d => newSearchParams.append('difficulty', d));
+            filters.difficulty = newDifficulties;
+        } else {
+            // 如果未选中，则添加选中
+            const newDifficulties = [...currentDifficulties, difficulty];
+            newSearchParams.delete('difficulty');
+            newDifficulties.forEach(d => newSearchParams.append('difficulty', d));
+            filters.difficulty = newDifficulties;
+        }
+
         navigate(`/challenges?${newSearchParams.toString()}`);
 
         // 保存筛选设置到本地存储
-        saveFilterPreferences({ ...filters, difficulty });
+        saveFilterPreferences({ ...filters, difficulty: filters.difficulty });
     };
 
     // 处理平台筛选
@@ -183,10 +207,22 @@ const ChallengeListPage = () => {
     // 从URL同步过滤器状态
     useEffect(() => {
         const tags = searchParams.getAll('tags');
-        const difficulty = searchParams.get('difficulty') || 'all';
+        let difficultyParams = searchParams.getAll('difficulty');
         const platform = searchParams.get('platform') || 'all';
 
-        const newFilters = { tags, difficulty, platform };
+        // 处理特殊难度字符串转换
+        if (difficultyParams.length === 1) {
+            const diffParam = difficultyParams[0];
+            if (diffParam === 'easy') {
+                difficultyParams = ['1', '2'];
+            } else if (diffParam === 'medium') {
+                difficultyParams = ['3', '4'];
+            } else if (diffParam === 'hard') {
+                difficultyParams = ['5'];
+            }
+        }
+        
+        const newFilters = { tags, difficulty: difficultyParams, platform };
         setFilters(newFilters);
 
         // 当URL发生变化时，同步到本地存储
@@ -218,7 +254,7 @@ const ChallengeListPage = () => {
         // 使用搜索服务过滤
         const filtered = searchService.filterChallenges(visibleChallenges, {
             tags: filters.tags,
-            difficulty: filters.difficulty,
+            difficulty: filters.difficulty.join(','),
             platform: filters.platform,
             query: searchQuery
         });
@@ -263,8 +299,17 @@ const ChallengeListPage = () => {
             newTags.forEach(t => newSearchParams.append('tags', t));
             newFilters = { ...newFilters, tags: newTags };
         } else if (type === 'difficulty') {
-            newSearchParams.delete('difficulty');
-            newFilters = { ...newFilters, difficulty: 'all' };
+            if (value) {
+                // 仅移除单个难度
+                const newDifficulties = filters.difficulty.filter(d => d !== value);
+                newSearchParams.delete('difficulty');
+                newDifficulties.forEach(d => newSearchParams.append('difficulty', d));
+                newFilters = { ...newFilters, difficulty: newDifficulties };
+            } else {
+                // 移除所有难度
+                newSearchParams.delete('difficulty');
+                newFilters = { ...newFilters, difficulty: [] };
+            }
         } else if (type === 'platform') {
             newSearchParams.delete('platform');
             newFilters = { ...newFilters, platform: 'all' };
@@ -278,7 +323,7 @@ const ChallengeListPage = () => {
     const handleClearAllFilters = () => {
         const newSearchParams = new URLSearchParams();
         setSearchParams(newSearchParams);
-        const newFilters = { tags: [], difficulty: 'all', platform: 'all' };
+        const newFilters = { tags: [], difficulty: [], platform: 'all' };
         setFilters(newFilters);
         saveFilterPreferences(newFilters);
     };
@@ -295,7 +340,7 @@ const ChallengeListPage = () => {
     // 获取应用的过滤器数量
     const getAppliedFiltersCount = () => {
         let count = 0;
-        if (filters.difficulty !== 'all') count++;
+        if (filters.difficulty.length > 0) count++;
         if (filters.platform !== 'all') count++;
         count += filters.tags.length;
         return count;
@@ -325,7 +370,7 @@ const ChallengeListPage = () => {
             selectedTags={filters.tags}
             selectedDifficulty={filters.difficulty}
             selectedPlatform={filters.platform}
-            hasFilters={filters.tags.length > 0 || filters.difficulty !== 'all' || filters.platform !== 'all'}
+            hasFilters={filters.tags.length > 0 || filters.difficulty.length > 0 || filters.platform !== 'all'}
             onRemoveTag={(tag) => handleFilterRemove('tag', tag)}
             onRemoveDifficulty={() => handleFilterRemove('difficulty')}
             onRemovePlatform={() => handleFilterRemove('platform')}

src/services/SearchService.ts

@@ -96,8 +96,16 @@ class SearchService {
         filters.tags.every(tag => challenge.tags.includes(tag));
 
       // 难度过滤
-      const matchesDifficulty = !filters.difficulty || filters.difficulty === 'all' ||
-        challenge.difficulty === parseInt(filters.difficulty);
+      let matchesDifficulty = true;
+      if (filters.difficulty && filters.difficulty !== 'all') {
+        // 处理逗号分隔的多难度筛选
+        const difficultyArray = filters.difficulty.split(',').filter(Boolean);
+        if (difficultyArray.length > 0) {
+          matchesDifficulty = difficultyArray.some(diff => 
+            challenge.difficulty === parseInt(diff)
+          );
+        }
+      }
 
       // 平台过滤
       const matchesPlatform = !filters.platform || filters.platform === 'all' ||