Back_end_Management_System/book-admin/项目结构说明.md

后台管理系统项目结构说明

📁 项目结构

book/
├── src/main/java/com/yu/book/
│   ├── admin/                          # 后台管理模块
│   │   ├── controller/
│   │   │   ├── AdminController.java    # 管理员登录控制器
│   │   │   └── AdminBookController.java # 书籍管理控制器
│   │   ├── service/
│   │   │   ├── AdminService.java       # 管理员服务
│   │   │   └── AdminBookService.java   # 书籍管理服务
│   │   ├── dto/
│   │   │   ├── AdminLoginDTO.java      # 登录DTO
│   │   │   └── BookManageDTO.java      # 书籍管理DTO
│   │   ├── vo/
│   │   │   ├── AdminLoginVO.java       # 登录VO
│   │   │   └── AdminBookVO.java        # 书籍管理VO
│   │   ├── interceptor/
│   │   │   └── AdminInterceptor.java   # 权限拦截器
│   │   └── config/
│   │       └── AdminWebConfig.java     # Web配置
│   └── ...
├── src/main/resources/
│   ├── db/
│   │   └── admin_schema.sql            # 数据库脚本
│   └── mapper/
│       └── BookMapper.xml              # 书籍Mapper XML
└── book-admin/                         # 前端项目目录
    ├── src/main/resources/static/      # 静态资源目录
    │   ├── pages/
    │   │   ├── login.html              # 登录页面
    │   │   ├── books.html              # 书籍管理页面
    │   │   └── test-connection.html    # 连接测试页面
    │   └── utils/
    │       └── api.js                  # API接口文件
    ├── package.json                    # npm配置文件
    ├── README.md                       # 说明文档
    ├── 启动指南.md                     # 启动指南
    ├── 完整功能说明.md                 # 功能说明
    └── 快速启动.md                     # 快速启动

🎯 文件说明

后端文件

Controller层

• AdminController.java - 管理员登录控制器
• AdminBookController.java - 书籍管理控制器

Service层

• AdminService.java - 管理员服务（登录验证）
• AdminBookService.java - 书籍管理服务（增删改查、上架下架）

DTO和VO

• AdminLoginDTO.java - 管理员登录DTO
• AdminLoginVO.java - 管理员登录VO
• BookManageDTO.java - 书籍管理DTO
• AdminBookVO.java - 书籍管理VO

权限控制

• AdminInterceptor.java - 管理员权限拦截器
• AdminWebConfig.java - Web配置（注册拦截器）

前端文件

页面

• login.html - 登录页面
• books.html - 书籍管理页面
• test-connection.html - 连接测试页面

工具类

• api.js - API接口文件（统一请求方法、所有API接口）

配置文件

• package.json - npm配置文件（启动脚本、依赖配置）

🔧 配置文件

package.json

{
  "scripts": {
    "dev": "http-server src/main/resources/static -p 8000 -o",
    "start": "http-server src/main/resources/static -p 8000 -o",
    "serve": "http-server src/main/resources/static -p 8000"
  }
}

api.js

const BASE_URL = 'http://localhost:8081'

🚀 启动方式

方式1：使用npm（推荐）

cd book-admin
npm install
npm run dev

方式2：使用Python

cd book-admin/src/main/resources/static
python -m http.server 8000

方式3：使用Node.js

cd book-admin/src/main/resources/static
npx http-server -p 8000

📝 访问地址

• 登录页面：http://localhost:8000/pages/login.html
• 书籍管理页面：http://localhost:8000/pages/books.html（需要登录）
• 连接测试页面：http://localhost:8000/pages/test-connection.html

🔐 权限控制

后端权限控制

• 所有 /api/admin/** 接口都需要token
• 登录接口 /api/admin/login 不需要token
• 权限拦截器验证token，如果无效返回401错误

前端权限控制

• 登录页面检查是否已登录，如果已登录跳转到书籍管理页面
• 书籍管理页面检查token，如果token不存在跳转到登录页面

📊 数据库表

users表

• 添加 role 字段（admin-管理员，user-普通用户）
• 默认管理员账号：admin / admin123

books表

• 包含书籍的所有字段
• 支持状态管理（status：0-下架，1-上架）

🎨 前端技术

• Vue.js 3（通过CDN引入）
• Fetch API（用于HTTP请求）
• HTML5 + CSS3
• 响应式设计

🔄 数据流

1. 用户登录 → 后端验证 → 返回token
2. 前端保存token → 后续请求携带token
3. 后端拦截器验证token → 允许或拒绝请求
4. 前端显示数据 → 用户操作 → 更新数据

📌 注意事项

1. 后端服务必须启动：前端依赖后端服务（端口8081）
2. 使用本地服务器：不要直接双击HTML文件
3. Token管理：Token保存在localStorage中
4. API地址：前端API地址配置在 utils/api.js 中
5. CORS配置：后端已配置CORS，允许跨域请求