амо: вывод инфо о юзере, реактивность, отправка id воронки

This commit is contained in:
Nastya 2024-06-02 00:05:04 +03:00
parent c9b27cbef9
commit ca132a1575
5 changed files with 37 additions and 9 deletions

@ -12,6 +12,7 @@ const API_URL = `${process.env.REACT_APP_DOMAIN}/squiz/amocrm`;
export type AccountResponse = { export type AccountResponse = {
ID: number; ID: number;
AmoUserID: number;
AccountID: string; AccountID: string;
AmoID: number; AmoID: number;
Name: string; Name: string;

@ -5,7 +5,7 @@ import RadioGroup from "@mui/material/RadioGroup";
import FormControlLabel from "@mui/material/FormControlLabel"; import FormControlLabel from "@mui/material/FormControlLabel";
import Box from "@mui/material/Box"; import Box from "@mui/material/Box";
import CheckboxIcon from "@icons/Checkbox"; import CheckboxIcon from "@icons/Checkbox";
import { Typography, useTheme } from "@mui/material"; import { Typography, useMediaQuery, useTheme } from "@mui/material";
import { import {
getPipelines, getPipelines,
getSteps, getSteps,
@ -32,6 +32,9 @@ export const CustomRadioGroup: FC<CustomRadioGroupProps> = ({
pipelineId, pipelineId,
}) => { }) => {
const theme = useTheme(); const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(500));
const [currentValue, setCurrentValue] = useState<string | null>( const [currentValue, setCurrentValue] = useState<string | null>(
selectedValue, selectedValue,
); );
@ -117,7 +120,7 @@ export const CustomRadioGroup: FC<CustomRadioGroupProps> = ({
<FormControlLabel <FormControlLabel
key={item.ID} key={item.ID}
sx={{ sx={{
color: "black", color: "red",
padding: "15px", padding: "15px",
borderBottom: `1px solid ${theme.palette.background.default}`, borderBottom: `1px solid ${theme.palette.background.default}`,
display: "flex", display: "flex",
@ -205,8 +208,13 @@ export const CustomRadioGroup: FC<CustomRadioGroupProps> = ({
currentValue === pipeline.Name currentValue === pipeline.Name
? theme.palette.background.default ? theme.palette.background.default
: theme.palette.common.white, : theme.palette.common.white,
"&.MuiFormControlLabel-root > .MuiTypography-root": {
width: "200px",
overflow: "hidden",
textOverflow: "ellipsis"
}
}} }}
value={pipeline.Name} value={pipeline.ID}
control={ control={
<Radio <Radio
checkedIcon={ checkedIcon={

@ -29,7 +29,26 @@ export const AmoAccountInfo: FC<AmoAccountInfoProps> = ({
</Typography> </Typography>
</Box> </Box>
<Box sx={{ width: isMobile ? "100%" : "45%" }}> <Box sx={{ width: isMobile ? "100%" : "45%" }}>
<Typography>{value}</Typography> <Typography>{value || "нет данных"}</Typography>
</Box>
</Box>
);
const infoItemLink = (title: string, link: string) => (
<Box
sx={{
display: "flex",
flexDirection: isMobile ? "column" : "row",
justifyContent: "space-between",
}}
>
<Box sx={{ width: isMobile ? "100%" : "45%" }}>
<Typography sx={{ color: theme.palette.grey2.main }}>
{title}:
</Typography>
</Box>
<Box sx={{ width: isMobile ? "100%" : "45%" }}>
<a target="_blank" href={link}>{link}</a>
</Box> </Box>
</Box> </Box>
); );
@ -52,12 +71,11 @@ export const AmoAccountInfo: FC<AmoAccountInfoProps> = ({
gap: isMobile ? "10px" : "20px", gap: isMobile ? "10px" : "20px",
}} }}
> >
{infoItem("Amo ID", accountInfo.AmoID)} {infoItem("Amo ID", accountInfo.AmoUserID)}
{infoItem("Имя аккаунта", accountInfo.Name)} {infoItem("Имя аккаунта", accountInfo.Name)}
{infoItem("Email аккаунта", accountInfo.Email)} {infoItem("Email аккаунта", accountInfo.Email)}
{infoItem("Роль", accountInfo.Role)} {infoItemLink("ЛК в amo", `https://${accountInfo.Subdomain}.amocrm.ru/dashboard/`)}
{infoItem("Группа пользователя", accountInfo.Group)} {infoItemLink("Профиль пользователя в amo", `https://${accountInfo.Subdomain}.amocrm.ru/settings/users/`)}
{infoItem("URL профиля пользователя в Amo", accountInfo.Subdomain)}
{infoItem("Страна пользователя", accountInfo.Country)} {infoItem("Страна пользователя", accountInfo.Country)}
</Box> </Box>
<StepButtonsBlock <StepButtonsBlock

@ -68,6 +68,7 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({
company: [], company: [],
buyer: [], buyer: [],
}); });
console.log(accountInfo)
useEffect(() => { useEffect(() => {
if (isModalOpen) { if (isModalOpen) {
@ -176,6 +177,7 @@ export const AmoCRMModal: FC<IntegrationsModalProps> = ({
}, },
], ],
[ [
accountInfo,
questionEntity, questionEntity,
selectedPipelinePerformer, selectedPipelinePerformer,
selectedPipeline, selectedPipeline,

@ -321,7 +321,6 @@ export default function Component() {
> >
Аналитика Аналитика
</Typography> </Typography>
<Typography>(в разработке)</Typography>
</Box> </Box>
<Box maxWidth={"230px"}> <Box maxWidth={"230px"}>
<Typography <Typography