feat(frontend): settings page added
This commit is contained in:
47
frontend/src/components/admin/settings/SettingsPage.tsx
Normal file
47
frontend/src/components/admin/settings/SettingsPage.tsx
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
import {LstCard} from "@/components/extendedUI/LstCard";
|
||||||
|
import {useSessionStore} from "@/lib/store/sessionStore";
|
||||||
|
import {useModuleStore} from "@/lib/store/useModuleStore";
|
||||||
|
import {useQuery} from "@tanstack/react-query";
|
||||||
|
import {useRouter} from "@tanstack/react-router";
|
||||||
|
import axios from "axios";
|
||||||
|
|
||||||
|
export default function SettingsPage() {
|
||||||
|
const token = localStorage.getItem("auth_token");
|
||||||
|
const {user} = useSessionStore();
|
||||||
|
const {modules} = useModuleStore();
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
const fetchSettings = async () => {
|
||||||
|
const {data} = await axios.get("/api/server/settings", {headers: {Authorization: `Bearer ${token}`}});
|
||||||
|
return data.data;
|
||||||
|
};
|
||||||
|
|
||||||
|
const adminModule = modules.filter((n) => n.name === "admin");
|
||||||
|
const userLevel = user?.roles.filter((r) => r.module_id === adminModule[0].module_id) || [];
|
||||||
|
|
||||||
|
if (!adminModule[0].roles.includes(userLevel[0]?.role)) {
|
||||||
|
router.navigate({to: "/"});
|
||||||
|
}
|
||||||
|
|
||||||
|
const {data, isError, error, isLoading} = useQuery({
|
||||||
|
queryKey: ["settings"],
|
||||||
|
queryFn: fetchSettings,
|
||||||
|
enabled: !!token,
|
||||||
|
refetchOnWindowFocus: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (isLoading) {
|
||||||
|
return <div>Loading.....</div>;
|
||||||
|
}
|
||||||
|
if (isError) {
|
||||||
|
return <div>{JSON.stringify(error)}</div>;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
{data.map((i) => {
|
||||||
|
return <LstCard key={i.settings_id}>{i.name}</LstCard>;
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -22,7 +22,7 @@ export function AppSidebar() {
|
|||||||
{moduleActive("production") && <ProductionSideBar />}
|
{moduleActive("production") && <ProductionSideBar />}
|
||||||
{moduleActive("logistics") && hasAccess(user, "logistics", modules) && <LogisticsSideBar />}
|
{moduleActive("logistics") && hasAccess(user, "logistics", modules) && <LogisticsSideBar />}
|
||||||
{moduleActive("forklift") && hasAccess(user, "forklift", modules) && <ForkliftSideBar />}
|
{moduleActive("forklift") && hasAccess(user, "forklift", modules) && <ForkliftSideBar />}
|
||||||
{moduleActive("admin") && hasAccess(user, "eom", modules) && <EomSideBar />}
|
{moduleActive("eom") && hasAccess(user, "eom", modules) && <EomSideBar />}
|
||||||
{moduleActive("quality") && hasAccess(user, "quality", modules) && <QualitySideBar />}
|
{moduleActive("quality") && hasAccess(user, "quality", modules) && <QualitySideBar />}
|
||||||
{moduleActive("admin") && hasAccess(user, "admin", modules) && <AdminSideBar />}
|
{moduleActive("admin") && hasAccess(user, "admin", modules) && <AdminSideBar />}
|
||||||
</SidebarContent>
|
</SidebarContent>
|
||||||
|
|||||||
@@ -29,7 +29,7 @@ const data = {
|
|||||||
items: [
|
items: [
|
||||||
{
|
{
|
||||||
title: "Settings",
|
title: "Settings",
|
||||||
url: "#",
|
url: "/settings",
|
||||||
icon: Settings,
|
icon: Settings,
|
||||||
isActive: false,
|
isActive: false,
|
||||||
},
|
},
|
||||||
@@ -53,9 +53,16 @@ const data = {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "UCD",
|
title: "UCD",
|
||||||
url: "#",
|
url: "https://ucd.alpla.net:8443/",
|
||||||
icon: Atom,
|
icon: Atom,
|
||||||
isActive: false,
|
isActive: false,
|
||||||
|
newWindow: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Lst Api",
|
||||||
|
url: "/api/docs",
|
||||||
|
icon: Webhook,
|
||||||
|
isActive: false,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
@@ -85,7 +92,7 @@ export function AdminSideBar() {
|
|||||||
{item.items.map((item) => (
|
{item.items.map((item) => (
|
||||||
<SidebarMenuSubItem key={item.title}>
|
<SidebarMenuSubItem key={item.title}>
|
||||||
<SidebarMenuSubButton asChild isActive={item.isActive}>
|
<SidebarMenuSubButton asChild isActive={item.isActive}>
|
||||||
<a href={item.url}>
|
<a href={item.url} target={item.newWindow ? "_blank" : "_self"}>
|
||||||
<item.icon />
|
<item.icon />
|
||||||
<span>{item.title}</span>
|
<span>{item.title}</span>
|
||||||
</a>
|
</a>
|
||||||
|
|||||||
@@ -19,6 +19,7 @@ import { Route as IndexImport } from './routes/index'
|
|||||||
import { Route as OcpIndexImport } from './routes/ocp/index'
|
import { Route as OcpIndexImport } from './routes/ocp/index'
|
||||||
import { Route as OcpLotsImport } from './routes/ocp/lots'
|
import { Route as OcpLotsImport } from './routes/ocp/lots'
|
||||||
import { Route as AuthProfileImport } from './routes/_auth/profile'
|
import { Route as AuthProfileImport } from './routes/_auth/profile'
|
||||||
|
import { Route as AdminSettingsImport } from './routes/_admin/settings'
|
||||||
import { Route as AdminModulesImport } from './routes/_admin/modules'
|
import { Route as AdminModulesImport } from './routes/_admin/modules'
|
||||||
|
|
||||||
// Create/Update Routes
|
// Create/Update Routes
|
||||||
@@ -69,6 +70,12 @@ const AuthProfileRoute = AuthProfileImport.update({
|
|||||||
getParentRoute: () => AuthRoute,
|
getParentRoute: () => AuthRoute,
|
||||||
} as any)
|
} as any)
|
||||||
|
|
||||||
|
const AdminSettingsRoute = AdminSettingsImport.update({
|
||||||
|
id: '/settings',
|
||||||
|
path: '/settings',
|
||||||
|
getParentRoute: () => AdminRoute,
|
||||||
|
} as any)
|
||||||
|
|
||||||
const AdminModulesRoute = AdminModulesImport.update({
|
const AdminModulesRoute = AdminModulesImport.update({
|
||||||
id: '/modules',
|
id: '/modules',
|
||||||
path: '/modules',
|
path: '/modules',
|
||||||
@@ -121,6 +128,13 @@ declare module '@tanstack/react-router' {
|
|||||||
preLoaderRoute: typeof AdminModulesImport
|
preLoaderRoute: typeof AdminModulesImport
|
||||||
parentRoute: typeof AdminImport
|
parentRoute: typeof AdminImport
|
||||||
}
|
}
|
||||||
|
'/_admin/settings': {
|
||||||
|
id: '/_admin/settings'
|
||||||
|
path: '/settings'
|
||||||
|
fullPath: '/settings'
|
||||||
|
preLoaderRoute: typeof AdminSettingsImport
|
||||||
|
parentRoute: typeof AdminImport
|
||||||
|
}
|
||||||
'/_auth/profile': {
|
'/_auth/profile': {
|
||||||
id: '/_auth/profile'
|
id: '/_auth/profile'
|
||||||
path: '/profile'
|
path: '/profile'
|
||||||
@@ -149,10 +163,12 @@ declare module '@tanstack/react-router' {
|
|||||||
|
|
||||||
interface AdminRouteChildren {
|
interface AdminRouteChildren {
|
||||||
AdminModulesRoute: typeof AdminModulesRoute
|
AdminModulesRoute: typeof AdminModulesRoute
|
||||||
|
AdminSettingsRoute: typeof AdminSettingsRoute
|
||||||
}
|
}
|
||||||
|
|
||||||
const AdminRouteChildren: AdminRouteChildren = {
|
const AdminRouteChildren: AdminRouteChildren = {
|
||||||
AdminModulesRoute: AdminModulesRoute,
|
AdminModulesRoute: AdminModulesRoute,
|
||||||
|
AdminSettingsRoute: AdminSettingsRoute,
|
||||||
}
|
}
|
||||||
|
|
||||||
const AdminRouteWithChildren = AdminRoute._addFileChildren(AdminRouteChildren)
|
const AdminRouteWithChildren = AdminRoute._addFileChildren(AdminRouteChildren)
|
||||||
@@ -173,6 +189,7 @@ export interface FileRoutesByFullPath {
|
|||||||
'/about': typeof AboutRoute
|
'/about': typeof AboutRoute
|
||||||
'/login': typeof LoginRoute
|
'/login': typeof LoginRoute
|
||||||
'/modules': typeof AdminModulesRoute
|
'/modules': typeof AdminModulesRoute
|
||||||
|
'/settings': typeof AdminSettingsRoute
|
||||||
'/profile': typeof AuthProfileRoute
|
'/profile': typeof AuthProfileRoute
|
||||||
'/ocp/lots': typeof OcpLotsRoute
|
'/ocp/lots': typeof OcpLotsRoute
|
||||||
'/ocp': typeof OcpIndexRoute
|
'/ocp': typeof OcpIndexRoute
|
||||||
@@ -184,6 +201,7 @@ export interface FileRoutesByTo {
|
|||||||
'/about': typeof AboutRoute
|
'/about': typeof AboutRoute
|
||||||
'/login': typeof LoginRoute
|
'/login': typeof LoginRoute
|
||||||
'/modules': typeof AdminModulesRoute
|
'/modules': typeof AdminModulesRoute
|
||||||
|
'/settings': typeof AdminSettingsRoute
|
||||||
'/profile': typeof AuthProfileRoute
|
'/profile': typeof AuthProfileRoute
|
||||||
'/ocp/lots': typeof OcpLotsRoute
|
'/ocp/lots': typeof OcpLotsRoute
|
||||||
'/ocp': typeof OcpIndexRoute
|
'/ocp': typeof OcpIndexRoute
|
||||||
@@ -197,6 +215,7 @@ export interface FileRoutesById {
|
|||||||
'/about': typeof AboutRoute
|
'/about': typeof AboutRoute
|
||||||
'/login': typeof LoginRoute
|
'/login': typeof LoginRoute
|
||||||
'/_admin/modules': typeof AdminModulesRoute
|
'/_admin/modules': typeof AdminModulesRoute
|
||||||
|
'/_admin/settings': typeof AdminSettingsRoute
|
||||||
'/_auth/profile': typeof AuthProfileRoute
|
'/_auth/profile': typeof AuthProfileRoute
|
||||||
'/ocp/lots': typeof OcpLotsRoute
|
'/ocp/lots': typeof OcpLotsRoute
|
||||||
'/ocp/': typeof OcpIndexRoute
|
'/ocp/': typeof OcpIndexRoute
|
||||||
@@ -210,6 +229,7 @@ export interface FileRouteTypes {
|
|||||||
| '/about'
|
| '/about'
|
||||||
| '/login'
|
| '/login'
|
||||||
| '/modules'
|
| '/modules'
|
||||||
|
| '/settings'
|
||||||
| '/profile'
|
| '/profile'
|
||||||
| '/ocp/lots'
|
| '/ocp/lots'
|
||||||
| '/ocp'
|
| '/ocp'
|
||||||
@@ -220,6 +240,7 @@ export interface FileRouteTypes {
|
|||||||
| '/about'
|
| '/about'
|
||||||
| '/login'
|
| '/login'
|
||||||
| '/modules'
|
| '/modules'
|
||||||
|
| '/settings'
|
||||||
| '/profile'
|
| '/profile'
|
||||||
| '/ocp/lots'
|
| '/ocp/lots'
|
||||||
| '/ocp'
|
| '/ocp'
|
||||||
@@ -231,6 +252,7 @@ export interface FileRouteTypes {
|
|||||||
| '/about'
|
| '/about'
|
||||||
| '/login'
|
| '/login'
|
||||||
| '/_admin/modules'
|
| '/_admin/modules'
|
||||||
|
| '/_admin/settings'
|
||||||
| '/_auth/profile'
|
| '/_auth/profile'
|
||||||
| '/ocp/lots'
|
| '/ocp/lots'
|
||||||
| '/ocp/'
|
| '/ocp/'
|
||||||
@@ -282,7 +304,8 @@ export const routeTree = rootRoute
|
|||||||
"/_admin": {
|
"/_admin": {
|
||||||
"filePath": "_admin.tsx",
|
"filePath": "_admin.tsx",
|
||||||
"children": [
|
"children": [
|
||||||
"/_admin/modules"
|
"/_admin/modules",
|
||||||
|
"/_admin/settings"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"/_auth": {
|
"/_auth": {
|
||||||
@@ -301,6 +324,10 @@ export const routeTree = rootRoute
|
|||||||
"filePath": "_admin/modules.tsx",
|
"filePath": "_admin/modules.tsx",
|
||||||
"parent": "/_admin"
|
"parent": "/_admin"
|
||||||
},
|
},
|
||||||
|
"/_admin/settings": {
|
||||||
|
"filePath": "_admin/settings.tsx",
|
||||||
|
"parent": "/_admin"
|
||||||
|
},
|
||||||
"/_auth/profile": {
|
"/_auth/profile": {
|
||||||
"filePath": "_auth/profile.tsx",
|
"filePath": "_auth/profile.tsx",
|
||||||
"parent": "/_auth"
|
"parent": "/_auth"
|
||||||
|
|||||||
14
frontend/src/routes/_admin/settings.tsx
Normal file
14
frontend/src/routes/_admin/settings.tsx
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
import SettingsPage from "@/components/admin/settings/SettingsPage";
|
||||||
|
import {createFileRoute} from "@tanstack/react-router";
|
||||||
|
|
||||||
|
export const Route = createFileRoute("/_admin/settings")({
|
||||||
|
component: RouteComponent,
|
||||||
|
});
|
||||||
|
|
||||||
|
function RouteComponent() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<SettingsPage />
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user