import Typography from "@mui/material/Typography";
import {useEffect, useState} from "react";
import {
Avatar,
Card,
CardContent,
CardHeader,
CircularProgress,
Collapse, Divider,
FormControl,
MenuItem, Pagination,
Select
} from "@mui/material";
import Box from "@mui/material/Box";
import {backURL} from "../../actions/PathDB";
import userDefault from "../../img/header/userDefault.png";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import {connect} from "react-redux";
import {actionUserCount, actionUserFind} from "../../actions/ActionUserFind";
import {timeCalc} from "../ProductPage/timeCalc";
const ClientsCart = ({_id, login, nick, avatar, createdAt, acl}) => {
const ItemAccordion = ({text, size='h6'}) => {
return (
{text}
)
}
const [expanded, setExpanded] = useState(false);
const handleExpandClick = () => {
setExpanded(!expanded);
};
return (
:
}
title={`Login: ${login || 'login'} ${nick ? '| Nick: ' + nick : ''} ${(acl && Array.isArray(acl) && acl.length > 1) ? '| Status: ' + acl.slice(1, acl.length).toString() : ''}`}
subheader={timeCalc(+createdAt || 0)}
/>
1) ? 'Status: ' + acl.slice(1, acl.length).toString() : ''}`}/>
)
}
const Clients = ({usersArr, usersCount, getAllClients, getCountUser}) => {
const itemsPerPage = 100
const [page, setPage] = useState(1)
const [sortValue, setSortValue] = useState('login')
const [sortVector, setSortVector] = useState(1)
const [sortSelect, setSortSelect] = useState(0)
useEffect(() => {
if (!usersArr && page === 1) getAllClients()
if (!usersCount) getCountUser()
else {
setCount(Math.ceil(+usersCount?.payload / itemsPerPage))
}
}, [getAllClients, getCountUser, page, sortValue, sortVector, usersArr, usersCount])
const [count, setCount] = useState(1)
const handleChange = (event, value) => {
setPage(value);
getAllClients(itemsPerPage * value, sortValue, sortVector);
}
const handleChangeSelect = (event) => {
setSortSelect(event.target.value);
if (event.target.value === 0){
setSortValue('login')
setSortVector(1)
getAllClients(itemsPerPage*page, sortValue, sortVector)
}
else if (event.target.value === 1){
setSortValue('login')
setSortVector(-1)
getAllClients(itemsPerPage*page, sortValue, sortVector)
}
else if (event.target.value === 2){
setSortValue('login')
setSortVector(1)
getAllClients(itemsPerPage*page, sortValue, sortVector)
}
else if (event.target.value === 3){
setSortValue('createdAt')
setSortVector(1)
getAllClients(itemsPerPage*page, sortValue, sortVector)
}
else if (event.target.value === 4){
setSortValue('createdAt')
setSortVector(-1)
getAllClients(itemsPerPage*page, sortValue, sortVector)
}
}
return (
<>
{usersCount?.payload && Total clients: {usersCount.payload}}
{!usersArr || !usersArr?.payload ?
:
Array.isArray(usersArr.payload) && usersArr.payload.map(item => {
return
})
}
>
)
}
export const CClients = connect(state => ({usersArr: state.promise['allUsers'], usersCount: state.promise['usersCount']}), {getAllClients: actionUserFind, getCountUser: actionUserCount})(Clients)