From 81e9d4fe8a49801e3c171daeca0beae45c5bddeb Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期一, 23 九月 2024 09:18:48 +0800 Subject: [PATCH] # --- zy-acs-flow/src/page/task/TaskListAside.jsx | 143 +++++++++++++++++++++++++++++++++++++++++++++++ zy-acs-flow/src/page/task/TaskList.jsx | 2 2 files changed, 145 insertions(+), 0 deletions(-) diff --git a/zy-acs-flow/src/page/task/TaskList.jsx b/zy-acs-flow/src/page/task/TaskList.jsx index 70a5c42..8bb60ee 100644 --- a/zy-acs-flow/src/page/task/TaskList.jsx +++ b/zy-acs-flow/src/page/task/TaskList.jsx @@ -42,6 +42,7 @@ import MyField from "../components/MyField"; import { PAGE_DRAWER_WIDTH, OPERATE_MODE } from '@/config/setting'; import * as Common from '@/utils/common'; +import TaskListAside from "./TaskListAside"; const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ '& .css-1vooibu-MuiSvgIcon-root': { @@ -150,6 +151,7 @@ </TopToolbar> )} perPage={25} + aside={<TaskListAside />} > <StyledDatagrid preferenceKey='task' diff --git a/zy-acs-flow/src/page/task/TaskListAside.jsx b/zy-acs-flow/src/page/task/TaskListAside.jsx new file mode 100644 index 0000000..9226abb --- /dev/null +++ b/zy-acs-flow/src/page/task/TaskListAside.jsx @@ -0,0 +1,143 @@ +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 TaskListAside = (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 TaskListAside; \ No newline at end of file -- Gitblit v1.9.1