| import React, { useState, useRef, useEffect, useMemo, useCallback } from "react"; | 
| import { | 
|     SavedQueriesList, | 
|     FilterLiveSearch, | 
|     FilterList, | 
|     FilterListItem, | 
|     useTheme, | 
|     useStore, | 
| } from 'react-admin'; | 
| import { Box, Typography, Card, CardContent } from '@mui/material'; | 
| import * as Common from '@/utils/common'; | 
| import WcIcon from '@mui/icons-material/Wc'; | 
| import BookmarkIcon from '@mui/icons-material/BookmarkBorder'; | 
| import StyleIcon from '@mui/icons-material/Style'; | 
| import AccessTimeIcon from '@mui/icons-material/AccessTime'; | 
| import { | 
|     endOfYesterday, | 
|     startOfWeek, | 
|     subWeeks, | 
|     startOfMonth, | 
|     subMonths, | 
| } from 'date-fns'; | 
| import request from '@/utils/request' | 
|   | 
| const BusListAside = (props) => { | 
|     const theme = useTheme(); | 
|     const [roles, setRoles] = React.useState([]); | 
|   | 
|     React.useEffect(() => { | 
|         request.post('/role/list', {}).then(res => { | 
|             if (res?.data?.code === 200) { | 
|                 setRoles(res.data.data); | 
|             } | 
|         }) | 
|     }, []) | 
|   | 
|     const isSelected = (value, filters) => { | 
|         const roleIds = filters.roleIds || []; | 
|         return roleIds.includes(value.roleId); | 
|     }; | 
|   | 
|     const toggleFilter = (value, filters) => { | 
|         const roleIds = filters.roleIds || []; | 
|         return { | 
|             ...filters, | 
|             roleIds: roleIds.includes(value.roleId) | 
|                 ? roleIds.filter(v => v !== value.roleId) | 
|                 // : [...roleIds, value.roleId], | 
|                 : [value.roleId], | 
|         }; | 
|     }; | 
|   | 
|   | 
|     return ( | 
|         <Card | 
|             sx={{ | 
|                 display: { xs: 'none', md: 'block', }, | 
|                 order: -1, | 
|                 mr: 2, | 
|                 mt: 8, | 
|                 alignSelf: 'flex-start', | 
|                 border: theme[0] === 'light' && '1px solid #e0e0e3', | 
|                 // width: 200 | 
|             }} | 
|         > | 
|             <CardContent> | 
|                 <SavedQueriesList icon={<BookmarkIcon />} /> | 
|                 <FilterLiveSearch source='condition' hiddenLabel /> | 
|   | 
|                 <FilterList | 
|                     label="filters.lastCreated" | 
|                     icon={<AccessTimeIcon />} | 
|                 > | 
|                     <FilterListItem | 
|                         label="filters.today" | 
|                         value={{ | 
|                             timeStart: endOfYesterday().toISOString(), | 
|                             timeEnd: undefined, | 
|                         }} | 
|                     /> | 
|                     <FilterListItem | 
|                         label="filters.thisWeek" | 
|                         value={{ | 
|                             timeStart: startOfWeek(new Date()).toISOString(), | 
|                             timeEnd: undefined, | 
|                         }} | 
|                     /> | 
|                     <FilterListItem | 
|                         label="filters.lastWeek" | 
|                         value={{ | 
|                             timeStart: subWeeks(startOfWeek(new Date()), 1).toISOString(), | 
|                             timeEnd: startOfWeek(new Date()).toISOString(), | 
|                         }} | 
|                     /> | 
|                     <FilterListItem | 
|                         label="filters.thisMonth" | 
|                         value={{ | 
|                             timeStart: startOfMonth(new Date()).toISOString(), | 
|                             timeEnd: undefined, | 
|                         }} | 
|                     /> | 
|                     <FilterListItem | 
|                         label="filters.lastMonth" | 
|                         value={{ | 
|                             timeStart: subMonths(startOfMonth(new Date()), 1).toISOString(), | 
|                             timeEnd: startOfMonth(new Date()).toISOString(), | 
|                         }} | 
|                     /> | 
|                     <FilterListItem | 
|                         label="filters.earlier" | 
|                         value={{ | 
|                             timeStart: undefined, | 
|                             timeEnd: subMonths(startOfMonth(new Date()), 1).toISOString(), | 
|                         }} | 
|                     /> | 
|                 </FilterList> | 
|   | 
|                 <FilterList label="table.field.user.sex" icon={<WcIcon />}> | 
|                     <FilterListItem label="table.field.user.sexes.female" value={{ sex: '2' }} /> | 
|                     <FilterListItem label="table.field.user.sexes.male" value={{ sex: '1' }} /> | 
|                     <FilterListItem label="table.field.user.sexes.unknown" value={{ sex: '0' }} /> | 
|                 </FilterList> | 
|   | 
|                 <FilterList label="table.field.user.role" icon={<StyleIcon />}> | 
|                     {roles.map(role => { | 
|                         return ( | 
|                             <FilterListItem | 
|                                 key={role.id} | 
|                                 label={`${role.name}`} | 
|                                 value={{ roleId: role.id }} | 
|                                 isSelected={isSelected} | 
|                                 toggleFilter={toggleFilter} | 
|                             /> | 
|                         ) | 
|                     })} | 
|                 </FilterList> | 
|   | 
|             </CardContent> | 
|         </Card> | 
|     ) | 
| } | 
|   | 
| export default BusListAside; |