1.9 KiB
1.9 KiB
快速启动指南
🎉 新增功能
已成功为您的智能运维管理系统添加了两个全新的对外页面:
✅ 已完成的工作
-
官网首页 (
/#/home)- 现代化的 UI 设计
- 功能特性展示(6 个核心功能)
- 数据中心关键指标
- 响应式布局
-
帮助中心 (
/#/help)- 常见问题 FAQ
- 使用指南分类
- 操作手册下载
- 联系方式展示
-
登录页面优化
- 添加"访问官网首页"按钮
-
路由配置
- 无需登录即可访问
- 独立布局(无侧边栏)
- 根路径自动重定向到首页
🚀 立即查看效果
方式一:直接访问 URL
在浏览器中访问:
http://localhost:5173/#/home
http://localhost:5173/#/help
方式二:从登录页跳转
访问登录页面,点击右上角的"首页"图标即可跳转到官网首页。
📝 下一步自定义建议
1. 修改 Logo
替换 src/assets/logo.svg 文件为您公司的 logo
2. 更新联系信息
编辑以下文件中的联系方式:
src/views/home/index.vue- 页脚联系方式src/views/help/index.vue- 联系我们板块
3. 添加真实的帮助文档
编辑 src/views/help/index.vue 中的:
const faqs = ref([...]) // 常见问题
const guides = ref([...]) // 使用指南
const manuals = ref([...]) // 操作手册
4. 调整配色方案
页面使用了 Arco Design 主题色,可以通过 CSS 变量调整:
rgb(var(--primary-6)) // 主色调
💡 提示
- 所有页面都已经适配移动端,可以在手机上查看效果
- 页面使用了 Vue Router 的 hash 模式,部署简单
- 无需后端支持,纯静态页面,可直接部署
📦 技术栈
- Vue 3 + TypeScript
- Arco Design 组件库
- Vite 构建工具
- Vue Router 路由管理
享受您的新页面!🎊