diff --git a/package.json b/package.json index ff88fc5..9baaad6 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,7 @@ "start-server-and-test": "^2.0.0", "styled-components": "^5.3.5", "typescript": "^4.8.2", + "use-debounce": "^9.0.4", "web-vitals": "^2.1.4", "zustand": "^4.3.8" }, diff --git a/src/api/verification.ts b/src/api/verification.ts index d60e65d..08a56f2 100644 --- a/src/api/verification.ts +++ b/src/api/verification.ts @@ -13,14 +13,16 @@ export type Verification = { status: "org" | "nko"; updated_at: string; comment: string; + taxnumber: string; files: File[]; }; type PatchVerificationBody = { - id: string; - status: "org" | "nko"; - comment: string; - accepted: boolean; + id?: string; + status?: "org" | "nko"; + comment?: string; + accepted?: boolean; + taxnumber?: string; }; const baseUrl = @@ -55,7 +57,7 @@ export const patchVerification = async ( >({ method: "patch", useToken: true, - url: baseUrl + `/verification/verification`, + url: baseUrl + `/verification`, body, }); diff --git a/src/pages/dashboard/ModalUser/VerificationTab.tsx b/src/pages/dashboard/ModalUser/VerificationTab.tsx index 191f143..83855d6 100644 --- a/src/pages/dashboard/ModalUser/VerificationTab.tsx +++ b/src/pages/dashboard/ModalUser/VerificationTab.tsx @@ -2,6 +2,7 @@ import { useState, useEffect } from "react"; import { Box, Typography, TextField, Button } from "@mui/material"; import { verification, patchVerification } from "@root/api/verification"; import { enqueueSnackbar } from "notistack"; +import { useDebouncedCallback } from "use-debounce"; import type { ChangeEvent } from "react"; import type { Verification } from "@root/api/verification"; @@ -12,8 +13,9 @@ type VerificationTabProps = { export const VerificationTab = ({ userId }: VerificationTabProps) => { const [isLoading, setIsLoading] = useState(true); - const [user, setUser] = useState(null); + const [verificationInfo, setVerificationInfo] = useState(null); const [comment, setComment] = useState(""); + const [INN, setINN] = useState(""); const requestVefification = async () => { setIsLoading(true); @@ -29,25 +31,34 @@ export const VerificationTab = ({ userId }: VerificationTabProps) => { } if (verificationResponse) { - setUser(verificationResponse); + setVerificationInfo(verificationResponse); setComment(verificationResponse.comment); + setINN(verificationResponse.taxnumber) } }; + const debouncedINNHC = useDebouncedCallback((str) => { + patchVerification({ + taxnumber: str.replace(/[^0-9]/g,""), + id: verificationInfo?._id, + }); + }, 2000); + + useEffect(() => { requestVefification(); }, []); const verify = async (accepted: boolean) => { - if (!user) { + if (!verificationInfo) { return; } const [_, patchVerificationError] = await patchVerification({ accepted, comment, - id: user._id, - status: user.status, + id: verificationInfo._id, + status: verificationInfo.status, }); if (patchVerificationError) { @@ -63,10 +74,10 @@ export const VerificationTab = ({ userId }: VerificationTabProps) => { sx={{ marginBottom: "10px", fontWeight: "bold", - color: user?.accepted ? "#0D9F00" : "#E02C2C", + color: verificationInfo?.accepted ? "#0D9F00" : "#E02C2C", }} > - {user?.accepted ? "Верификация пройдена" : "Не верифицирован"} + {verificationInfo?.accepted ? "Верификация пройдена" : "Не верифицирован"} {isLoading ? ( { > Загрузка данных... - ) : user && user.files.length > 0 ? ( - user.files.map(({ name, url }, index) => ( + ) : + verificationInfo && verificationInfo.files.length > 0 ? ( + verificationInfo.files.map(({ name, url }, index) => ( {index + 1}.{" "} @@ -89,6 +101,7 @@ export const VerificationTab = ({ userId }: VerificationTabProps) => { { Пользователь не загружал данные )} - {user?.comment && ( + ) =>{ + if (!verificationInfo) { + return; + } + setINN(event.target.value) + debouncedINNHC(event.target.value)} + } + placeholder="ИНН" + /> + {verificationInfo?.comment && ( { > Комментарий: - {user.comment} + {verificationInfo.comment} )}