# ppmt2

**Repository Path**: pipi2002/ppmt2

## Basic Information

- **Project Name**: ppmt2
- **Description**: 泡泡玛特2
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-10
- **Last Updated**: 2025-11-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 🎈 泡泡玛特电商平台

一个面向 POP MART（泡泡玛特）爱好者的、以内容资讯为特色的轻量级电商与收藏管理平台。

## ✨ 项目特色

### 核心亮点：内容驱动型电商
- **边看边买**：在资讯详情页直接展示相关商品，用户可以一键跳转购买
- **社区互动**：用户可以分享收藏、交流心得，关联商品展示
- **收藏图鉴**：游戏化的收集进度系统，激励用户完成收藏

## 🎨 设计系统

**主题：** "Bubbleverse Dreamland" (泡泡宇宙梦乐园)

**色彩方案：**
- 主色：#C4B5FD (梦幻紫)
- 辅色：#FBCFE8 (泡泡粉)
- 点缀色：#A7F3D0 (薄荷绿)

## 🚀 技术栈

- **前端框架：** Vue 3 (Composition API)
- **UI 组件库：** Element Plus 2.11.2
- **样式方案：** Tailwind CSS
- **路由管理：** Vue Router
- **状态管理：** Pinia
- **HTTP 请求：** Axios
- **构建工具：** Vite
- **Mock 数据：** vite-plugin-mock

## 📦 功能模块

### 1. 首页
- 🎠 轮播图展示
- 🔥 热门系列推荐
- 📰 最新资讯
- 🚀 快捷入口

### 2. 商品中心
- 商品列表（搜索、排序、分页）
- 商品详情（系列款式、隐藏款标识）
- 收藏功能
- 购物车快速添加

### 3. 泡泡资讯 【核心亮点】
- 资讯列表（分类筛选）
- 资讯详情（**文内商品关联**）
- 点赞、收藏、分享

### 4. 泡泡社区
- 社区首页（话题筛选）
- 发布帖子（图片上传、话题标签、商品关联）
- 帖子详情（评论互动）
- 用户主页（关注系统）

### 5. 购物车与结算
- 购物车管理
- 4步结算流程
- 地址管理
- 支付方式选择

### 6. 个人中心
- 个人信息展示
- 我的收藏（收集进度）
- 我的订单
- 账户设置

### 7. 用户认证
- 登录/注册
- 表单验证
- 会话管理

## 🛠️ 开发指南

### 安装依赖

\`\`\`bash
npm install
\`\`\`

### 启动开发服务器

\`\`\`bash
npm run dev
\`\`\`

访问 http://localhost:5173

### 构建生产版本

\`\`\`bash
npm run build
\`\`\`

### 预览生产构建

\`\`\`bash
npm run preview
\`\`\`

## 📁 项目结构

\`\`\`
src/
├── assets/              # 静态资源
│   └── styles/         # 全局样式
├── components/         # 组件
│   ├── common/         # 通用组件
│   └── layout/         # 布局组件
├── views/              # 页面组件
├── router/             # 路由配置
├── stores/             # Pinia 状态管理
├── api/                # API 接口
├── utils/              # 工具函数
├── App.vue
└── main.js
\`\`\`

## 🎯 核心功能演示

### 1. 内容电商体验
1. 访问首页 → 点击"最新资讯"
2. 进入资讯详情页
3. 查看文章下方的"相关商品"
4. 点击商品卡片 → 跳转到商品详情
5. 或直接点击"加入购物车"

### 2. 社区互动
1. 访问"泡泡社区"
2. 点击"发帖"按钮
3. 填写内容、上传图片、选择话题
4. 关联相关商品
5. 发布后其他用户可以看到关联的商品

### 3. 收藏图鉴
1. 登录后访问"个人中心"
2. 查看"我的收藏"
3. 查看收集进度条
4. 继续收集完成图鉴

## 💡 特色功能说明

### 文内商品关联
这是项目的最大亮点！在资讯详情页和社区帖子中，可以直接展示相关商品：
- 用户阅读内容时可以直接看到相关商品
- 点击商品卡片跳转到详情页
- 支持直接加入购物车
- 实现"边看边买"的购物体验

### 收集进度系统
- 游戏化的收集体验
- 进度条显示收集完成度
- 激励用户完成收藏

### 社区互动
- 用户可以分享收藏心得
- 支持图片上传
- 话题标签分类
- 关联商品展示

## 📝 开发说明

### 数据模拟
项目使用 Pinia Store 中的模拟数据，实际开发中需要：
1. 替换为真实的 API 接口
2. 实现图片上传功能
3. 完善支付流程
4. 添加更多的数据验证

### 待完善功能
- [ ] 图片上传（目前为模拟）
- [ ] 真实支付集成
- [ ] 评论系统完善
- [ ] 搜索功能增强
- [ ] 消息通知系统
- [ ] 更多的数据统计

## 🎨 设计理念

1. **内容驱动**：通过优质内容吸引用户，自然引导购买
2. **社区互动**：用户之间的交流增强平台粘性
3. **游戏化**：收集进度、徽章系统激励用户
4. **简洁美观**：梦幻主题色，圆角设计，流畅动画

## 📄 License

MIT

## 👥 贡献

欢迎提交 Issue 和 Pull Request！

---

Made with ❤️ for POP MART fans