绝尘
98393b4908
Tauri 2 + Vue 3 + Vite 6 桌面应用，Rust workspace 含 13 个 crate (df-ai / df-storage / df-workflow / df-core / df-execute 等)。 核心能力：AI 聊天 agentic 循环(工具调用+人工审批)、工作流引擎、 任务/想法/项目/阶段管理、可追溯性，及配套前端组件。
716 lines
17 KiB
HTML
716 lines
17 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>DevFlow 使用手册</title>
|
||
<style>
|
||
/* DevFlow Design System */
|
||
:root {
|
||
/* — Surface — */
|
||
--df-bg: #0c0e1a;
|
||
--df-bg-raised: #12152a;
|
||
--df-bg-card: #171b33;
|
||
--df-bg-card-hover: #1c2140;
|
||
--df-sidebar-bg: #090b15;
|
||
|
||
/* — Text — */
|
||
--df-text: #eef0f6;
|
||
--df-text-secondary: #8b90a8;
|
||
--df-text-dim: #4a4f6a;
|
||
|
||
/* — Accent: 紫色系 — */
|
||
--df-accent: #7b6ff0;
|
||
--df-accent-hover: #6a5de0;
|
||
--df-accent-soft: rgba(123,111,240,0.15);
|
||
--df-accent-bg: rgba(123,111,240,0.08);
|
||
|
||
/* — Semantic — */
|
||
--df-success: #3ddba0;
|
||
--df-success-bg: rgba(61,219,160,0.12);
|
||
--df-warning: #f0c75e;
|
||
--df-warning-bg: rgba(240,199,94,0.12);
|
||
--df-danger: #f06565;
|
||
--df-danger-bg: rgba(240,101,101,0.12);
|
||
--df-info: #5eaff0;
|
||
--df-info-bg: rgba(94,175,240,0.12);
|
||
|
||
/* — Border — */
|
||
--df-border: rgba(255,255,255,0.06);
|
||
--df-border-strong: rgba(255,255,255,0.10);
|
||
|
||
/* — Radius — */
|
||
--df-radius-sm: 6px;
|
||
--df-radius: 8px;
|
||
--df-radius-lg: 12px;
|
||
}
|
||
|
||
/* 页面样式 */
|
||
body {
|
||
padding: 2rem;
|
||
max-width: 768px;
|
||
margin: 0 auto;
|
||
background: var(--df-bg);
|
||
color: var(--df-text);
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||
line-height: 1.7;
|
||
}
|
||
|
||
/* 按钮样式 */
|
||
.btn {
|
||
padding: 8px 16px;
|
||
border: none;
|
||
border-radius: var(--df-radius);
|
||
font-size: 13px;
|
||
cursor: pointer;
|
||
transition: all 0.15s;
|
||
}
|
||
|
||
.btn-primary {
|
||
background: var(--df-accent);
|
||
color: #fff;
|
||
}
|
||
|
||
.btn-primary:hover {
|
||
background: var(--df-accent-hover);
|
||
}
|
||
|
||
/* 卡片样式 */
|
||
.card {
|
||
background: var(--df-bg-card);
|
||
border: 0.5px solid var(--df-border);
|
||
border-radius: var(--df-radius-lg);
|
||
padding: 1.5rem;
|
||
margin-bottom: 1.5rem;
|
||
}
|
||
|
||
/* 标题样式 */
|
||
h1 {
|
||
font-size: 28px;
|
||
font-weight: 500;
|
||
color: var(--df-text);
|
||
margin: 0 0 0.5rem;
|
||
}
|
||
|
||
h2 {
|
||
font-size: 20px;
|
||
font-weight: 500;
|
||
color: var(--df-text);
|
||
margin: 0 0 0.75rem;
|
||
}
|
||
|
||
h3 {
|
||
font-size: 16px;
|
||
font-weight: 500;
|
||
color: var(--df-text);
|
||
margin: 0 0 0.5rem;
|
||
}
|
||
|
||
p {
|
||
font-size: 14px;
|
||
color: var(--df-text-secondary);
|
||
margin: 0 0 1rem;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
/* 小标题 */
|
||
.section-title {
|
||
font-size: 12px;
|
||
font-weight: 500;
|
||
color: var(--df-text-dim);
|
||
letter-spacing: 0.05em;
|
||
text-transform: uppercase;
|
||
margin: 0 0 1rem;
|
||
}
|
||
|
||
/* 特性卡片 */
|
||
.feature-row {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 12px;
|
||
margin-bottom: 1rem;
|
||
}
|
||
|
||
.feature-icon {
|
||
font-size: 20px;
|
||
flex-shrink: 0;
|
||
margin-top: 2px;
|
||
}
|
||
|
||
.feature-text {
|
||
font-size: 14px;
|
||
color: var(--df-text-secondary);
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.feature-text strong {
|
||
color: var(--df-text);
|
||
font-weight: 500;
|
||
}
|
||
|
||
/* 按钮样式 */
|
||
.btn-demo {
|
||
background: transparent;
|
||
border: 0.5px solid var(--df-border);
|
||
border-radius: var(--df-radius);
|
||
padding: 8px 16px;
|
||
font-size: 13px;
|
||
cursor: pointer;
|
||
color: var(--df-text);
|
||
transition: background 0.15s;
|
||
margin-top: 1rem;
|
||
}
|
||
|
||
.btn-demo:hover {
|
||
background: var(--df-bg-raised);
|
||
}
|
||
|
||
/* 代码块 */
|
||
code {
|
||
font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
|
||
font-size: 12px;
|
||
background: var(--df-bg-raised);
|
||
padding: 2px 6px;
|
||
border-radius: 4px;
|
||
color: var(--df-accent);
|
||
}
|
||
|
||
/* 主题切换 */
|
||
.theme-toggle {
|
||
position: fixed;
|
||
top: 1rem;
|
||
right: 1rem;
|
||
background: var(--df-bg-card);
|
||
border: 0.5px solid var(--df-border);
|
||
border-radius: var(--df-radius);
|
||
padding: 8px;
|
||
cursor: pointer;
|
||
color: var(--df-text-secondary);
|
||
transition: all 0.15s;
|
||
z-index: 100;
|
||
}
|
||
|
||
.theme-toggle:hover {
|
||
background: var(--df-bg-raised);
|
||
color: var(--df-text);
|
||
}
|
||
|
||
/* 标签 */
|
||
.tag {
|
||
display: inline-block;
|
||
padding: 2px 8px;
|
||
border-radius: var(--df-radius-sm);
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
margin-left: 0.5rem;
|
||
}
|
||
|
||
.tag-purple {
|
||
background: var(--df-accent-bg);
|
||
color: var(--df-accent);
|
||
}
|
||
|
||
.tag-teal {
|
||
background: var(--df-success-bg);
|
||
color: var(--df-success);
|
||
}
|
||
|
||
.tag-amber {
|
||
background: var(--df-warning-bg);
|
||
color: var(--df-warning);
|
||
}
|
||
|
||
.tag-coral {
|
||
background: var(--df-danger-bg);
|
||
color: var(--df-danger);
|
||
}
|
||
|
||
/* 流程演示 */
|
||
.flow-demo {
|
||
background: var(--df-bg-raised);
|
||
border: 0.5px solid var(--df-border);
|
||
border-radius: var(--df-radius);
|
||
padding: 1rem;
|
||
margin: 1rem 0;
|
||
}
|
||
|
||
/* 响应式 */
|
||
@media (max-width: 640px) {
|
||
body {
|
||
padding: 1rem;
|
||
}
|
||
|
||
h1 {
|
||
font-size: 24px;
|
||
}
|
||
|
||
h2 {
|
||
font-size: 18px;
|
||
}
|
||
}
|
||
|
||
/* 代码块容器 */
|
||
.code-block {
|
||
background: var(--df-bg-raised);
|
||
border: 0.5px solid var(--df-border);
|
||
border-radius: var(--df-radius);
|
||
padding: 1rem;
|
||
margin: 1rem 0;
|
||
overflow-x: auto;
|
||
}
|
||
|
||
.code-block pre {
|
||
margin: 0;
|
||
font-size: 12px;
|
||
color: var(--df-text);
|
||
}
|
||
|
||
.code-block code {
|
||
background: none;
|
||
padding: 0;
|
||
color: inherit;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<button class="theme-toggle" id="themeToggle" title="切换主题">
|
||
<i class="ti ti-moon"></i>
|
||
</button>
|
||
|
||
<h1>🚀 DevFlow 使用手册</h1>
|
||
<p style="margin-bottom: 2rem">"本地优先的个人创作流程驾驶舱"</p>
|
||
|
||
<!-- Mermaid 流程图 -->
|
||
<div class="flow-demo">
|
||
<h3 style="font-size: 14px; margin-bottom: 1rem;">核心流程</h3>
|
||
<div style="text-align: center; margin-bottom: 1rem;">
|
||
<p style="font-size: 12px; color: var(--df-text-dim); margin-bottom: 0.5rem;">想法到创作成果的完整链路</p>
|
||
</div>
|
||
<div class="code-block">
|
||
<pre><code>想法池 → 对抗评估 → 创作（代码/文档/PPT） → 发布/分享</code>
|
||
</pre>
|
||
</div>
|
||
<div style="display: flex; justify-content: center; gap: 1rem; margin-top: 1rem;">
|
||
<span class="tag tag-purple">评估</span>
|
||
<span class="tag tag-teal">创作</span>
|
||
<span class="tag tag-amber">执行</span>
|
||
<span class="tag tag-coral">发布</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 快速开始 -->
|
||
<div class="card">
|
||
<h2>🏃 快速开始</h2>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">💻</span>
|
||
<div class="feature-text">
|
||
<strong>运行应用</strong><br>
|
||
<code>bun install</code><br>
|
||
<code>bun run tauri dev</code>
|
||
</div>
|
||
</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">💡</span>
|
||
<div class="feature-text">
|
||
<strong>一句话功能</strong><br>
|
||
你的创作流程，本地跑，AI 辅助，数据不出门
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 核心价值链 -->
|
||
<div class="card">
|
||
<h2>🎯 核心价值链</h2>
|
||
<p style="font-weight: 500; margin-bottom: 1rem;">想法 → 评估 → 创作 → 发布</p>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">💡</span>
|
||
<div class="feature-text">
|
||
<strong>想法管理</strong><br>
|
||
收集、分类、评估创作想法<br>
|
||
支持多种类型的创作灵感
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">⚖️</span>
|
||
<div class="feature-text">
|
||
<strong>对抗评估</strong><br>
|
||
正方观点 + 反方观点 + 分析师建议<br>
|
||
确保创作质量和价值
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🎨</span>
|
||
<div class="feature-text">
|
||
<strong>创作执行</strong><br>
|
||
代码、文档、PPT 等多种创作形式<br>
|
||
AI 辅助和模板支持
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">📤</span>
|
||
<div class="feature-text">
|
||
<strong>发布分享</strong><br>
|
||
多格式导出、版本管理<br>
|
||
一键发布到各平台
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 功能模块 -->
|
||
<div class="card">
|
||
<h2>📋 功能模块</h2>
|
||
<p style="font-size: 12px; color: var(--df-text-dim); margin-bottom: 1rem;">聚焦核心，拒绝过设计</p>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🤖</span>
|
||
<div class="feature-text">
|
||
<strong>AI Chat</strong><br>
|
||
单 Provider 简化配置<br>
|
||
工具调用：代码生成、文件操作、Git 操作<br>
|
||
流式响应：实时输出
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">💡</span>
|
||
<div class="feature-text">
|
||
<strong>想法池</strong><br>
|
||
轻量版：聚焦核心<br>
|
||
预留对抗评估：后续升级
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">📂</span>
|
||
<div class="feature-text">
|
||
<strong>项目管理</strong><br>
|
||
多项目支持<br>
|
||
与 Git 分支联动
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">📚</span>
|
||
<div class="feature-text">
|
||
<strong>知识库（收藏夹）</strong><br>
|
||
静态收集：个人经验碎片<br>
|
||
分类管理：审查规则、Prompt 模板、踩坑经验
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">⚙️</span>
|
||
<div class="feature-text">
|
||
<strong>设置</strong><br>
|
||
AI 配置：Provider、模型选择<br>
|
||
通用设置：主题、语言
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 特色功能 -->
|
||
<div class="card">
|
||
<h2>🌟 特色功能</h2>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🏠</span>
|
||
<div class="feature-text">
|
||
<strong>本地优先</strong><br>
|
||
SQLite 本地数据库<br>
|
||
基础功能离线可用<br>
|
||
代码不出本地
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">⚡</span>
|
||
<div class="feature-text">
|
||
<strong>实时监控</strong><br>
|
||
WebSocket 实时更新<br>
|
||
工作流执行进度<br>
|
||
错误原因分析
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🔧</span>
|
||
<div class="feature-text">
|
||
<strong>工作流节点</strong><br>
|
||
Script：执行 Shell 命令<br>
|
||
Human：人工审批<br>
|
||
Condition：条件判断<br>
|
||
Parallel：并行执行
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 使用场景 -->
|
||
<div class="card">
|
||
<h2>🎨 界面说明</h2>
|
||
|
||
<div class="section-title">颜色系统</div>
|
||
<div style="display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1rem;">
|
||
<div style="display: flex; align-items: center; gap: 0.5rem;">
|
||
<span style="width: 16px; height: 16px; background: var(--df-accent); border-radius: 4px;"></span>
|
||
<span style="font-size: 12px;">紫色（主色）</span>
|
||
</div>
|
||
<div style="display: flex; align-items: center; gap: 0.5rem;">
|
||
<span style="width: 16px; height: 16px; background: var(--df-success); border-radius: 4px;"></span>
|
||
<span style="font-size: 12px;">青绿（成功）</span>
|
||
</div>
|
||
<div style="display: flex; align-items: center; gap: 0.5rem;">
|
||
<span style="width: 16px; height: 16px; background: var(--df-warning); border-radius: 4px;"></span>
|
||
<span style="font-size: 12px;">琥珀（警告）</span>
|
||
</div>
|
||
<div style="display: flex; align-items: center; gap: 0.5rem;">
|
||
<span style="width: 16px; height: 16px; background: var(--df-danger); border-radius: 4px;"></span>
|
||
<span style="font-size: 12px;">珊瑚（危险）</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-title">图标含义</div>
|
||
<div style="display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1rem;">
|
||
<span style="font-size: 14px;">📋 待开始</span>
|
||
<span style="font-size: 14px;">🔨 进行中</span>
|
||
<span style="font-size: 14px;">👀 待审查</span>
|
||
<span style="font-size: 14px;">✅ 已合并</span>
|
||
<span style="font-size: 14px;">🗑️ 已废弃</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 注意事项 -->
|
||
<div class="card">
|
||
<h2>⚠️ 注意事项</h2>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🔗</span>
|
||
<div class="feature-text">
|
||
<strong>Git 集成</strong><br>
|
||
必须初始化 Git 仓库<br>
|
||
配置用户邮箱和姓名<br>
|
||
保持分支命名规范
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🔌</span>
|
||
<div class="feature-text">
|
||
<strong>AI 配置</strong><br>
|
||
需要有效的 API Key<br>
|
||
检查网络连接<br>
|
||
关注 Token 使用量
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">⚙️</span>
|
||
<div class="feature-text">
|
||
<strong>工作流设计</strong><br>
|
||
避免长时间阻塞操作<br>
|
||
设置合理的超时时间<br>
|
||
保留人工干预接口
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 更新日志 -->
|
||
<div class="card">
|
||
<h2>🔄 更新日志</h2>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">✅</span>
|
||
<div class="feature-text">
|
||
<strong>v1.0 (2026-06-11)</strong><br>
|
||
完成核心功能<br>
|
||
任务管理系统<br>
|
||
工作流引擎<br>
|
||
AI Chat 集成<br>
|
||
本地数据存储
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🔄</span>
|
||
<div class="feature-text">
|
||
<strong>计划功能</strong><br>
|
||
想法对抗式评估<br>
|
||
更多工作流节点<br>
|
||
团队协作功能
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 配置指南 -->
|
||
<div class="card">
|
||
<h2>⚙️ 配置指南</h2>
|
||
|
||
<div class="section-title">AI 配置</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🤖</span>
|
||
<div class="feature-text">
|
||
<strong>Provider 设置</strong><br>
|
||
支持 OpenAI、Anthropic、DeepSeek<br>
|
||
配置 API Key 和模型选择
|
||
</div>
|
||
</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">⚙️</span>
|
||
<div class="feature-text">
|
||
<strong>高级参数</strong><br>
|
||
Temperature: 0-2（创造性）<br>
|
||
Max Tokens: 限制回答长度
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-title">Git 集成</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🔗</span>
|
||
<div class="feature-text">
|
||
<strong>基础配置</strong><br>
|
||
git config user.name/email<br>
|
||
自动分支创建：feature/任务名
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-title">工作流配置</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🔄</span>
|
||
<div class="feature-text">
|
||
<strong>节点类型</strong><br>
|
||
script: Shell 命令<br>
|
||
human: 人工审批<br>
|
||
condition: 条件判断
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 常见问题 -->
|
||
<div class="card">
|
||
<h2>❓ 常见问题</h2>
|
||
|
||
<div class="section-title">安装启动</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🚀</span>
|
||
<div class="feature-text">
|
||
<strong>无法启动</strong><br>
|
||
检查 Node.js >= 18<br>
|
||
bun clean + bun install<br>
|
||
确认端口 1420 可用
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-title">功能使用</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">💡</span>
|
||
<div class="feature-text">
|
||
<strong>任务不显示</strong><br>
|
||
确认选中项目<br>
|
||
刷新页面<br>
|
||
查看控制台错误
|
||
</div>
|
||
</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🤖</span>
|
||
<div class="feature-text">
|
||
<strong>AI 无响应</strong><br>
|
||
检查 API Key<br>
|
||
确认网络连接<br>
|
||
切换 Provider 测试
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-title">数据管理</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">💾</span>
|
||
<div class="feature-text">
|
||
<strong>存储位置</strong><br>
|
||
Windows: %APPDATA%\devflow\ <br>
|
||
macOS: ~/Library/Application Support/devflow/ <br>
|
||
Linux: ~/.config/devflow/
|
||
</div>
|
||
</div>
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🔧</span>
|
||
<div class="feature-text">
|
||
<strong>数据备份</strong><br>
|
||
备份数据库：cp devflow.db backup/ <br>
|
||
备份配置：cp config.json backup/
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 核心原则 -->
|
||
<div class="card">
|
||
<h2>💡 产品哲学</h2>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">🎯</span>
|
||
<div class="feature-text">
|
||
<strong>聚焦核心</strong><br>
|
||
不是全流程操作系统<br>
|
||
专注于本地任务流程<br>
|
||
简单、实用、可靠
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-row">
|
||
<span class="feature-icon">👨💻</span>
|
||
<div class="feature-text">
|
||
<strong>开发者第一</strong><br>
|
||
功能设计以开发者需求为中心<br>
|
||
避免过工程化的设计<br>
|
||
保留必要的扩展性
|
||
</div>
|
||
</div>
|
||
|
||
<button class="btn-demo" onclick="window.location.href='https://github.com/your-repo/devflow'">
|
||
🚀 开始使用 DevFlow
|
||
</button>
|
||
</div>
|
||
|
||
<script>
|
||
// 主题切换
|
||
const themeToggle = document.getElementById('themeToggle');
|
||
const html = document.documentElement;
|
||
|
||
// 检查本地存储的主题
|
||
const currentTheme = localStorage.getItem('theme') || 'dark';
|
||
html.setAttribute('data-theme', currentTheme);
|
||
|
||
themeToggle.addEventListener('click', () => {
|
||
const newTheme = html.getAttribute('data-theme') === 'dark' ? 'light' : 'dark';
|
||
html.setAttribute('data-theme', newTheme);
|
||
localStorage.setItem('theme', newTheme);
|
||
});
|
||
|
||
// 模拟 Tabler Icons（实际项目中需要引入）
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
// 创建图标映射
|
||
const icons = {
|
||
'ti-moon': '🌙',
|
||
'ti-sun': '☀️',
|
||
'ti-home': '🏠',
|
||
'ti-settings': '⚙️',
|
||
'ti-chart-bar': '📊',
|
||
'ti-calendar': '📅',
|
||
'ti-star': '⭐',
|
||
'ti-bolt': '⚡',
|
||
'ti-brain': '🧠',
|
||
'ti-arrow-right': '→'
|
||
};
|
||
|
||
// 替换图标
|
||
document.querySelectorAll('.ti').forEach(icon => {
|
||
const iconClass = icon.className.split(' ')[1];
|
||
if (icons[iconClass]) {
|
||
icon.textContent = icons[iconClass];
|
||
}
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |