ticket 16

2024-06-23 21:05:43 +03:00 · 2024-06-23 21:05:43 +03:00 · 133ed782aa
commit 133ed782aa
parent 86854956eb
10 changed files with 175 additions and 101 deletions
--- a/src/assets/styles/adminPanel.module.scss
+++ b/src/assets/styles/adminPanel.module.scss
@ -33,6 +33,8 @@
        }
    }
    &__wrapper {
+        width: 100%;
+        height: 100%;
        &__header {
            width: 100%;
            height: 15%;
@ -53,9 +55,13 @@
                width: 100%;
                height: 20%;
                border-bottom: 1px solid rgb(200, 200, 200);
-                display: flex;
-                justify-content: space-between;
-                align-items: center;
+                &__wrapper {
+                    display: flex;
+                    justify-content: space-between;
+                    align-items: center;
+                    width: 95%;
+                    height: 100%;
+                }
                &__item {
                    font-size: 15px;
                    font-family: "Montserrat", sans-serif;
@ -67,19 +73,30 @@
            &__users {
                width: 100%;
                height: 80%;
-                margin-top: 10px;
+                overflow-y: auto;
+                &::-webkit-scrollbar {
+                    width: 7px;
+                }
+                &::-webkit-scrollbar-thumb {
+                    background-color: rgb(200, 200, 200);
+                }
                &__item {
                    width: 100%;
                    height: 20%;
-                    display: flex;
-                    justify-content: space-between;
-                    align-items: center;
                    border-bottom: 1px solid rgb(200, 200, 200);
+                    position: relative;
+                    &__wrapper {
+                        width: 95%;
+                        height: 100%;
+                        display: flex;
+                        justify-content: space-between;
+                        align-items: center;
+                    }
                    &__link {
                        font-size: 15px;
                        font-family: "Montserrat", sans-serif;
                        color: rgb(70, 70, 70);
-                        width: 33.3%;
+                        width: 20%;
                        text-align: center;
                        cursor: pointer;
                        &:hover {
@ -91,9 +108,19 @@
                        font-size: 15px;
                        font-family: "Montserrat", sans-serif;
                        color: rgb(100, 100, 100);
-                        width: 33.3%;
+                        width: 20%;
                        text-align: center;
                    }
+                    &__remove {
+                        position: absolute;
+                        right: 2%;
+                        cursor: pointer;
+                        i {
+                            &:hover {
+                                color: rgb(199, 73, 73);
+                            }
+                        }
+                    }
                }
            }
            &__item {
--- a/src/components/NavBar.jsx
+++ b/src/components/NavBar.jsx
@ -10,9 +10,14 @@ const NavBar = ({navigate, auth, setAuth}) => {
                <div className={classes.menu}>
                    <div className={classes.menu__authorized}>
                        <span onClick={() => navigate("/")}>Главная</span>
-                        {auth ? 
-                        auth.is_admin ? <span onClick={() => navigate("/forms")}>Мои формы</span> : <span></span> :
-                        <span></span>}
+                        {
+                            auth ? 
+                                auth.is_admin ? 
+                                <><span onClick={() => navigate("/forms")}>Мои формы</span> 
+                                <span onClick={() => navigate("/admin")}>Админ панель</span></> : 
+                                <span></span> :
+                            <span></span>
+                        }
                    </div>                   
                </div>
                <div className={classes.profile}>
--- a/src/hooks/api/adminApi.js
+++ b/src/hooks/api/adminApi.js
@ -1,42 +1,42 @@
-import axios from "axios";
+// import axios from "axios";

-async function listUsersApi(token) {
-    try {
-        const response = await axios.get(`https://api.minerva.krbl.ru/auth/manage/users`,
-        {
-            headers: {
-                "Authorization": `Token ${token}`
-            }
-        })
-        return response
-    }
-    catch (e) {
-        return e
-    }
-};
+// async function listUsersApi(token) {
+//     try {
+//         const response = await axios.get(`https://api.minerva.krbl.ru/auth/manage/users`,
+//         {
+//             headers: {
+//                 "Authorization": `Token ${token}`
+//             }
+//         })
+//         return response
+//     }
+//     catch (e) {
+//         return e
+//     }
+// };

-async function editUserApi(token, data) {
-    try {
-        const response = await axios.post(`https://api.minerva.krbl.ru/auth/manage/edit`,
-        {
-            "email": data.email,
-            "first_name": data.first_name,
-            "id": data.id,
-            "is_admin": data.is_admin,
-            "last_name": data.last_name,
-            "login": data.login,
-            "phone": data.phone
-        },
-        {
-            headers: {
-                "Authorization": `Token ${token}`
-            }
-        })
-        return response
-    }
-    catch (e) {
-        return e
-    }
-};
+// async function editUserApi(token, data) {
+//     try {
+//         const response = await axios.post(`https://api.minerva.krbl.ru/auth/manage/edit`,
+//         {
+//             "email": data.email,
+//             "first_name": data.first_name,
+//             "id": data.id,
+//             "is_admin": data.is_admin,
+//             "last_name": data.last_name,
+//             "login": data.login,
+//             "phone": data.phone
+//         },
+//         {
+//             headers: {
+//                 "Authorization": `Token ${token}`
+//             }
+//         })
+//         return response
+//     }
+//     catch (e) {
+//         return e
+//     }
+// };

-export {listUsersApi, editUserApi}
+// export {listUsersApi, editUserApi}
--- a/src/hooks/api/formApi.js
+++ b/src/hooks/api/formApi.js
@ -131,6 +131,7 @@ async function saveAnswersApi(token, formToken, data) {
                "Authorization": `Token ${token}`
            }
        })
+        console.log("saveAnswersApi", response)
        return response
    }
    catch (e) {
--- a/src/hooks/api/listFormsApi.js
+++ b/src/hooks/api/listFormsApi.js
@ -26,6 +26,7 @@ async function createFormApi(token) {
                "Authorization": `Token ${token}`,
            }
        })
+        console.log("createFormApi", response)
        return response
    }
    catch (e) {
@ -67,7 +68,10 @@ async function updateTitleFormApi(token, formId, title) {

 async function newFormTokenApi(token, formId) {
    try {
-        const response = await axios.post(`https://api.minerva.krbl.ru/formBuilder/edit/${formId}/access/new`, {},
+        const response = await axios.post(`https://api.minerva.krbl.ru/formBuilder/edit/${formId}/access/new`, 
+        {
+            "name": "test"
+        },
        {
            headers: {
                "Authorization": `Token ${token}`
--- a/src/hooks/api/profileApi.js
+++ b/src/hooks/api/profileApi.js
@ -18,8 +18,6 @@ async function editUserApi(token, data) {
                "Authorization": `Token ${token}`,
            },
        })
-
-        console.log(response)
        return response
    }
    catch(e) {
@ -29,22 +27,6 @@ async function editUserApi(token, data) {
 };


-// async function getListUserApi(token) {
-//     try {
-//         const response = await axios.get(`https://api.minerva.krbl.ru/auth/manage/users`,
-//         {
-//             headers: {
-//                 "Authorization": `Token ${token}`
-//             }
-//         })
-//         return response
-//     }
-//     catch (e) {
-//         return e
-//     }
-// };
-
-
 async function getListUserApi(token) {
    try {
        const response = await axios.get(`https://api.minerva.krbl.ru/auth/manage/users`,
@ -83,10 +65,31 @@ async function addUserApi(token, data) {
    catch (e) {
        return e
    }
+};
+
+
+async function removeUserApi(token, login) {
+    try {
+        const response = await axios.post("https://api.minerva.krbl.ru/auth/manage/delete", 
+        {
+            "login": login
+        },
+        { 
+            headers: {
+                "Authorization": `Token ${token}`,
+            },
+        })
+        return response
+    }
+    catch(e) {
+        console.log(e)
+        return e
+    }
 }

 export {
    editUserApi,
    getListUserApi,
-    addUserApi
+    addUserApi,
+    removeUserApi
 }
--- a/src/pages/AdminPanel.jsx
+++ b/src/pages/AdminPanel.jsx
@ -3,11 +3,12 @@ import { useCookies } from "react-cookie";
 import { useNavigate } from "react-router-dom";
 import classes from "../assets/styles/adminPanel.module.scss";
 import { UserData } from "../context";
-import { getListUserApi, editUserApi, addUserApi } from "../hooks/api/profileApi.js";
+import { getListUserApi, editUserApi, addUserApi, removeUserApi } from "../hooks/api/profileApi.js";
 import { verifyUser } from "../hooks/services/profile.js";
 import DefaultModal from "../components/DefaultModal.jsx";
 import EditUserAdminPanel from "../components/bodyModal/EditUserAdminPanel.jsx";
 import MyButton from "../components/MyButton.jsx";
+import CheckModal from "../components/CheckModal.jsx";


 const AdminPanel = () => {
@ -106,13 +107,21 @@ const AdminPanel = () => {
        setPhone(user.phone)
    }

+    async function removeUser(login) {
+        const response = await removeUserApi(cookies.token, login)
+
+        if (response.status === 200) {
+            setListUser(listUser.filter(item => item.login !== login))
+        }
+    }
+
    return (
        <div className={classes.main}>
            <div className={classes.wrapper}>
                <div className={classes.admin}>
-                    <div className={classes.admin__linkProfile}>
+                    {/* <div className={classes.admin__linkProfile}>
                        <span onClick={() => navigate("/profile")}>Профиль</span>
-                    </div>
+                    </div> */}
                    <div className={classes.admin__wrapper}>
                        <div className={classes.admin__wrapper__header}>
                            <h3>Пользователи</h3>
@ -125,34 +134,56 @@ const AdminPanel = () => {
                        </div>
                        <div className={classes.admin__wrapper__body}>
                            <div className={classes.admin__wrapper__body__columns}>
-                                <div className={classes.admin__wrapper__body__columns__item}>Логин</div>
-                                <div className={classes.admin__wrapper__body__columns__item}>Фамилия</div>
-                                <div className={classes.admin__wrapper__body__columns__item}>Email</div>
-                                <div className={classes.admin__wrapper__body__columns__item}>Учитель</div>
-                                <div className={classes.admin__wrapper__body__columns__item}>Администратор</div>
+                                <div className={classes.admin__wrapper__body__columns__wrapper}>
+                                    <div className={classes.admin__wrapper__body__columns__item}>Логин</div>
+                                    <div className={classes.admin__wrapper__body__columns__item}>Фамилия</div>
+                                    <div className={classes.admin__wrapper__body__columns__item}>Email</div>
+                                    <div className={classes.admin__wrapper__body__columns__item}>Учитель</div>
+                                    <div className={classes.admin__wrapper__body__columns__item}>Администратор</div>
+                                </div>
                            </div>
                            <div className={classes.admin__wrapper__body__users}>
                                {listUser.map(item => 
                                    <div className={classes.admin__wrapper__body__users__item} key={item.id}>
-                                        <div 
-                                            className={classes.admin__wrapper__body__users__item__link} 
-                                            data-bs-toggle="modal" data-bs-target={`#adminModal`}
-                                            onClick={() => openUser(item)}
-                                        >
-                                            {item.login}
-                                        </div>
-                                        <div className={classes.admin__wrapper__body__users__item__info}>
-                                            {item.last_name ? item.last_name : '-'}
-                                        </div>
-                                        <div className={classes.admin__wrapper__body__users__item__info}>
-                                            {item.email ? item.email : '-'}
-                                        </div>
-                                        <div className={classes.admin__wrapper__body__users__item__info}>
-                                            {item.is_teacher ? 'Да' : 'Нет'}
-                                        </div>
-                                        <div className={classes.admin__wrapper__body__users__item__info}>
-                                            {item.admin ? 'Да' : 'Нет'}
-                                        </div>
+                                        <div className={classes.admin__wrapper__body__users__item__wrapper}>
+                                            <div 
+                                                className={classes.admin__wrapper__body__users__item__link} 
+                                                data-bs-toggle="modal" data-bs-target={`#adminModal`}
+                                                onClick={() => openUser(item)}
+                                            >
+                                                {item.login}
+                                            </div>
+                                            <div className={classes.admin__wrapper__body__users__item__info}>
+                                                {item.last_name ? item.last_name : '-'}
+                                            </div>
+                                            <div className={classes.admin__wrapper__body__users__item__info}>
+                                                {item.email ? item.email : '-'}
+                                            </div>
+                                            <div className={classes.admin__wrapper__body__users__item__info}>
+                                                {
+                                                    item.is_teacher ? 
+                                                    <i class="fa-solid fa-circle-check" style={{color: "rgb(150, 209, 158)"}}></i> : 
+                                                    <i class="fa-solid fa-circle-xmark" style={{color: "rgb(235, 130, 130)"}}></i>
+                                                }
+                                            </div>
+                                            <div className={classes.admin__wrapper__body__users__item__info}>
+                                                {
+                                                    item.admin ? 
+                                                    <i class="fa-solid fa-circle-check" style={{color: "rgb(150, 209, 158)"}}></i> : 
+                                                    <i class="fa-solid fa-circle-xmark" style={{color: "rgb(235, 130, 130)"}}></i>}
+                                            </div>
+                                            <div className={classes.admin__wrapper__body__users__item__remove}>
+                                                <i class="fa-solid fa-trash" data-bs-toggle="modal" data-bs-target={`#checkModal${item.id}`}></i>
+                                            </div>
+                                            <CheckModal 
+                                                postfix={item.id}
+                                                message={`Вы хотетите удалить пользователя <${item.login}>?`} 
+                                                action={{
+                                                    execute: () => removeUser(item.login), 
+                                                    cancel: () => {}
+                                                }}
+                                            />
+                                        </div>   
                                    </div>
                                )}
                                <DefaultModal 
--- a/src/pages/Profile.jsx
+++ b/src/pages/Profile.jsx
@ -97,9 +97,9 @@ const Profile = () => {
        <div className={classes.main}>
            <div className={classes.wrapper}>
                <div className={classes.profile}>
-                    {user.is_admin ? <div className={classes.profile__linkAdmin}>
+                    {/* {user.is_admin ? <div className={classes.profile__linkAdmin}>
                        <span onClick={() => navigate("/admin")}>Админ панель</span>
-                    </div> : <div></div>}
+                    </div> : <div></div>} */}
                    <div className={classes.profile__wrapper}>
                        <div className={classes.profile__wrapper__header}>
                            <h3>Ваши данные</h3>
--- a/src/pages/TokensForm.jsx
+++ b/src/pages/TokensForm.jsx
@ -18,6 +18,7 @@ const TokensForm = () => {
    useEffect(() => {
        async function listFormsByToken() {
            const response = await listFormsByTokenApi(cookies.token, formId)
+            console.log(response)
            
            if (response.data.tokens) {
                setTokens(response.data.tokens.filter(item => item.is_active === true))
@ -78,7 +79,7 @@ const TokensForm = () => {
                                                По умолчанию
                                            </div>
                                            <div className={classes.answers__wrapper__body__item__wrapper__token}>
-                                                {item.form_id}
+                                                {item.id}
                                            </div>
                                        </div>
                                        <div className={classes.answers__wrapper__body__item__btn}>
--- a/src/router/protectedRouting.js
+++ b/src/router/protectedRouting.js
@ -5,6 +5,7 @@ const protectedUrl = {
        new RegExp("/profile"),
        new RegExp("/forms/\\w+/answers"),
        new RegExp("/tokens/\\w+"),
+        new RegExp("/admin"),
    ],
    Authorized: [
        "/enter"
@ -14,6 +15,7 @@ const protectedUrl = {
        new RegExp("/forms/\\w+/edit"),
        new RegExp("/forms/\\w+/answers"),
        new RegExp("/tokens/\\w+"),
+        new RegExp("/admin"),
    ]
 }