取消跟踪IDE与AI缓存目录

This commit is contained in:
小潘
2026-06-29 09:35:00 +08:00
parent c56f65898b
commit f02e6555af
3 changed files with 0 additions and 175 deletions
-10
View File
@@ -1,10 +0,0 @@
{
"permissions": {
"allow": [
"Bash(npm install *)",
"Bash(npx vite *)",
"Bash(npx tailwindcss *)",
"Bash(timeout 10)"
]
}
}
-2
View File
@@ -1,2 +0,0 @@
{
}
@@ -1,163 +0,0 @@
# 产品营销网站设计文档
## 概述
为广西职业院校提供教育信息化产品的营销推广网站。纯前端静态站点,部署到 EdgeOne,域名 `https://products.2009xc.com/`
## 技术栈
- **构建工具**Vite
- **框架**React 18 + React Router v6
- **样式**Tailwind CSS v3 + CSS 变量(主题色切换)
- **部署**:静态文件,EdgeOne CDN
## 页面结构
### 路由设计
| 路由 | 页面 | 说明 |
|------|------|------|
| `/` | 首页 | Hero区 + 产品概览 + 信任背书 + 新闻动态 |
| `/product/:slug` | 产品详情页 | 通用模板,根据slug加载产品数据 |
| `/contact` | 联系我们/成为代理商 | 代理优势 + 申请表单 + 联系方式 |
### 目录结构
```
website
/
├── public/ # 静态资源
├── src/
│ ├── components/
│ │ ├── Navbar.jsx # 顶部导航栏(固定、响应式汉堡菜单)
│ │ ├── Footer.jsx # 页脚
│ │ ├── HeroSection.jsx # 首页Hero大图区
│ │ ├── ProductCard.jsx # 产品概览卡片
│ │ ├── TrustSection.jsx # 信任背书区(Logo墙+评价+数据)
│ │ ├── NewsSection.jsx # 新闻动态区
│ │ ├── DemoSection.jsx # 演示体验模块(网址+二维码+账号密码)
│ │ ├── ContactForm.jsx # 代理商申请表单
│ │ └── ThemeProvider.jsx# 主题色上下文(CSS变量切换)
│ ├── pages/
│ │ ├── Home.jsx
│ │ ├── ProductPage.jsx # 通用产品详情页模板
│ │ └── Contact.jsx
│ ├── data/
│ │ └── products.js # 产品数据配置
│ ├── App.jsx
│ └── main.jsx
├── index.html
├── tailwind.config.js
├── vite.config.js
└── package.json
```
## 首页设计
### 1. 导航栏
- 公司Logo(左)+ 产品菜单(下拉展示所有产品)+ "联系我们"按钮(右)
- 滚动后固定顶部,添加阴影
- 移动端折叠为汉堡菜单
### 2. Hero 大图区
- 全屏渐变背景(深蓝→蓝紫渐变)
- 公司标语:"智慧教育,赋能未来"(示例)
- 副标题:一句话描述公司使命
- CTA按钮:"了解我们的产品"
### 3. 产品概览区
- 2×3 网格卡片布局
- 每张卡片:SVG图标 + 产品名称 + 一句话简介 + "了解更多"按钮
- hover效果:上浮+阴影增强
### 4. 信任背书区
- 合作院校Logo墙(示例占位)
- 关键数据统计:"服务100+所院校"、"覆盖50万+师生"(示例)
- 客户评价轮播
### 5. 新闻动态区
- 3-4条最新动态卡片(标题+摘要+日期)
- 示例占位内容
### 6. 页脚
- 公司信息 + 联系方式 + 版权 + 备案号
## 产品详情页设计
通过URL参数 `/product/:slug``products.js` 加载数据,所有产品共享同一模板。
### 页面结构(从上到下)
1. **产品头部** — 全宽渐变背景(产品主题色),产品名称 + Slogan + 产品截图/插画
2. **核心价值** — 3-4个价值点(图标+标题+描述),营销化文案
3. **功能亮点** — 左右交替布局,图文并茂,每个功能一个区块
4. **应用场景** — 针对职业院校的实际使用场景
5. **演示体验模块** — 演示网址(可点击)+ 二维码(SVG占位)+ 体验账号密码(卡片)
6. **其他产品推荐** — "您可能还感兴趣"卡片
7. **CTA** — "立即联系我们"按钮
## 主题色系统
通过 CSS 变量 + ThemeProvider 上下文实现每个产品页面的主题色切换。
| 产品 | slug | 主题色 | 色值 |
|------|------|--------|------|
| 智慧校园管理平台 | smart-campus | 蓝色 | #2563EB |
| 实习实训管理平台 | internship | 绿色 | #059669 |
| 教学资源管理平台 | teaching-resource | 紫色 | #7C3AED |
| 考试测评系统 | exam-system | 橙色 | #EA580C |
| 就业服务平台 | career-service | 青色 | #0891B2 |
导航栏和页脚使用公司统一配色(深色),不受产品主题色影响。
## 联系我们/成为代理商页面
1. **代理优势区** — 4-6个加盟优势卡片(政策支持、培训赋能、丰厚回报、品牌背书等)
2. **代理流程** — 横向步骤条:咨询 → 签约 → 培训 → 开业
3. **在线申请表单** — 姓名、公司名称、联系电话、邮箱、所在地区、代理意向产品(下拉)、备注
4. **联系方式区** — 电话、邮箱、地址、微信公众号二维码
表单仅做前端验证,展示提交成功提示(无后端处理)。
## 响应式断点
- **桌面端** ≥1024px:完整布局,双栏图文交替
- **平板端** 768-1023px:间距调整,卡片2列
- **移动端** <768px:单栏,汉堡菜单
## 设计风格
- 科技感/现代风,参考阿里云/腾讯云产品页风格
- 大色块渐变、圆角卡片、适当的阴影和动效
- 中文排版,适合中国用户习惯
- SVG图标和装饰元素增加美观
- 文案以营销宣传为主,不深入技术细节
## 产品数据结构
```js
// src/data/products.js
{
slug: 'smart-campus',
name: '校企益邦',
slogan: '数字化管理,让校园更智慧',
themeColor: '#2563EB',
icon: '...', // SVG图标组件名
brief: '...', // 一句话简介(首页卡片用)
values: [...], // 核心价值点
features: [...], // 功能亮点
scenarios: [...], // 应用场景
demo: {
url: '...',
qrCode: '...', // 二维码图片路径
account: '...',
password: '...'
}
}
```
## 部署
- `vite build` 输出到 `website/dist/`
- 上传到 EdgeOne,绑定域名 `products.2009xc.com`
- Vite 配置 `base: '/'`