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

Merge branch 'dev' into 'staging'

Browse Source 
Dev

See merge request frontend/squiz!358
This commit is contained in:
Nastya 2024-07-23 10:57:59 +00:00
commit 69e49e8a81
46 changed files with 308 additions and 447 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.tsx
View File

@ -20,7 +20,7 @@ import { Restore } from "./pages/auth/Restore";
import SigninDialog from "./pages/auth/Signin";
import SignupDialog from "./pages/auth/Signup";
import { InfoPrivilege } from "./pages/InfoPrivilege";
import AmoTokenExpiredDialog from "./pages/IntegrationsPage/IntegrationsModal/AmoTokenExpiredDialog";
import AmoTokenExpiredDialog from "./pages/IntegrationsPage/IntegrationsModal/Amo/AmoTokenExpiredDialog";
import Landing from "./pages/Landing/Landing";
import Main from "./pages/main";

2
src/api/integration.ts
View File

@ -1,4 +1,4 @@
import { QuestionKeys } from "@/pages/IntegrationsPage/IntegrationsModal/types";
import { QuestionKeys } from "@/pages/IntegrationsPage/IntegrationsModal/Amo/types";
import { makeRequest } from "@api/makeRequest";
import { parseAxiosError } from "@utils/parse-error";
import useSWR from "swr";

1
src/api/statistic.ts
View File

@ -105,7 +105,6 @@ export const getGraphics = async (
withCredentials: true,
});
console.log(questionsResponse)
return [questionsResponse];
} catch (nativeError) {
const [error] = parseAxiosError(nativeError);

44
src/components/CustomRadioGroup/CustomRadioGroup.tsx
View File

@ -1,8 +1,8 @@
import * as React from "react";
import { FC, useMemo } from "react";
import CheckboxIcon from "@icons/Checkbox";
import { SelectChangeEvent, Typography, useTheme, Box, FormControlLabel, RadioGroup, Radio } from "@mui/material";
import { MinifiedData, TagKeys } from "@/pages/IntegrationsPage/IntegrationsModal/types";
import { SelectChangeEvent, Typography, useTheme, Box, FormControlLabel, RadioGroup, Radio, useMediaQuery } from "@mui/material";
import { MinifiedData, TagKeys } from "@/pages/IntegrationsPage/IntegrationsModal/Amo/types";
type CustomRadioGroupProps = {
items: MinifiedData[] | [];
@ -20,22 +20,19 @@ export const CustomRadioGroup: FC<CustomRadioGroupProps> = ({
activeScope,
}) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(600));
const currentItem = useMemo(() => {
if (selectedItemId !== null && selectedItemId.length > 0) {
return items.find((item) => item.id === selectedItemId) || null;
}
return null;
}, [selectedItemId, items]);
const currentItem =
(selectedItemId !== null && selectedItemId.length > 0) ?
items.find((item) => item.id === selectedItemId) || null
:
null;
const filteredItems = useMemo(() => {
let newArray = items;
if (activeScope !== undefined)
newArray = newArray.filter((item) => {
const filteredItems =
(activeScope !== undefined) ?
items.filter((item) => {
return item.entity === activeScope;
});
return newArray;
}, items);
}) : items
const onScroll = React.useCallback((e: React.UIEvent<HTMLDivElement>) => {
const scrollHeight = e.currentTarget.scrollHeight;
@ -48,9 +45,9 @@ export const CustomRadioGroup: FC<CustomRadioGroupProps> = ({
}
}, []);
const formControlLabels = useMemo(() => {
if (filteredItems.length !== 0) {
return filteredItems.map((item) => (
const formControlLabels =
(filteredItems.length !== 0) ?
filteredItems.map((item) => (
<FormControlLabel
key={item.id}
sx={{
@ -64,7 +61,7 @@ export const CustomRadioGroup: FC<CustomRadioGroupProps> = ({
backgroundColor:
currentItem?.id === item.id ? theme.palette.background.default : theme.palette.common.white,
"&.MuiFormControlLabel-root > .MuiTypography-root": {
width: "200px",
width: isMobile ? "150px" : "200px",
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap"
@ -86,9 +83,9 @@ export const CustomRadioGroup: FC<CustomRadioGroupProps> = ({
label={item.title}
labelPlacement={"start"}
/>
));
}
return (
))
:
(
<Box
sx={{
display: "flex",
@ -100,8 +97,7 @@ export const CustomRadioGroup: FC<CustomRadioGroupProps> = ({
>
<Typography>Нет элементов</Typography>
</Box>
);
}, [filteredItems, selectedItemId]);
)
return (
<Box

2
src/components/CustomSelect/CustomSelect.tsx
View File

@ -2,7 +2,7 @@ import * as React from "react";
import { FC, useCallback, useMemo, useRef, useState } from "react";
import { Avatar, MenuItem, Select, SelectChangeEvent, Typography, useMediaQuery, useTheme, Box } from "@mui/material";
import arrow_down from "../../assets/icons/arrow_down.svg";
import { MinifiedData } from "@/pages/IntegrationsPage/IntegrationsModal/types";
import { MinifiedData } from "@/pages/IntegrationsPage/IntegrationsModal/Amo/types";
type CustomSelectProps = {
items: MinifiedData[] | [];

0
src/pages/IntegrationsPage/IntegrationsModal/AmoAccountInfo/AmoAccountInfo.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoAccountInfo/AmoAccountInfo.tsx
View File

11
src/pages/IntegrationsPage/IntegrationsModal/AmoCRMModal.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoCRMModal.tsx
View File

@ -49,8 +49,6 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
const isTablet = useMediaQuery(theme.breakpoints.down(1000));
const { questions } = useQuestions();
console.log("КВЕШЕНЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫААААААААААААА")
console.log(questions)
const minifiedQuestions = useMemo(
() =>
questions
@ -118,6 +116,7 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
questions,
});
const handleAddTagQuestion = useCallback(
(scope: QuestionKeys | TagKeys, id: string, type: "question" | "tag") => {
if (!scope || !id) return;
@ -157,8 +156,6 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
}
if (openDelete.type === "question") {
console.log("delete id ", openDelete.id)
console.log("selectedQuestions ", selectedQuestions[openDelete.scope as QuestionKeys])
let newArray = selectedQuestions
newArray[openDelete.scope as QuestionKeys] = newArray[openDelete.scope as QuestionKeys].filter(e => e.id !== openDelete.id)
// let index = -1
@ -170,7 +167,6 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
// ...prevState,
// [openDelete.scope]: newArray,
// }));
console.log("результат ебаный", newArray)
setSelectedQuestions(newArray);
setSelectedCurrentFields(selectedCurrentFields.filter(e => e.id !== openDelete.id));
@ -216,7 +212,6 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
selectedCurrentFields.forEach((data) => {
if (data.entity === "Contact") {
console.log(data)
FieldsRule.Contact.ContactRuleMap[data.id] = Number(data.amoId)
} else {
FieldsRule[data.entity].QuestionID[data.id] = Number(data.amoId) || 0
@ -229,8 +224,6 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
}
body.FieldsRule = FieldsRule;
console.log(body)
if (firstRules) {
setIntegrationRules(quiz.backendId.toString(), body);
} else {
@ -338,6 +331,7 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
arrayOfPipelinesSteps,
arrayOfUsers,
arrayOfTags,
arrayOfFields,
selectedPipeline,
selectedPipelineStep,
selectedDealUser,
@ -347,7 +341,6 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({ isModalOpen, handleClo
arrayOfPipelinesSteps,
arrayOfUsers,
minifiedQuestions,
arrayOfTags,
selectedCurrentFields,
]
);

2
src/pages/IntegrationsPage/IntegrationsModal/AmoLogin/AmoLogin.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoLogin/AmoLogin.tsx
View File

@ -1,6 +1,6 @@
import { Box, Typography, useMediaQuery, useTheme } from "@mui/material";
import { FC } from "react";
import { AmoButton } from "../../../../components/AmoButton/AmoButton";
import { AmoButton } from "../../../../../components/AmoButton/AmoButton";
import { connectAmo } from "@api/integration";
type IntegrationStep1Props = {

0
src/pages/IntegrationsPage/IntegrationsModal/AmoModalTitle/AmoModalTitle.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoModalTitle/AmoModalTitle.tsx
View File

104
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/AmoQuestions.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/AmoQuestions.tsx
View File

@ -1,10 +1,11 @@
import { FC, useMemo, useState } from "react";
import { FC, useEffect, useMemo, useState } from "react";
import { ItemsSelectionView } from "./ItemsSelectionView/ItemsSelectionView";
import { ItemDetailsView } from "./ItemDetailsView/ItemDetailsView";
import { Box } from "@mui/material";
import { MinifiedData, QuestionKeys, SelectedQuestions, TagKeys, TagQuestionHC } from "../types";
import { EntitiesQuestions } from "./EntitiesQuestions";
import { diffArr } from "../AmoCRMModal";
import { DataConstrictor } from "../Components/DataConstrictor";
type Props = {
selectedCurrentFields: MinifiedData[] | [];
@ -41,10 +42,6 @@ export const AmoQuestions: FC<Props> = ({
FieldsAllowedFC,
setSelectedCurrentFields
}) => {
console.log("selectedCurrentFields")
console.log(selectedCurrentFields)
console.log("selectedQuestions")
console.log(selectedQuestions)
const [isSelection, setIsSelection] = useState<boolean>(false);
const [activeScope, setActiveScope] = useState<QuestionKeys | null>(null);
const [selectedQuestion, setSelectedQuestion] = useState<string | null>(null);
@ -58,9 +55,9 @@ export const AmoQuestions: FC<Props> = ({
handleAddQuestion(activeScope, selectedQuestion, "question");
};
const handleAddCurrentField = () => {
if (activeScope === null || selectedField === null || selectedQuestion === null ||
if (activeScope === null || selectedField === null || selectedQuestion === null ||
selectedCurrentFields.some(e => (e.id === selectedQuestion) && e.entity === activeScope)
) return;
) return;
setActiveScope(null);
//Убедимся что такой ФК не добавлялось
const newArray = selectedCurrentFields
@ -69,24 +66,19 @@ export const AmoQuestions: FC<Props> = ({
if (e.subTitle === selectedQuestion) index = i
})
if (index !== -1) newArray.splice(index, 1);
console.log(newArray)
newArray.push({
id: selectedQuestion,
title: questionsItems.find(e => e.id === selectedQuestion)?.title || FCTranslate[selectedQuestion],
entity: activeScope,
amoId: selectedField,
})
console.log(newArray)
setSelectedCurrentFields(newArray);
};
const handleAdd = () => {
console.log(activeScope, selectedQuestion)
if (isCurrentFields) {
console.log("добавляю текущее поле")
handleAddCurrentField()
} else {
console.log("добавляю новое поле")
handleAddNewField()
}
}
@ -99,7 +91,7 @@ export const AmoQuestions: FC<Props> = ({
});
};
const SCFworld = (() => {
const obj = {
const obj = {
Lead: [],
Company: [],
Customer: [],
@ -112,11 +104,36 @@ const obj = {
})
return obj
})()
console.log("SCFworld")
console.log(SCFworld)
const [sortedFieldsAllowedFC, setSortedFieldsAllowedFC] = useState<MinifiedData[]>(FieldsAllowedFC);
const [sortedFieldsItems, setSortedFieldsItems] = useState<MinifiedData[]>(fieldsItems);
const [sortedquestionsItems, setSortedquestionsItems] = useState<MinifiedData[]>(questionsItems);
console.log("допущенные ФОРМА КОНТАКТОВ")
console.log(FieldsAllowedFC)
console.log("фильтрованные")
console.log(sortedFieldsAllowedFC)
console.log("")
console.log("допущенные вапросы")
console.log(questionsItems)
console.log("фильтрованные")
console.log(sortedquestionsItems)
const startConstrictor = (substr: string) => {
const a = FieldsAllowedFC.filter((mData) => mData.title.toLowerCase().startsWith(substr.toLowerCase()))
const b = fieldsItems.filter((mData) => mData.title.toLowerCase().startsWith(substr.toLowerCase()))
const c = questionsItems.filter((mData) => mData.title.toLowerCase().startsWith(substr.toLowerCase()))
setSortedFieldsAllowedFC(a);
setSortedFieldsItems(b);
setSortedquestionsItems(c);
}
useEffect(() => {
setSortedFieldsAllowedFC(FieldsAllowedFC);
setSortedFieldsItems(fieldsItems);
setSortedquestionsItems(questionsItems);
}, [activeScope])
return (
<Box
sx={{
@ -127,28 +144,37 @@ const obj = {
}}
>
{isSelection && activeScope !== null ? (
<EntitiesQuestions
FieldsAllowedFC={FieldsAllowedFC}
fieldsItems={fieldsItems}
items={diffArr(questionsItems, selectedQuestions[activeScope])}
selectedItemId={selectedQuestion}
setSelectedQuestion={setSelectedQuestion}
selectedField={selectedField}
selectedCurrentFields={selectedCurrentFields}
setSelectedField={setSelectedField}
onSmallBtnClick={() => {
setActiveScope(null);
setIsSelection(false);
}}
onLargeBtnClick={() => {
handleAdd();
setActiveScope(null);
setIsSelection(false);
}}
activeScope={activeScope}
setIsCurrentFields={setIsCurrentFields}
isCurrentFields={isCurrentFields}
/>
<>
<DataConstrictor
isError={false}
constrictor={startConstrictor}
/>
{/* табличка */}
<EntitiesQuestions
FieldsAllowedFC={sortedFieldsAllowedFC}
fieldsItems={sortedFieldsItems}
items={(sortedquestionsItems.length === 0) ? [] : diffArr(sortedquestionsItems, selectedQuestions[activeScope])}
selectedItemId={selectedQuestion}
setSelectedQuestion={setSelectedQuestion}
selectedField={selectedField}
selectedCurrentFields={selectedCurrentFields}
setSelectedField={setSelectedField}
onSmallBtnClick={() => {
setActiveScope(null);
setIsSelection(false);
}}
onLargeBtnClick={() => {
handleAdd();
setActiveScope(null);
setIsSelection(false);
}}
activeScope={activeScope}
setIsCurrentFields={setIsCurrentFields}
isCurrentFields={isCurrentFields}
/>
</>
// Здесь выбираем элемент в табличку
// <ItemsSelectionView
// items={questionsItems}

97
src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/CurrentFieldSelectMobile.tsx Normal file
View File

@ -0,0 +1,97 @@
import * as React from "react";
import { FC, useCallback, useMemo, useRef, useState } from "react";
import { Avatar, MenuItem, Select, SelectChangeEvent, Typography, useMediaQuery, useTheme, Box } from "@mui/material";
import arrow_down from "@icons/arrow_down.svg";
import { MinifiedData } from "@/pages/IntegrationsPage/IntegrationsModal/Amo/types";
import { CustomRadioGroup } from "@/components/CustomRadioGroup/CustomRadioGroup";
type CustomSelectProps = {
items: MinifiedData[] | [];
selectedItemId: string | null;
setSelectedItem: (value: string | null) => void;
handleScroll: () => void;
};
export const CurrentFieldSelect: FC<CustomSelectProps> = ({ items, selectedItemId, setSelectedItem, handleScroll }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(600));
const ref = useRef<HTMLDivElement | null>(null);
const [opened, setOpened] = useState<boolean>(false);
const toggleOpened = useCallback(() => {
setOpened((isOpened) => !isOpened);
}, []);
const onScroll = useCallback((e: React.UIEvent<HTMLDivElement>) => {
const scrollHeight = e.currentTarget.scrollHeight;
const scrollTop = e.currentTarget.scrollTop;
const clientHeight = e.currentTarget.clientHeight;
const scrolledToBottom = scrollTop / (scrollHeight - clientHeight) > 0.9;
if (scrolledToBottom) {
handleScroll();
}
}, []);
const currentItem = items.find((item) => item.id === selectedItemId) || null
return (
<Box>
<Box
sx={{
zIndex: 0,
position: "relative",
width: "100%",
height: "56px",
padding: "5px",
color: "#4D4D4D",
border: `2px solid ${theme.palette.common.white}`,
borderRadius: "12px",
background: "#EFF0F5",
display: "flex",
alignItems: "center",
cursor: "pointer",
}}
onClick={toggleOpened}
>
<Typography
sx={{
marginLeft: isMobile ? "10px" : "20px",
fontWeight: "400",
fontSize: "18px",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
overflow: "hidden",
flexGrow: 1,
}}
>
{currentItem?.title || "Выберите поле"}
</Typography>
<img
src={arrow_down}
alt="check"
style={{
position: "absolute",
top: "50%",
right: "10px",
transform: `translateY(-50%) rotate(${opened ? "180deg" : "0deg"}`,
height: "36px",
width: "36px",
}}
className={`select-icon ${opened ? "opened" : ""}`}
/>
</Box>
{opened &&
<CustomRadioGroup
items={items}
selectedItemId={selectedItemId}
setSelectedItem={setSelectedItem}
handleScroll={() => { }}
activeScope={undefined}
/>
}
</Box>
);
};

2
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/CurrentFields.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/CurrentFields.tsx
View File

@ -2,7 +2,7 @@ import { CustomRadioGroup } from "@/components/CustomRadioGroup/CustomRadioGroup
import {Box, Typography, useMediaQuery, useTheme} from "@mui/material"
import { MinifiedData } from "../types";
import {CustomSelect} from "@/components/CustomSelect/CustomSelect";
import {CurrentFieldSelect} from "@/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/CurrentFieldSelectMobile";
import {CurrentFieldSelect} from "@/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/CurrentFieldSelectMobile";
interface Props {
items: MinifiedData[];

8
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/EntitiesQuestions.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/EntitiesQuestions.tsx
View File

@ -41,6 +41,13 @@ export const EntitiesQuestions: FC<ItemsSelectionViewProps> = ({
}) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(600));
console.log("--------------")
console.log("EntitiesQuestions")
console.log("вопросы")
console.log(items)
console.log("ФК")
console.log(FieldsAllowedFC)
console.log("------------------------------")
return (
<Box
@ -58,6 +65,7 @@ export const EntitiesQuestions: FC<ItemsSelectionViewProps> = ({
flexGrow: 1,
width: "100%",
height: "346px",
overflow: "auto"
}}
>
<Box>

0
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/Item/AnswerItem/AnswerItem.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/Item/AnswerItem/AnswerItem.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/Item/IconBtnAdd/IconBtnAdd.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/Item/IconBtnAdd/IconBtnAdd.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/Item/Item.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/Item/Item.tsx
View File

5
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/ItemDetailsView/ItemDetailsView.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/ItemDetailsView/ItemDetailsView.tsx
View File

@ -25,12 +25,7 @@ export const ItemDetailsView: FC<ItemDetailsViewProps> = ({
setActiveScope,
deleteHC,
}) => {
console.log(selectedQuestions)
const theme = useTheme();
console.log("items")
console.log(items)
console.log("selectedQuestions")
console.log(selectedQuestions)
return (
<Box

2
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/ItemForQuestions.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/ItemForQuestions.tsx
View File

@ -2,7 +2,7 @@ import { Box, IconButton, Typography, useTheme } from "@mui/material";
import { FC } from "react";
import { IconBtnAdd } from "./Item/IconBtnAdd/IconBtnAdd";
import { AnswerItem } from "./Item/AnswerItem/AnswerItem";
import { QuestionKeys, SelectedQuestions, TagKeys, SelectedTags, MinifiedData } from "../../types";
import { QuestionKeys, SelectedQuestions, TagKeys, SelectedTags, MinifiedData } from "../types";
type ItemProps = {
items: MinifiedData[];

2
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/ItemsSelectionView/ItemsSelectionView.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/ItemsSelectionView/ItemsSelectionView.tsx
View File

@ -1,5 +1,5 @@
import { Box } from "@mui/material";
import { CustomRadioGroup } from "../../../../../components/CustomRadioGroup/CustomRadioGroup";
import { CustomRadioGroup } from "../../../../../../components/CustomRadioGroup/CustomRadioGroup";
import { StepButtonsBlock } from "../../StepButtonsBlock/StepButtonsBlock";
import { FC } from "react";
import { MinifiedData, TagKeys } from "../../types";

0
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/NewFields.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoQuestions/NewFields.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/AmoRemoveAccount/AmoDeleteTagQuestion.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoRemoveAccount/AmoDeleteTagQuestion.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/AmoRemoveAccount/AmoRemoveAccount.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoRemoveAccount/AmoRemoveAccount.tsx
View File

45
src/pages/IntegrationsPage/IntegrationsModal/AmoTags/AmoTags.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoTags/AmoTags.tsx
View File

@ -3,6 +3,7 @@ import { Box } from "@mui/material";
import { ItemsSelectionView } from "../AmoQuestions/ItemsSelectionView/ItemsSelectionView";
import { TagsDetailsView } from "./TagsDetailsView/TagsDetailsView";
import { MinifiedData, QuestionKeys, SelectedTags, TagKeys, TagQuestionHC } from "../types";
import { DataConstrictor } from "../Components/DataConstrictor";
type Props = {
tagsItems: MinifiedData[] | [];
@ -23,6 +24,8 @@ export const AmoTags: FC<Props> = ({
handlePrevStep,
handleNextStep,
}) => {
const [sortedTagsItems, setSortedTagsItems] = useState<MinifiedData[] | []>(tagsItems);
const [isSelection, setIsSelection] = useState<boolean>(false);
const [activeScope, setActiveScope] = useState<TagKeys | null>(null);
const [selectedTag, setSelectedTag] = useState<string | null>(null);
@ -39,6 +42,10 @@ export const AmoTags: FC<Props> = ({
type: "tag",
});
};
const startConstrictor = (substr: string) => {
const a = tagsItems.filter((mData) => mData.title.toLowerCase().startsWith(substr.toLowerCase()))
setSortedTagsItems(a);
}
return (
<Box
@ -51,22 +58,28 @@ export const AmoTags: FC<Props> = ({
>
{isSelection && activeScope !== null ? (
// Здесь выбираем элемент в табличку
<ItemsSelectionView
items={tagsItems}
selectedItemId={selectedTag}
setSelectedItem={setSelectedTag}
handleScroll={handleScroll}
activeScope={activeScope}
onSmallBtnClick={() => {
setActiveScope(null);
setIsSelection(false);
}}
onLargeBtnClick={() => {
handleAdd();
setActiveScope(null);
setIsSelection(false);
}}
/>
<>
<DataConstrictor
isError={sortedTagsItems.length === 0}
constrictor={startConstrictor}
/>
<ItemsSelectionView
items={sortedTagsItems}
selectedItemId={selectedTag}
setSelectedItem={setSelectedTag}
handleScroll={handleScroll}
activeScope={activeScope}
onSmallBtnClick={() => {
setActiveScope(null);
setIsSelection(false);
}}
onLargeBtnClick={() => {
handleAdd();
setActiveScope(null);
setIsSelection(false);
}}
/>
</>
) : (
// Табличка
<TagsDetailsView

12
src/pages/IntegrationsPage/IntegrationsModal/AmoTags/TagsDetailsView/TagsDetailsView.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoTags/TagsDetailsView/TagsDetailsView.tsx
View File

@ -1,4 +1,4 @@
import { Box, Typography, useTheme } from "@mui/material";
import { Box, Typography, useMediaQuery, useTheme } from "@mui/material";
import { StepButtonsBlock } from "../../StepButtonsBlock/StepButtonsBlock";
import { FC } from "react";
import { Item } from "../../AmoQuestions/Item/Item";
@ -25,6 +25,8 @@ export const TagsDetailsView: FC<TagsDetailsViewProps> = ({
}) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(600));
return (
<Box
sx={{
@ -45,13 +47,15 @@ export const TagsDetailsView: FC<TagsDetailsViewProps> = ({
padding: "10px",
boxShadow: "0 0 20px rgba(0, 0, 0, 0.15)",
display: "flex",
flexDirection: isMobile ? "column" : "row",
}}
>
<Box
sx={{
padding: "0 40px",
borderRight: `1px solid ${theme.palette.background.default}`,
height: "100%",
p: isMobile ? "0" : "0 40px",
m: isMobile ? "5px auto 20px" : "0",
borderRight: isMobile ? "none" : `1px solid ${theme.palette.background.default}`,
height: isMobile ? "auto" : "100%",
display: "flex",
alignItems: "center",
}}

0
src/pages/IntegrationsPage/IntegrationsModal/AmoTokenExpiredDialog.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/AmoTokenExpiredDialog.tsx
View File

62
src/pages/IntegrationsPage/IntegrationsModal/Amo/Components/DataConstrictor.tsx Normal file
View File

@ -0,0 +1,62 @@
import { useState } from "react"
import { IconButton, Input, useMediaQuery, useTheme } from "@mui/material"
import Trash from "@/assets/icons/trash"
import { useDebouncedCallback } from "use-debounce"
interface Props {
isError: boolean
constrictor: (text: string) => void
}
export const DataConstrictor = ({
isError,
constrictor,
}: Props) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(600));
const [text, setText] = useState("")
const errCalc = isError && text.length > 0
const debouncedTestHC = useDebouncedCallback(
(value: string) => {
constrictor(value)
},
700
);
return <Input
value={text}
placeholder="быстрый поиск"
disableUnderline
sx={{
bgcolor: isError ? "#e6bbbb" : "#f2f3f7",
borderRadius: "10px",
maxWidth: isMobile ? "200px" : "300px",
p: "0 5px 0 15px",
mt: "10px",
"&:hover": {
bgcolor: errCalc ? "#e6bbbb" : "#ececec"
}
}}
endAdornment={
text.length > 0
?
<IconButton
onClick={() => {
setText("")
constrictor("")
}}
>
<Trash />
</IconButton>
:
null
}
onChange={({ target }) => {
setText(target.value)
debouncedTestHC(target.value)
}}
/>
}

2
src/pages/IntegrationsPage/IntegrationsModal/DealPerformers/DealPerformers.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/DealPerformers/DealPerformers.tsx
View File

@ -1,7 +1,7 @@
import { Box, useMediaQuery, useTheme } from "@mui/material";
import { FC } from "react";
import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock";
import { CustomSelect } from "../../../../components/CustomSelect/CustomSelect";
import { CustomSelect } from "../../../../../components/CustomSelect/CustomSelect";
import { MinifiedData } from "../types";
type Props = {

4
src/pages/IntegrationsPage/IntegrationsModal/PipelineSteps/PipelineSteps.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/PipelineSteps/PipelineSteps.tsx
View File

@ -1,8 +1,8 @@
import { Box, useMediaQuery, useTheme } from "@mui/material";
import { FC } from "react";
import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock";
import { CustomSelect } from "../../../../components/CustomSelect/CustomSelect";
import { CustomRadioGroup } from "../../../../components/CustomRadioGroup/CustomRadioGroup";
import { CustomSelect } from "../../../../../components/CustomSelect/CustomSelect";
import { CustomRadioGroup } from "../../../../../components/CustomRadioGroup/CustomRadioGroup";
import { MinifiedData } from "../types";
type Props = {

4
src/pages/IntegrationsPage/IntegrationsModal/Pipelines/Pipelines.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/Pipelines/Pipelines.tsx
View File

@ -1,8 +1,8 @@
import { Box, useMediaQuery, useTheme } from "@mui/material";
import { FC } from "react";
import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock";
import { CustomSelect } from "../../../../components/CustomSelect/CustomSelect";
import { CustomRadioGroup } from "../../../../components/CustomRadioGroup/CustomRadioGroup";
import { CustomSelect } from "../../../../../components/CustomSelect/CustomSelect";
import { CustomRadioGroup } from "../../../../../components/CustomRadioGroup/CustomRadioGroup";
import { MinifiedData } from "../types";
type Props = {

0
src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/AmoSettingsBlock.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/SettingsBlock/AmoSettingsBlock.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/ResponsiblePerson/ResponsiblePerson.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/SettingsBlock/SettingItem/ResponsiblePerson/ResponsiblePerson.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SelectedParameter/SelectedParameter.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/SettingsBlock/SettingItem/SelectedParameter/SelectedParameter.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItem.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/SettingsBlock/SettingItem/SettingItem.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/SettingsBlock/SettingItem/SettingItemHeader/SettingItemHeader.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/SettingsBlock/SettingItem/SettingItemHeader/SettingItemHeader.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/StepButtonsBlock/StepButtonsBlock.tsx → src/pages/IntegrationsPage/IntegrationsModal/Amo/StepButtonsBlock/StepButtonsBlock.tsx
View File

0
src/pages/IntegrationsPage/IntegrationsModal/types.ts → src/pages/IntegrationsPage/IntegrationsModal/Amo/types.ts
View File

5
src/pages/IntegrationsPage/IntegrationsModal/useAmoIntegration.ts → src/pages/IntegrationsPage/IntegrationsModal/Amo/useAmoIntegration.ts
View File

@ -14,7 +14,7 @@ import {
} from "@/api/integration";
import { AnyTypedQuizQuestion } from "@frontend/squzanswerer";
const SIZE = 175;
const SIZE = 275;
interface Props {
isModalOpen: boolean;
@ -101,8 +101,6 @@ export const useAmoIntegration = ({ isModalOpen, isTryRemoveAccount, quizID, que
if (gottenList !== null) {
Object.keys(gottenList.QuestionID).forEach((qId) => {
console.log(qId)
console.log(questions)
const q = questions.find(e=>e.backendId === Number(qId)) || {}
gottenQuestions[key as QuestionKeys].push({
id: qId,
@ -126,7 +124,6 @@ export const useAmoIntegration = ({ isModalOpen, isTryRemoveAccount, quizID, que
amoId: MAP[key].toString(),
})
}
console.log(list)
setSelectedCurrentFields(list)
}
}

189
src/pages/IntegrationsPage/IntegrationsModal/AmoQuestions/CurrentFieldSelectMobile.tsx
View File

@ -1,189 +0,0 @@
import * as React from "react";
import { FC, useCallback, useMemo, useRef, useState } from "react";
import { Avatar, MenuItem, Select, SelectChangeEvent, Typography, useMediaQuery, useTheme, Box } from "@mui/material";
import arrow_down from "@icons/arrow_down.svg";
import { MinifiedData } from "@/pages/IntegrationsPage/IntegrationsModal/types";
type CustomSelectProps = {
items: MinifiedData[] | [];
selectedItemId: string | null;
setSelectedItem: (value: string | null) => void;
handleScroll: () => void;
};
export const CurrentFieldSelect: FC<CustomSelectProps> = ({ items, selectedItemId, setSelectedItem, handleScroll }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(600));
const ref = useRef<HTMLDivElement | null>(null);
const [opened, setOpened] = useState<boolean>(false);
const toggleOpened = useCallback(() => {
setOpened((isOpened) => !isOpened);
}, []);
const onScroll = useCallback((e: React.UIEvent<HTMLDivElement>) => {
const scrollHeight = e.currentTarget.scrollHeight;
const scrollTop = e.currentTarget.scrollTop;
const clientHeight = e.currentTarget.clientHeight;
const scrolledToBottom = scrollTop / (scrollHeight - clientHeight) > 0.9;
if (scrolledToBottom) {
handleScroll();
}
}, []);
const currentItem = useMemo(() => items.find((item) => item.id === selectedItemId) || null, [selectedItemId, items]);
const menuItems = useMemo(() => {
if (items.length !== 0) {
return items.map((item) => (
<MenuItem
key={item.id}
value={item.id}
sx={{
padding: "6px 0",
zIndex: 5,
borderTop: "1px solid rgba(154, 154, 175, 0.1)",
width: "auto",
}}
>
<Box
sx={{
fontSize: "16px",
color: "#4D4D4D",
display: "flex",
flexDirection: isMobile ? "column" : "row",
justifyContent: "space-evenly",
width: "100%",
}}
>
<Typography
sx={{
width: "33%",
borderRight: isMobile ? "none" : "1px solid rgba(154, 154, 175, 0.1)",
padding: isMobile ? "5px 0 5px 20px" : "10px 0 10px 20px",
}}
>
{item.title}
</Typography>
<Typography
sx={{
width: "33%",
borderRight: isMobile ? "none" : "1px solid rgba(154, 154, 175, 0.1)",
padding: isMobile ? "5px 0 5px 20px" : "10px 0 10px 20px",
color: isMobile ? "#9A9AAF" : "#4D4D4D",
}}
>
{item.subTitle}
</Typography>
</Box>
</MenuItem>
));
}
return (
<MenuItem
key={"-1"}
disabled
sx={{ padding: "12px", zIndex: 2 }}
>
нет данных
</MenuItem>
);
}, [items, selectedItemId]);
return (
<Box>
<Box
sx={{
zIndex: 0,
position: "relative",
width: "100%",
height: "56px",
padding: "5px",
color: "#4D4D4D",
border: `2px solid ${theme.palette.common.white}`,
borderRadius: "12px",
background: "#EFF0F5",
display: "flex",
alignItems: "center",
cursor: "pointer",
}}
onClick={() => {
if (ref.current !== null) ref.current?.click();
}}
>
<Typography
sx={{
marginLeft: isMobile ? "10px" : "20px",
fontWeight: "400" ,
fontSize: "18px",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
overflow: "hidden",
flexGrow: 1,
}}
>
{currentItem?.title || "Выберите поле"}
</Typography>
<img
src={arrow_down}
alt="check"
style={{
position: "absolute",
top: "50%",
right: "10px",
transform: `translateY(-50%) rotate(${opened ? "180deg" : "0deg"}`,
height: "36px",
width: "36px",
}}
className={`select-icon ${opened ? "opened" : ""}`}
/>
</Box>
<Select
ref={ref}
className="select"
value={selectedItemId || ""}
open={opened}
MenuProps={{
disablePortal: true,
PaperProps: {
onScroll: onScroll,
style: {
zIndex: 2,
minWidth: undefined,
maxHeight: "300px",
overflow: "auto",
overflowX: "auto",
paddingTop: 0,
marginTop: "-50px",
borderRadius: "12px",
border: "1px solid",
maxWidth: "calc(100% - 104px)",
left: "52px",
boxShadow: "none"
},
},
}}
sx={{
display: "block",
"& .MuiSelect-select.MuiSelect-outlined.MuiInputBase-input": {
display: "none",
},
"& .MuiSelect-icon": {
display: "none",
},
"& .MuiOutlinedInput-notchedOutline": {
border: 0,
},
}}
onChange={({ target }: SelectChangeEvent<string>) => setSelectedItem(target.value)}
onClick={toggleOpened}
>
{menuItems}
</Select>
</Box>
);
};

4
src/pages/IntegrationsPage/PartnersBoard/PartnersBoard.tsx
View File

@ -16,7 +16,7 @@ const AnalyticsModal = lazy(() =>
);
const AmoCRMModal = lazy(() =>
import("../IntegrationsModal/AmoCRMModal").then((module) => ({
import("../IntegrationsModal/Amo/AmoCRMModal").then((module) => ({
default: module.AmoCRMModal,
}))
);
@ -60,7 +60,7 @@ export const PartnersBoard: FC<PartnersBoardProps> = ({
>
<Box>
{
user.user._id === "6694dc24d5802e9f13662a7e" &&
user.user._id === "6692e068983ee77f8e1e682e" &&
<>
<Typography
variant="h6"

3
src/pages/QuizAnswersPage/CardAnswer.tsx
View File

@ -297,8 +297,6 @@ export const CardAnswer: FC<CardAnswerProps> = ({
}}
>
{resultsAnswer.map((answer, id) => {
// console.log(answer)
// console.log(answer.content)
let titleQuestion;
let typeOuestion;
let typeQuestionFile;
@ -308,7 +306,6 @@ export const CardAnswer: FC<CardAnswerProps> = ({
let idAnswer = answer.question_id; //айди вопроса у ответа
for (i in quest) {
if (quest[i].backendId === idAnswer) {
console.log(quest[i])
titleQuestion = quest[i].title;
typeOuestion = quest[i].type;
typeQuestionFile = quest[i].content.type;

8
src/pages/Tariffs/Tariffs.tsx
View File

@ -135,18 +135,14 @@ function TariffPage() {
//Если нам хватает денежек - покупаем тариф
const [data, payError] = await cartApi.pay();
console.log(payError)
if (payError || !data) {
//если денег не хватило
if (payError?.includes("insufficient funds") || payError?.includes("Payment Required")) {
let cashDif = Number(payError.split(":")[1]);
console.log(payError)
console.log(cashDif)
var link = document.createElement("a");
link.href = `https://${isTestServer ? "s" : ""}hub.pena.digital/quizpayment?action=squizpay&dif=${cashDif}&data=${token}&userid=${userId}`;
document.body.appendChild(link);
console.log(link)
link.click();
return;
}
@ -440,11 +436,7 @@ const outCart = (cart: string[]) => {
}
let saveCart = JSON.parse(localStorage.getItem("saveCart") || "[]") || [];
console.log("saveCart")
console.log(saveCart)
if (!Array.isArray(saveCart)) saveCart = []
console.log("saveCart")
console.log(saveCart)
saveCart = saveCart.push(id);
localStorage.setItem("saveCart", JSON.stringify(saveCart));
});

3
src/pages/createQuize/CreateButtons.tsx
View File

@ -9,7 +9,6 @@ export default function CreateButtons({ mt }: string) {
const navigate = useNavigate();
const theme = useTheme();
const user = useUserStore();
console.log(user)
const isMobile = useMediaQuery(theme.breakpoints.down(500));
return (
@ -22,7 +21,7 @@ export default function CreateButtons({ mt }: string) {
}}
>
{
user.user._id === "6694dc24d5802e9f13662a7e" &&
user.user._id === "6692e068983ee77f8e1e682e" &&
<Link to="/gallery" style={{ textDecoration: "none" }}>
<Button
sx={{

2
src/pages/startPage/EditPage.tsx
View File

@ -21,7 +21,7 @@ import { AnyTypedQuizQuestion } from "@frontend/squzanswerer";
import { ModalInfoWhyCantCreate } from "./ModalInfoWhyCantCreate";
import { ConfirmLeaveModal } from "./ConfirmLeaveModal";
import { checkQuestionHint } from "@utils/checkQuestionHint";
import AmoTokenExpiredDialog from "../IntegrationsPage/IntegrationsModal/AmoTokenExpiredDialog";
import AmoTokenExpiredDialog from "../IntegrationsPage/IntegrationsModal/Amo/AmoTokenExpiredDialog";
import { useAmoAccount } from "@/api/integration";
interface Props {

51
src/ui_kit/Header/Avatar.tsx
View File

@ -1,51 +0,0 @@
import { Avatar, Box, SxProps, Theme, Typography } from "@mui/material";
interface Props {
sx: SxProps<Theme>;
}
export default function CustomAvatar({ sx }: Props) {
return (
<Avatar sx={sx}>
<Typography
sx={{
fontWeight: 500,
fontSize: "14px",
lineHeight: "20px",
zIndex: 1,
}}
>
AA
</Typography>
<Box sx={{ position: "absolute" }}>
<svg
xmlns="http://www.w3.org/2000/svg"
width="37"
height="36"
viewBox="0 0 37 36"
fill="none"
>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M16.0896 15.3939C16.1897 9.41281 22.9128 5.35966 28.711 3.9153C34.7649 2.40721 41.974 3.19598 46.0209 7.93784C49.6931 12.2405 46.8503 18.5029 45.9355 24.0976C45.2565 28.2502 44.7264 32.5083 41.552 35.2692C38.1345 38.2416 32.8105 41.3312 29.1224 38.7209C25.459 36.1281 30.5336 29.8417 28.3428 25.9204C25.5777 20.9711 15.9947 21.0705 16.0896 15.3939Z"
fill="#FC712F"
/>
<circle
cx="28.7954"
cy="-4.08489"
r="5.51855"
transform="rotate(-32.339 28.7954 -4.08489)"
fill="#FC712F"
/>
<circle
cx="25.1065"
cy="28.2781"
r="1.26958"
transform="rotate(-32.339 25.1065 28.2781)"
fill="#FC712F"
/>
</svg>
</Box>
</Avatar>
);
}

32
src/ui_kit/Header/NavMenuItem.tsx
View File

@ -1,32 +0,0 @@
import { Link, Typography, useTheme } from "@mui/material";
interface Props {
text: string;
isActive?: boolean;
onClick?: () => void;
href?: string;
}
export default function NavMenuItem({
href,
onClick,
text,
isActive = false,
}: Props) {
const theme = useTheme();
return (
<Link href={href} underline="none" onClick={onClick}>
я есть навбар меню итем
<Typography
color={isActive ? theme.palette.brightPurple.main : undefined}
variant="body2"
sx={{
whiteSpace: "nowrap",
}}
>
{text}
</Typography>
</Link>
);
}

45
src/ui_kit/Header/NavbarCollapsed.tsx
View File

@ -1,45 +0,0 @@
import { IconButton, useTheme } from "@mui/material";
import SectionWrapper from "../SectionWrapper";
import MenuIcon from "@mui/icons-material/Menu";
import PenaLogo from "@ui_kit/PenaLogo";
interface Props {
isLoggedIn: boolean;
}
export default function NavbarCollapsed({ isLoggedIn }: Props) {
const theme = useTheme();
return (
<SectionWrapper
component="nav"
maxWidth="lg"
outerContainerSx={{
backgroundColor: theme.palette.navbarbg.main,
position: "sticky",
top: 0,
zIndex: 1,
}}
sx={{
height: "51px",
py: "6px",
display: "flex",
justifyContent: "space-between",
alignItems: "center",
}}
>
я подписан как навбар коллапсед
<PenaLogo width={100} />
<IconButton
sx={{
p: 0,
height: "30px",
width: "30px",
color: theme.palette.primary.main,
}}
>
<MenuIcon sx={{ height: "30px", width: "30px" }} />
</IconButton>
</SectionWrapper>
);
}