v1.0.3修复优化
This commit is contained in:
@@ -13,39 +13,54 @@ if (file_exists($configFile)) {
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>AI Chat - 安装向导</title>
|
||||
<link rel="stylesheet" href="/assets/css/style.css">
|
||||
<style>
|
||||
.install-container { max-width: 700px; margin: 40px auto; padding: 0 20px; }
|
||||
.step-content { display: none; background: var(--bg-card); border-radius: var(--radius); padding: 24px; }
|
||||
.step-content.active { display: block; }
|
||||
.check-item { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--border-color); }
|
||||
.check-item .status { font-weight: bold; }
|
||||
.check-item .status.pass { color: var(--success); }
|
||||
.check-item .status.fail { color: var(--danger); }
|
||||
.provider-item { background: var(--bg-secondary); padding: 16px; border-radius: var(--radius); margin-bottom: 12px; }
|
||||
.provider-item .form-group { margin-bottom: 8px; }
|
||||
h1 { text-align: center; margin-bottom: 30px; color: var(--primary); }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="install-container">
|
||||
<h1>
|
||||
<svg viewBox="0 0 24 24" width="28" height="28" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-6px;margin-right:10px;"><rect x="3" y="4" width="18" height="12" rx="3"/><circle cx="9" cy="10" r="1.5" fill="currentColor" stroke="none"/><circle cx="15" cy="10" r="1.5" fill="currentColor" stroke="none"/><path d="M8 16v2M16 16v2M12 16v3"/></svg>
|
||||
AI Chat 安装向导
|
||||
</h1>
|
||||
|
||||
<!-- 标题区域 -->
|
||||
<div class="install-header">
|
||||
<div class="install-logo">
|
||||
<svg viewBox="0 0 24 24" width="40" height="40" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||||
<rect x="3" y="4" width="18" height="12" rx="3"/>
|
||||
<circle cx="9" cy="10" r="1.5" fill="currentColor" stroke="none"/>
|
||||
<circle cx="15" cy="10" r="1.5" fill="currentColor" stroke="none"/>
|
||||
<path d="M8 16v2M16 16v2M12 16v3"/>
|
||||
</svg>
|
||||
</div>
|
||||
<h1>AI Chat 安装向导</h1>
|
||||
<p class="install-subtitle">跟随引导完成初始配置，快速启用你的 AI 对话平台</p>
|
||||
</div>
|
||||
|
||||
<!-- 步骤指示器 -->
|
||||
<ul class="step-indicator">
|
||||
<li class="step active" data-step="1">1. 环境检查</li>
|
||||
<li class="step" data-step="2">2. 数据库配置</li>
|
||||
<li class="step" data-step="3">3. 应用配置</li>
|
||||
<li class="step" data-step="4">4. 管理员账户</li>
|
||||
<li class="step" data-step="5">5. AI供应商</li>
|
||||
<li class="step active" data-step="1">
|
||||
<span class="step-num">1</span>
|
||||
<span class="step-label">环境检查</span>
|
||||
</li>
|
||||
<li class="step" data-step="2">
|
||||
<span class="step-num">2</span>
|
||||
<span class="step-label">数据库</span>
|
||||
</li>
|
||||
<li class="step" data-step="3">
|
||||
<span class="step-num">3</span>
|
||||
<span class="step-label">应用配置</span>
|
||||
</li>
|
||||
<li class="step" data-step="4">
|
||||
<span class="step-num">4</span>
|
||||
<span class="step-label">管理员</span>
|
||||
</li>
|
||||
<li class="step" data-step="5">
|
||||
<span class="step-num">5</span>
|
||||
<span class="step-label">AI 供应商</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- 步骤1：环境检查 -->
|
||||
<div class="step-content active" id="step1">
|
||||
<h2>环境检查</h2>
|
||||
<div id="envChecks">
|
||||
<div class="step-header">
|
||||
<h2>环境检查</h2>
|
||||
<p class="step-desc">检查服务器运行环境是否满足安装要求</p>
|
||||
</div>
|
||||
<div id="envChecks" class="check-list">
|
||||
<!-- 由 JS 动态填充 -->
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
@@ -55,48 +70,62 @@ if (file_exists($configFile)) {
|
||||
|
||||
<!-- 步骤2：数据库配置 -->
|
||||
<div class="step-content" id="step2">
|
||||
<h2>数据库配置</h2>
|
||||
<div class="form-group">
|
||||
<label>主机地址</label>
|
||||
<input type="text" id="dbHost" value="127.0.0.1" placeholder="数据库主机">
|
||||
<div class="step-header">
|
||||
<h2>数据库配置</h2>
|
||||
<p class="step-desc">填写 MySQL 数据库连接信息</p>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>端口</label>
|
||||
<input type="number" id="dbPort" value="3306" placeholder="数据库端口">
|
||||
<div class="form-row">
|
||||
<div class="form-group" style="flex:2">
|
||||
<label>主机地址</label>
|
||||
<input type="text" id="dbHost" value="127.0.0.1" placeholder="数据库主机">
|
||||
</div>
|
||||
<div class="form-group" style="flex:1">
|
||||
<label>端口</label>
|
||||
<input type="number" id="dbPort" value="3306" placeholder="端口号">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>数据库名</label>
|
||||
<input type="text" id="dbName" placeholder="数据库名称">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>用户名</label>
|
||||
<input type="text" id="dbUser" placeholder="数据库用户名">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>密码</label>
|
||||
<input type="password" id="dbPassword" placeholder="数据库密码">
|
||||
<div class="form-row">
|
||||
<div class="form-group" style="flex:1">
|
||||
<label>用户名</label>
|
||||
<input type="text" id="dbUser" placeholder="数据库用户名">
|
||||
</div>
|
||||
<div class="form-group" style="flex:1">
|
||||
<label>密码</label>
|
||||
<input type="password" id="dbPassword" placeholder="数据库密码">
|
||||
</div>
|
||||
</div>
|
||||
<div id="dbTestResult"></div>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-secondary" onclick="InstallWizard.prevStep()">上一步</button>
|
||||
<button class="btn btn-secondary" onclick="InstallWizard.testDb()">测试连接</button>
|
||||
<button class="btn btn-outline" onclick="InstallWizard.testDb()">
|
||||
<svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="margin-right:4px;"><path d="M22 11.08V12a10 10 0 11-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>
|
||||
测试连接
|
||||
</button>
|
||||
<button class="btn btn-primary" onclick="InstallWizard.nextStep()">下一步</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 步骤3：应用配置 -->
|
||||
<div class="step-content" id="step3">
|
||||
<h2>应用配置</h2>
|
||||
<div class="step-header">
|
||||
<h2>应用配置</h2>
|
||||
<p class="step-desc">设置 JWT 令牌参数，用于用户认证加密</p>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>JWT 密钥</label>
|
||||
<div style="display:flex;gap:8px;">
|
||||
<input type="text" id="jwtSecret" placeholder="留空则自动生成" style="flex:1;">
|
||||
<button class="btn btn-secondary btn-sm" onclick="document.getElementById('jwtSecret').value=InstallWizard.generateSecret()">自动生成</button>
|
||||
<div class="input-action-row">
|
||||
<input type="text" id="jwtSecret" placeholder="留空则自动生成安全密钥">
|
||||
<button class="btn btn-outline btn-sm" onclick="document.getElementById('jwtSecret').value=InstallWizard.generateSecret()">自动生成</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>JWT 过期时间（秒）</label>
|
||||
<input type="number" id="jwtExpiry" value="86400" placeholder="默认 86400（24小时）">
|
||||
<span class="form-hint">默认 86400 秒（24 小时），可根据需要调整</span>
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-secondary" onclick="InstallWizard.prevStep()">上一步</button>
|
||||
@@ -106,18 +135,23 @@ if (file_exists($configFile)) {
|
||||
|
||||
<!-- 步骤4：管理员账户 -->
|
||||
<div class="step-content" id="step4">
|
||||
<h2>创建管理员账户</h2>
|
||||
<div class="step-header">
|
||||
<h2>创建管理员账户</h2>
|
||||
<p class="step-desc">设置管理员登录凭据，安装后可在系统中修改</p>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>用户名</label>
|
||||
<input type="text" id="adminUsername" placeholder="管理员用户名">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>密码</label>
|
||||
<input type="password" id="adminPassword" placeholder="至少6位密码">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>确认密码</label>
|
||||
<input type="password" id="adminPasswordConfirm" placeholder="再次输入密码">
|
||||
<div class="form-row">
|
||||
<div class="form-group" style="flex:1">
|
||||
<label>密码</label>
|
||||
<input type="password" id="adminPassword" placeholder="至少6位密码">
|
||||
</div>
|
||||
<div class="form-group" style="flex:1">
|
||||
<label>确认密码</label>
|
||||
<input type="password" id="adminPasswordConfirm" placeholder="再次输入密码">
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-secondary" onclick="InstallWizard.prevStep()">上一步</button>
|
||||
@@ -127,18 +161,28 @@ if (file_exists($configFile)) {
|
||||
|
||||
<!-- 步骤5：AI供应商 -->
|
||||
<div class="step-content" id="step5">
|
||||
<h2>AI 供应商配置</h2>
|
||||
<p style="color:var(--text-secondary);margin-bottom:16px;">至少配置一个 AI 供应商</p>
|
||||
<div class="step-header">
|
||||
<h2>AI 供应商配置</h2>
|
||||
<p class="step-desc">至少配置一个 AI 供应商，安装后可在设置中添加更多</p>
|
||||
</div>
|
||||
<div id="providerList">
|
||||
<!-- 由 JS 动态管理 -->
|
||||
</div>
|
||||
<button class="btn btn-secondary" onclick="InstallWizard.addProvider()" style="margin-top:8px;">+ 添加供应商</button>
|
||||
<div id="installResult"></div>
|
||||
<button class="btn btn-outline" onclick="InstallWizard.addProvider()" style="margin-top:12px;width:100%;">
|
||||
<svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" style="margin-right:4px;"><path d="M12 5v14M5 12h14"/></svg>
|
||||
添加供应商
|
||||
</button>
|
||||
<div id="installResult" style="margin-top:16px;"></div>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-secondary" onclick="InstallWizard.prevStep()">上一步</button>
|
||||
<button class="btn btn-primary" id="installBtn" onclick="InstallWizard.runInstall()">完成安装</button>
|
||||
<button class="btn btn-primary btn-lg" id="installBtn" onclick="InstallWizard.runInstall()">完成安装</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 底部版本信息 -->
|
||||
<div class="install-footer">
|
||||
AI Chat · v1.0
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
@@ -162,16 +206,20 @@ if (file_exists($configFile)) {
|
||||
|
||||
const container = document.getElementById('envChecks');
|
||||
container.innerHTML = checks.map(c => `
|
||||
<div class="check-item">
|
||||
<span>${c.name}</span>
|
||||
<span class="status ${c.pass ? 'pass' : 'fail'}">${c.pass ? '通过' : '未通过'}</span>
|
||||
<div class="check-item ${c.pass ? 'pass' : 'fail'}">
|
||||
<span class="check-name">${c.name}</span>
|
||||
<span class="check-status">
|
||||
${c.pass
|
||||
? '<svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg> 通过'
|
||||
: '<svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6L6 18M6 6l12 12"/></svg> 未通过'
|
||||
}
|
||||
</span>
|
||||
</div>
|
||||
`).join('');
|
||||
},
|
||||
|
||||
nextStep() {
|
||||
if (this.currentStep === 4) {
|
||||
// 验证管理员密码
|
||||
const pwd = document.getElementById('adminPassword').value;
|
||||
const confirm = document.getElementById('adminPasswordConfirm').value;
|
||||
const username = document.getElementById('adminUsername').value;
|
||||
@@ -229,9 +277,23 @@ if (file_exists($configFile)) {
|
||||
const index = list.children.length;
|
||||
const html = `
|
||||
<div class="provider-item" data-index="${index}">
|
||||
<div class="form-group">
|
||||
<label>供应商名称</label>
|
||||
<input type="text" class="provider-name" placeholder="如：OpenAI、DeepSeek">
|
||||
<div class="provider-item-header">
|
||||
<span class="provider-item-title">供应商 #${index + 1}</span>
|
||||
${index > 0 ? '<button class="btn btn-danger btn-sm" onclick="this.closest(\'.provider-item\').remove()">删除</button>' : ''}
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group" style="flex:1">
|
||||
<label>供应商名称</label>
|
||||
<input type="text" class="provider-name" placeholder="如：OpenAI、DeepSeek">
|
||||
</div>
|
||||
<div class="form-group" style="flex:1">
|
||||
<label>供应商类型</label>
|
||||
<select class="provider-type">
|
||||
<option value="newapi">OpenAI 兼容</option>
|
||||
<option value="openai">OpenAI 官方</option>
|
||||
<option value="claude">Claude (Anthropic)</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>API URL</label>
|
||||
@@ -245,15 +307,6 @@ if (file_exists($configFile)) {
|
||||
<label>可用模型（逗号分隔）</label>
|
||||
<input type="text" class="provider-models" placeholder="如：gpt-3.5-turbo, gpt-4">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>供应商类型</label>
|
||||
<select class="provider-type">
|
||||
<option value="newapi">OpenAI 兼容</option>
|
||||
<option value="openai">OpenAI 官方</option>
|
||||
<option value="claude">Claude (Anthropic)</option>
|
||||
</select>
|
||||
</div>
|
||||
${index > 0 ? '<button class="btn btn-danger btn-sm" onclick="this.parentElement.remove()">删除</button>' : ''}
|
||||
</div>
|
||||
`;
|
||||
list.insertAdjacentHTML('beforeend', html);
|
||||
|
||||
Reference in New Issue
Block a user