crap

src/pages/LeadsPage/index.ts

@@ -0,0 +1 @@
+export {LeadsPage} from './ui/LeadsPage.tsx';

src/pages/LeadsPage/ui/LeadsPage.module.css

@@ -0,0 +1,35 @@
+.container {
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+}
+
+.header {
+    display: flex;
+    flex-direction: row;
+}
+
+.header-input {
+    flex: 1;
+}
+
+.header-button {
+    height: 100%;
+    width: 10%;
+    min-width: 5rem;
+}
+
+.search-input {
+
+}
+
+.boards {
+    margin-top: 1rem;
+    flex: 1;
+    display: flex;
+    gap: 0.5rem;
+    justify-content: center;
+    /*background-color: rebeccapurple;*/
+    padding-right: 5%;
+    padding-left: 5%;
+}

src/pages/LeadsPage/ui/LeadsPage.tsx

@@ -0,0 +1,39 @@
+import {FC} from "react";
+import styles from './LeadsPage.module.css';
+import Board from "../../../components/Dnd/Board/Board.tsx";
+import {Button, TextInput} from "@mantine/core";
+import {DragDropContext} from "@hello-pangea/dnd";
+
+export const LeadsPage: FC = () => {
+
+    return (
+        <div className={styles['container']}>
+            <div className={styles['header']}>
+                <TextInput
+                    radius={0}
+                    placeholder={"Поиск и фильтры"}
+                    size={"xl"}
+                    className={styles['header-input']}
+                />
+                <Button
+                    radius={0}
+                    color={"gray"}
+                    variant={"light"}
+                    className={styles['header-button']}
+                >Поиск</Button>
+            </div>
+            <div className={styles['boards']}>
+                <DragDropContext onDragEnd={() => {
+                }}>
+                    <Board title={"Ожидает приемки"} withCreateButton droppableId={"AWAITING_ACCEPTANCE"}/>
+                    <Board title={"Упаковка"} droppableId={"PACKAGING"}/>
+                    <Board title={"Ожидает отгрузки"} droppableId={"AWAITING_SHIPMENT"}/>
+                    <Board title={"Ожидает оплаты"} droppableId={"AWAITING_PAYMENT"}/>
+                    <Board title={"Завершена"} droppableId={"COMPLETED"}/>
+
+                </DragDropContext>
+
+            </div>
+        </div>
+    )
+}

src/pages/LoginPage/LoginPage.module.scss

@@ -0,0 +1,6 @@
+.title {
+  font-family:
+          Greycliff CF,
+          var(--mantine-font-family);
+  font-weight: 900;
+}

src/pages/LoginPage/LoginPage.tsx

@@ -0,0 +1,60 @@
+import {Button, Container, Paper, Title,} from '@mantine/core';
+import classes from './LoginPage.module.scss';
+import {RootState, useAppDispatch} from "../../redux/store.ts";
+import {AuthService} from "../../client";
+import TelegramLoginButton, {TelegramUser} from "../../components/TelegramAuthButton/TelegramAuthButton.tsx";
+import {notifications} from "../../shared/lib/notifications.ts";
+import {login} from "../../features/authSlice.ts";
+import {useNavigate} from "@tanstack/react-router";
+import {useSelector} from "react-redux";
+
+const LoginPage = () => {
+    const dispatch = useAppDispatch();
+    const authState = useSelector((state: RootState) => state.auth);
+    const navigate = useNavigate();
+    if (authState.isAuthorized) {
+        navigate({to: "/"})
+        return (<></>)
+    }
+    return (
+
+        <Container size={420} my={40}>
+            <Title ta="center" className={classes.title}>
+                Добро пожаловать на DENCO CRM
+            </Title>
+            <Paper withBorder shadow="md" p={30} mt={30} radius="md">
+                <TelegramLoginButton
+                    botName={"DencoFulfillmentTestBot"}
+                    dataOnauth={() => {
+                    }}
+                    wrapperProps={{style: {display: "none"}}}
+                />
+                <Button fullWidth onClick={() => {
+                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                    // @ts-expect-error
+                    window.Telegram.Login.auth(
+                        {
+                            bot_id: import.meta.env.VITE_BOT_ID,
+                            request_access: true
+                        },
+                        (data: TelegramUser) => {
+                            AuthService.loginAuthLoginPost({requestBody: data})
+                                .then(({access_token}) => {
+                                    dispatch(login({accessToken: access_token}));
+                                    navigate({to: "/"}).then(() => {
+                                        notifications.success({message: "Вы успешно вошли!"})
+                                    })
+                                }).catch(() => {
+                                notifications.error({message: "Неудалось войти!"})
+                            })
+                        }
+                    )
+
+                }}>
+                    Войти через Telegram
+                </Button>
+            </Paper>
+        </Container>
+    )
+}
+export default LoginPage

src/pages/MainPage/MainPage.tsx

@@ -1,14 +1,11 @@
 import {FC} from "react";
 
-import {Flex, Text} from "@mantine/core";
-
 const MainPage: FC = () => {
 
-    return (
-        <Flex direction={"column"} style={{flex: 1, justifyItems: "center", alignContent: "center"}}>
-            <Text>авфыв</Text>
+    return (<>
+
+        </>
 
-        </Flex>
     )
 }
 

src/pages/PageWrapper/PageWrapper.tsx

@@ -0,0 +1,20 @@
+import {FC, ReactNode} from "react";
+import {Flex} from "@mantine/core";
+import {Navbar} from "../../components/Navbar/Navbar.tsx";
+import {useSelector} from "react-redux";
+import {RootState} from "../../redux/store.ts";
+
+export type Props = {
+    children: ReactNode;
+}
+const PageWrapper: FC<Props> = ({children}) => {
+    const authState = useSelector((state: RootState) => state.auth);
+    return (<Flex style={{flex: 1}}>
+            {authState.isAuthorized &&
+                <Navbar/>
+            }
+            {children}
+        </Flex>
+    )
+}
+export default PageWrapper;

src/pages/RootPage/RootPage.tsx

@@ -0,0 +1,35 @@
+import {Outlet} from "@tanstack/react-router";
+import {useEffect} from "react";
+import {useSelector} from "react-redux";
+import {RootState} from "../../redux/store.ts";
+import {OpenAPI} from "../../client";
+import PageWrapper from "../PageWrapper/PageWrapper.tsx";
+
+const RootPage = () => {
+    const authState = useSelector((state: RootState) => state.auth);
+    const rewriteLocalStorage = () => {
+        const jsonData = JSON.stringify(authState);
+        localStorage.setItem('authState', jsonData);
+    }
+    const setOpenApiToken = () => {
+        OpenAPI.TOKEN = authState.accessToken;
+    }
+    useEffect(() => {
+        rewriteLocalStorage();
+        setOpenApiToken();
+    }, [authState]);
+
+    return (
+        <>
+
+            <PageWrapper>
+                <Outlet/>
+            </PageWrapper>
+
+
+
+        </>
+    )
+}
+
+export default RootPage;