118 lines
3.3 KiB
TypeScript
118 lines
3.3 KiB
TypeScript
import { Box, Button } from "@mui/material"
|
||
import { StepButtonsBlock } from "../StepButtonsBlock/StepButtonsBlock"
|
||
import { FC, useState } from "react";
|
||
import { MinifiedData, TagKeys } from "../types";
|
||
import { CurrentFields } from "./CurrentFields";
|
||
import { NewFields } from "./NewFields";
|
||
import { QuestionPair } from "./AmoQuestions";
|
||
|
||
type ItemsSelectionViewProps = {
|
||
items: MinifiedData[] | [];
|
||
fieldsItems: MinifiedData[] | [];
|
||
selectedItemId?: string | null;
|
||
setSelectedQuestion: (value: string | null) => void;
|
||
selectedField?: string | null;
|
||
setSelectedField: (value: string | null) => void;
|
||
handleScroll?: () => void;
|
||
onLargeBtnClick: () => void;
|
||
onSmallBtnClick: () => void;
|
||
activeScope: TagKeys;
|
||
FieldsAllowedFC: MinifiedData[];
|
||
setIsCurrentFields: (a:boolean) => void;
|
||
isCurrentFields: boolean
|
||
}
|
||
export const EntitiesQuestions: FC<ItemsSelectionViewProps> = ({
|
||
items,
|
||
fieldsItems,
|
||
selectedItemId,
|
||
setSelectedQuestion,
|
||
selectedField,
|
||
setSelectedField,
|
||
handleScroll,
|
||
onLargeBtnClick,
|
||
onSmallBtnClick,
|
||
activeScope,
|
||
FieldsAllowedFC,
|
||
setIsCurrentFields,
|
||
isCurrentFields,
|
||
}) => {
|
||
|
||
return (
|
||
<Box
|
||
sx={{
|
||
display: "flex",
|
||
flexDirection: "column",
|
||
alignItems: "center",
|
||
height: "100%",
|
||
flexGrow: 1,
|
||
}}
|
||
>
|
||
<Box
|
||
sx={{
|
||
marginTop: "20px",
|
||
flexGrow: 1,
|
||
width: "100%",
|
||
height: "346px",
|
||
}}
|
||
>
|
||
<Box>
|
||
<Button
|
||
onClick={() => setIsCurrentFields(old => !old)}
|
||
sx={{
|
||
borderRadius: "50px",
|
||
p: "10px 30px",
|
||
mr: "10px",
|
||
|
||
border: isCurrentFields ? "1px solid #7E2AEA" : "",
|
||
bgcolor: isCurrentFields ? "#7E2AEA1A" : "#F2F3F7",
|
||
color: isCurrentFields ? "#7E2AEA" : "",
|
||
}}
|
||
>Ваши готовые поля</Button>
|
||
<Button
|
||
onClick={() => setIsCurrentFields(old => !old)}
|
||
sx={{
|
||
borderRadius: "50px",
|
||
p: "10px 30px",
|
||
|
||
border: !isCurrentFields ? "1px solid #7E2AEA" : "",
|
||
bgcolor: !isCurrentFields ? "#7E2AEA1A" : "#F2F3F7",
|
||
color: !isCurrentFields ? "#7E2AEA" : "",
|
||
}}
|
||
>Новые поля</Button>
|
||
</Box>
|
||
{
|
||
isCurrentFields ?
|
||
<CurrentFields
|
||
items={items}
|
||
fieldsItems={[...FieldsAllowedFC, ...fieldsItems].filter(e => e.entity === activeScope)}
|
||
currentField={selectedField}
|
||
currentQuestion={selectedItemId}
|
||
setCurrentField={setSelectedField}
|
||
setCurrentQuestion={setSelectedQuestion}
|
||
/>
|
||
:
|
||
<NewFields
|
||
items={items}
|
||
currentQuestion={selectedItemId}
|
||
setCurrentQuestion={setSelectedQuestion}
|
||
/>
|
||
}
|
||
</Box>
|
||
<Box
|
||
sx={{
|
||
marginTop: "20px",
|
||
alignSelf: "end",
|
||
}}
|
||
>
|
||
<StepButtonsBlock
|
||
onLargeBtnClick={() => {
|
||
onLargeBtnClick()
|
||
}}
|
||
largeBtnText={"Добавить"}
|
||
onSmallBtnClick={onSmallBtnClick}
|
||
smallBtnText={"Отменить"}
|
||
/>
|
||
</Box>
|
||
</Box>
|
||
)
|
||
} |