k

src/pages/AdminPage/AdminPage.tsx

@@ -1,7 +1,7 @@
 import styles from './AdminPage.module.css';
 import {Tabs} from "@mantine/core";
 import PageBlock from "../../components/PageBlock/PageBlock.tsx";
-import {IconBriefcase, IconUser, IconUsersGroup} from "@tabler/icons-react";
+import {IconBriefcase, IconUser} from "@tabler/icons-react";
 import RolesAndPositionsTab from "./tabs/RolesAndPositions/RolesAndPositionsTab.tsx";
 import UsersTab from "./tabs/Users/UsersTab.tsx";
 import {motion} from "framer-motion";
@@ -17,27 +17,28 @@ const AdminPage = () => {
                             Пользователи
                         </Tabs.Tab>
                         <Tabs.Tab value={"rolesAndPositions"} leftSection={<IconBriefcase/>}>
-                            Роли и должности
-                        </Tabs.Tab>
-                        <Tabs.Tab value={"employees"} leftSection={<IconUsersGroup/>}>
-                            Сотрудники
+                            Должности
                         </Tabs.Tab>
+                        {/*<Tabs.Tab value={"employees"} leftSection={<IconUsersGroup/>}>*/}
+                        {/*    Сотрудники*/}
+                        {/*</Tabs.Tab>*/}
                     </Tabs.List>
                     <Tabs.Panel value={"users"}>
                         <motion.div
+                            initial={{opacity: 0}}
+                            animate={{opacity: 1}}
+                            transition={{duration: 0.2}}
 
-                            initial={{scaleY: 0}}
-                            animate={{scaleY: 1}}
-                            transition={{duration: 0.1}}>
+                        >
                             <UsersTab/>
 
                         </motion.div>
                     </Tabs.Panel>
                     <Tabs.Panel value={"rolesAndPositions"}>
                         <motion.div
-                            initial={{scaleY: 0}}
-                            animate={{scaleY: 1}}
-                            transition={{duration: 0.1}}
+                            initial={{opacity: 0}}
+                            animate={{opacity: 1}}
+                            transition={{duration: 0.2}}
                         >
                             <RolesAndPositionsTab/>
                         </motion.div>

src/pages/AdminPage/components/PositionsTable/PositionsTable.tsx

@@ -3,36 +3,76 @@ import {PositionSchema} from "../../../../client";
 import {BaseTable} from "../../../../components/BaseTable/BaseTable.tsx";
 import {usePositionsTableColumns} from "./columns.tsx";
 import {FC} from "react";
-import {Button, Flex, rem} from "@mantine/core";
+import {ActionIcon, Button, Flex, rem, Text, Tooltip} from "@mantine/core";
+import {modals} from "@mantine/modals";
+import {IconTrash} from "@tabler/icons-react";
+import {MRT_TableOptions} from "mantine-react-table";
 
 type Props = CRUDTableProps<PositionSchema>;
 
-const PositionsTable: FC<Props> = ({items}) => {
+const PositionsTable: FC<Props> = ({items, onCreate, onDelete}) => {
     const columns = usePositionsTableColumns();
+
+    const onCreateClick = () => {
+        if (!onCreate) return;
+        modals.openContextModal({
+            modal: "positionForm",
+            withCloseButton: false,
+            innerProps: {
+                onCreate: onCreate
+            }
+        })
+    }
+
+    const onDeleteClick = (position: PositionSchema) => {
+        if (!onDelete) return;
+        modals.openConfirmModal({
+            title: 'Удаление должности',
+            children: (
+                <Text size="sm">
+                    Вы уверены что хотите удалить должность {position.name}
+                </Text>
+            ),
+            labels: {confirm: 'Да', cancel: "Нет"},
+            confirmProps: {color: 'red'},
+            onConfirm: () => onDelete(position)
+        });
+    }
+
     return (
 
         <BaseTable
+            data={items}
+            columns={columns}
             restProps={{
                 enableTopToolbar: true,
                 enableSorting: false,
                 enableColumnActions: false,
-                renderTopToolbar: () => (
+                enableRowActions: true,
+                renderTopToolbar: (
                     <Flex p={rem(10)}>
 
                         <Button
                             variant={"default"}
-                            onClick={() => {
-
-                            }}
+                            onClick={() => onCreateClick()}
                         >
                             Создать должность
                         </Button>
                     </Flex>
 
+                ),
+                renderRowActions: ({row}) => (
+                    <Flex gap="md">
+
+                        <Tooltip label="Удалить">
+                            <ActionIcon onClick={() => onDeleteClick(row.original)} variant={"default"}>
+                                <IconTrash/>
+                            </ActionIcon>
+                        </Tooltip>
+                    </Flex>
                 )
-            }}
-            data={items}
-            columns={columns}
+            } as MRT_TableOptions<PositionSchema>}
+
         />
 
     )

src/pages/AdminPage/components/PositionsTable/columns.tsx

@@ -4,13 +4,14 @@ import {PositionSchema} from "../../../../client";
 
 export const usePositionsTableColumns = () => {
     return useMemo<MRT_ColumnDef<PositionSchema>[]>(() => [
+        {
+            accessorKey: "name",
+            header: "Название должности"
+        },
         {
             accessorKey: "key",
             header: "Ключ"
         },
-        {
-            accessorKey: "name",
-            header: "Название должности"
-        }
+
     ], []);
 }

src/pages/AdminPage/components/UsersTable/UsersTable.tsx

@@ -29,7 +29,7 @@ const UsersTable: FC<Props> = ({items, onChange, onDelete}) => {
         if (!onDelete) return;
         modals.openConfirmModal({
             title: 'Удаление пользователя',
-            centered: true,
+            // centered: true,
             children: (
                 <Text size="sm">
                     Вы уверены что хотите удалить пользователя {user.firstName} {user.secondName}

src/pages/AdminPage/components/UsersTable/columns.tsx

@@ -6,8 +6,12 @@ import {IconCheck, IconX} from "@tabler/icons-react";
 export const useUsersTableColumns = () => {
     return useMemo<MRT_ColumnDef<UserSchema>[]>(() => [
         {
-            accessorKey: "id",
-            header: "ID"
+            accessorKey: "firstName",
+            header: "Имя"
+        },
+        {
+            accessorKey: "secondName",
+            header: "Фамилия"
         },
         {
             accessorKey: "telegramId",

src/pages/AdminPage/modals/UserFormModal/UserFormModal.tsx

@@ -27,7 +27,6 @@ const UserFormModal = ({context, id, innerProps}: ContextModalProps<Props>) => {
             }).isValid && 'Неверно указан номер телефона',
         }
     });
-    console.log(form.getInputProps('isAdmin'))
     return (<BaseFormModal
             form={form}
             closeOnSubmit

src/pages/AdminPage/tabs/RolesAndPositions/RolesAndPositionsTab.tsx

@@ -1,39 +1,39 @@
-import {Tabs} from "@mantine/core";
 import PositionsTable from "../../components/PositionsTable/PositionsTable.tsx";
 import usePositionsList from "../../hooks/usePositionsList.tsx";
-import {motion} from "framer-motion";
+import {PositionSchema, PositionService} from "../../../../client";
+import {notifications} from "../../../../shared/lib/notifications.ts";
 
 const RolesAndPositionsTab = () => {
-    const {objects: positions} = usePositionsList();
+    const {objects: positions, refetch} = usePositionsList();
+    const onCreate = (position: PositionSchema) => {
+        PositionService.createPosition({
+            requestBody: {
+                data: position
+            }
+        }).then(async ({ok, message}) => {
+            notifications.guess(ok, {message});
+            if (!ok) return;
+            await refetch();
+        })
+    }
+    const onDelete = (position: PositionSchema) => {
+        PositionService.deletePosition({
+            requestBody: {
+                positionKey: position.key
+            }
+        }).then(async ({ok, message}) => {
+            notifications.guess(ok, {message});
+            if (!ok) return;
+            await refetch();
+        })
+    }
+
     return (
-        <Tabs w={"100%"}
-              variant={"default"}
-              keepMounted={false}
-              defaultValue={"roles"}
-        >
-            <Tabs.List grow>
-                <Tabs.Tab value={"roles"}>Роли</Tabs.Tab>
-                <Tabs.Tab value={"positions"}>Должности</Tabs.Tab>
-            </Tabs.List>
-            <Tabs.Panel value={"roles"}>
-                <motion.div
-                    initial={{scaleY: 0}}
-                    animate={{scaleY: 1}}
-                    transition={{duration: 0.1}}
-                >
-                    <PositionsTable items={positions}/>
-                </motion.div>
-            </Tabs.Panel>
-            <Tabs.Panel value={"positions"}>
-                <motion.div
-                    initial={{scaleY: 0}}
-                    animate={{scaleY: 1}}
-                    transition={{duration: 0.1}}
-                >
-                    <PositionsTable items={positions}/>
-                </motion.div>
-            </Tabs.Panel>
-        </Tabs>
+        <PositionsTable
+            items={positions}
+            onCreate={onCreate}
+            onDelete={onDelete}
+        />
     )
 }
 export default RolesAndPositionsTab;

src/pages/AdminPage/tabs/Users/UsersTab.tsx

@@ -12,6 +12,7 @@ const UsersTab = () => {
                 data: {
                     ...user,
                     positionKey: user.position?.key,
+                    roleKey: user.role.key
                 }
             }
         }).then(async ({ok, message}) => {