fix:排序

src/modules/task-center/data-center/components/StudyTable.tsx

@@ -26,16 +26,33 @@ function StudyTable(props: any) {
     const [list, setList] = useState<any[]>([]);
     const [list, setList] = useState<any[]>([]);
     const [total, setTotal] = useState<any>(0);
     const [total, setTotal] = useState<any>(0);
     const [name, setName] = useState<any>('');
     const [name, setName] = useState<any>('');
-    const timer = useRef<any>(null)
+    const [orderFiled, setOrderFiled] = useState<any>(null);
+    const [sort, setSort] = useState<any>(null);
+    const timer = useRef<any>(null);
+    const sortNameMap: any = {
+        learnPercentage: 'LEARN_NUM',
+        latelyLearnTime: 'LATE_LEARN_TIME',
+        startLearnTime: 'START_LEARN_TIME',
+    }
 
 
     useEffect(() => {
     useEffect(() => {
         getList()
         getList()
-    }, [query])
+    }, [query, orderFiled, sort])
+
+
 
 
     function getList() {
     function getList() {
-        Service.Hades('public/hades/getTaskCustomerRecordPage', query).then((res: any) => {
+        const _query = { ...query };
+        delete _query.sortMap;
+        if (sort) {
+            _query.sortMap = {
+                [sortNameMap[orderFiled]]: sort === "ascend" ? 'SORT_ASC' : 'SORT_DESC'
+            }
+        }
+
+        Service.Hades('public/hades/getTaskCustomerRecordPage', _query).then((res: any) => {
             res.result.records.map((item: any) => {
             res.result.records.map((item: any) => {
-                item.department =item.departmentNameList.map((_item:any)=>{
+                item.department = item.departmentNameList.map((_item: any) => {
                     if (_item == '1000') {
                     if (_item == '1000') {
                         return '微信'
                         return '微信'
                     } else {
                     } else {
@@ -49,11 +66,6 @@ function StudyTable(props: any) {
         })
         })
     }
     }
 
 
-
-
-
-
-
     const columns = [
     const columns = [
         {
         {
             title: '学员',
             title: '学员',
@@ -75,11 +87,11 @@ function StudyTable(props: any) {
             render: (val: any, record: any) => {
             render: (val: any, record: any) => {
                 return <div>
                 return <div>
                     {
                     {
-                        record.department.map((item:any,index:number)=>{
-                            if((index+1) ==record.department.length){
+                        record.department.map((item: any, index: number) => {
+                            if ((index + 1) == record.department.length) {
                                 return item
                                 return item
-                            }else{
-                                return [item,';']
+                            } else {
+                                return [item, ';']
                             }
                             }
 
 
                         })
                         })
@@ -105,7 +117,9 @@ function StudyTable(props: any) {
         {
         {
             title: '学习进度',
             title: '学习进度',
             key: 'learnPercentage',
             key: 'learnPercentage',
+            sorter: true,
             dataIndex: 'learnPercentage',
             dataIndex: 'learnPercentage',
+            sortOrder: (orderFiled == 'learnPercentage') ? sort : null,
             render: (val: any, record: any) => {
             render: (val: any, record: any) => {
                 return `${val}%`;
                 return `${val}%`;
             },
             },
@@ -117,8 +131,8 @@ function StudyTable(props: any) {
             dataIndex: 'latelyLearnTime',
             dataIndex: 'latelyLearnTime',
             sorter: true,
             sorter: true,
             width: 240,
             width: 240,
+            sortOrder: (orderFiled == 'latelyLearnTime') ? sort : null,
             render: (val: any, record: any) => {
             render: (val: any, record: any) => {
-
                 return `${formatDate('YYYY-MM-DD H:i', parseInt(record.latelyLearnTime))}`;
                 return `${formatDate('YYYY-MM-DD H:i', parseInt(record.latelyLearnTime))}`;
             },
             },
         },
         },
@@ -128,6 +142,8 @@ function StudyTable(props: any) {
             dataIndex: 'startLearnTime',
             dataIndex: 'startLearnTime',
             width: 240,
             width: 240,
             sorter: true,
             sorter: true,
+            field: 'yuiooo',
+            sortOrder: (orderFiled == 'startLearnTime') ? sort : null,
             render: (val: any, record: any) => {
             render: (val: any, record: any) => {
                 return <div>{formatDate('YYYY-MM-DD H:i', val)}</div>;
                 return <div>{formatDate('YYYY-MM-DD H:i', val)}</div>;
             },
             },
@@ -154,6 +170,13 @@ function StudyTable(props: any) {
         },
         },
     ];
     ];
 
 
+    function onChange(pagination: any, filters: any, sorter: any, extra: any) {
+        console.log(sorter)
+        setOrderFiled(sorter.field || null)
+        setSort(sorter.order)
+    }
+
+
 
 
     return <div className="study_Table">
     return <div className="study_Table">
         <div className="filter">
         <div className="filter">
@@ -256,6 +279,7 @@ function StudyTable(props: any) {
                                 storeUserId: User.getStoreUserId(),
                                 storeUserId: User.getStoreUserId(),
                                 userId: User.getStoreUserId(),
                                 userId: User.getStoreUserId(),
                             })
                             })
+                            setSort('')
                         }}>
                         }}>
                             &#xe61b;{' '}
                             &#xe61b;{' '}
                         </span>
                         </span>
@@ -275,7 +299,7 @@ function StudyTable(props: any) {
                 columns={columns}
                 columns={columns}
                 pagination={false}
                 pagination={false}
                 className='user-learning-table'
                 className='user-learning-table'
-                onChange={() => { }}
+                onChange={onChange}
                 showSorterTooltip={false}
                 showSorterTooltip={false}
                 bordered
                 bordered
             />
             />