feat: 启用后端自动启动与 Setup 引导流程增强
主要修改点: 1. 网络绑定扩展至 Server - .env.example: SERVER_HOST/VITE_SERVER_HOST 从 127.0.0.1 改为 0.0.0.0 - server/src/app/core/config.py: 默认 app_host 从 127.0.0.1 改为 0.0.0.0 2. 启动脚本重构(重命名以区分职责) - server/start.sh → server/server_start.sh - web/start.sh → web/web_start.sh - 根目录 start.sh: 更新调用路径(./start.sh → ./server_start.sh, ./web_start.sh) - 根目录 start.sh: 新增 setup_ready() 检测函数 - 根目录 start.sh: server_probe_host() 支持 0.0.0.0 探测转换为 127.0.0.1 - 根目录 start.sh: start_setup_web() 新增 X_FINANCIAL_FORCE_SETUP=true 3. API URL 动态化 (web/src/services/api.js) - 从 localStorage 持久化读取 API Base URL - 新增 setRuntimeApiBaseUrl() / getRuntimeApiBaseUrl() 导出函数 - buildUrl() 改用运行时 runtimeApiBaseUrl 4. 浏览器 Host 智能解析 (web/vite.config.js) - 新增 resolveBrowserApiHost(): 根据 server_host/web_host 配置决定浏览器端使用的 API Host - buildApiBaseUrl() 改用 resolveBrowserApiHost() - 新增后端启动状态管理: backendStartState / cloneBackendStartState() / updateBackendStep() - 后端启动分 5 步追踪: config → deps → server → health → done - 新增 backendStartPromise 避免重复启动 5. Setup 表单逻辑增强 (web/src/composables/useSetupView.js) - 新增 shouldExposeServerHost(): 判断浏览器 host 是否非本地 - 新增 resolveInitialServerHost(): 当浏览器访问且 server_host 为本地时暴露 0.0.0.0 - buildPayload(): 根据 shouldExposeServerHost() 自动将 127.0.0.1/localhost 转为 0.0.0.0 6. Bootstrap API 扩展 (web/src/services/bootstrap.js) - 新增 startBootstrapBackend(): POST /bootstrap/backend 触发后端启动 - 新增 fetchBootstrapBackendStatus(): GET /bootstrap/backend 查询后端状态 7. Session 导航增强 (web/src/composables/useSystemState.js) - 新增 resolveBrowserApiBaseUrl(): 智能解析浏览器端 API Base URL - installSessionNavigation(): 调用 fetchBootstrapState() 同步引导状态 - 新增 reconcileEntryRoute(): 根据引导状态协调路由 - VITE_SERVER_HOST 默认值从 127.0.0.1 改为 0.0.0.0 8. Setup 视图增强 (web/src/views/SetupRouteView.vue) - 向 SetupView 传递启动进度相关 props: startupCountdownSeconds, startupLog, startupSteps, startupVisible, progressMessage 9. CSS 新增 (web/src/assets/styles/views/setup-view.css) - .setup-complete-progress: 进度文字样式 - .setup-modal-backdrop: 模态框遮罩 - .setup-startup-modal: 启动模态框容器 - .setup-startup-head / .setup-startup-body / .setup-startup-spinner: 模态框头部/内容/加载动画 - .setup-startup-steps / .setup-startup-step: 步骤列表及单个步骤 - .setup-startup-step.is-running / .is-success / .is-failed: 步骤状态样式 - .setup-startup-log: 启动日志区域
This commit is contained in:
@@ -204,6 +204,15 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.setup-complete-progress {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
color: rgba(209, 250, 229, 0.86);
|
||||
font-size: 13px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.setup-panel {
|
||||
padding: 36px;
|
||||
display: grid;
|
||||
@@ -522,6 +531,185 @@
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.setup-modal-backdrop {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 50;
|
||||
padding: 24px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: rgba(3, 20, 15, 0.72);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.setup-startup-modal {
|
||||
width: min(1120px, 100%);
|
||||
max-height: calc(100vh - 48px);
|
||||
overflow: hidden;
|
||||
padding: 24px;
|
||||
border: 1px solid rgba(110, 231, 183, 0.22);
|
||||
border-radius: 8px;
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
gap: 20px;
|
||||
background:
|
||||
radial-gradient(circle at top right, rgba(16, 185, 129, 0.16), transparent 18rem),
|
||||
linear-gradient(180deg, #05251d 0%, #081611 100%);
|
||||
box-shadow: 0 30px 80px rgba(0, 0, 0, 0.42);
|
||||
}
|
||||
|
||||
.setup-startup-head {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 18px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.setup-startup-head h2 {
|
||||
margin-top: 4px;
|
||||
color: #ffffff;
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.setup-startup-head span {
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
color: rgba(209, 250, 229, 0.78);
|
||||
font-size: 13px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.setup-startup-spinner {
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
border: 1px solid rgba(110, 231, 183, 0.26);
|
||||
border-radius: 50%;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
flex: 0 0 auto;
|
||||
color: #a7f3d0;
|
||||
background: rgba(6, 78, 59, 0.34);
|
||||
}
|
||||
|
||||
.setup-startup-spinner .pi {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.setup-startup-spinner strong {
|
||||
color: #ffffff;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.setup-startup-body {
|
||||
min-height: 0;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(330px, 0.86fr) minmax(460px, 1.14fr);
|
||||
gap: 18px;
|
||||
}
|
||||
|
||||
.setup-startup-steps {
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
padding-right: 2px;
|
||||
display: grid;
|
||||
align-content: start;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.setup-startup-step {
|
||||
padding: 14px;
|
||||
border: 1px solid rgba(148, 163, 184, 0.16);
|
||||
border-radius: 8px;
|
||||
display: grid;
|
||||
grid-template-columns: 24px 1fr;
|
||||
gap: 12px;
|
||||
background: rgba(15, 23, 42, 0.24);
|
||||
}
|
||||
|
||||
.setup-startup-step .pi {
|
||||
margin-top: 2px;
|
||||
color: rgba(209, 250, 229, 0.46);
|
||||
}
|
||||
|
||||
.setup-startup-step strong {
|
||||
color: #f8fffb;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.setup-startup-step span {
|
||||
display: block;
|
||||
margin-top: 4px;
|
||||
color: rgba(209, 250, 229, 0.68);
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.setup-startup-step.is-running {
|
||||
border-color: rgba(59, 130, 246, 0.34);
|
||||
}
|
||||
|
||||
.setup-startup-step.is-running .pi {
|
||||
color: #93c5fd;
|
||||
}
|
||||
|
||||
.setup-startup-step.is-success {
|
||||
border-color: rgba(16, 185, 129, 0.32);
|
||||
}
|
||||
|
||||
.setup-startup-step.is-success .pi {
|
||||
color: #34d399;
|
||||
}
|
||||
|
||||
.setup-startup-step.is-error {
|
||||
border-color: rgba(248, 113, 113, 0.36);
|
||||
}
|
||||
|
||||
.setup-startup-step.is-error .pi {
|
||||
color: #f87171;
|
||||
}
|
||||
|
||||
.setup-startup-console {
|
||||
min-height: 0;
|
||||
border: 1px solid rgba(148, 163, 184, 0.16);
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
background: rgba(2, 6, 23, 0.42);
|
||||
}
|
||||
|
||||
.setup-startup-console-head {
|
||||
min-height: 44px;
|
||||
padding: 0 14px;
|
||||
border-bottom: 1px solid rgba(148, 163, 184, 0.14);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
background: rgba(15, 23, 42, 0.5);
|
||||
}
|
||||
|
||||
.setup-startup-console-head strong {
|
||||
color: #e2e8f0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.setup-startup-console-head span {
|
||||
color: rgba(148, 163, 184, 0.9);
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.setup-startup-log {
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
padding: 14px;
|
||||
color: rgba(226, 232, 240, 0.84);
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
@media (max-width: 1180px) {
|
||||
.setup-page {
|
||||
grid-template-columns: 1fr;
|
||||
@@ -546,6 +734,32 @@
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.setup-modal-backdrop {
|
||||
padding: 14px;
|
||||
}
|
||||
|
||||
.setup-startup-modal {
|
||||
max-height: calc(100vh - 28px);
|
||||
padding: 18px;
|
||||
}
|
||||
|
||||
.setup-startup-head {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.setup-startup-body {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.setup-startup-steps,
|
||||
.setup-startup-console {
|
||||
max-height: none;
|
||||
}
|
||||
|
||||
.setup-startup-log {
|
||||
max-height: 260px;
|
||||
}
|
||||
|
||||
.field-span-2 {
|
||||
grid-column: auto;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user