155 lines
4.0 KiB
TypeScript
155 lines
4.0 KiB
TypeScript
import { useState, useEffect } from "react";
|
||
import { useParams } from "react-router-dom";
|
||
import { Box, Typography, TextField, Button } from "@mui/material";
|
||
|
||
|
||
import type { ChangeEvent } from "react";
|
||
import { makeRequest } from "@frontend/kitui";
|
||
|
||
type File = {
|
||
name: "inn" | "rule" | "egrule" | "certificate";
|
||
url: string;
|
||
};
|
||
|
||
type Verification = {
|
||
_id: string;
|
||
accepted: boolean;
|
||
status: "org" | "nko";
|
||
updated_at: string;
|
||
comment: string;
|
||
files: File[];
|
||
};
|
||
|
||
type PatchVerificationBody = {
|
||
id: string;
|
||
status: "org" | "nko";
|
||
comment: string;
|
||
accepted: boolean;
|
||
};
|
||
|
||
const baseUrl =
|
||
process.env.NODE_ENV === "production" ? "" : "https://hub.pena.digital";
|
||
|
||
export const VerificationTab = () => {
|
||
const [user, setUser] = useState<Verification | null>(null);
|
||
const [comment, setComment] = useState<string>("");
|
||
const { userId } = useParams();
|
||
|
||
const requestVefification = async () =>
|
||
makeRequest<never, Verification>({
|
||
method: "get",
|
||
url: baseUrl + `/verification/verification/${userId}`,
|
||
}).then((verification) => {
|
||
setUser(verification);
|
||
setComment(verification.comment);
|
||
});
|
||
|
||
useEffect(() => {
|
||
requestVefification();
|
||
}, []);
|
||
|
||
const verify = async (accepted: boolean) => {
|
||
if (!user) {
|
||
return;
|
||
}
|
||
|
||
try {
|
||
await makeRequest<PatchVerificationBody, never>({
|
||
method: "patch",
|
||
useToken: true,
|
||
url: baseUrl + `/verification/verification`,
|
||
body: {
|
||
accepted,
|
||
comment,
|
||
id: user._id,
|
||
status: user.status,
|
||
},
|
||
});
|
||
|
||
await requestVefification();
|
||
} catch {}
|
||
};
|
||
|
||
return (
|
||
<Box sx={{ padding: "25px" }}>
|
||
<Typography
|
||
sx={{
|
||
marginBottom: "10px",
|
||
fontWeight: "bold",
|
||
color: user?.accepted ? "#0D9F00" : "#E02C2C",
|
||
}}
|
||
>
|
||
{user?.accepted ? "Верификация пройдена" : "Не верифицирован"}
|
||
</Typography>
|
||
{user?.files?.map(({ name, url }, index) => (
|
||
<Box sx={{ marginBottom: "25px" }} key={name + url}>
|
||
<Typography sx={{ fontWeight: "bold", fontSize: "18px" }}>
|
||
{index + 1}.{" "}
|
||
{name === "inn"
|
||
? "Скан ИНН организации (выписка из ЕГЮРЛ)"
|
||
: name === "rule"
|
||
? "Устав организации"
|
||
: name === "certificate"
|
||
? "Свидетельство о регистрации НКО"
|
||
: `Скан документа ${index + 1}`}
|
||
</Typography>
|
||
<Typography>
|
||
<a
|
||
style={{
|
||
color: "#7E2AEA",
|
||
textDecoration: "none",
|
||
fontSize: "18px",
|
||
}}
|
||
href={url}
|
||
>
|
||
{url.split("/").pop()?.split(".")?.[0]}
|
||
</a>
|
||
</Typography>
|
||
</Box>
|
||
))}
|
||
{user?.comment && (
|
||
<Box sx={{ marginBottom: "15px" }}>
|
||
<Typography
|
||
component="span"
|
||
sx={{ fontWeight: "bold", marginBottom: "10px" }}
|
||
>
|
||
Комментарий:
|
||
</Typography>
|
||
<Typography component="span"> {user.comment}</Typography>
|
||
</Box>
|
||
)}
|
||
<TextField
|
||
multiline
|
||
value={comment}
|
||
rows={4}
|
||
label="Комментарий"
|
||
type=""
|
||
sx={{
|
||
width: "100%",
|
||
maxWidth: "500px",
|
||
marginBottom: "10px",
|
||
}}
|
||
onChange={(event: ChangeEvent<HTMLTextAreaElement>) =>
|
||
setComment(event.target.value)
|
||
}
|
||
/>
|
||
<Box sx={{ display: "flex", columnGap: "10px" }}>
|
||
<Button
|
||
variant="text"
|
||
sx={{ background: "#9A9AAF" }}
|
||
onClick={() => verify(false)}
|
||
>
|
||
Отклонить
|
||
</Button>
|
||
<Button
|
||
variant="text"
|
||
sx={{ background: "#9A9AAF" }}
|
||
onClick={() => verify(true)}
|
||
>
|
||
Подтвердить
|
||
</Button>
|
||
</Box>
|
||
</Box>
|
||
);
|
||
};
|