From addee744ef6f418a5ee77885dd7d8dc5f14edfa7 Mon Sep 17 00:00:00 2001 From: IlyaDoronin Date: Tue, 21 May 2024 11:21:38 +0300 Subject: [PATCH 1/6] fix: crop size --- src/pages/Questions/OptionsAndPicture/OptionsAndPicture.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/Questions/OptionsAndPicture/OptionsAndPicture.tsx b/src/pages/Questions/OptionsAndPicture/OptionsAndPicture.tsx index 314947fa..651b4859 100644 --- a/src/pages/Questions/OptionsAndPicture/OptionsAndPicture.tsx +++ b/src/pages/Questions/OptionsAndPicture/OptionsAndPicture.tsx @@ -130,7 +130,7 @@ export default function OptionsAndPicture({ if (selectedVariantId) clearQuestionImages(question.id, selectedVariantId); }} - cropAspectRatio={{ width: 452, height: 300 }} + cropAspectRatio={{ width: 300, height: 300 }} /> Date: Fri, 24 May 2024 03:40:01 +0300 Subject: [PATCH 2/6] =?UTF-8?q?=D0=BE=D1=82=D0=BA=D0=BB=D1=8E=D1=87=D0=B5?= =?UTF-8?q?=D0=BD=D0=B8=D0=B5=20=D1=84=D0=BE=D1=80=D0=BC=D1=8B=20=D0=BA?= =?UTF-8?q?=D0=BE=D0=BD=D1=82=D0=B0=D0=BA=D1=82=D0=BE=D0=B2=20=D0=B8=20?= =?UTF-8?q?=D0=B0=D0=BD=D1=82=D0=B8=D1=84=D1=80=D0=BE=D0=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/model/quizSettings.ts | 4 ++++ src/pages/ContactFormPage/ContactFormPage.tsx | 16 ++++++++++++++++ src/pages/startPage/StartPageSettings.tsx | 18 ++++++++++++++++++ src/stores/quizes.ts | 4 ++++ 4 files changed, 42 insertions(+) diff --git a/src/model/quizSettings.ts b/src/model/quizSettings.ts index b0118cd3..41fe92c1 100644 --- a/src/model/quizSettings.ts +++ b/src/model/quizSettings.ts @@ -114,6 +114,8 @@ export interface QuizConfig { law?: string; }; meta: string; + antifraud: boolean; + showfc: boolean; yandexMetricsNumber: number | undefined; vkMetricsNumber: number | undefined; } @@ -228,6 +230,8 @@ export const defaultQuizConfig: QuizConfig = { button: "", }, meta: "", + antifraud: true, + showfc: true, yandexMetricsNumber: undefined, vkMetricsNumber: undefined, }; diff --git a/src/pages/ContactFormPage/ContactFormPage.tsx b/src/pages/ContactFormPage/ContactFormPage.tsx index 0ad52a83..7117f422 100644 --- a/src/pages/ContactFormPage/ContactFormPage.tsx +++ b/src/pages/ContactFormPage/ContactFormPage.tsx @@ -35,6 +35,7 @@ import { FieldSettingsDrawerState, FormContactFieldName, } from "@model/quizSettings"; +import CustomizedSwitch from "@ui_kit/CustomSwitch"; const buttons: { key: FormContactFieldName; name: string; desc: string }[] = [ { name: "Имя", desc: "Дмитрий", key: "name" }, @@ -63,6 +64,21 @@ export default function ContactFormPage() { mt: "67px", }} > + + { + updateQuiz(quiz.id, (quiz) => { + quiz.config.showfc = e.target.checked; + + }) + }} + /> + + Показывать форму контактов + {!quiz?.config.formContact.fields.name.used && !quiz?.config.formContact.fields.email.used && !quiz?.config.formContact.fields.phone.used && diff --git a/src/pages/startPage/StartPageSettings.tsx b/src/pages/startPage/StartPageSettings.tsx index ea667fa7..385c4ec5 100755 --- a/src/pages/startPage/StartPageSettings.tsx +++ b/src/pages/startPage/StartPageSettings.tsx @@ -10,6 +10,7 @@ import { QuizStartpageType } from "@model/quizSettings"; import InfoIcon from "@icons/InfoIcon"; import UploadBox from "@ui_kit/UploadBox"; import UploadIcon from "../../assets/icons/UploadIcon"; +import CustomizedSwitch from "@ui_kit/CustomSwitch"; import { Box, @@ -46,6 +47,7 @@ import { DropZone } from "./dropZone"; import Extra from "./extra"; import TooltipClickInfo from "@ui_kit/Toolbars/TooltipClickInfo"; import { VideoElement } from "./VideoElement"; +import * as React from "react"; const designTypes = [ [ @@ -868,6 +870,22 @@ export default function StartPageSettings() { maxLength={1000} /> + + { + updateQuiz(quiz.id, (quiz) => { + quiz.config.antifraud = e.target.checked; + + }) + }} + /> + + Включить антифрод + + )} diff --git a/src/stores/quizes.ts b/src/stores/quizes.ts index cdee3acc..327f9eb3 100644 --- a/src/stores/quizes.ts +++ b/src/stores/quizes.ts @@ -62,6 +62,8 @@ export interface Quizes { law?: string; }; meta: string; + antifraud: boolean; + showfc: boolean; }; } @@ -150,6 +152,8 @@ export const quizStore = create()( law: "", }, meta: "что-то", + antifraud: true, + showfc: true }, }; set({ listQuizes: newListQuizes }); From 9e21fc491dacb29cf235be624c924adefae45a9a Mon Sep 17 00:00:00 2001 From: aleksandr-raw <104529174+aleksandr-raw@users.noreply.github.com> Date: Fri, 17 May 2024 16:04:59 +0400 Subject: [PATCH 3/6] restored amo modal --- ...{IntegrationsModal.tsx => AmoCRMModal.tsx} | 4 +- .../IntegrationStep6/IntegrationStep6.tsx | 2 +- .../IntegrationStep6/Item/Item.tsx | 7 +- .../ItemDetailsView/ItemDetailsView.tsx | 2 +- .../IntegrationStep7/IntegrationStep7.tsx | 2 +- .../TagsDetailsView/TagsDetailsView.tsx | 2 +- .../SettingsBlock/SettingItem/SettingItem.tsx | 2 +- .../SettingsBlock/SettingsBlock.tsx | 2 +- .../IntegrationsPage/IntegrationsPage.tsx | 19 ++-- .../PartnersBoard/PartnerItem/PartnerItem.tsx | 50 ---------- .../PartnersBoard/PartnersBoard.tsx | 90 ++++++++---------- .../IntegrationsPage/mocks/AmoCRMLogo.tsx | 6 ++ src/pages/IntegrationsPage/mocks/MockData.ts | 6 -- .../IntegrationsPage/mocks/amoCRMLogo.svg | 9 ++ .../IntegrationsPage/mocks/amoCrmLogo.png | Bin 3374 -> 0 bytes 15 files changed, 74 insertions(+), 129 deletions(-) rename src/pages/IntegrationsPage/IntegrationsModal/{IntegrationsModal.tsx => AmoCRMModal.tsx} (98%) delete mode 100644 src/pages/IntegrationsPage/PartnersBoard/PartnerItem/PartnerItem.tsx create mode 100644 src/pages/IntegrationsPage/mocks/AmoCRMLogo.tsx create mode 100644 src/pages/IntegrationsPage/mocks/amoCRMLogo.svg delete mode 100644 src/pages/IntegrationsPage/mocks/amoCrmLogo.png diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationsModal.tsx b/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx similarity index 98% rename from src/pages/IntegrationsPage/IntegrationsModal/IntegrationsModal.tsx rename to src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx index e78f1d71..7a15289e 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationsModal.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx @@ -15,7 +15,6 @@ import { IntegrationStep4 } from "./IntegrationStep4/IntegrationStep4"; import { IntegrationStep5 } from "./IntegrationStep5/IntegrationStep5"; import { IntegrationStep6 } from "./IntegrationStep6/IntegrationStep6"; import { funnelsMock, performersMock, stagesMock } from "../mocks/MockData"; -import File from "@ui_kit/QuizPreview/QuizPreviewQuestionTypes/File"; import { IntegrationsModalTitle } from "./IntegrationsModalTitle/IntegrationsModalTitle"; import { SettingsBlock } from "./SettingsBlock/SettingsBlock"; import { IntegrationStep7 } from "./IntegrationStep7/IntegrationStep7"; @@ -32,7 +31,7 @@ type IntegrationsModalProps = { export type TagKeys = "contact" | "company" | "deal" | "buyer"; export type TTags = Record; -export const IntegrationsModal: FC = ({ +export const AmoCRMModal: FC = ({ isModalOpen, handleCloseModal, companyName, @@ -209,6 +208,7 @@ export const IntegrationsModal: FC = ({ fontSize: isMobile ? "20px" : "24px", fontWeight: "500", padding: "20px", + color: theme.palette.grey2.main, }} > Интеграция с {companyName ? companyName : "партнером"} diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/IntegrationStep6.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/IntegrationStep6.tsx index fb7f7a1b..5911f001 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/IntegrationStep6.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/IntegrationStep6.tsx @@ -9,7 +9,7 @@ import { } from "react"; import { ItemsSelectionView } from "./ItemsSelectionView/ItemsSelectionView"; import { ItemDetailsView } from "./ItemDetailsView/ItemDetailsView"; -import { TitleKeys, TQuestionEntity } from "../IntegrationsModal"; +import { TitleKeys, TQuestionEntity } from "../AmoCRMModal"; import Box from "@mui/material/Box"; type IntegrationStep6Props = { diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/Item/Item.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/Item/Item.tsx index 55c746f9..d902eb12 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/Item/Item.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/Item/Item.tsx @@ -2,12 +2,7 @@ import { Box, Typography, useTheme } from "@mui/material"; import { FC } from "react"; import { IconBtnAdd } from "./IconBtnAdd/IconBtnAdd"; import { AnswerItem } from "./AnswerItem/AnswerItem"; -import { - TagKeys, - TitleKeys, - TQuestionEntity, - TTags, -} from "../../IntegrationsModal"; +import { TagKeys, TitleKeys, TQuestionEntity, TTags } from "../../AmoCRMModal"; type ItemProps = { title: TitleKeys | TagKeys; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/ItemDetailsView/ItemDetailsView.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/ItemDetailsView/ItemDetailsView.tsx index a22eec6e..e468013d 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/ItemDetailsView/ItemDetailsView.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/ItemDetailsView/ItemDetailsView.tsx @@ -2,7 +2,7 @@ import { Box, useTheme } from "@mui/material"; import { Item } from "../Item/Item"; import { StepButtonsBlock } from "../../StepButtonsBlock/StepButtonsBlock"; import { FC } from "react"; -import { TQuestionEntity } from "../../IntegrationsModal"; +import { TQuestionEntity } from "../../AmoCRMModal"; type TitleKeys = "contacts" | "company" | "deal" | "users" | "buyers"; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/IntegrationStep7.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/IntegrationStep7.tsx index 80607d8b..756c891f 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/IntegrationStep7.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/IntegrationStep7.tsx @@ -8,7 +8,7 @@ import { useState, } from "react"; -import { TagKeys, TTags } from "../IntegrationsModal"; +import { TagKeys, TTags } from "../AmoCRMModal"; import Box from "@mui/material/Box"; import { ItemsSelectionView } from "../IntegrationStep6/ItemsSelectionView/ItemsSelectionView"; import { TagsDetailsView } from "./TagsDetailsView/TagsDetailsView"; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/TagsDetailsView/TagsDetailsView.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/TagsDetailsView/TagsDetailsView.tsx index 43b050f7..f2091b71 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/TagsDetailsView/TagsDetailsView.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/TagsDetailsView/TagsDetailsView.tsx @@ -1,7 +1,7 @@ import { Box, Typography, useTheme } from "@mui/material"; import { StepButtonsBlock } from "../../StepButtonsBlock/StepButtonsBlock"; import { FC } from "react"; -import { TagKeys, TTags } from "../../IntegrationsModal"; +import { TagKeys, TTags } from "../../AmoCRMModal"; import { Item } from "../../IntegrationStep6/Item/Item"; type TagsDetailsViewProps = { diff --git a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx index 80ace601..bad4f702 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx @@ -5,7 +5,7 @@ import { SettingItemHeader } from "./SettingItemHeader/SettingItemHeader"; import { ResponsiblePerson } from "./ResponsiblePerson/ResponsiblePerson"; import { SelectedParameter } from "./SelectedParameter/SelectedParameter"; import { FileBlock } from "../../IntegrationStep5/FileBlock/FileBlock"; -import { TQuestionEntity, TTags } from "../../IntegrationsModal"; +import { TQuestionEntity, TTags } from "../../AmoCRMModal"; type SettingItemProps = { step: number; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx index 523666fd..4d7b67ee 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx @@ -2,7 +2,7 @@ import { FC } from "react"; import { Box, useMediaQuery, useTheme } from "@mui/material"; import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock"; import { SettingItem } from "./SettingItem/SettingItem"; -import { TQuestionEntity, TTags } from "../IntegrationsModal"; +import { TQuestionEntity, TTags } from "../AmoCRMModal"; type SettingsBlockProps = { stepTitles: string[]; diff --git a/src/pages/IntegrationsPage/IntegrationsPage.tsx b/src/pages/IntegrationsPage/IntegrationsPage.tsx index 7357dca1..b74e3650 100644 --- a/src/pages/IntegrationsPage/IntegrationsPage.tsx +++ b/src/pages/IntegrationsPage/IntegrationsPage.tsx @@ -5,7 +5,6 @@ import { useCurrentQuiz } from "@root/quizes/hooks"; import { useQuizStore } from "@root/quizes/store"; import { useNavigate } from "react-router-dom"; import { PartnersBoard } from "./PartnersBoard/PartnersBoard"; -import { partnersMock } from "./mocks/MockData"; import { QuizMetricType } from "@model/quizSettings"; interface IntegrationsPageProps { @@ -26,6 +25,9 @@ export const IntegrationsPage = ({ const [companyName, setCompanyName] = useState< keyof typeof QuizMetricType | null >(null); + + const [isAmoCrmModalOpen, setIsAmoCrmModalOpen] = useState(false); + useEffect(() => { if (editQuizId === null) navigate("/list"); }, [navigate, editQuizId]); @@ -38,9 +40,9 @@ export const IntegrationsPage = ({ const handleCloseModal = () => { setIsModalOpen(false); - // setTimeout(() => { - // setCompanyName(null); - // }, 300); + }; + const handleCloseAmoSRMModal = () => { + setIsAmoCrmModalOpen(false); }; return ( @@ -63,18 +65,15 @@ export const IntegrationsPage = ({ Интеграции - {/**/} ); diff --git a/src/pages/IntegrationsPage/PartnersBoard/PartnerItem/PartnerItem.tsx b/src/pages/IntegrationsPage/PartnersBoard/PartnerItem/PartnerItem.tsx deleted file mode 100644 index b780ed4e..00000000 --- a/src/pages/IntegrationsPage/PartnersBoard/PartnerItem/PartnerItem.tsx +++ /dev/null @@ -1,50 +0,0 @@ -import { Box, Typography, useTheme } from "@mui/material"; -import { FC } from "react"; -import { Partner } from "../PartnersBoard"; - -type PartnerItemProps = { - partner: Partner; - setIsModalOpen: (value: boolean) => void; - setCompanyName: (value: string) => void; -}; - -export const PartnerItem: FC = ({ - partner, - setIsModalOpen, - setCompanyName, -}) => { - const theme = useTheme(); - - const handleClick = () => { - setCompanyName(partner.name); - setIsModalOpen(true); - }; - - return ( - <> - {partner && ( - - {partner.logo ? ( - {partner.name} - ) : ( - {partner.name} - )} - - )} - - ); -}; diff --git a/src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx b/src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx index e39d98e8..c44b90c0 100644 --- a/src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx +++ b/src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx @@ -1,44 +1,36 @@ import { Box, Typography, useTheme } from "@mui/material"; -import { FC } from "react"; +import React, { FC } from "react"; import { ServiceButton } from "./ServiceButton/ServiceButton"; import { YandexMetricaLogo } from "../mocks/YandexMetricaLogo"; import AnalyticsModal from "./AnalyticsModal/AnalyticsModal"; import { VKPixelLogo } from "../mocks/VKPixelLogo"; import { QuizMetricType } from "@model/quizSettings"; - -export type Partner = { - name: string; - logo?: string; - category: string; -}; +import { AmoCRMLogo } from "../mocks/AmoCRMLogo"; +import { AmoCRMModal } from "../IntegrationsModal/AmoCRMModal"; type PartnersBoardProps = { - partners: Partner[]; setIsModalOpen: (value: boolean) => void; companyName: keyof typeof QuizMetricType | null; setCompanyName: (value: keyof typeof QuizMetricType) => void; isModalOpen: boolean; handleCloseModal: () => void; + setIsAmoCrmModalOpen: (value: boolean) => void; + isAmoCrmModalOpen: boolean; + handleCloseAmoSRMModal: () => void; }; export const PartnersBoard: FC = ({ - partners, setIsModalOpen, isModalOpen, handleCloseModal, companyName, setCompanyName, + setIsAmoCrmModalOpen, + isAmoCrmModalOpen, + handleCloseAmoSRMModal, }) => { const theme = useTheme(); - // const partnersByCategory = partners.reduce( - // (acc, partner) => { - // (acc[partner.category] = acc[partner.category] || []).push(partner); - // return acc; - // }, - // {} as Record, - // ); - return ( = ({ justifyContent: { xs: "center", sm: "center", md: "start" }, }} > - {/*{Object.entries(partnersByCategory).map(([category, partners]) => (*/} - {/* */} - {/* */} - {/* {category}*/} - {/* */} - {/* */} - {/* {partners.map((partner) => (*/} - {/* */} - {/* ))}*/} - - {/* */} - {/* */} - {/*))}*/} - + + CRM + + + } + setIsModalOpen={setIsAmoCrmModalOpen} + setCompanyName={setCompanyName} + name={"amoCRM"} + /> + + = ({ companyName={companyName} /> )} + {companyName && ( + + )} ); }; diff --git a/src/pages/IntegrationsPage/mocks/AmoCRMLogo.tsx b/src/pages/IntegrationsPage/mocks/AmoCRMLogo.tsx new file mode 100644 index 00000000..be6b1460 --- /dev/null +++ b/src/pages/IntegrationsPage/mocks/AmoCRMLogo.tsx @@ -0,0 +1,6 @@ +import React from "react"; +import { ReactComponent as AmoLogo } from "./amoCRMLogo.svg"; + +export const AmoCRMLogo = () => { + return ; +}; diff --git a/src/pages/IntegrationsPage/mocks/MockData.ts b/src/pages/IntegrationsPage/mocks/MockData.ts index 22094d4f..e38462fc 100644 --- a/src/pages/IntegrationsPage/mocks/MockData.ts +++ b/src/pages/IntegrationsPage/mocks/MockData.ts @@ -1,9 +1,3 @@ -import amoCrmLogo from "./amoCrmLogo.png"; - -export const partnersMock = [ - { category: "CRM", name: "amoCRM", logo: amoCrmLogo }, -]; - export const performersMock = [ "Ангелина Полякова", "Петр Иванов", diff --git a/src/pages/IntegrationsPage/mocks/amoCRMLogo.svg b/src/pages/IntegrationsPage/mocks/amoCRMLogo.svg new file mode 100644 index 00000000..c531cc0b --- /dev/null +++ b/src/pages/IntegrationsPage/mocks/amoCRMLogo.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/pages/IntegrationsPage/mocks/amoCrmLogo.png b/src/pages/IntegrationsPage/mocks/amoCrmLogo.png deleted file mode 100644 index 07d03d78474832ac5d0e8cf8e3bd42bed9c98936..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 3374 zcmai%=QkS+8^)tl39+|WrAF;7N)WZT+R{{v8byl7UbXiKwO4JmsTHegR;`wY)GUos zGgOTxT5q4f;JwcI-PgJ95BE9u$1BOySO)~;00IC2ke=>C^S|!(7gY-Kzq2-AxBRbB zKG(JN0|2NP|APcjSj_f!N#bX&0|PYAg7^LgGFJ^F4FI4mgX$W28vvjl(R-+25kzui zOZD7hksW%2A#TLRp40*FO1;pdK*3H==_ku#ZQCM3Sg#2#;~4_y9y5O{fvkbzY)Ds%0G$rgp;Avcg+ zwHsowRL!gZtCPq(j=NI1hbc6#@_Tq$WbJ)pq6qAydVv>`E1?xBI+qt%Ic{FxF~gQm zQnf93UV6%+ryo4ZLE;|AcpNkm{#|E>`5y@KGH!{=`sCWCe3GH`Ask$&CUD?)p*94m zl@r-E)BHKb#+UfSEj#K6lR>u7vow3WkPm>}8so4MF=mYJzbwXs>5 zSxB`wQT>T?Rxm9B^X4&yPZl-D7~Byk-ODo^Q08;@oq~pPT+qS3XZ+9~XW&sraq9hP z^n~$|%3%s2ej2PHv}`*HsqDxJjZ*|;c~}hBA~>?Fgpd7a_c%WGf1nOobRJjm7Nj8` zfoONwhrK9}LXph09Fb6DE7KQ=8!n}wd#Fkq$~$Q|&dWmq5w~t#gCj#=lk>WU1D!7I zSZrl3oN#_J{VBSDTz2$eHRW2eC2FE|uYjLG|A#IJ%3p z!>-q&hb%*W|8a$wX$^lnfL6XNbfx{-uUI>zNUFd3HDAH503RN^w!?2~h^d zLU{P#Jm>ZxRpzbTn(r7P(PzSb2dJ35iB}_K8n4xa(hy)wZBw*A!)*OLF8~+^b6uCp z{kMEm7dV>^p4-!I4DudCWu^4BJROEl8TLADINW><)_SZE2a6^q6C|BRMc0SrhalEs zYw&|jHKC4(n5PU0u4YepqVJvf1iF+*rit0<1`dd?Igsc2j``1WK`@g8%~l-z%!rnm zV86Y)p6WI3l$E{l;2w0^S+1n&Q}XjEk??oLa3a@M6T|{hYSaE;p0n(+3|0HSS05s{ z7F9}o0$H|cVEL}X96?TsxK=SzE3DqKCyQ%^5{ZnPQ%p&In(Kes25~V zlM>DowU*eWKdp^b+nvxRG!I3Et>6#9aJZ(5cWzWGn|1(zzhfLqH6hXJ<3vMeHPT)Fu{p9&Y4G~Yc@zRA{0!CF`-oh|&D z49nYh{b@dgE8Kis#W@2-FHU>H#@}&WRvGsH<5Qz5wjth2Nk0IY%)2s2Iei*C zCwMl}Z!vMDEorcnJ0vjLg#~-q=shJTxXn7?dmp)0Bli>?b&~oOafY9Ne2mgn{1nfh z@Q-^Mk8?>Z&2G{D{t71_wlCjBSE&kU$DP!XLtHzScbhVnF*HJSceP_6GGILGs#AGp zWpM|d?^MmBTf-p_X3BguN$S1=Oq!ky4qiv`8)Iw6_c?YI^KzLC<_0o*Y~ClW<1bDk zy_Vanr{&W4#AMwCGVzg@(+`pmljh%`)DEidXhN+~JFtyg4O;v(B%tySvnRDxb< z&{L2g!XbSm(AQQ$;+!c_oyyZBqf3yWffSjbJ8#VX$XD&P*3%|xz6a|kZzO+Yk;Y{Y zw?!Z#WWY2dzHu&lC&Q8HV2HV$MVl_SQg+e&73sZul^e;Nr*q(iUb+ATGVy$Pk1Me{ z^Sz4gsKA{RYXkk{vX-WGtMvF_LyklT{G?`^J1|yjAIBEzMqUzfur>OqjDm+@j;mlj z#lLu3$R)kPSs)X7np*QqXBwk)k}g0=$u6T6;qeemhEm?8UPP8fr*-DC)|twGN!bH= z9MiimQHNysGbmTd-tcHU?APtJS_L?BE2zBTdC@w&asdXe#tLzO6 zt{DZXQT=-A7Wj%cNopdPo_lYivi5fqI@I<@+Te)!*7ZX_oP}4Gauc(u7hK+c4iLyh zd`V?;*!uNm8HoADwM@mafTqpq)%H79N+`ywd#(R|@Y z9vBP3r_YOh!rr%-xkPT%V5s%&6Dbt+hN8{2pT1}sTZwNBQ`VM3eTJTuStC6e@eo=z zrwaU$*^iSG=rZ9n@^Lps6Hb5{D?JWTU3?vHf?v#iv%TMVV$cHi4`qeQoc!EU6=z%` zVLP?a#=w3qWBgpL3;awsaGU%63SYw;8oCW%41bW}l&tqz-0_|?ik(x7+i*_FJ4#yb?Kqx-8U#*E+2PQ& z=!uB2Kb&MlIoUhEDX14n`;61$p*0WOLZ+zPiL!n2^Q7aZ`72M9t|qtUWc(6O#h5ST z9f{S^m6)vwr27JIqNS?fsy^Zq+aQ)~|=k1w0U2c&FulHaA zo{_=8B%x}zXtp$7&d6sit<6@rt0)MF%G&x?r;$O-$BF(DdE9A2=G~O3pmBJlclUMb zOsD<0ro+U?NFROV`N^i2@YibuIy3iI_D_%0a4KXFGcGafF5ke2civMcsnbOyrOOxM zOGnx>WBYb{{D|D#y{qXqcSBk9fctl@}`9v1K?JFDQ?LBTTQ0f{cg9L zsbH0_>=_S$iQ6k}X74(g^lD?;+>!UfGl^jTkO?7SSUv?RkB5+F27tRH$Hf@GKu!b#iDsd$p`Q+BTN>wA*U) zVyL&0@h7XzW`eL}ZCN1VQfp5f(_x!W3_Ka5n>BP98>`%zP_biYie0-`8rOw|CCxeh zDI3QTs-4DDAv@cs3tl|6KsfuYgSO@z#_gMr4sM|5_)eQEbNJy#jMBZ9jv?rSL>0z* z;fjv=`*+A4+^z#svn{u!PtM}q=W|AXp|YJuS@X|NwPM;AZpg+gP3D#KxrdknFVxf=w}v*H?dZ*YWSgA3U8{szv#4!S7|21ns&Kl0&*87Qvz> zi4tBqg&i18Kk?gQt7lqWeC^tVIDBP6+_s8qJ99#;+6o7II-voHEJvY;m~Hl1oD1Ym n;pa)US9D0=|JSa>AJSjv2FZ*i(f9t=8-Sjc@xx}AL-hXu0E}@3 From 73fa046cc8cc4c0375440b480a07236d6f20c667 Mon Sep 17 00:00:00 2001 From: aleksandr-raw <104529174+aleksandr-raw@users.noreply.github.com> Date: Mon, 20 May 2024 22:15:36 +0400 Subject: [PATCH 4/6] realized steps, users, tags... WIP --- src/api/integration.ts | 114 ++++++++++ .../CustomRadioGroup/CustomRadioGroup.tsx | 206 ++++++++++++++---- src/components/CustomSelect/CustomSelect.tsx | 77 +++++-- .../IntegrationsModal/AmoCRMModal.tsx | 1 + .../IntegrationStep2/IntegrationStep2.tsx | 3 +- .../IntegrationStep3/IntegrationStep3.tsx | 9 +- .../IntegrationStep4/IntegrationStep4.tsx | 2 +- .../ItemsSelectionView/ItemsSelectionView.tsx | 3 + .../IntegrationStep7/IntegrationStep7.tsx | 1 + 9 files changed, 356 insertions(+), 60 deletions(-) create mode 100644 src/api/integration.ts diff --git a/src/api/integration.ts b/src/api/integration.ts new file mode 100644 index 00000000..7d59a3f4 --- /dev/null +++ b/src/api/integration.ts @@ -0,0 +1,114 @@ +import { makeRequest } from "@api/makeRequest"; +import { parseAxiosError } from "@utils/parse-error"; + +export type PaginationRequest = { + page: number; + size: number; +}; + +export type Tag = { + ID: number; + AmoID: number; + AccountID: number; + Entity: string; + Name: string; + Color: string; + Deleted: boolean; + CreatedAt: number; +}; + +export type TagsResponse = { + count: number; + items: Tag[]; +}; +const API_URL = `${process.env.REACT_APP_DOMAIN}/squiz/amocrm/amocrm`; + +export const getTags = async ({ + page, + size, +}: PaginationRequest): Promise<[TagsResponse | null, string?]> => { + try { + const tagsResponse = await makeRequest({ + method: "GET", + url: `${API_URL}/tags?page=${page}&size=${size}`, + }); + return [tagsResponse]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Не удалось получить список тегов. ${error}`]; + } +}; + +export type User = { + ID: number; + AccountID: string; + AmoID: number; + Name: string; + Email: string; + Role: string; + Group: number; + Deleted: boolean; + CreatedAt: number; + Subdomain: string; + Amoiserid: number; + Country: string; +}; + +export type UsersResponse = { + count: number; + items: User[]; +}; + +export const getUsers = async ({ + page, + size, +}: PaginationRequest): Promise<[UsersResponse | null, string?]> => { + try { + const usersResponse = await makeRequest({ + method: "GET", + url: `${API_URL}/users?page=${page}&size=${size}`, + }); + return [usersResponse]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Не удалось получить список пользователей. ${error}`]; + } +}; + +export type Step = { + ID: number; + AmoID: number; + PipelineID: number; + AccountID: number; + Name: string; + Color: string; + Deleted: boolean; + CreatedAt: number; +}; + +export type StepsResponse = { + count: number; + items: Step[]; +}; + +export const getSteps = async ({ + page, + size, + pipelineId, +}: PaginationRequest & { pipelineId: number }): Promise< + [StepsResponse | null, string?] +> => { + try { + const stepsResponse = await makeRequest< + PaginationRequest & { pipelineId: number }, + StepsResponse + >({ + method: "GET", + url: `${API_URL}/steps?page=${page}&size=${size}&pipelineID=${pipelineId}`, + }); + return [stepsResponse]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Не удалось получить список шагов. ${error}`]; + } +}; diff --git a/src/components/CustomRadioGroup/CustomRadioGroup.tsx b/src/components/CustomRadioGroup/CustomRadioGroup.tsx index 3710f25d..f70395c1 100644 --- a/src/components/CustomRadioGroup/CustomRadioGroup.tsx +++ b/src/components/CustomRadioGroup/CustomRadioGroup.tsx @@ -1,33 +1,195 @@ import * as React from "react"; -import { FC } from "react"; +import { FC, useEffect, useMemo, useRef, useState } from "react"; import Radio from "@mui/material/Radio"; import RadioGroup from "@mui/material/RadioGroup"; import FormControlLabel from "@mui/material/FormControlLabel"; import Box from "@mui/material/Box"; import CheckboxIcon from "@icons/Checkbox"; -import { useTheme } from "@mui/material"; +import { Typography, useTheme } from "@mui/material"; +import { + getSteps, + getTags, + PaginationRequest, + Step, + Tag, +} from "@api/integration"; type CustomRadioGroupProps = { - items: string[]; + type?: string; selectedValue: string | null; setSelectedValue: (value: string | null) => void; + pipelineId?: number | null; }; +const SIZE = 25; + export const CustomRadioGroup: FC = ({ - items, + type, selectedValue, setSelectedValue, + pipelineId, }) => { const theme = useTheme(); - const [currentValue, setCurrentValue] = React.useState( + const [currentValue, setCurrentValue] = useState( selectedValue, ); + const [page, setPage] = useState(1); + const [isLoading, setIsLoading] = useState(false); + const [tags, setTags] = useState([]); + const [steps, setSteps] = useState([]); + const [hasMoreItems, setHasMoreItems] = useState(true); + const boxRef = useRef(null); + const handleChange = (event: React.ChangeEvent) => { setSelectedValue((event.target as HTMLInputElement).value); setCurrentValue((event.target as HTMLInputElement).value); }; + + const handleScroll = (e: React.UIEvent) => { + const scrollHeight = e.currentTarget.scrollHeight; + const scrollTop = e.currentTarget.scrollTop; + const clientHeight = e.currentTarget.clientHeight; + const scrolledToBottom = scrollTop / (scrollHeight - clientHeight) > 0.9; + + if (scrolledToBottom && !isLoading && hasMoreItems) { + setPage((prevPage) => prevPage + 1); + } + }; + + useEffect(() => { + if (type === "typeTags" && hasMoreItems) { + setIsLoading(true); + const pagination: PaginationRequest = { + page: page, + size: SIZE, + }; + getTags(pagination).then(([response]) => { + if (response && response.items !== null) { + setTags((prevItems) => [...prevItems, ...response.items]); + if (response.items.length < SIZE) { + setHasMoreItems(false); + } + } + setIsLoading(false); + }); + } + if (type === "typeSteps" && hasMoreItems && pipelineId) { + setIsLoading(true); + const pagination: PaginationRequest & { pipelineId: number } = { + page: page, + size: SIZE, + pipelineId: pipelineId, + }; + getSteps(pagination).then(([response]) => { + if (response && response.items !== null) { + setSteps((prevItems) => [...prevItems, ...response.items]); + if (response.items.length < SIZE) { + setHasMoreItems(false); + } + } + setIsLoading(false); + }); + } + }, [page, type, hasMoreItems, pipelineId]); + + const formControlLabels = useMemo(() => { + if (type === "typeTags" && tags && tags.length !== 0) { + return tags.map((item) => ( + + } + icon={} + /> + } + // label={item.Name} + label={ + + + {item.Name} + + {item.Entity} + + } + labelPlacement={"start"} + /> + )); + } + if (type === "typeSteps" && steps && steps.length !== 0) { + return steps.map((step) => ( + + } + icon={} + /> + } + label={step.Name} + labelPlacement={"start"} + /> + )); + } + return ( + + Нет элементов + + ); + }, [tags, currentValue, type]); + return ( = ({ value={currentValue} onChange={handleChange} > - {items.map((item) => ( - - } - icon={} - /> - } - label={item} - labelPlacement={"start"} - /> - ))} + {formControlLabels} ); diff --git a/src/components/CustomSelect/CustomSelect.tsx b/src/components/CustomSelect/CustomSelect.tsx index c98c5d55..ce2db1b6 100644 --- a/src/components/CustomSelect/CustomSelect.tsx +++ b/src/components/CustomSelect/CustomSelect.tsx @@ -8,26 +8,34 @@ import { useTheme, } from "@mui/material"; import Box from "@mui/material/Box"; -import { FC, useCallback, useRef, useState } from "react"; +import * as React from "react"; +import { FC, useCallback, useEffect, useMemo, useRef, useState } from "react"; import "./CustomSelect.css"; import arrow_down from "../../assets/icons/arrow_down.svg"; +import { getUsers, PaginationRequest, User } from "@api/integration"; type CustomSelectProps = { - items: string[]; selectedItem: string | null; setSelectedItem: (value: string | null) => void; + type?: string; }; export const CustomSelect: FC = ({ - items, selectedItem, setSelectedItem, + type, }) => { const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down(600)); const [opened, setOpened] = useState(false); const [currentValue, setCurrentValue] = useState(selectedItem); + const [users, setUsers] = useState([]); + const [isLoading, setIsLoading] = useState(false); + const [page, setPage] = useState(1); + const [hasMoreItems, setHasMoreItems] = useState(true); + const SIZE = 25; const ref = useRef(null); + console.log("page", page); const onSelectItem = useCallback( (event: SelectChangeEvent) => { @@ -42,6 +50,55 @@ export const CustomSelect: FC = ({ setOpened((isOpened) => !isOpened); }, []); + const handleScroll = (e: React.UIEvent) => { + const scrollHeight = e.currentTarget.scrollHeight; + const scrollTop = e.currentTarget.scrollTop; + const clientHeight = e.currentTarget.clientHeight; + const scrolledToBottom = scrollTop / (scrollHeight - clientHeight) > 0.9; + + if (scrolledToBottom && !isLoading && hasMoreItems) { + setPage((prevPage) => prevPage + 1); + } + }; + + useEffect(() => { + if (type === "typeUsers" && hasMoreItems) { + setIsLoading(true); + const pagination: PaginationRequest = { + page: page, + size: SIZE, + }; + getUsers(pagination).then(([response]) => { + if (response && response.items !== null) { + setUsers((prevItems) => [...prevItems, ...response.items]); + if (response.items.length < SIZE) { + setHasMoreItems(false); + } + } + setIsLoading(false); + }); + } + }, [page, type, hasMoreItems]); + + const menuItems = useMemo(() => { + if (type === "typeUsers" && users && users.length !== 0) { + return users.map((user) => ( + + {user.Name} + + )); + } + return ( + + нет данных + + ); + }, [users, type]); + return ( = ({ MenuProps={{ disablePortal: true, PaperProps: { + onScroll: handleScroll, style: { zIndex: 2, maxHeight: "300px", @@ -111,18 +169,7 @@ export const CustomSelect: FC = ({ onChange={onSelectItem} onClick={toggleOpened} > - {items.map((item) => { - const uniqueKey = `${item}-${Date.now()}`; - return ( - - {item} - - ); - })} + {menuItems} ); diff --git a/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx b/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx index 7a15289e..dc924892 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx @@ -115,6 +115,7 @@ export const AmoCRMModal: FC = ({ setSelectedStage={setSelectedStage} performers={performersMock} stages={stagesMock} + pipelineId={selectedFunnel} /> ), }, diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx index edd16fd2..129dd95e 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx @@ -41,8 +41,8 @@ export const IntegrationStep2: FC = ({ = ({ }} > diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep3/IntegrationStep3.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep3/IntegrationStep3.tsx index 75d77f10..ecf8bc99 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep3/IntegrationStep3.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep3/IntegrationStep3.tsx @@ -13,6 +13,7 @@ type IntegrationStep3Props = { setSelectedStage: (value: string | null) => void; performers: string[]; stages: string[]; + pipelineId: string | null; }; export const IntegrationStep3: FC = ({ @@ -22,8 +23,7 @@ export const IntegrationStep3: FC = ({ setSelectedStagePerformer, selectedStage, setSelectedStage, - performers, - stages, + pipelineId, }) => { const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down(600)); @@ -42,7 +42,7 @@ export const IntegrationStep3: FC = ({ @@ -55,7 +55,8 @@ export const IntegrationStep3: FC = ({ }} > diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep4/IntegrationStep4.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep4/IntegrationStep4.tsx index 88009b2e..c50cecfb 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep4/IntegrationStep4.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep4/IntegrationStep4.tsx @@ -35,8 +35,8 @@ export const IntegrationStep4: FC = ({ void; @@ -17,6 +18,7 @@ export const ItemsSelectionView: FC = ({ setSelectedValue, onLargeBtnClick, onSmallBtnClick, + type, }) => { return ( = ({ }} > = ({ items={items} selectedValue={selectedValue} setSelectedValue={setSelectedValue} + type={"typeTags"} onSmallBtnClick={() => { setActiveItem(null); setIsSelection(false); From a66a4764cf57f5ea3387031c5eeecc536e59ac4a Mon Sep 17 00:00:00 2001 From: aleksandr-raw <104529174+aleksandr-raw@users.noreply.github.com> Date: Wed, 22 May 2024 01:29:33 +0400 Subject: [PATCH 5/6] WIP... realized pipelines, users, removed utm, refactored modals with lazy --- src/api/integration.ts | 36 ++++++- .../CustomRadioGroup/CustomRadioGroup.tsx | 57 ++++++++++- src/components/CustomSelect/CustomSelect.tsx | 66 ++++++++++++- .../IntegrationsModal/AmoCRMModal.tsx | 67 +++++-------- .../IntegrationStep2/IntegrationStep2.tsx | 29 +++--- .../IntegrationStep3/IntegrationStep3.tsx | 26 +++-- .../CustomFileUploader/CustomFileUploader.tsx | 94 ------------------- .../IntegrationStep5/FileBlock/FileBlock.tsx | 58 ------------ .../IntegrationStep5/IntegrationStep5.tsx | 52 ---------- .../SettingsBlock/SettingItem/SettingItem.tsx | 17 +--- .../SettingsBlock/SettingsBlock.tsx | 3 - .../AnalyticsModal/AnalyticsModal.tsx | 6 +- .../PartnersBoard/PartnersBoard.tsx | 44 ++++++--- src/ui_kit/LabeledDatePicker.tsx | 1 - 14 files changed, 234 insertions(+), 322 deletions(-) delete mode 100644 src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/CustomFileUploader/CustomFileUploader.tsx delete mode 100644 src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/FileBlock/FileBlock.tsx delete mode 100644 src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/IntegrationStep5.tsx diff --git a/src/api/integration.ts b/src/api/integration.ts index 7d59a3f4..5236c2d6 100644 --- a/src/api/integration.ts +++ b/src/api/integration.ts @@ -21,7 +21,7 @@ export type TagsResponse = { count: number; items: Tag[]; }; -const API_URL = `${process.env.REACT_APP_DOMAIN}/squiz/amocrm/amocrm`; +const API_URL = `${process.env.REACT_APP_DOMAIN}/squiz/amocrm`; export const getTags = async ({ page, @@ -112,3 +112,37 @@ export const getSteps = async ({ return [null, `Не удалось получить список шагов. ${error}`]; } }; + +export type Pipeline = { + ID: number; + AmoID: number; + AccountID: number; + Name: string; + IsArchive: boolean; + Deleted: boolean; + CreatedAt: number; +}; + +export type PipelinesResponse = { + count: number; + items: Pipeline[]; +}; + +export const getPipelines = async ({ + page, + size, +}: PaginationRequest): Promise<[PipelinesResponse | null, string?]> => { + try { + const pipelinesResponse = await makeRequest< + PaginationRequest, + PipelinesResponse + >({ + method: "GET", + url: `${API_URL}/pipelines?page=${page}&size=${size}`, + }); + return [pipelinesResponse]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Не удалось получить список воронок. ${error}`]; + } +}; diff --git a/src/components/CustomRadioGroup/CustomRadioGroup.tsx b/src/components/CustomRadioGroup/CustomRadioGroup.tsx index f70395c1..e83d8071 100644 --- a/src/components/CustomRadioGroup/CustomRadioGroup.tsx +++ b/src/components/CustomRadioGroup/CustomRadioGroup.tsx @@ -7,9 +7,11 @@ import Box from "@mui/material/Box"; import CheckboxIcon from "@icons/Checkbox"; import { Typography, useTheme } from "@mui/material"; import { + getPipelines, getSteps, getTags, PaginationRequest, + Pipeline, Step, Tag, } from "@api/integration"; @@ -37,6 +39,7 @@ export const CustomRadioGroup: FC = ({ const [isLoading, setIsLoading] = useState(false); const [tags, setTags] = useState([]); const [steps, setSteps] = useState([]); + const [pipelines, setPipelines] = useState([]); const [hasMoreItems, setHasMoreItems] = useState(true); const boxRef = useRef(null); @@ -90,6 +93,22 @@ export const CustomRadioGroup: FC = ({ setIsLoading(false); }); } + if (type === "typePipelines" && hasMoreItems) { + setIsLoading(true); + const pagination: PaginationRequest = { + page: page, + size: SIZE, + }; + getPipelines(pagination).then(([response]) => { + if (response && response.items !== null) { + setPipelines((prevItems) => [...prevItems, ...response.items]); + if (response.items.length < SIZE) { + setHasMoreItems(false); + } + } + setIsLoading(false); + }); + } }, [page, type, hasMoreItems, pipelineId]); const formControlLabels = useMemo(() => { @@ -123,7 +142,6 @@ export const CustomRadioGroup: FC = ({ icon={} /> } - // label={item.Name} label={ @@ -171,6 +189,41 @@ export const CustomRadioGroup: FC = ({ /> )); } + if (type === "typePipelines" && pipelines && pipelines.length !== 0) { + return pipelines.map((pipeline) => ( + + } + icon={} + /> + } + label={pipeline.Name} + labelPlacement={"start"} + /> + )); + } return ( = ({ Нет элементов ); - }, [tags, currentValue, type]); + }, [tags, steps, currentValue, type, pipelines]); return ( = ({ const [hasMoreItems, setHasMoreItems] = useState(true); const SIZE = 25; const ref = useRef(null); - console.log("page", page); + const selectWidth = ref.current ? ref.current.offsetWidth : undefined; + + const [savedValue, setSavedValue] = useState(null); const onSelectItem = useCallback( (event: SelectChangeEvent) => { const newValue = event.target.value.toString(); + const selectedUser = users.find((user) => user.Name === newValue); + if (selectedUser) { + //для сохранения ID выбранного пользователя в стейт или конфиг... + setSavedValue(selectedUser.ID); + } setCurrentValue(newValue); setSelectedItem(newValue); }, - [setSelectedItem, setCurrentValue], + [setSelectedItem, setCurrentValue, setSavedValue, users], ); const toggleOpened = useCallback(() => { @@ -86,9 +93,56 @@ export const CustomSelect: FC = ({ - {user.Name} + + + {user.Name} + + + {user.Email} + + + {user.Role} + + )); } @@ -162,10 +216,12 @@ export const CustomSelect: FC = ({ zIndex: 2, maxHeight: "300px", overflow: "auto", + overflowX: "auto", + maxWidth: selectWidth, }, }, }} - sx={{ width: "100%" }} + sx={{}} onChange={onSelectItem} onClick={toggleOpened} > diff --git a/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx b/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx index dc924892..330b5f61 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx @@ -12,9 +12,8 @@ import { IntegrationStep1 } from "./IntegrationStep1/IntegrationStep1"; import { IntegrationStep2 } from "./IntegrationStep2/IntegrationStep2"; import { IntegrationStep3 } from "./IntegrationStep3/IntegrationStep3"; import { IntegrationStep4 } from "./IntegrationStep4/IntegrationStep4"; -import { IntegrationStep5 } from "./IntegrationStep5/IntegrationStep5"; import { IntegrationStep6 } from "./IntegrationStep6/IntegrationStep6"; -import { funnelsMock, performersMock, stagesMock } from "../mocks/MockData"; +import { performersMock } from "../mocks/MockData"; import { IntegrationsModalTitle } from "./IntegrationsModalTitle/IntegrationsModalTitle"; import { SettingsBlock } from "./SettingsBlock/SettingsBlock"; import { IntegrationStep7 } from "./IntegrationStep7/IntegrationStep7"; @@ -42,18 +41,17 @@ export const AmoCRMModal: FC = ({ const [step, setStep] = useState(0); const [isSettingsBlock, setIsSettingsBlock] = useState(false); - const [selectedFunnelPerformer, setSelectedFunnelPerformer] = useState< + const [selectedPipelinePerformer, setSelectedPipelinePerformer] = useState< string | null >(null); - const [selectedFunnel, setSelectedFunnel] = useState(null); - const [selectedStagePerformer, setSelectedStagePerformer] = useState< + const [selectedPipeline, setSelectedPipeline] = useState(null); + const [selectedStepsPerformer, setSelectedStepsPerformer] = useState< string | null >(null); - const [selectedStage, setSelectedStage] = useState(null); + const [selectedStep, setSelectedStep] = useState(null); const [selectedDealPerformer, setSelectedDealPerformer] = useState< string | null >(null); - const [utmFile, setUtmFile] = useState(null); const [questionEntity, setQuestionEntity] = useState({ contacts: [], company: [], @@ -93,12 +91,10 @@ export const AmoCRMModal: FC = ({ ), }, @@ -109,13 +105,11 @@ export const AmoCRMModal: FC = ({ ), }, @@ -132,18 +126,6 @@ export const AmoCRMModal: FC = ({ /> ), }, - { - title: "Добавление utm-меток", - isSettingsAvailable: false, - component: ( - - ), - }, { title: "Соотнесение вопросов и сущностей", isSettingsAvailable: true, @@ -171,11 +153,11 @@ export const AmoCRMModal: FC = ({ ], [ questionEntity, - utmFile, - selectedFunnelPerformer, - selectedFunnel, - selectedStagePerformer, - selectedStage, + // utmFile, + selectedPipelinePerformer, + selectedPipeline, + selectedStepsPerformer, + selectedStep, selectedDealPerformer, tags, ], @@ -188,7 +170,7 @@ export const AmoCRMModal: FC = ({ open={isModalOpen} onClose={handleCloseModal} fullWidth - fullScreen={isMobile} + // fullScreen={isMobile} PaperProps={{ sx: { maxWidth: isTablet ? "100%" : "920px", @@ -253,11 +235,10 @@ export const AmoCRMModal: FC = ({ setIsSettingsBlock={setIsSettingsBlock} setStep={setStep} selectedDealPerformer={selectedDealPerformer} - selectedFunnelPerformer={selectedFunnelPerformer} - selectedFunnel={selectedFunnel} - selectedStagePerformer={selectedStagePerformer} - selectedStage={selectedStage} - utmFile={utmFile} + selectedFunnelPerformer={selectedPipelinePerformer} + selectedFunnel={selectedPipeline} + selectedStagePerformer={selectedStepsPerformer} + selectedStage={selectedStep} questionEntity={questionEntity} tags={tags} /> diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx index 129dd95e..dd055bbf 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx @@ -7,23 +7,19 @@ import { CustomRadioGroup } from "../../../../components/CustomRadioGroup/Custom type IntegrationStep2Props = { handlePrevStep: () => void; handleNextStep: () => void; - selectedFunnelPerformer: string | null; - setSelectedFunnelPerformer: (value: string | null) => void; - selectedFunnel: string | null; - setSelectedFunnel: (value: string | null) => void; - performers: string[]; - funnels: string[]; + selectedPipelinePerformer: string | null; + setSelectedPipelinePerformer: (value: string | null) => void; + selectedPipeline: string | null; + setSelectedPipeline: (value: string | null) => void; }; export const IntegrationStep2: FC = ({ handlePrevStep, handleNextStep, - selectedFunnelPerformer, - setSelectedFunnelPerformer, - selectedFunnel, - setSelectedFunnel, - performers, - funnels, + selectedPipelinePerformer, + setSelectedPipelinePerformer, + selectedPipeline, + setSelectedPipeline, }) => { const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down(600)); @@ -40,8 +36,8 @@ export const IntegrationStep2: FC = ({ > @@ -54,8 +50,9 @@ export const IntegrationStep2: FC = ({ }} > void; handleNextStep: () => void; - selectedStagePerformer: string | null; - setSelectedStagePerformer: (value: string | null) => void; - selectedStage: string | null; - setSelectedStage: (value: string | null) => void; - performers: string[]; - stages: string[]; + selectedStepsPerformer: string | null; + setSelectedStepsPerformer: (value: string | null) => void; + selectedStep: string | null; + setSelectedStep: (value: string | null) => void; pipelineId: string | null; }; export const IntegrationStep3: FC = ({ handlePrevStep, handleNextStep, - selectedStagePerformer, - setSelectedStagePerformer, - selectedStage, - setSelectedStage, + selectedStepsPerformer, + setSelectedStepsPerformer, + selectedStep, + setSelectedStep, pipelineId, }) => { const theme = useTheme(); @@ -41,9 +39,9 @@ export const IntegrationStep3: FC = ({ > = ({ void; -} - -export const CustomFileUploader: FC = ({ - accept, - description, - handleImageChange, -}) => { - const theme = useTheme(); - const dropZone = useRef(null); - const [ready, setReady] = useState(false); - const isMobile = useMediaQuery(theme.breakpoints.down(700)); - - const handleDragEnter = (event: DragEvent) => { - event.preventDefault(); - setReady(true); - }; - - const handleDrop = (event: DragEvent) => { - event.preventDefault(); - event.stopPropagation(); - - const file = event.dataTransfer.files[0]; - if (!file) return; - - handleImageChange(file); - }; - - const acceptedFormats = accept - ? accept.map((format) => "." + format).join(", ") - : ""; - - return ( - - { - const file = event.target.files?.[0]; - if (file) handleImageChange(file); - }} - hidden - accept={acceptedFormats || ".jpg, .jpeg, .png , .gif"} - multiple - type="file" - data-cy="upload-image-input" - /> - ) => - event.preventDefault() - } - onDrop={handleDrop} - ref={dropZone} - sx={{ - width: isMobile ? "100%" : "580px", - padding: isMobile ? "33px" : "33px 10px 33px 55px", - display: "flex", - alignItems: "center", - backgroundColor: theme.palette.background.default, - border: `1px solid ${ready ? "red" : theme.palette.grey2.main}`, - borderRadius: "8px", - gap: "55px", - flexDirection: isMobile ? "column" : "row", - }} - onDragEnter={handleDragEnter} - > - - - - Добавить файл - - - {description || "Принимает JPG, PNG, и GIF формат — максимум 5mb"} - - - - - ); -}; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/FileBlock/FileBlock.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/FileBlock/FileBlock.tsx deleted file mode 100644 index 89d63fcf..00000000 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/FileBlock/FileBlock.tsx +++ /dev/null @@ -1,58 +0,0 @@ -import React, { FC } from "react"; -import Box from "@mui/material/Box"; -import { IconButton, Typography, useTheme } from "@mui/material"; -import CloseIcon from "@mui/icons-material/Close"; - -type FileBlockProps = { - file: File | null; - setFile?: (file: File | null) => void; -}; - -export const FileBlock: FC = ({ setFile, file }) => { - const theme = useTheme(); - return ( - - - Вы загрузили: - - - - {file?.name} - - {setFile && ( - setFile(null)} - sx={{ - backgroundColor: "#864BD9", - borderRadius: "50%", - width: "24px", - height: "24px", - color: "white", - }} - > - - - )} - - - ); -}; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/IntegrationStep5.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/IntegrationStep5.tsx deleted file mode 100644 index dd5a60c1..00000000 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep5/IntegrationStep5.tsx +++ /dev/null @@ -1,52 +0,0 @@ -import { Box, useMediaQuery, useTheme } from "@mui/material"; -import React, { FC } from "react"; -import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock"; -import File from "@ui_kit/QuizPreview/QuizPreviewQuestionTypes/File"; -import { FileBlock } from "./FileBlock/FileBlock"; -import { CustomFileUploader } from "./CustomFileUploader/CustomFileUploader"; - -type IntegrationStep5Props = { - handlePrevStep: () => void; - handleNextStep: () => void; - setUtmFile: (file: File | null) => void; - utmFile: File | null; -}; - -export const IntegrationStep5: FC = ({ - handlePrevStep, - handleNextStep, - utmFile, - setUtmFile, -}) => { - const theme = useTheme(); - const upMd = useMediaQuery(theme.breakpoints.up("md")); - - return ( - - - {utmFile ? ( - - ) : ( - - )} - - - - ); -}; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx index bad4f702..82f0ac12 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx @@ -4,7 +4,6 @@ import { Typography, useMediaQuery, useTheme } from "@mui/material"; import { SettingItemHeader } from "./SettingItemHeader/SettingItemHeader"; import { ResponsiblePerson } from "./ResponsiblePerson/ResponsiblePerson"; import { SelectedParameter } from "./SelectedParameter/SelectedParameter"; -import { FileBlock } from "../../IntegrationStep5/FileBlock/FileBlock"; import { TQuestionEntity, TTags } from "../../AmoCRMModal"; type SettingItemProps = { @@ -17,7 +16,6 @@ type SettingItemProps = { selectedStagePerformer: string | null; selectedDealPerformer: string | null; selectedStage: string | null; - utmFile: File | null; questionEntity: TQuestionEntity; tags: TTags; }; @@ -32,7 +30,6 @@ export const SettingItem: FC = ({ selectedStagePerformer, selectedDealPerformer, selectedStage, - utmFile, questionEntity, tags, }) => { @@ -68,17 +65,6 @@ export const SettingItem: FC = ({ ); } if (step === 4) { - return ( - - {utmFile ? ( - - ) : ( - Файл не загружен - )} - - ); - } - if (step === 5) { const isFilled = Object.values(questionEntity).some( (array) => array.length > 0, ); @@ -110,7 +96,7 @@ export const SettingItem: FC = ({ ); } - if (step === 6) { + if (step === 5) { const isFilled = Object.values(tags).some((array) => array.length > 0); const status = isFilled ? "Заполнено" : "Не заполнено"; @@ -148,7 +134,6 @@ export const SettingItem: FC = ({ selectedStagePerformer, selectedDealPerformer, selectedStage, - utmFile, questionEntity, tags, ]); diff --git a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx index 4d7b67ee..434ef61c 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx @@ -13,7 +13,6 @@ type SettingsBlockProps = { selectedStagePerformer: string | null; selectedStage: string | null; selectedDealPerformer: string | null; - utmFile: File | null; questionEntity: TQuestionEntity; tags: TTags; }; @@ -27,7 +26,6 @@ export const SettingsBlock: FC = ({ selectedStagePerformer, selectedDealPerformer, selectedStage, - utmFile, questionEntity, tags, }) => { @@ -68,7 +66,6 @@ export const SettingsBlock: FC = ({ selectedStagePerformer={selectedStagePerformer} selectedDealPerformer={selectedDealPerformer} selectedStage={selectedStage} - utmFile={utmFile} questionEntity={questionEntity} tags={tags} /> diff --git a/src/pages/IntegrationsPage/PartnersBoard/AnalyticsModal/AnalyticsModal.tsx b/src/pages/IntegrationsPage/PartnersBoard/AnalyticsModal/AnalyticsModal.tsx index 677c117b..4ad0f815 100644 --- a/src/pages/IntegrationsPage/PartnersBoard/AnalyticsModal/AnalyticsModal.tsx +++ b/src/pages/IntegrationsPage/PartnersBoard/AnalyticsModal/AnalyticsModal.tsx @@ -25,11 +25,11 @@ interface Props { companyName: keyof typeof QuizMetricType; } -export default function AnalyticsModal({ +export const AnalyticsModal = ({ isModalOpen, handleCloseModal, companyName, -}: Props) { +}: Props) => { const theme = useTheme(); const quiz = useCurrentQuiz(); const isMobile = useMediaQuery(theme.breakpoints.down(600)); @@ -260,4 +260,4 @@ export default function AnalyticsModal({ ); -} +}; diff --git a/src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx b/src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx index c44b90c0..5510eb08 100644 --- a/src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx +++ b/src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx @@ -1,12 +1,23 @@ -import { Box, Typography, useTheme } from "@mui/material"; -import React, { FC } from "react"; +import { Box, Typography, useMediaQuery, useTheme } from "@mui/material"; +import React, { FC, lazy, Suspense } from "react"; import { ServiceButton } from "./ServiceButton/ServiceButton"; import { YandexMetricaLogo } from "../mocks/YandexMetricaLogo"; -import AnalyticsModal from "./AnalyticsModal/AnalyticsModal"; +// import AnalyticsModal from "./AnalyticsModal/AnalyticsModal"; import { VKPixelLogo } from "../mocks/VKPixelLogo"; import { QuizMetricType } from "@model/quizSettings"; import { AmoCRMLogo } from "../mocks/AmoCRMLogo"; -import { AmoCRMModal } from "../IntegrationsModal/AmoCRMModal"; + +const AnalyticsModal = lazy(() => + import("./AnalyticsModal/AnalyticsModal").then((module) => ({ + default: module.AnalyticsModal, + })), +); + +const AmoCRMModal = lazy(() => + import("../IntegrationsModal/AmoCRMModal").then((module) => ({ + default: module.AmoCRMModal, + })), +); type PartnersBoardProps = { setIsModalOpen: (value: boolean) => void; @@ -30,6 +41,7 @@ export const PartnersBoard: FC = ({ handleCloseAmoSRMModal, }) => { const theme = useTheme(); + const isMobile = useMediaQuery(theme.breakpoints.down(600)); return ( = ({ {companyName && ( - + + + )} {companyName && ( - + + + )} ); diff --git a/src/ui_kit/LabeledDatePicker.tsx b/src/ui_kit/LabeledDatePicker.tsx index bd60b544..261e4450 100644 --- a/src/ui_kit/LabeledDatePicker.tsx +++ b/src/ui_kit/LabeledDatePicker.tsx @@ -11,7 +11,6 @@ import { DatePicker } from "@mui/x-date-pickers"; import moment from "moment"; import type { Moment } from "moment"; - interface Props { label?: string; sx?: SxProps; From f8f22e13972732887ec5f1e470b219f5a5287c57 Mon Sep 17 00:00:00 2001 From: aleksandr-raw <104529174+aleksandr-raw@users.noreply.github.com> Date: Sat, 25 May 2024 01:23:55 +0400 Subject: [PATCH 6/6] tasks 20,21,22,23,24,25,26 --- src/api/integration.ts | 186 +++++++++++++++++- src/assets/icons/Amologo.png | Bin 0 -> 5253 bytes src/components/AmoButton/AmoButton.tsx | 51 +++++ .../AmoAccountInfo/AmoAccountInfo.tsx | 70 +++++++ .../IntegrationsModal/AmoCRMModal.tsx | 67 ++++--- .../IntegrationsModal/AmoLogin/AmoLogin.tsx | 150 ++++++++++++++ .../AmoModalTitle.tsx} | 4 +- .../AmoStep2.tsx} | 4 +- .../AmoStep3.tsx} | 5 +- .../AmoStep4.tsx} | 6 +- .../IntegrationStep1/IntegrationStep1.tsx | 144 -------------- .../{IntegrationStep6.tsx => AmoStep6.tsx} | 4 +- .../{IntegrationStep7.tsx => AmoStep7.tsx} | 4 +- ...SettingsBlock.tsx => AmoSettingsBlock.tsx} | 4 +- 14 files changed, 516 insertions(+), 183 deletions(-) create mode 100644 src/assets/icons/Amologo.png create mode 100644 src/components/AmoButton/AmoButton.tsx create mode 100644 src/pages/IntegrationsPage/IntegrationsModal/AmoAccountInfo/AmoAccountInfo.tsx create mode 100644 src/pages/IntegrationsPage/IntegrationsModal/AmoLogin/AmoLogin.tsx rename src/pages/IntegrationsPage/IntegrationsModal/{IntegrationsModalTitle/IntegrationsModalTitle.tsx => AmoModalTitle/AmoModalTitle.tsx} (96%) rename src/pages/IntegrationsPage/IntegrationsModal/{IntegrationStep2/IntegrationStep2.tsx => AmoStep2/AmoStep2.tsx} (95%) rename src/pages/IntegrationsPage/IntegrationsModal/{IntegrationStep3/IntegrationStep3.tsx => AmoStep3/AmoStep3.tsx} (95%) rename src/pages/IntegrationsPage/IntegrationsModal/{IntegrationStep4/IntegrationStep4.tsx => AmoStep4/AmoStep4.tsx} (91%) delete mode 100644 src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep1/IntegrationStep1.tsx rename src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/{IntegrationStep6.tsx => AmoStep6.tsx} (95%) rename src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/{IntegrationStep7.tsx => AmoStep7.tsx} (95%) rename src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/{SettingsBlock.tsx => AmoSettingsBlock.tsx} (96%) diff --git a/src/api/integration.ts b/src/api/integration.ts index 5236c2d6..efa22fa8 100644 --- a/src/api/integration.ts +++ b/src/api/integration.ts @@ -6,6 +6,81 @@ export type PaginationRequest = { size: number; }; +const API_URL = `${process.env.REACT_APP_DOMAIN}/squiz/amocrm`; + +// получение информации об аккаунте + +export type AccountResponse = { + ID: number; + AccountID: string; + AmoID: number; + Name: string; + Email: string; + Role: string; + Group: number; + Deleted: boolean; + CreatedAt: number; + Subdomain: string; + Amoiserid: number; + Country: string; +}; + +export const getAccount = async (): Promise< + [AccountResponse | null, string?] +> => { + try { + const response = await makeRequest({ + method: "GET", + url: `${API_URL}/account`, + useToken: true, + }); + return [response]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Не удалось получить информацию об аккаунте. ${error}`]; + } +}; + +// подключить Amo + +export const connectAmo = async (): Promise<[string | null, string?]> => { + try { + const response = await makeRequest({ + method: "POST", + url: `${API_URL}/account`, + useToken: true, + withCredentials: true, + }); + return [response.link]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Не удалось подключить аккаунт. ${error}`]; + } +}; + +// получение токена + +export type TokenPair = { + accessToken: string; + refreshToken: string; +}; + +export const getTokens = async (): Promise<[TokenPair | null, string?]> => { + try { + const response = await makeRequest({ + method: "GET", + url: `${API_URL}/webhook/create`, + useToken: true, + }); + return [response]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Failed to get tokens. ${error}`]; + } +}; + +//получение списка тегов + export type Tag = { ID: number; AmoID: number; @@ -21,7 +96,6 @@ export type TagsResponse = { count: number; items: Tag[]; }; -const API_URL = `${process.env.REACT_APP_DOMAIN}/squiz/amocrm`; export const getTags = async ({ page, @@ -39,6 +113,8 @@ export const getTags = async ({ } }; +//получение списка пользователей + export type User = { ID: number; AccountID: string; @@ -75,6 +151,8 @@ export const getUsers = async ({ } }; +//получение списка шагов + export type Step = { ID: number; AmoID: number; @@ -113,6 +191,8 @@ export const getSteps = async ({ } }; +//получение списка воронок + export type Pipeline = { ID: number; AmoID: number; @@ -146,3 +226,107 @@ export const getPipelines = async ({ return [null, `Не удалось получить список воронок. ${error}`]; } }; + +//получение настроек интеграции + +export type IntegrationRules = { + ID: number; + AccountID: number; + QuizID: number; + PerformerID: number; + PipelineID: number; + StepID: number; + UTMs: number[]; + FieldsRule: { + lead: { QuestionID: number }[]; + contact: { ContactRuleMap: string }[]; + company: { QuestionID: number }[]; + customer: { QuestionID: number }[]; + }; + Deleted: boolean; + CreatedAt: number; +}; + +export const getIntegrationRules = async ( + quizID: string, +): Promise<[IntegrationRules | null, string?]> => { + try { + const settingsResponse = await makeRequest({ + method: "GET", + url: `${API_URL}/rules/${quizID}`, + }); + return [settingsResponse]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Не удалось получить настройки интеграции. ${error}`]; + } +}; + +//обновление настроек интеграции + +export type IntegrationRulesUpdate = { + PerformerID: number; + PipelineID: number; + StepID: number; + Utms: number[]; + Fieldsrule: { + Lead: { QuestionID: number }[]; + Contact: { ContactRuleMap: string }[]; + Company: { QuestionID: number }[]; + Customer: { QuestionID: number }[]; + }; +}; + +export const updateIntegrationRules = async ( + quizID: string, + settings: IntegrationRulesUpdate, +): Promise<[string | null, string?]> => { + try { + const updateResponse = await makeRequest({ + method: "PATCH", + url: `${API_URL}/rules/${quizID}`, + body: settings, + }); + return [updateResponse]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Failed to update integration settings. ${error}`]; + } +}; + +// Получение кастомных полей + +export type CustomField = { + ID: number; + AmoID: number; + Code: string; + AccountID: number; + Name: string; + EntityType: string; + Type: string; + Deleted: boolean; + CreatedAt: number; +}; + +export type CustomFieldsResponse = { + count: number; + items: CustomField[]; +}; + +export const getCustomFields = async ( + pagination: PaginationRequest, +): Promise<[CustomFieldsResponse | null, string?]> => { + try { + const fieldsResponse = await makeRequest< + PaginationRequest, + CustomFieldsResponse + >({ + method: "GET", + url: `${API_URL}/fields?page=${pagination.page}&size=${pagination.size}`, + }); + return [fieldsResponse]; + } catch (nativeError) { + const [error] = parseAxiosError(nativeError); + return [null, `Не удалось получить список кастомных полей. ${error}`]; + } +}; diff --git a/src/assets/icons/Amologo.png b/src/assets/icons/Amologo.png new file mode 100644 index 0000000000000000000000000000000000000000..058ea7961f0557f9152e4e20ca251cf10f8bb734 GIT binary patch literal 5253 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 literal 0 HcmV?d00001 diff --git a/src/components/AmoButton/AmoButton.tsx b/src/components/AmoButton/AmoButton.tsx new file mode 100644 index 00000000..0c04b643 --- /dev/null +++ b/src/components/AmoButton/AmoButton.tsx @@ -0,0 +1,51 @@ +import { Button, Typography, useMediaQuery, useTheme } from "@mui/material"; +import AmoLogo from "../../assets/icons/Amologo.png"; +import { FC } from "react"; + +type AmoButtonProps = { + onClick?: () => void; +}; + +export const AmoButton: FC = ({ onClick }) => { + const theme = useTheme(); + const isMobile = useMediaQuery(theme.breakpoints.down(600)); + return ( + + ); +}; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/AmoAccountInfo/AmoAccountInfo.tsx b/src/pages/IntegrationsPage/IntegrationsModal/AmoAccountInfo/AmoAccountInfo.tsx new file mode 100644 index 00000000..6c9530f4 --- /dev/null +++ b/src/pages/IntegrationsPage/IntegrationsModal/AmoAccountInfo/AmoAccountInfo.tsx @@ -0,0 +1,70 @@ +import { Box, Typography, useMediaQuery, useTheme } from "@mui/material"; +import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock"; +import { FC } from "react"; +import { AccountResponse } from "@api/integration"; + +type AmoAccountInfoProps = { + handleNextStep: () => void; + accountInfo: AccountResponse; +}; + +export const AmoAccountInfo: FC = ({ + handleNextStep, + accountInfo, +}) => { + const theme = useTheme(); + const isMobile = useMediaQuery(theme.breakpoints.down(600)); + + const infoItem = (title: string, value: string | number) => ( + + + + {title}: + + + + {value} + + + ); + + return ( + + + {infoItem("Amo ID", accountInfo.AmoID)} + {infoItem("Имя аккаунта", accountInfo.Name)} + {infoItem("Email аккаунта", accountInfo.Email)} + {infoItem("Роль", accountInfo.Role)} + {infoItem("Группа пользователя", accountInfo.Group)} + {infoItem("URL профиля пользователя в Amo", accountInfo.Subdomain)} + {infoItem("Страна пользователя", accountInfo.Country)} + + + + ); +}; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx b/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx index 330b5f61..27269f91 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx @@ -5,18 +5,19 @@ import { useMediaQuery, useTheme, } from "@mui/material"; -import React, { FC, useMemo, useState } from "react"; +import React, { FC, useEffect, useMemo, useState } from "react"; import Box from "@mui/material/Box"; import CloseIcon from "@mui/icons-material/Close"; -import { IntegrationStep1 } from "./IntegrationStep1/IntegrationStep1"; -import { IntegrationStep2 } from "./IntegrationStep2/IntegrationStep2"; -import { IntegrationStep3 } from "./IntegrationStep3/IntegrationStep3"; -import { IntegrationStep4 } from "./IntegrationStep4/IntegrationStep4"; -import { IntegrationStep6 } from "./IntegrationStep6/IntegrationStep6"; -import { performersMock } from "../mocks/MockData"; -import { IntegrationsModalTitle } from "./IntegrationsModalTitle/IntegrationsModalTitle"; -import { SettingsBlock } from "./SettingsBlock/SettingsBlock"; -import { IntegrationStep7 } from "./IntegrationStep7/IntegrationStep7"; +import { AmoLogin } from "./AmoLogin/AmoLogin"; +import { AmoStep2 } from "./AmoStep2/AmoStep2"; +import { AmoStep3 } from "./AmoStep3/AmoStep3"; +import { AmoStep4 } from "./AmoStep4/AmoStep4"; +import { AmoStep6 } from "./IntegrationStep6/AmoStep6"; +import { AmoModalTitle } from "./AmoModalTitle/AmoModalTitle"; +import { AmoSettingsBlock } from "./SettingsBlock/AmoSettingsBlock"; +import { AmoStep7 } from "./IntegrationStep7/AmoStep7"; +import { AmoAccountInfo } from "./AmoAccountInfo/AmoAccountInfo"; +import { AccountResponse, getAccount } from "@api/integration"; export type TitleKeys = "contacts" | "company" | "deal" | "users" | "buyers"; @@ -41,6 +42,8 @@ export const AmoCRMModal: FC = ({ const [step, setStep] = useState(0); const [isSettingsBlock, setIsSettingsBlock] = useState(false); + + const [accountInfo, setAccountInfo] = useState(null); const [selectedPipelinePerformer, setSelectedPipelinePerformer] = useState< string | null >(null); @@ -66,6 +69,20 @@ export const AmoCRMModal: FC = ({ buyer: [], }); + useEffect(() => { + if (isModalOpen) { + const fetchAccount = async () => { + const [account, error] = await getAccount(); + if (account && !error) { + setAccountInfo(account); + } else { + setAccountInfo(null); + } + }; + fetchAccount(); + } + }, [isModalOpen]); + const handleNextStep = () => { setStep((prevState) => prevState + 1); }; @@ -76,19 +93,27 @@ export const AmoCRMModal: FC = ({ handleCloseModal(); setStep(1); }; - const steps = useMemo( () => [ { - title: "Авторизация в аккаунте", + title: accountInfo + ? "Информация об аккаунте" + : "Авторизация в аккаунте", isSettingsAvailable: false, - component: , + component: accountInfo ? ( + + ) : ( + + ), }, { title: "Выбор воронки", isSettingsAvailable: true, component: ( - = ({ title: "Выбор этапа воронки", isSettingsAvailable: true, component: ( - = ({ title: "Сделка", isSettingsAvailable: true, component: ( - ), }, @@ -130,7 +154,7 @@ export const AmoCRMModal: FC = ({ title: "Соотнесение вопросов и сущностей", isSettingsAvailable: true, component: ( - = ({ title: "Добавление тегов", isSettingsAvailable: true, component: ( - = ({ ], [ questionEntity, - // utmFile, selectedPipelinePerformer, selectedPipeline, selectedStepsPerformer, @@ -221,7 +244,7 @@ export const AmoCRMModal: FC = ({ flexGrow: 1, }} > - = ({ /> {isSettingsBlock ? ( - void; +}; + +// interface Values { +// login: string; +// password: string; +// } +// +// const initialValues: Values = { +// login: "", +// password: "", +// }; +// +// const validationSchema = object({ +// login: string().required("Поле обязательно"), +// password: string().required("Поле обязательно").min(8, "Минимум 8 символов"), +// }); + +export const AmoLogin: FC = ({ handleNextStep }) => { + const theme = useTheme(); + const isMobile = useMediaQuery(theme.breakpoints.down(600)); + + const onAmoClick = async () => { + console.log("Amo click"); + const [url, error] = await connectAmo(); + if (url && !error) { + window.open(url, "_blank"); + } + }; + + // const formik = useFormik({ + // initialValues, + // validationSchema, + // onSubmit: async (values, formikHelpers) => { + // const loginTrimmed = values.login.trim(); + // const passwordTrimmed = values.password.trim(); + // try { + // // Simulate a network request + // await new Promise((resolve) => setTimeout(resolve, 2000)); + // handleNextStep(); + // } catch (error) { + // formikHelpers.setSubmitting(false); + // if (error instanceof Error) { + // formikHelpers.setErrors({ + // login: error.message, + // password: error.message, + // }); + // } + // } + // }, + // }); + + return ( + + {/**/} + {/* */} + {/* */} + {/**/} + + + Инструкция + + + После нажатия на кнопку - "Подключить", вас переадресует на страницу + подключения интеграции в ваш аккаунт AmoCRM. Пожалуйста, согласитесь + на всё, что мы предлагаем, иначе чуда не случится. + + + + + + {/**/} + + ); +}; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationsModalTitle/IntegrationsModalTitle.tsx b/src/pages/IntegrationsPage/IntegrationsModal/AmoModalTitle/AmoModalTitle.tsx similarity index 96% rename from src/pages/IntegrationsPage/IntegrationsModal/IntegrationsModalTitle/IntegrationsModalTitle.tsx rename to src/pages/IntegrationsPage/IntegrationsModal/AmoModalTitle/AmoModalTitle.tsx index 93462345..39e297fb 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationsModalTitle/IntegrationsModalTitle.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/AmoModalTitle/AmoModalTitle.tsx @@ -4,7 +4,7 @@ import GearIcon from "@icons/GearIcon"; import React, { FC, useCallback, useMemo } from "react"; import AccountSetting from "@icons/AccountSetting"; -type IntegrationsModalTitleProps = { +type AmoModalTitleProps = { step: number; steps: { title: string; isSettingsAvailable: boolean }[]; isSettingsBlock?: boolean; @@ -12,7 +12,7 @@ type IntegrationsModalTitleProps = { setStep: (value: number) => void; }; -export const IntegrationsModalTitle: FC = ({ +export const AmoModalTitle: FC = ({ step, steps, setIsSettingsBlock, diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx b/src/pages/IntegrationsPage/IntegrationsModal/AmoStep2/AmoStep2.tsx similarity index 95% rename from src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx rename to src/pages/IntegrationsPage/IntegrationsModal/AmoStep2/AmoStep2.tsx index dd055bbf..a32c375b 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep2/IntegrationStep2.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/AmoStep2/AmoStep2.tsx @@ -4,7 +4,7 @@ import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock"; import { CustomSelect } from "../../../../components/CustomSelect/CustomSelect"; import { CustomRadioGroup } from "../../../../components/CustomRadioGroup/CustomRadioGroup"; -type IntegrationStep2Props = { +type AmoStep2Props = { handlePrevStep: () => void; handleNextStep: () => void; selectedPipelinePerformer: string | null; @@ -13,7 +13,7 @@ type IntegrationStep2Props = { setSelectedPipeline: (value: string | null) => void; }; -export const IntegrationStep2: FC = ({ +export const AmoStep2: FC = ({ handlePrevStep, handleNextStep, selectedPipelinePerformer, diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep3/IntegrationStep3.tsx b/src/pages/IntegrationsPage/IntegrationsModal/AmoStep3/AmoStep3.tsx similarity index 95% rename from src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep3/IntegrationStep3.tsx rename to src/pages/IntegrationsPage/IntegrationsModal/AmoStep3/AmoStep3.tsx index 3d9fd9be..e453f173 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep3/IntegrationStep3.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/AmoStep3/AmoStep3.tsx @@ -4,7 +4,7 @@ import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock"; import { CustomSelect } from "../../../../components/CustomSelect/CustomSelect"; import { CustomRadioGroup } from "../../../../components/CustomRadioGroup/CustomRadioGroup"; -type IntegrationStep3Props = { +type AmoStep3Props = { handlePrevStep: () => void; handleNextStep: () => void; selectedStepsPerformer: string | null; @@ -14,7 +14,7 @@ type IntegrationStep3Props = { pipelineId: string | null; }; -export const IntegrationStep3: FC = ({ +export const AmoStep3: FC = ({ handlePrevStep, handleNextStep, selectedStepsPerformer, @@ -53,6 +53,7 @@ export const IntegrationStep3: FC = ({ }} > void; handleNextStep: () => void; selectedDealPerformer: string | null; setSelectedDealPerformer: (value: string | null) => void; - performers: string[]; }; -export const IntegrationStep4: FC = ({ +export const AmoStep4: FC = ({ handlePrevStep, handleNextStep, selectedDealPerformer, setSelectedDealPerformer, - performers, }) => { const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down(600)); diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep1/IntegrationStep1.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep1/IntegrationStep1.tsx deleted file mode 100644 index 6074d652..00000000 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep1/IntegrationStep1.tsx +++ /dev/null @@ -1,144 +0,0 @@ -import { Box, Typography, useMediaQuery, useTheme } from "@mui/material"; -import { FC } from "react"; -import { object, string } from "yup"; -import InputTextfield from "@ui_kit/InputTextfield"; -import PasswordInput from "@ui_kit/passwordInput"; -import { useFormik } from "formik"; -import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock"; - -type IntegrationStep1Props = { - handleNextStep: () => void; -}; - -interface Values { - login: string; - password: string; -} - -const initialValues: Values = { - login: "", - password: "", -}; - -const validationSchema = object({ - login: string().required("Поле обязательно"), - password: string().required("Поле обязательно").min(8, "Минимум 8 символов"), -}); - -export const IntegrationStep1: FC = ({ - handleNextStep, -}) => { - const theme = useTheme(); - const isMobile = useMediaQuery(theme.breakpoints.down(600)); - - const formik = useFormik({ - initialValues, - validationSchema, - onSubmit: async (values, formikHelpers) => { - const loginTrimmed = values.login.trim(); - const passwordTrimmed = values.password.trim(); - try { - // Simulate a network request - await new Promise((resolve) => setTimeout(resolve, 2000)); - handleNextStep(); - } catch (error) { - formikHelpers.setSubmitting(false); - if (error instanceof Error) { - formikHelpers.setErrors({ - login: error.message, - password: error.message, - }); - } - } - }, - }); - - return ( - - - - - - - - Инструкция - - - Повседневная практика показывает, что постоянный количественный рост и - сфера нашей активности способствует подготовки и реализации систем - массового участия - - - - - ); -}; diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/IntegrationStep6.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/AmoStep6.tsx similarity index 95% rename from src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/IntegrationStep6.tsx rename to src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/AmoStep6.tsx index 5911f001..4c7d6645 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/IntegrationStep6.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep6/AmoStep6.tsx @@ -12,14 +12,14 @@ import { ItemDetailsView } from "./ItemDetailsView/ItemDetailsView"; import { TitleKeys, TQuestionEntity } from "../AmoCRMModal"; import Box from "@mui/material/Box"; -type IntegrationStep6Props = { +type AmoStep6Props = { handlePrevStep: () => void; handleNextStep: () => void; questionEntity: TQuestionEntity; setQuestionEntity: Dispatch>; }; -export const IntegrationStep6: FC = ({ +export const AmoStep6: FC = ({ handlePrevStep, handleNextStep, questionEntity, diff --git a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/IntegrationStep7.tsx b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/AmoStep7.tsx similarity index 95% rename from src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/IntegrationStep7.tsx rename to src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/AmoStep7.tsx index 366e0322..ca18f1a8 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/IntegrationStep7.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/IntegrationStep7/AmoStep7.tsx @@ -13,14 +13,14 @@ import Box from "@mui/material/Box"; import { ItemsSelectionView } from "../IntegrationStep6/ItemsSelectionView/ItemsSelectionView"; import { TagsDetailsView } from "./TagsDetailsView/TagsDetailsView"; -type IntegrationStep7Props = { +type AmoStep7Props = { handleSmallBtn: () => void; handleLargeBtn: () => void; tags: TTags; setTags: Dispatch>; }; -export const IntegrationStep7: FC = ({ +export const AmoStep7: FC = ({ handleSmallBtn, handleLargeBtn, tags, diff --git a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/AmoSettingsBlock.tsx similarity index 96% rename from src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx rename to src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/AmoSettingsBlock.tsx index 434ef61c..7cc2211f 100644 --- a/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingsBlock.tsx +++ b/src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/AmoSettingsBlock.tsx @@ -4,7 +4,7 @@ import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock"; import { SettingItem } from "./SettingItem/SettingItem"; import { TQuestionEntity, TTags } from "../AmoCRMModal"; -type SettingsBlockProps = { +type AmoSettingsBlockProps = { stepTitles: string[]; setStep: (value: number) => void; setIsSettingsBlock: (value: boolean) => void; @@ -17,7 +17,7 @@ type SettingsBlockProps = { tags: TTags; }; -export const SettingsBlock: FC = ({ +export const AmoSettingsBlock: FC = ({ stepTitles, setStep, setIsSettingsBlock,