k

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

@@ -0,0 +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";
+
+const RolesAndPositionsTab = () => {
+    const {objects: positions} = usePositionsList();
+    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>
+    )
+}
+export default RolesAndPositionsTab;