Repos / peace-lab-global / pig-meditation OWN

pig-meditation

🌿「静心屿」冥想小程序管理后台

🌿「静心屿」冥想小程序管理后台

🎯 项目概述

这是一个专为「静心屿」冥想小程序打造的专业内容管理后台系统,采用现代化技术栈构建,致力于为运营人员提供宁静高效的管理体验。

🏗️ 技术架构

前端技术栈

  • 框架: Vue 3.4 + TypeScript + Vite 5
  • 状态管理: Pinia + persist-plugin
  • 路由: Vue Router 4(含权限校验)
  • UI组件: Element Plus 深度定制
  • 图表: ECharts 5
  • 构建优化: vite-plugin-compression + CDN

后端技术栈

  • 框架: NestJS 10 + TypeScript
  • 数据库: MySQL 8.0 + TypeORM
  • 存储: 阿里云OSS + 媒体处理
  • 安全: JWT + RBAC权限模型
  • 部署: Docker-compose

🚀 快速启动

1. 环境准备

# 复制环境配置文件
cp .env.example .env

# 配置必要参数
# OSS_BUCKET, JWT_SECRET, DB_HOST, ADMIN_DEFAULT_PWD

2. 启动服务

# 一键启动所有服务
docker-compose up -d

# 访问地址
http://localhost:80

3. 默认登录信息

  • 用户名: admin
  • 密码: quiet@Admin2024

📁 项目结构

mocici-miniapp/
├── backend/              # NestJS 后端服务
│   ├── src/
│   │   ├── auth/         # 认证模块 (JWT)
│   │   ├── users/        # 用户管理
│   │   ├── courses/      # 课程管理
│   │   ├── articles/     # 文章管理
│   │   ├── common/       # 公共模块 (Guards/Filters/Decorators)
│   │   └── database/     # 迁移与种子数据
│   ├── ormconfig.ts
│   └── Dockerfile
├── frontend/             # Vue 3 前端应用
│   ├── src/
│   │   ├── api/          # API 接口封装
│   │   ├── components/   # 公共组件
│   │   ├── composables/  # 组合式函数
│   │   ├── views/        # 页面组件
│   │   ├── store/        # Pinia 状态管理
│   │   ├── router/       # 路由配置
│   │   ├── types/        # TypeScript 类型定义
│   │   ├── utils/        # 工具函数
│   │   └── styles/       # 全局样式
│   ├── vite.config.ts
│   └── Dockerfile
├── nginx/                # 反向代理配置
├── docs/                 # 项目文档
├── docker-compose.yml    # 容器编排
└── README.md             # 项目文档

mocici-miniapp/
├── backend/ # NestJS后端服务
│ ├── src/
│ │ ├── auth/ # 认证模块
│ │ ├── courses/ # 课程管理
│ │ ├── articles/ # 文章管理
│ │ ├── users/ # 用户管理
│ │ └── common/ # 公共模块
│ └── ormconfig.ts
├── frontend/ # Vue3前端应用
│ ├── src/
│ │ ├── views/ # 页面组件
│ │ ├── components/ # 公共组件
│ │ ├── store/ # 状态管理
│ │ └── router/ # 路由配置
├── docker-compose.yml # 容器编排
└── README.md # 项目文档


## 🌸 核心功能

### 🔒 权限管理体系
- 超级管理员 / 内容编辑 / 数据查看员三级权限
- 动态菜单渲染
- 操作日志审计

### 🎧 音视频课程管理
- 拖拽上传 + OSS实时进度显示
- 自动媒体转码处理
- 场景分类与引导语速设置
- 状态流转:草稿 → 审核中 → 已发布 → 已下架

### 📖 文章内容管理
- Quill富文本编辑器定制版
- 智能摘要生成功能
- 水墨风格水印处理

### 📊 数据静观台
- 实时数据看板
- 课程播放热力图
- 用户活跃趋势分析

## 🎨 设计理念

### 色彩体系
- **主色调**: #5A8F7B(竹青)- 代表宁静与成长
- **辅助色**: #F8F9FA(雾白)- 营造纯净空间
- **警示色**: #F5A623(暖橙)- 温和提醒替代刺眼红

### 交互体验
- 呼吸式骨架屏加载动画
- 柔滑的操作反馈动效
- 防抖节流优化性能

## 🔧 开发指南

### 本地开发环境
```bash
# 后端开发
cd backend
npm install
npm run start:dev

# 前端开发
cd frontend
npm install
npm run dev

代码规范

  • TypeScript 严格模式(前后端均已启用)
  • ESLint + Prettier 统一代码格式
  • 前后端独立 lint 配置,支持 npm run lint 一键检查
  • Vue 3 Composition API + setup 语法
  • NestJS 模块化架构 + DTO 校验

🛡️ 安全特性

  • JWT Token认证机制
  • RBAC角色权限控制
  • XSS攻击防护
  • SQL注入防范
  • 操作日志完整记录

🌿 运营心法

每日清晨发布新课程,如晨露滋养用户心灵

让技术成为宁静的容器,为运营者打造数字禅房般的管理体验。

📚 文档导航

文档 说明
部署指南 Docker Compose 部署与环境配置
API 文档 RESTful API 接口说明
架构设计 系统架构、模块划分、数据流
数据库设计 表结构、字段说明、枚举值
前端开发 组件、工具函数、路由权限
错误码规范 错误码定义与处理策略
环境变量 .env 配置项详细说明
CHANGELOG 版本变更日志
CONTRIBUTING 开发贡献指南
docs/ 全链路开发、发布、运维、运营文档

愿每一次内容发布,都能为用户带来内心的平静