Получение списка юзеров в адмике
This commit is contained in:
parent
c251a598cc
commit
3bf2eee43d
@ -21,6 +21,8 @@ export const MOCK_DATA_USERS = [
|
||||
|
||||
export type TMockData = typeof MOCK_DATA_USERS;
|
||||
|
||||
export type UsersType = { login: string; email: string; phoneNumber: string; isDeleted: boolean; createdAt: string }[];
|
||||
|
||||
export const getRoles_mock = (): Promise<TMockData> => {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(() => {
|
||||
|
@ -7,8 +7,6 @@ import { ThemeProvider } from "@mui/material/styles";
|
||||
|
||||
import { SnackbarProvider } from "notistack";
|
||||
|
||||
import theme from "./theme";
|
||||
|
||||
import PublicRoute from "@kitUI/publicRoute";
|
||||
import PrivateRoute from "@kitUI/privateRoute";
|
||||
|
||||
@ -26,6 +24,7 @@ import PromocodeManagement from "@pages/dashboard/Content/PromocodeManagement";
|
||||
import { SettingRoles } from "@pages/Setting/SettingRoles";
|
||||
import Support from "@pages/dashboard/Content/Support/Support";
|
||||
|
||||
import theme from "./theme";
|
||||
import "./index.css";
|
||||
|
||||
const componentsArray = [
|
||||
|
@ -3,6 +3,7 @@ import React, { useEffect, useState } from "react";
|
||||
|
||||
type ConditionalRenderProps = {
|
||||
isLoading: boolean;
|
||||
role: string;
|
||||
childrenUser?: JSX.Element;
|
||||
childrenAdmin?: JSX.Element;
|
||||
childrenManager?: JSX.Element;
|
||||
@ -10,25 +11,26 @@ type ConditionalRenderProps = {
|
||||
|
||||
const ConditionalRender = ({
|
||||
isLoading,
|
||||
role,
|
||||
childrenUser,
|
||||
childrenAdmin,
|
||||
childrenManager,
|
||||
}: ConditionalRenderProps): JSX.Element => {
|
||||
const [role, setRole] = useState<string>("");
|
||||
// const [role, setRole] = useState<string>("");
|
||||
|
||||
useEffect(() => {
|
||||
const axiosAccount = async () => {
|
||||
try {
|
||||
const { data } = await axios.get("https://admin.pena.digital/user/643e23f3dba63ba17272664d");
|
||||
setRole(data.role);
|
||||
} catch (error) {
|
||||
console.error("Ошибка при получение роли пользавателя");
|
||||
}
|
||||
};
|
||||
axiosAccount();
|
||||
}, [role]);
|
||||
// useEffect(() => {
|
||||
// const axiosAccount = async () => {
|
||||
// try {
|
||||
// const { data } = await axios.get("https://admin.pena.digital/user/643e23f3dba63ba17272664d");
|
||||
// setRole(data.role);
|
||||
// } catch (error) {
|
||||
// console.error("Ошибка при получение роли пользавателя");
|
||||
// }
|
||||
// };
|
||||
// axiosAccount();
|
||||
// }, [role]);
|
||||
|
||||
if (isLoading) {
|
||||
if (!isLoading) {
|
||||
if (role === "admin") {
|
||||
return childrenAdmin ? childrenAdmin : <div>Администратор</div>;
|
||||
}
|
||||
|
@ -1,6 +1,7 @@
|
||||
import * as React from "react";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { Box, Typography, TextField, Button } from "@mui/material";
|
||||
import axios from "axios";
|
||||
import Table from "@mui/material/Table";
|
||||
import TableHead from "@mui/material/TableHead";
|
||||
import TableBody from "@mui/material/TableBody";
|
||||
@ -13,14 +14,18 @@ import AccordionSummary from "@mui/material/AccordionSummary";
|
||||
import AccordionDetails from "@mui/material/AccordionDetails";
|
||||
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
||||
import ClearIcon from "@mui/icons-material/Clear";
|
||||
|
||||
import { getRoles_mock, TMockData } from "../../../api/roles";
|
||||
|
||||
import type { UsersType } from "../../../api/roles";
|
||||
|
||||
import theme from "../../../theme";
|
||||
import axios from "axios";
|
||||
import ConditionalRender from "@root/pages/Setting/ConditionalRender";
|
||||
|
||||
const Users: React.FC = () => {
|
||||
const radioboxes = ["a", "b", "c"];
|
||||
const radioboxes = ["admin", "manager", "user"];
|
||||
|
||||
const [selectedValue, setSelectedValue] = React.useState("a");
|
||||
const [selectedValue, setSelectedValue] = React.useState("admin");
|
||||
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setSelectedValue(event.target.value);
|
||||
};
|
||||
@ -57,20 +62,30 @@ const Users: React.FC = () => {
|
||||
handleChangeData();
|
||||
|
||||
const [roles, setRoles] = React.useState<TMockData>([]);
|
||||
const [users, setUsers] = React.useState<UsersType>();
|
||||
|
||||
React.useEffect(() => {
|
||||
const axiosRoles = async () => {
|
||||
const response = await axios({
|
||||
const { data } = await axios({
|
||||
method: "get",
|
||||
url: "https://admin.pena.digital/strator/role/",
|
||||
});
|
||||
return response;
|
||||
setRoles(data);
|
||||
};
|
||||
axiosRoles().then((result) => {
|
||||
setRoles(result.data);
|
||||
const gettingRegisteredUsers = async () => {
|
||||
const { data } = await axios({
|
||||
method: "get",
|
||||
url: "https://hub.pena.digital/user/",
|
||||
});
|
||||
setUsers(data);
|
||||
};
|
||||
|
||||
gettingRegisteredUsers();
|
||||
axiosRoles();
|
||||
}, []);
|
||||
|
||||
console.log(users);
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Button
|
||||
@ -382,72 +397,125 @@ const Users: React.FC = () => {
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
ID
|
||||
login
|
||||
</Typography>
|
||||
</TableCell>
|
||||
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
email
|
||||
</Typography>
|
||||
</TableCell>
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
phoneNumber
|
||||
</Typography>
|
||||
</TableCell>
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
isDeleted
|
||||
</Typography>
|
||||
</TableCell>
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
createdAt
|
||||
</Typography>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
|
||||
<TableBody>
|
||||
<ConditionalRender
|
||||
isLoading={false}
|
||||
role={selectedValue}
|
||||
childrenUser={
|
||||
<>
|
||||
{users &&
|
||||
users.map(({ login, email, phoneNumber, isDeleted, createdAt }) => (
|
||||
<TableRow
|
||||
key={createdAt}
|
||||
sx={{
|
||||
borderBottom: "2px solid",
|
||||
borderColor: theme.palette.grayLight.main,
|
||||
height: "100px",
|
||||
cursor: "pointer",
|
||||
}}
|
||||
onClick={() => navigate("/modalUser")}
|
||||
>
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
1
|
||||
{login}
|
||||
</Typography>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
|
||||
<TableRow
|
||||
sx={{
|
||||
borderBottom: "2px solid",
|
||||
borderColor: theme.palette.grayLight.main,
|
||||
height: "100px",
|
||||
cursor: "pointer",
|
||||
}}
|
||||
onClick={() => navigate("/modalUser")}
|
||||
>
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
2
|
||||
{email}
|
||||
</Typography>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
|
||||
<TableRow
|
||||
sx={{
|
||||
borderBottom: "1px solid",
|
||||
border: theme.palette.secondary.main,
|
||||
height: "100px",
|
||||
cursor: "pointer",
|
||||
}}
|
||||
onClick={() => navigate("/modalUser")}
|
||||
>
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
3
|
||||
{phoneNumber}
|
||||
</Typography>
|
||||
</TableCell>
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
{isDeleted ? "true" : "false"}
|
||||
</Typography>
|
||||
</TableCell>
|
||||
<TableCell sx={{ textAlign: "center" }}>
|
||||
<Typography
|
||||
variant="h4"
|
||||
sx={{
|
||||
color: theme.palette.secondary.main,
|
||||
}}
|
||||
>
|
||||
{createdAt}
|
||||
</Typography>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</>
|
||||
}
|
||||
/>
|
||||
</TableBody>
|
||||
</Table>
|
||||
</React.Fragment>
|
||||
|
Loading…
Reference in New Issue
Block a user