90 lines
2.6 KiB
JavaScript
90 lines
2.6 KiB
JavaScript
import React from "react";
|
|
import { color } from "../../style/varibles";
|
|
import { ModalOverlayStyled, UserModalStyled, UserBtns } from "./UserModal.style";
|
|
|
|
import api from "../../services/api";
|
|
import { AuthContext } from "../../context/Auth/AuthContext";
|
|
import { Can } from "../Can";
|
|
|
|
import BtnComponent from "../Base/Btn/Btn";
|
|
import FormComponent from "../Base/Form/FormComponent";
|
|
import InputComponent from "../Base/Form/Input/InputComponent";
|
|
import UserModalComponent from "./UserModalImg/UserModalComponent";
|
|
|
|
import UserImg from "../../assets/images/User/user.jpg";
|
|
|
|
const UserModal = ({ modal, click, userId }) => {
|
|
const { user } = React.useContext(AuthContext);
|
|
|
|
const InitalState = {
|
|
name: "",
|
|
email: "",
|
|
password: "",
|
|
profile: "",
|
|
};
|
|
const [userData, setUserData] = React.useState(InitalState);
|
|
const [selectedQueueIds, setSelectedQueueIds] = React.useState([]);
|
|
|
|
React.useEffect(() => {
|
|
// const fetchUser = async () => {
|
|
// if (!userId) return;
|
|
// try {
|
|
// const { data } = await api.get(`/users/${userId}`);
|
|
// setUserData((prevState) => {
|
|
// return console.log({ ...prevState, ...data });
|
|
// });
|
|
// const userQueueIds = data.queues?.map((queue) => queue.id);
|
|
// setSelectedQueueIds(userQueueIds);
|
|
// } catch (err) {
|
|
// alert(err);
|
|
// }
|
|
// };
|
|
|
|
// fetchUser();
|
|
}, [userId]);
|
|
|
|
return (
|
|
<ModalOverlayStyled modal={modal}>
|
|
<UserModalStyled>
|
|
<UserModalComponent img={UserImg} desc="Clique na imagem para alterar" />
|
|
<FormComponent method="get">
|
|
<InputComponent
|
|
id="nome"
|
|
label="Nome"
|
|
type="text"
|
|
value={userData.name}
|
|
onChange={(event) => setUserData({ name: event.target.data })}
|
|
/>
|
|
<InputComponent
|
|
id="email"
|
|
label="E-mail"
|
|
type="email"
|
|
value={userData.email}
|
|
onChange={(event) => setUserData({ email: event.target.data })}
|
|
/>
|
|
<InputComponent id="password" label="Senha" type="password" />
|
|
<UserBtns>
|
|
<BtnComponent text="Cancelar" onClick={click} />
|
|
<BtnComponent
|
|
text="Salvar"
|
|
bgcolor={color.status.yes}
|
|
fontcolor={color.pricinpal.blanco}
|
|
/>
|
|
</UserBtns>
|
|
</FormComponent>
|
|
</UserModalStyled>
|
|
</ModalOverlayStyled>
|
|
);
|
|
};
|
|
|
|
export default UserModal;
|
|
|
|
/*{name: 'teste', id: 2, email: 'teste@teste.com', profile: 'master', tokenVersion: 0, …}
|
|
email: "teste@teste.com"
|
|
id: 2
|
|
name: "teste"
|
|
profile: "master"
|
|
queues: []
|
|
tokenVersion: 0 */
|
|
|