更新依赖项；调整新的目录结构

.npmrc

@@ -1,2 +1 @@
-legacy-peer-deps=true
+legacy-peer-deps=true
-strict-peer-dependencies=false

package.json

@@ -19,9 +19,9 @@
     "@mui/lab": "^6.0.0-beta.14",
     "@mui/material": "^6.1.7",
     "@mui/x-data-grid": "^7.22.2",
-    "@refinedev/cli": "^2.16.48",
+    "@refinedev/cli": "^2.16.49",
-    "@refinedev/core": "^5.0.0",
+    "@refinedev/core": "^5.0.2",
-    "@refinedev/devtools": "^2.0.1",
+    "@refinedev/devtools": "^2.0.2",
     "@refinedev/kbar": "^2.0.0",
     "@refinedev/mui": "^7.0.0",
     "@refinedev/nextjs-router": "^7.0.0",
@@ -55,4 +55,4 @@
   "refine": {
     "projectId": "4LwOCL-BBaV29-qUYMAJ"
   }
-}
+}

package_back.json

@@ -0,0 +1,58 @@
+{
+  "name": "tjwater-app",
+  "version": "0.1.0",
+  "private": true,
+  "engines": {
+    "node": ">=20"
+  },
+  "scripts": {
+    "dev": "cross-env NODE_OPTIONS=--max_old_space_size=4096 refine dev",
+    "build": "refine build",
+    "start": "refine start",
+    "lint": "next lint",
+    "refine": "refine"
+  },
+  "dependencies": {
+    "@emotion/react": "^11.8.2",
+    "@emotion/styled": "^11.8.1",
+    "@mui/icons-material": "^6.1.6",
+    "@mui/lab": "^6.0.0-beta.14",
+    "@mui/material": "^6.1.7",
+    "@mui/x-data-grid": "^7.22.2",
+    "@refinedev/cli": "^2.16.48",
+    "@refinedev/core": "^5.0.0",
+    "@refinedev/devtools": "^2.0.1",
+    "@refinedev/kbar": "^2.0.0",
+    "@refinedev/mui": "^7.0.0",
+    "@refinedev/nextjs-router": "^7.0.0",
+    "@refinedev/react-hook-form": "^5.0.0",
+    "@refinedev/simple-rest": "^6.0.0",
+    "@tailwindcss/postcss": "^4.1.13",
+    "@turf/turf": "^7.2.0",
+    "clsx": "^2.1.1",
+    "deck.gl": "^9.1.14",
+    "js-cookie": "^3.0.5",
+    "next": "^15.2.4",
+    "next-auth": "^4.24.5",
+    "ol": "^10.6.1",
+    "postcss": "^8.5.6",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "react-icons": "^5.5.0",
+    "tailwindcss": "^4.1.13"
+  },
+  "devDependencies": {
+    "@svgr/webpack": "^8.1.0",
+    "@types/js-cookie": "^3.0.6",
+    "@types/node": "^20",
+    "@types/react": "^19.1.0",
+    "@types/react-dom": "^19.1.0",
+    "cross-env": "^7.0.3",
+    "eslint": "^8",
+    "eslint-config-next": "^15.0.3",
+    "typescript": "^5.8.3"
+  },
+  "refine": {
+    "projectId": "4LwOCL-BBaV29-qUYMAJ"
+  }
+}

src/app/(main)/layout.tsx

@@ -0,0 +1,57 @@
+import type { Metadata } from "next";
+import { cookies } from "next/headers";
+import React from "react";
+import { RefineContext } from "../_refine_context";
+
+import authOptions from "@app/api/auth/[...nextauth]/options";
+import { Header } from "@components/header";
+import { Title } from "@components/title";
+import { ThemedLayout } from "@refinedev/mui";
+import { getServerSession } from "next-auth/next";
+import { redirect } from "next/navigation";
+
+import "../globals.css";
+
+import { META_DATA } from "@config/config";
+
+export const metadata: Metadata = META_DATA;
+
+export default async function MainLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  const cookieStore = await cookies();
+  const theme = cookieStore.get("theme");
+  const defaultMode = theme?.value === "dark" ? "dark" : "light";
+
+  const data = await getData();
+
+  if (!data.session?.user) {
+    return redirect("/login");
+  }
+
+  return (
+    <RefineContext defaultMode={defaultMode}>
+      <ThemedLayout
+        Header={Header}
+        Title={Title}
+        childrenBoxProps={{
+          sx: { height: "100vh", p: 0 },
+        }}
+        containerBoxProps={{
+          sx: { height: "100%" },
+        }}
+      >
+        {children}
+      </ThemedLayout>
+    </RefineContext>
+  );
+}
+
+async function getData() {
+  const session = await getServerSession(authOptions);
+  return {
+    session,
+  };
+}

src/app/api/auth/[...nextauth]/options.ts

@@ -1,24 +1,24 @@
 import KeycloakProvider from "next-auth/providers/keycloak";
+import Avatar from "@assets/avatar/avatar-small.jpeg";
 
 const authOptions = {
   // Configure one or more authentication providers
   providers: [
-    // !!! Should be stored in .env file.
     KeycloakProvider({
-      clientId: `tjwater`,
+      clientId: process.env.KEYCLOAK_CLIENT_ID!,
-      clientSecret: `Darcm3gw0ZEJhIxt4DQUvacXpVlE7MBt`,
+      clientSecret: process.env.KEYCLOAK_CLIENT_SECRET!,
-      issuer: `http://localhost:8088/realms/tjwater`,
+      issuer: process.env.KEYCLOAK_ISSUER!,
       profile(profile) {
         return {
           id: profile.sub,
           name: profile.name ?? profile.preferred_username,
           email: profile.email,
-          image: `https://faces-img.xcdn.link/thumb-lorem-face-6312_thumb.jpg`,
+          image: Avatar.src,
         };
       },
     }),
   ],
-  secret: `Darcm3gw0ZEJhIxt4DQUvacXpVlE7MBt`,
+  secret: process.env.NEXTAUTH_SECRET,
 };
 
 export default authOptions;

src/app/layout.tsx

@@ -2,16 +2,6 @@ import type { Metadata } from "next";
 import { cookies } from "next/headers";
 import React, { Suspense } from "react";
 import { RefineContext } from "./_refine_context";
-
-import authOptions from "@app/api/auth/[...nextauth]/options";
-import { Header } from "@components/header";
-import { Title } from "@components/title";
-import { ThemedLayout } from "@refinedev/mui";
-import { getServerSession } from "next-auth/next";
-import { redirect } from "next/navigation";
-
-import "./globals.css";
-
 import { META_DATA } from "@config/config";
 
 export const metadata: Metadata = META_DATA;
@@ -25,39 +15,13 @@ export default async function RootLayout({
   const theme = cookieStore.get("theme");
   const defaultMode = theme?.value === "dark" ? "dark" : "light";
 
-  const data = await getData();
-
-  if (!data.session?.user) {
-    return redirect("/login");
-  }
-
   return (
     <html lang="en">
       <body>
         <Suspense>
-          <RefineContext defaultMode={defaultMode}>
+          <RefineContext defaultMode={defaultMode}>{children}</RefineContext>
-            <ThemedLayout
-              Header={Header}
-              Title={Title}
-              childrenBoxProps={{
-                sx: { height: "100vh", p: 0 },
-              }}
-              containerBoxProps={{
-                sx: { height: "100%" }, // 修改根容器：占满视口
-              }}
-            >
-              {children}
-            </ThemedLayout>
-          </RefineContext>
         </Suspense>
       </body>
     </html>
   );
 }
-
-async function getData() {
-  const session = await getServerSession(authOptions);
-  return {
-    session,
-  };
-}