feat: add boot and webui

2026-09-22 23:11:52 +08:00 · 2024-12-08 16:59:18 +08:00
parent 146f67c653
commit f7fc98b388
46 changed files with 2340 additions and 1 deletions
@@ -0,0 +1,56 @@
+import { ModeToggle } from "@/components/mode-toggle.tsx";
+import { ThemeProvider } from "@/components/theme-provider.tsx";
+import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert.tsx";
+import { Button } from "@/components/ui/button.tsx";
+import { Outlet, createRootRoute } from "@tanstack/react-router";
+import { TanStackRouterDevtools } from "@tanstack/router-devtools";
+import { ServerOffIcon } from "lucide-react";
+
+export const Route = createRootRoute({
+  component: RootComponent,
+});
+
+function RootComponent() {
+  return (
+    <ThemeProvider defaultTheme="system" storageKey="vite-ui-theme">
+      <div className="min-h-screen">
+        <header className="border-b px-4 py-3">
+          <div className="flex items-center justify-between">
+            <div className="flex items-center">
+              <h2 className="text-lg font-semibold">MemShellParty - JavaWeb</h2>
+            </div>
+            <div className="flex gap-1 mr-4">
+              <Button
+                variant="ghost"
+                size="icon"
+                className="size-8"
+                onClick={() => window.open("https://github.com/ReaJason/MemShellParty")}
+              >
+                <svg
+                  height="32"
+                  aria-hidden="true"
+                  viewBox="0 0 24 24"
+                  version="1.1"
+                  width="32"
+                  data-view-component="true"
+                  className="octicon octicon-mark-github v-align-middle"
+                  fill="currentColor"
+                >
+                  <path d="M12.5.75C6.146.75 1 5.896 1 12.25c0 5.089 3.292 9.387 7.863 10.91.575.101.79-.244.79-.546 0-.273-.014-1.178-.014-2.142-2.889.532-3.636-.704-3.866-1.35-.13-.331-.69-1.352-1.18-1.625-.402-.216-.977-.748-.014-.762.906-.014 1.553.834 1.769 1.179 1.035 1.74 2.688 1.25 3.349.948.1-.747.402-1.25.733-1.538-2.559-.287-5.232-1.279-5.232-5.678 0-1.25.445-2.285 1.178-3.09-.115-.288-.517-1.467.115-3.048 0 0 .963-.302 3.163 1.179.92-.259 1.897-.388 2.875-.388.977 0 1.955.13 2.875.388 2.2-1.495 3.162-1.179 3.162-1.179.633 1.581.23 2.76.115 3.048.733.805 1.179 1.825 1.179 3.09 0 4.413-2.688 5.39-5.247 5.678.417.36.776 1.05.776 2.128 0 1.538-.014 2.774-.014 3.162 0 .302.216.662.79.547C20.709 21.637 24 17.324 24 12.25 24 5.896 18.854.75 12.5.75Z" />
+                </svg>
+              </Button>
+              <ModeToggle />
+            </div>
+          </div>
+        </header>
+        <Alert className="px-4 border-0 border-b">
+          <ServerOffIcon className="h-4 w-4" />
+          <AlertTitle>服务不可用!</AlertTitle>
+          <AlertDescription>未检测到可用后端服务，生成功能暂不可用.</AlertDescription>
+        </Alert>
+        <Outlet />
+        <TanStackRouterDevtools position="bottom-right" />
+      </div>
+    </ThemeProvider>
+  );
+}
@@ -0,0 +1,30 @@
+import { MainConfigCard } from "@/components/main-config-card.tsx";
+import { PackageConfigCard } from "@/components/package-config-card.tsx";
+import { ShellConfigCard } from "@/components/shell-config-card.tsx";
+import { ShellResult } from "@/components/shell-result.tsx";
+import { Button } from "@/components/ui/button";
+import { createFileRoute } from "@tanstack/react-router";
+import { WandSparklesIcon } from "lucide-react";
+
+export const Route = createFileRoute("/")({
+  component: AboutComponent,
+});
+
+function AboutComponent() {
+  return (
+    <div className="flex flex-col md:flex-row gap-4 p-4">
+      <div className="w-full md:w-1/2 space-y-4">
+        <MainConfigCard />
+        <ShellConfigCard />
+        <PackageConfigCard />
+        <Button className="w-full">
+          <WandSparklesIcon />
+          Generate
+        </Button>
+      </div>
+      <div className="w-full md:w-1/2 space-y-4">
+        <ShellResult />
+      </div>
+    </div>
+  );
+}