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; 
 |