feat: 重构设置模块，合并相关组件并实现首次登录和配置功能
This commit is contained in:
@@ -4,7 +4,7 @@ import { useStore } from "./store";
|
||||
import '@kevisual/kv-code/kv-code.js'
|
||||
const link = {
|
||||
loginDocs: '../docs/01-login-first/',
|
||||
settingDocs: '../../docs/10-config/',
|
||||
settingsDocs: '../../docs/10-config/',
|
||||
}
|
||||
export const FirstLogin = () => {
|
||||
const store = useStore();
|
||||
@@ -84,7 +84,7 @@ export const Config = () => {
|
||||
<div className="p-4 flex flex-col h-full">
|
||||
<div className="mb-4 flex justify-between items-center">
|
||||
<h2 className="text-xl font-bold text-black" >
|
||||
<a href={link.settingDocs} target="_blank" rel="noreferrer" className="underline">
|
||||
<a href={link.settingsDocs} target="_blank" rel="noreferrer" className="underline">
|
||||
配置中心文档
|
||||
</a>
|
||||
</h2>
|
||||
@@ -5,8 +5,8 @@ export const Nav = () => {
|
||||
const currentPath = typeof window !== 'undefined' ? window.location.pathname : ''
|
||||
|
||||
const navItems = [
|
||||
{ name: '管理员设置', path: wrapBasename('/setting/') },
|
||||
{ name: '全局设置', path: wrapBasename('/setting/all/') },
|
||||
{ name: '管理员设置', path: wrapBasename('/settings/') },
|
||||
{ name: '全局设置', path: wrapBasename('/settings/all/') },
|
||||
];
|
||||
|
||||
const isActive = (path: string) => {
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: '第一次登录'
|
||||
tags: ['setting']
|
||||
tags: ['settings']
|
||||
createdAt: '2025-12-18 20:00:00'
|
||||
---
|
||||
|
||||
|
||||
@@ -3,7 +3,118 @@ import Html from '@/components/html.astro';
|
||||
---
|
||||
|
||||
<Html>
|
||||
<main>
|
||||
cli-center
|
||||
<main class="container">
|
||||
<div class="hero">
|
||||
<h1 class="title">欢迎使用 CLI Center</h1>
|
||||
<p class="subtitle">强大的命令行工具管理中心</p>
|
||||
</div>
|
||||
|
||||
<div class="card-grid">
|
||||
<a href="./docs/" class="card">
|
||||
<div class="card-icon">📚</div>
|
||||
<h2>文档中心</h2>
|
||||
<p>查看完整的使用文档和API参考</p>
|
||||
</a>
|
||||
|
||||
<a href="./settings/" class="card">
|
||||
<div class="card-icon">⚙️</div>
|
||||
<h2>设置中心</h2>
|
||||
<p>配置和管理您的应用设置</p>
|
||||
</a>
|
||||
</div>
|
||||
</main>
|
||||
</Html>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 3rem 1.5rem;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.hero {
|
||||
text-align: center;
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 3.5rem;
|
||||
font-weight: 800;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
margin-bottom: 1rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1.5rem;
|
||||
color: #6b7280;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.card-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 2rem;
|
||||
width: 100%;
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.card {
|
||||
background: white;
|
||||
border-radius: 1rem;
|
||||
padding: 2.5rem;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
transition: all 0.3s ease;
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
transform: translateY(-8px);
|
||||
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
|
||||
border-color: #667eea;
|
||||
}
|
||||
|
||||
.card-icon {
|
||||
font-size: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.card h2 {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.75rem 0;
|
||||
color: #111827;
|
||||
}
|
||||
|
||||
.card p {
|
||||
font-size: 1rem;
|
||||
color: #6b7280;
|
||||
margin: 0;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.title {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.card-grid {
|
||||
grid-template-columns: 1fr;
|
||||
max-width: 400px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
import Html from '@/components/html.astro';
|
||||
import { FirstLogin } from '@/apps/setting/index.tsx';
|
||||
import { FirstLogin } from '@/apps/settings/index.tsx';
|
||||
---
|
||||
|
||||
<Html>
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
import Html from '@/components/html.astro';
|
||||
import { Config } from '@/apps/setting/index.tsx';
|
||||
import { Config } from '@/apps/settings/index.tsx';
|
||||
---
|
||||
|
||||
<Html>
|
||||
Reference in New Issue
Block a user