SQuiz/frontPanel
3
0
Fork 0
Code Issues 18 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

скелетон для модалки амо

Browse Source
This commit is contained in:
Tamara 2024-06-24 19:20:22 +03:00
parent fdef102baf
commit ce39371fe5
2 changed files with 52 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx
View File

@ -1,5 +1,5 @@
import React, { FC, useCallback, useEffect, useMemo, useState } from "react"; import React, { FC, useCallback, useEffect, useMemo, useState } from "react";
import { Dialog, IconButton, Typography, useMediaQuery, useTheme, Box } from "@mui/material"; import {Dialog, IconButton, Typography, useMediaQuery, useTheme, Box, Skeleton} from "@mui/material";
import { useQuestions } from "@/stores/questions/hooks"; import { useQuestions } from "@/stores/questions/hooks";
import { redirect } from "react-router-dom"; import { redirect } from "react-router-dom";
import { enqueueSnackbar } from "notistack"; import { enqueueSnackbar } from "notistack";
@ -73,7 +73,7 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
const [openDelete, setOpenDelete] = useState<TagQuestionHC | null>(null); const [openDelete, setOpenDelete] = useState<TagQuestionHC | null>(null);
const { const {
isloadingPage, isLoadingPage,
firstRules, firstRules,
accountInfo, accountInfo,
arrayOfPipelines, arrayOfPipelines,
@ -360,43 +360,56 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
flexGrow: 1, flexGrow: 1,
}} }}
> >
<AmoModalTitle {isLoadingPage ?
step={step} <Skeleton
steps={steps} sx={{
isSettingsBlock={isSettingsBlock} width: "100%",
setIsSettingsBlock={setIsSettingsBlock} height: "100%",
setStep={setStep} transform: "none",
startRemoveAccount={() => setIsTryRemoveAccount(true)} }}
/> /> :
{openDelete !== null ? ( <>
<AmoDeleteTagQuestion <AmoModalTitle
close={() => setOpenDelete(null)} step={step}
deleteItem={handleDeleteTagQuestion} steps={steps}
/> isSettingsBlock={isSettingsBlock}
) : (
<>
{isTryRemoveAccount && <AmoRemoveAccount stopThisPage={() => setIsTryRemoveAccount(false)} />}
{isSettingsBlock && (
<Box sx={{ flexGrow: 1, width: "100%" }}>
<AmoSettingsBlock
stepTitles={stepTitles}
setIsSettingsBlock={setIsSettingsBlock} setIsSettingsBlock={setIsSettingsBlock}
setStep={setStep} setStep={setStep}
selectedDealUser={arrayOfUsers.find((u) => u.id === selectedDealUser)?.title || "не указан"} startRemoveAccount={() => setIsTryRemoveAccount(true)}
selectedFunnel={arrayOfPipelines.find((p) => p.id === selectedPipeline)?.title || "нет данных"} />
selectedStage={ {openDelete !== null ? (
arrayOfPipelinesSteps.find((s) => s.id === selectedPipelineStep)?.title || "нет данных" <AmoDeleteTagQuestion
} close={() => setOpenDelete(null)}
selectedQuestions={selectedQuestions} deleteItem={handleDeleteTagQuestion}
selectedTags={selectedTags} />
/> ) : (
</Box> <>
)} {isTryRemoveAccount && <AmoRemoveAccount stopThisPage={() => setIsTryRemoveAccount(false)} />}
{!isSettingsBlock && !isTryRemoveAccount && ( {isSettingsBlock && (
<Box sx={{ flexGrow: 1, width: "100%" }}>{steps[step].component}</Box> <Box sx={{ flexGrow: 1, width: "100%" }}>
)} <AmoSettingsBlock
</> stepTitles={stepTitles}
)} setIsSettingsBlock={setIsSettingsBlock}
setStep={setStep}
selectedDealUser={arrayOfUsers.find((u) => u.id === selectedDealUser)?.title || "не указан"}
selectedFunnel={arrayOfPipelines.find((p) => p.id === selectedPipeline)?.title || "нет данных"}
selectedStage={
arrayOfPipelinesSteps.find((s) => s.id === selectedPipelineStep)?.title || "нет данных"
}
selectedQuestions={selectedQuestions}
selectedTags={selectedTags}
/>
</Box>
)}
{!isSettingsBlock && !isTryRemoveAccount && (
<Box sx={{ flexGrow: 1, width: "100%" }}>{steps[step].component}</Box>
)}
</>
)}
</>
}
</Box> </Box>
</Dialog> </Dialog>
); );

4
src/pages/IntegrationsPage/IntegrationsModal/useAmoIntegration.ts
View File

@ -21,7 +21,7 @@ interface Props {
} }
export const useAmoIntegration = ({ isModalOpen, isTryRemoveAccount, quizID }: Props) => { export const useAmoIntegration = ({ isModalOpen, isTryRemoveAccount, quizID }: Props) => {
const [isloadingPage, setIsLoadingPage] = useState<boolean>(true); const [isLoadingPage, setIsLoadingPage] = useState<boolean>(true);
const [firstRules, setFirstRules] = useState<boolean>(false); const [firstRules, setFirstRules] = useState<boolean>(false);
const [accountInfo, setAccountInfo] = useState<AccountResponse | null>(null); const [accountInfo, setAccountInfo] = useState<AccountResponse | null>(null);
@ -224,7 +224,7 @@ export const useAmoIntegration = ({ isModalOpen, isTryRemoveAccount, quizID }: P
}, [pageOfTags]); }, [pageOfTags]);
return { return {
isloadingPage, isLoadingPage,
firstRules, firstRules,
accountInfo, accountInfo,
arrayOfPipelines, arrayOfPipelines,