11import { useEffect , useState } from 'react' ;
2- import { Table , Typography , Button , Space , Spin , Empty , message , Tooltip } from 'antd' ;
2+ import { Table , Typography , Button , Space , Empty , Tooltip } from 'antd' ;
33import { FolderOpen , FileText , ArrowLeft } from 'lucide-react' ;
44import { queryEvaluationFilesUsingGet , queryEvaluationItemsUsingGet } from '../../evaluation.api' ;
5+ import useFetchData from '@/hooks/useFetchData' ;
56
67const { Text } = Typography ;
78
@@ -39,63 +40,52 @@ type EvalItem = {
3940} ;
4041
4142export default function EvaluationItems ( { task } : { task : any } ) {
42- const [ loadingFiles , setLoadingFiles ] = useState < boolean > ( false ) ;
43- const [ files , setFiles ] = useState < EvalFile [ ] > ( [ ] ) ;
44- const [ filePagination , setFilePagination ] = useState ( { current : 1 , pageSize : 10 , total : 0 } ) ;
45-
4643 const [ selectedFile , setSelectedFile ] = useState < { fileId : string ; fileName : string } | null > ( null ) ;
47- const [ loadingItems , setLoadingItems ] = useState < boolean > ( false ) ;
48- const [ items , setItems ] = useState < EvalItem [ ] > ( [ ] ) ;
49- const [ itemPagination , setItemPagination ] = useState ( { current : 1 , pageSize : 10 , total : 0 } ) ;
5044
51- // Fetch files list
52- useEffect ( ( ) => {
53- if ( ! task ?. id || selectedFile ) return ;
54- const fetchFiles = async ( ) => {
55- setLoadingFiles ( true ) ;
56- try {
57- const res = await queryEvaluationFilesUsingGet ( { taskId : task . id , page : filePagination . current , size : filePagination . pageSize } ) ;
58- const data = res ?. data ;
59- const list : EvalFile [ ] = data ?. content || [ ] ;
60- setFiles ( list ) ;
61- setFilePagination ( ( p ) => ( { ...p , total : data ?. totalElements || 0 } ) ) ;
62- } catch ( e ) {
63- message . error ( '加载评估文件失败' ) ;
64- console . error ( e ) ;
65- } finally {
66- setLoadingFiles ( false ) ;
45+ // 文件列表数据(使用 useFetchData),pageOffset=0 表示后端分页为 1 基
46+ const {
47+ loading : loadingFiles ,
48+ tableData : files ,
49+ pagination : filePagination ,
50+ setSearchParams : setFileSearchParams ,
51+ } = useFetchData < EvalFile > (
52+ ( params ) => queryEvaluationFilesUsingGet ( { taskId : task ?. id , ...params } ) ,
53+ ( d ) => d as unknown as EvalFile ,
54+ 30000 ,
55+ false ,
56+ [ ] ,
57+ 0
58+ ) ;
59+
60+ // 评估条目数据(使用 useFetchData),依赖选中文件
61+ const {
62+ loading : loadingItems ,
63+ tableData : items ,
64+ pagination : itemPagination ,
65+ setSearchParams : setItemSearchParams ,
66+ fetchData : fetchItems ,
67+ } = useFetchData < EvalItem > (
68+ ( params ) => {
69+ if ( ! task ?. id || ! selectedFile ?. fileId ) {
70+ return Promise . resolve ( { data : { content : [ ] , totalElements : 0 } } ) ;
6771 }
68- } ;
69- fetchFiles ( ) ;
70- // eslint-disable-next-line react-hooks/exhaustive-deps
71- } , [ task ?. id , filePagination . current , filePagination . pageSize , selectedFile ] ) ;
72+ return queryEvaluationItemsUsingGet ( { taskId : task . id , file_id : selectedFile . fileId , ...params } ) ;
73+ } ,
74+ ( d ) => d as unknown as EvalItem ,
75+ 30000 ,
76+ false ,
77+ [ ] ,
78+ 0
79+ ) ;
7280
73- // Fetch items of selected file
81+ // 当选择文件变化时,主动触发一次条目查询,避免仅依赖 searchParams 变更导致未触发
7482 useEffect ( ( ) => {
75- if ( ! task ?. id || ! selectedFile ) return ;
76- const fetchItems = async ( ) => {
77- setLoadingItems ( true ) ;
78- try {
79- const res = await queryEvaluationItemsUsingGet ( {
80- taskId : task . id ,
81- page : itemPagination . current ,
82- size : itemPagination . pageSize ,
83- file_id : selectedFile . fileId ,
84- } ) ;
85- const data = res ?. data ;
86- const list : EvalItem [ ] = data ?. content || [ ] ;
87- setItems ( list ) ;
88- setItemPagination ( ( p ) => ( { ...p , total : data ?. totalElements || 0 } ) ) ;
89- } catch ( e ) {
90- message . error ( '加载评估条目失败' ) ;
91- console . error ( e ) ;
92- } finally {
93- setLoadingItems ( false ) ;
94- }
95- } ;
96- fetchItems ( ) ;
97- // eslint-disable-next-line react-hooks/exhaustive-deps
98- } , [ task ?. id , selectedFile ?. fileId , itemPagination . current , itemPagination . pageSize ] ) ;
83+ if ( task ?. id && selectedFile ?. fileId ) {
84+ setItemSearchParams ( ( prev : any ) => ( { ...prev , current : 1 } ) ) ;
85+ // 立即拉取一次,保证点击后立刻出现数据
86+ fetchItems ( ) ;
87+ }
88+ } , [ task ?. id , selectedFile ?. fileId ] ) ;
9989
10090 const fileColumns = [
10191 {
@@ -228,19 +218,20 @@ export default function EvaluationItems({ task }: { task: any }) {
228218 dataSource = { files }
229219 loading = { loadingFiles }
230220 size = "middle"
231- onRow = { ( record ) => ( { onClick : ( ) => setSelectedFile ( { fileId : record . fileId , fileName : record . fileName } ) } ) }
232- pagination = { {
233- current : filePagination . current ,
234- pageSize : filePagination . pageSize ,
235- total : filePagination . total ,
236- onChange : ( current , pageSize ) => setFilePagination ( { current, pageSize, total : filePagination . total } ) ,
237- } }
221+ onRow = { ( record ) => ( {
222+ onClick : ( ) => {
223+ setSelectedFile ( { fileId : record . fileId , fileName : record . fileName } ) ;
224+ // 切换文件时,重置条目表到第一页
225+ setItemSearchParams ( ( prev : any ) => ( { ...prev , current : 1 } ) ) ;
226+ } ,
227+ } ) }
228+ pagination = { filePagination }
238229 />
239230 ) : (
240231 < div className = "flex flex-col gap-3" >
241232 < div className = "sticky top-0 z-10 bg-white py-2" style = { { borderBottom : '1px solid #f0f0f0' } } >
242233 < Space wrap >
243- < Button icon = { < ArrowLeft size = { 16 } /> } onClick = { ( ) => { setSelectedFile ( null ) ; setItems ( [ ] ) ; } } >
234+ < Button icon = { < ArrowLeft size = { 16 } /> } onClick = { ( ) => { setSelectedFile ( null ) ; } } >
244235 返回文件列表
245236 </ Button >
246237 < Space >
@@ -257,12 +248,7 @@ export default function EvaluationItems({ task }: { task: any }) {
257248 dataSource = { items }
258249 loading = { loadingItems }
259250 size = "middle"
260- pagination = { {
261- current : itemPagination . current ,
262- pageSize : itemPagination . pageSize ,
263- total : itemPagination . total ,
264- onChange : ( current , pageSize ) => setItemPagination ( { current, pageSize, total : itemPagination . total } ) ,
265- } }
251+ pagination = { itemPagination }
266252 />
267253 </ div >
268254 ) }
0 commit comments