Files
hzdyjs/mobile/README.md
T
2025-06-26 18:30:03 +08:00

3.5 KiB
Raw Blame History

校园管理移动端

基于 uniapp + uView UI 构建的校园管理移动端应用。

项目特性

  • 🚀 基于 uniapp 框架,支持多端部署
  • 🎨 采用 uView UI 组件库,界面美观
  • 📱 响应式设计,适配各种屏幕尺寸
  • 🔐 完整的登录认证系统
  • 📊 丰富的数据展示组件
  • 🛠 完善的工具函数和 API 封装

技术栈

  • 框架: uniapp (Vue 3)
  • UI 库: uView UI 2.x
  • 状态管理: Vuex
  • 网络请求: uni.request 封装
  • 样式: SCSS
  • 构建工具: Vue CLI

项目结构

xgxt-mobile/
├── pages/                  # 页面文件
│   ├── login/             # 登录页面
│   ├── index/             # 首页
│   ├── workbench/         # 工作台
│   └── mine/              # 我的页面
├── static/                # 静态资源
│   └── tabbar/           # 底部导航图标
├── utils/                 # 工具函数
│   ├── auth.js           # 认证相关
│   └── request.js        # 网络请求
├── api/                   # API接口
│   ├── auth.js           # 认证接口
│   └── common.js         # 通用接口
├── uni_modules/           # uni_modules目录
├── App.vue               # 应用入口
├── main.js               # 主入口文件
├── pages.json            # 页面配置
├── manifest.json         # 应用配置
└── uni.scss              # 全局样式变量

功能模块

1. 登录认证

  • 用户名密码登录
  • 登录状态保持
  • 自动登录检查
  • 退出登录

2. 首页

  • 用户信息展示
  • 轮播图
  • 快捷功能入口
  • 数据统计
  • 最新动态

3. 工作台

  • 工作统计
  • 待办事项
  • 工作流程
  • 快速操作

4. 我的页面

  • 个人信息
  • 功能设置
  • 应用配置
  • 退出登录

安装和运行

1. 安装依赖

npm install

2. 安装 uView UI

npm install uview-ui@2.0.36

3. 运行项目

# H5端开发
npm run dev:h5

# 微信小程序
npm run dev:mp-weixin

# APP端
npm run dev:app-plus

4. 构建项目

# H5端构建
npm run build:h5

# 微信小程序构建
npm run build:mp-weixin

# APP端构建
npm run build:app-plus

默认登录信息

  • 用户名: admin
  • 密码: admin

配置说明

1. 网络请求配置

在 utils/request.js 中修改 BASE_URL 为实际的 API 地址:

const BASE_URL = 'https://your-api-domain.com';

2. 应用配置

在 manifest.json 中修改应用基本信息:

{
    "name": "你的应用名称",
    "appid": "你的应用ID",
    "description": "应用描述"
}

3. 页面配置

在 pages.json 中配置页面路由和 tabBar:

  • 添加新页面路由
  • 修改 tabBar 图标和文字
  • 配置页面样式

开发规范

1. 命名规范

  • 文件名使用小写+连字符
  • 组件名使用大驼峰
  • 变量名使用小驼峰

2. 代码规范

  • 使用 ESLint 进行代码检查
  • 统一使用 2 空格缩进
  • 使用分号结尾

3. 提交规范

  • feat: 新功能
  • fix: 修复 bug
  • docs: 文档更新
  • style: 代码格式调整
  • refactor: 重构
  • test: 测试相关

注意事项

  1. 请确保已安装 uView UI 插件
  2. 静态资源文件需要替换为实际的图片文件
  3. API 接口需要根据后端实际情况进行调整
  4. 不同平台可能需要特殊配置

许可证

MIT License