update: ScriptsPage.tsx

2026-09-02 10:10:41 +08:00
parent df374d00c3
commit 635d80e3cf
2 changed files with 8 additions and 7 deletions
@@ -0,0 +1,30 @@
+import { primaryButtonClass } from "./modalUi";
+import {Plus, SquareChartGantt} from "lucide-react";
+import {Button} from "~/components/ui/button";
+
+type WelcomePanelProps = {
+  onCreateScript: () => void;
+};
+
+export function WelcomePanel({ onCreateScript }: WelcomePanelProps) {
+  return (
+    <div className="welcome-panel-shell flex min-h-full flex-col items-center justify-center p-[35px] text-center">
+      <div className="mb-[21px] grid size-[86px] place-items-center rounded-[25px] border border-[#cfe0f0] bg-gradient-to-br from-white to-[#eaf4fd] text-[#3d8cd9] shadow-[0_16px_35px_rgb(40_103_165/12%)]">
+        <SquareChartGantt size={42}/>
+      </div>
+      <span className="text-[10px] font-extrabold tracking-[0.12em] text-[#2e81ce]">
+        构建脚本工作台
+      </span>
+      <h2 className="mb-[7px] mt-[9px] text-[23px] text-[#21354c]">
+        创建你的第一个模型脚本
+      </h2>
+      <p className="mb-[22px] w-full max-w-[430px] text-xs leading-[1.8] text-[#76879a]">
+        通过 Notebook 完成数据探索，或使用 Python 脚本构建可调度的处理任务。
+      </p>
+      <Button className={primaryButtonClass} type="button" onClick={onCreateScript}>
+        <Plus size={17} />
+        新建构建脚本
+      </Button>
+    </div>
+  );
+}