✨ 添加(ui/autoMate)：在Config页面添加Category子页面，并设为默认显示页面

📝 新建(ui/autoMate)：添加Category页面的样式文件和组件文件
🔧 更新(ui/autoMate)：更新Config页面样式文件，设置nav样式为border-r border-t
🔧 修改(ui/autoMate)：在window.ts中修改frame和transparent属性的值

ui/autoMate/src/main/config/window.ts

@@ -11,8 +11,8 @@ export function createWindow(): BrowserWindow {  // Create the browser window.
       height: 750,
       center: true,
       show: false,
-      // frame: false,
-      // transparent: true,
+      frame: true,
+      transparent: false,
       // alwaysOnTop: true,
       autoHideMenuBar: true,
       ...(process.platform === 'linux' ? { icon } : {}),

ui/autoMate/src/renderer/src/pages/Category/category.scss

@@ -0,0 +1,22 @@
+.category-page{
+    @apply w-screen h-screen;
+    display: grid;
+    grid-template:
+        "categories content" auto
+        "nav content" 30px/120px auto;
+    
+
+    .categories{
+        @apply border-r;
+        grid-area: categories;
+    }
+
+    .nav {
+        @apply border-t border-r;
+        grid-area: nav;
+    }
+
+    .content {
+        grid-area: content;
+    }
+}

ui/autoMate/src/renderer/src/pages/Category/index.tsx

@@ -0,0 +1,11 @@
+import "./category.scss"
+
+export const Category = () => {
+    return (
+    <main className="category-page">
+        <div className="categories">categories</div>
+        <div className="nav">nav</div>
+        <div className="content">content</div>
+    </main>
+ )
+}

ui/autoMate/src/renderer/src/pages/Config/index.tsx

@@ -1,12 +1,8 @@
-import styles from "./styles.module.scss"
+import { Outlet } from "react-router-dom"
 export default function Config(){
     return (
-      <main className={styles.container}>
-        <div> </div>
-        <div> </div>
-        <div className={styles.category}> </div>
-        <div className={styles.nav}> </div>
-        <div className={styles.content}> </div>
+      <main>
+      <Outlet />
       </main>
     )
   }

ui/autoMate/src/renderer/src/pages/Config/styles.module.scss

@@ -25,7 +25,7 @@
         }
         &.nav {
             grid-area: nav;
-            @apply border-r;
+            @apply border-r border-t;
         }
     }
 }

ui/autoMate/src/renderer/src/router/index.tsx

@@ -1,6 +1,7 @@
 import Config from "@renderer/pages/Config";
 import Home from "@renderer/pages/Home";
 import { createHashRouter } from "react-router-dom";
+import {Category} from "@renderer/pages/Category";
 
 const router = createHashRouter([
   {
@@ -9,7 +10,14 @@ const router = createHashRouter([
   },
   {
     path: "config",
-    element: <Config />
+    element: <Config />,
+    children: [
+      {
+        // 界面第一次打开时，默认显示的页面
+        index: true,
+        element: <Category />
+      }
+    ]
   }
 ])
 export default router