update: 新闻素材筛选条件缓存

src/hooks/useCache.ts

@@ -8,42 +8,6 @@ type StoreInstance<T> = {
 	add: (value: T) => void;
 	remove: (value: T) => void
 }
-// function createStore<T>(set:  Get<StoreApi<StoreInstance<Id>>, "setState", never>){
-// 	return {
-// 		data: [],
-// 		set: (values: T[]) => {
-// 			set(s=>{
-//
-// 			})
-// 			// set()
-// 			set({data: values})
-// 		},
-// 		clear: () => {
-// 			set({data: []})
-// 		},
-// 		add: (id: Id) => {
-// 			set((state) => ({
-// 				data: [...state.data, id]
-// 			}))
-// 		},
-// 		remove: (id: Id) => {
-// 			set((state) => ({
-// 				data: state.data.filter((item) => item != id)
-// 			}))
-// 		}
-// 	}
-// }
-// export const useIndexIdCache = create<StoreInstance<Id>>((set) => {
-// 	//createStore<Id>(set)
-// 	return {
-// 		data: [],
-// 		xxx: () => {
-// 			set(s => {
-// 				s.data = [...s.data, 1]
-// 			})
-// 		}
-// 	}
-// });
 export const useIndexArrayCache = create<StoreInstance<Id>>((set) => ({
 	cache: [],
 	set: (values: Id[]) => {
@@ -63,74 +27,4 @@ export const useIndexArrayCache = create<StoreInstance<Id>>((set) => ({
 		}))
 	}
 }))
-//
+
-// export const useCacheStore = create<{
-// 	[dataKey: string]: Id[];
-// 	clear: (key: string) => void;
-// 	set: (key: string, value: Id[]) => void;
-// 	add: (key: string, id: Id) => void;
-// 	remove: (key: string, id: Id) => void
-// }>((set) => ({
-// 	data: {},
-// 	clear: (key: string) => {
-// 		set(s => {
-// 			s[key] = []
-// 			return s;
-// 		})
-// 	},
-// 	set: (key: string, value: Id[]) => {
-// 		set((s) => {
-// 			s[key] = value
-// 			return s;
-// 		})
-// 	},
-// 	add: (key: string, id: Id) => {
-// 		console.log(id, 'add cache', key)
-// 		set((s) => {
-// 			if (!s[key]) {
-// 				s[key] = [];
-// 			}
-// 			s[key].push(id)
-// 			return s;
-// 		})
-// 	},
-// 	remove: (key: string, id: Id) => {
-// 		set((s) => {
-// 			if (!s[key]) {
-// 				return s;
-// 			}
-// 			s[key] = s[key].filter((item) => item != id)
-// 			return s;
-// 		})
-// 	}
-// }))
-//
-// function useCache(key: 'index' | 'edit') {
-// 	//{data,set,add,remove,clear}
-// 	const store = useCacheStore()
-//
-// 	return {
-// 		store,
-// 		data: store[key],
-// 		getCache: () => {
-// 			// return cache.data[key] || []
-// 			return store[key] || [];
-// 		},
-// 		setCache: (value: Id[]) => {
-// 			store.set(key, value)
-// 		},
-// 		clearCache: () => {
-// 			store.clear(key)
-// 		},
-// 		addCache: (id: Id, addSame = false) => {
-// 			if (!addSame && store[key]?.includes(id)) return;
-// 			console.log(id, 'add cache')
-// 			store.add(key, id)
-// 		},
-// 		removeCache: (id: Id) => {
-// 			store.remove(key, id)
-// 		}
-// 	}
-// }
-//
-// export default useCache

src/pages/news/components/search-panel.tsx

@@ -1,6 +1,6 @@
 import {Input} from "antd";
 import {useBoolean, useLocalStorageState, useSetState,useClickAway} from "ahooks";
-import {useCallback, useMemo, useRef, useState} from "react";
+import {useCallback, useEffect, useMemo, useRef, useState} from "react";
 import {clsx} from "clsx";
 import useArticleTags from "@/hooks/useArticleTags.ts";
 
@@ -12,6 +12,7 @@ import {IconPin} from "@/components/icons";
 
 type SearchPanelProps = {
 	onSearch?: (params: ApiArticleSearchParams) => void;
+	defaultParams?: Partial<ApiArticleSearchParams>;
 }
 const pagination = {
 	limit: 12, page: 1
@@ -21,19 +22,46 @@ const DEFAULT_STATE = {
 	tag_level_2_id: -1,
 	subOptions: []
 }
-export default function SearchPanel({onSearch}: SearchPanelProps) {
+export default function SearchPanel({onSearch,defaultParams}: SearchPanelProps) {
 	const tags = useArticleTags();
 	const [params, setParams] = useSetState<ApiArticleSearchParams>({
 		pagination,
-		time_flag:1
+		time_flag:1,
+		...(defaultParams || {})
 	});
-	const [prevSearchName, setPrevSearchName] = useState<string>()
+	const [prevSearchName, setPrevSearchName] = useState<string>(defaultParams?.title||'')
 
 	const [state, setState] = useSetState<{
 		tag_level_1_id: number;
 		tag_level_2_id: number;
 		subOptions: (string | number)[]
-	}>({...DEFAULT_STATE})
+	}>({
+		...DEFAULT_STATE,
+		...(defaultParams&&defaultParams.tag_level_1_id?{tag_level_1_id:defaultParams.tag_level_1_id}: {}),
+		...(defaultParams&&defaultParams.tag_level_2_id?{tag_level_2_id:defaultParams.tag_level_2_id}: {})
+	})
+	useEffect(()=>{
+		if(!defaultParams){
+			return;
+		}
+		const _state = {
+			tag_level_1_id: -1,
+			tag_level_2_id: -1,
+		}
+
+		if(defaultParams.tag_level_1_id){
+			_state.tag_level_1_id = defaultParams.tag_level_1_id
+			if(tags && tags.length > 0){
+				const tag = tags.find(s => s.value == defaultParams.tag_level_1_id)
+				setSubOptions(tag?.children || [])
+			}
+		}
+		if(defaultParams.tag_level_2_id){
+			_state.tag_level_2_id = defaultParams.tag_level_2_id
+		}
+		console.log('xaf',_state)
+		setState(_state)
+	},[tags])
 	const [pinnedTag, setPinnedTag] = useLocalStorageState<number[]>(
 		'user-pinned-tag-list',
 		{
@@ -202,7 +230,7 @@ export default function SearchPanel({onSearch}: SearchPanelProps) {
 						{
 							subOptions.map(it => (
 								<div
-									className={`filter-item whitespace-nowrap px-2 py-1 mt-1 text-sm mr-1 cursor-pointer rounded text-gray-400 ${state.tag_level_2_id == it.value ? 'text-black' : 'hover:text-gray-600'}`}
+									className={`filter-item whitespace-nowrap px-2 py-1 mt-1 text-sm mr-1 cursor-pointer rounded ${state.tag_level_2_id == it.value ? 'text-black' : ' text-gray-400 hover:text-gray-600'}`}
 									key={it.value}
 									onClick={() => {
 										handleFilter({tag_level_1_id:state.tag_level_1_id,tag_level_2_id: Number(it.value)})

src/pages/news/index.tsx

@@ -14,11 +14,15 @@ import InfiniteScroller, {InfiniteScrollerRef} from "@/components/scoller/infini
 import ButtonToTop from "@/components/scoller/button-to-top.tsx";
 import {useIndexArrayCache} from "@/hooks/useCache.ts";
 
+const FilterCache: Partial<ApiArticleSearchParams> = {
+	time_flag: 1,
+}
 export default function NewsIndex() {
-
 	const [params, setParams] = useState<ApiArticleSearchParams>({
-		pagination: {page: 1, limit: 12},time_flag:1
+		pagination: {page: 1, limit: 12}, 
+		...FilterCache
 	})
+
 	// const [checkedId, setCheckedId] = useState<Id[]>([])
 	const {cache: checkedId, set: setCheckedId} = useIndexArrayCache()
 
@@ -33,6 +37,11 @@ export default function NewsIndex() {
 	const {loading} = useRequest(() => getList(params), {
 		refreshDeps: [params],
 		onSuccess: (_data) => {
+			FilterCache.tag_level_1_id = params.tag_level_1_id;
+			FilterCache.tag_level_2_id = params.tag_level_2_id;
+			FilterCache.title = params.title;
+			FilterCache.time_flag = params.time_flag;
+			console.log('success',FilterCache)
 			if (params.pagination.page === 1) {
 				setData(_data)
 				setState({checkAll: checkedId && _data.list && checkedId.length === _data.list.length})
@@ -78,7 +87,7 @@ export default function NewsIndex() {
 		}
 	}
 	return (<div className={'container pb-5'}>
-		<SearchPanel onSearch={setParams}/>
+		<SearchPanel defaultParams={params} onSearch={setParams}/>
 		{activeNews && <Modal
             rootClassName={'news-detail-modal'}
             closeIcon={null} open={true} width={1000}