|  |  | 
 |  |  | import { formatDistance } from 'date-fns'; | 
 |  |  | import request from '@/utils/request'; | 
 |  |  | import { useTheme } from '@mui/material/styles'; | 
 |  |  | import { getTaskStsColor } from '@/utils/common'; | 
 |  |  | import { getTaskStsColor } from '@/utils/color-util'; | 
 |  |  | import ListEmptyTip from "../../components/ListEmptyTip"; | 
 |  |  |  | 
 |  |  | const TaskItem = ({ record, now }) => { | 
 |  |  |     const translate = useTranslate(); | 
 |  |  |     const theme = useTheme(); | 
 |  |  |     console.log(record); | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <> | 
 |  |  | 
 |  |  |                     </ListItemAvatar> | 
 |  |  |                     <ListItemText | 
 |  |  |                         primary={<> | 
 |  |  |                             <Typography | 
 |  |  |                                 variant="body1" | 
 |  |  |                                 color="textPrimary" | 
 |  |  |                                 component="span" | 
 |  |  |                             > | 
 |  |  |                                 {record.taskType$} | 
 |  |  |                             </Typography> | 
 |  |  |                             <Stack direction={'row'}> | 
 |  |  |                                 <Typography | 
 |  |  |                                     variant="body1" | 
 |  |  |                                     color="textSecondary" | 
 |  |  |                                     component="span" | 
 |  |  |                                     sx={{ fontWeight: '600' }} | 
 |  |  |                                 > | 
 |  |  |                                     {record.taskType$} | 
 |  |  |                                 </Typography> | 
 |  |  |                                 <Typography | 
 |  |  |                                     variant="caption" | 
 |  |  |                                     color="textSecondary" | 
 |  |  |                                     component="span" | 
 |  |  |                                 > | 
 |  |  |                                      -  {record.taskTypeEl} | 
 |  |  |                                 </Typography> | 
 |  |  |                             </Stack> | 
 |  |  |  | 
 |  |  |                         </>} | 
 |  |  |                         secondary={ | 
 |  |  |                             <> | 
 |  |  | 
 |  |  |                                     variant="body2" | 
 |  |  |                                     color="textSecondary" | 
 |  |  |                                     component="span" | 
 |  |  |                                     sx={{ fontWeight: 'bold' }} | 
 |  |  |                                 > | 
 |  |  |                                     {record.taskSts$} | 
 |  |  |                                 </Typography> | 
 |  |  | 
 |  |  |     const [currCount, setCurrCount] = useState(pageSize); | 
 |  |  |     const [records, setRecords] = useState(null); | 
 |  |  |     const [total, setTotal] = useState(0); | 
 |  |  |     const translate = useTranslate(); | 
 |  |  |  | 
 |  |  |     useEffect(() => { | 
 |  |  |         const http = async () => { | 
 |  |  | 
 |  |  |                     <List> | 
 |  |  |                         {records.map(record => { | 
 |  |  |                             return ( | 
 |  |  |                                 <> | 
 |  |  |                                 <React.Fragment key={record.id}> | 
 |  |  |                                     <TaskItem | 
 |  |  |                                         key={record.id} | 
 |  |  |                                         record={record} | 
 |  |  |                                         now={now} | 
 |  |  |                                     /> | 
 |  |  |                                     <Divider /> | 
 |  |  |                                 </> | 
 |  |  |  | 
 |  |  |                                 </React.Fragment> | 
 |  |  |                             ) | 
 |  |  |                         })} | 
 |  |  |  | 
 |  |  |                         {currCount < total && ( | 
 |  |  |                             <Button | 
 |  |  |                                 onClick={() => | 
 |  |  | 
 |  |  |                                 fullWidth | 
 |  |  |                                 sx={{ mt: 1 }} | 
 |  |  |                             > | 
 |  |  |                                 Load more activity | 
 |  |  |                                 {translate('common.action.loadMore')} | 
 |  |  |                             </Button> | 
 |  |  |                         )} | 
 |  |  |                     </List> | 
 |  |  |                 </Box> | 
 |  |  |             ) : ( | 
 |  |  |                 <Typography> | 
 |  |  |                     no data found | 
 |  |  |                 </Typography> | 
 |  |  |                 <ListEmptyTip /> | 
 |  |  |             )} | 
 |  |  |  | 
 |  |  |         </> |