/eta_vue

Primary LanguageVue

ETA_Vue

项目说明

  • 此项目为基于 Vue + Jfinal 的前后端分离项目的前端部分
  • 采用element-ui作为UI库,详情请见 官方文档
  • 采用vuex存储全局变量,全局变量配置在「store」文件夹中
  • 采用vue-router作导航管理,导航管理在「router」文件夹中
  • 采用axios来对后端接口进行调用,接口的说明及配置在「api」文件夹中
  • 作为单页面应用,程序的主入口为App.js,顶层路由分为「登陆页面」及「主页面」两块,其中主页面中各个功能页面的切换以视图形式展现,通过二级路由切换,视图存放在「views」文件夹中

首次启动前安装依赖

yarn install

启动项目

yarn serve

打包

yarn build

工作进度

  • 用渐进式框架Vue将前端页面全部重构(约计5000行代码),现可以完美适配移动端
  • 在不改动原有数据库结构的基础上,将原项目重构为前后端分离项目

前后端分离的优点

  • 可以在不停止后端服务的情况下,快速对前端页面进行迭代,从打包到上线最快仅需1分钟
  • 可以分布式部署,后期方便扩展

渐进式框架的优点

  • 页面局部刷新,提高性能的同时可以带来更良好的用户体验
  • 组件化页面,元素可复用

改进

  • 修复了学生奖项图片无法打包的问题(后端加了容错处理)
  • 修复了辅导员不能跨班级、跨年级管理的问题
  • 新增了 辅导员/系统管理员 可以更新奖项图片的功能(后端新增接口)
  • 新增了 可选显示列功能
  • 优化了多图存储逻辑(单项最大图片数量可以多于10张,考虑到服务器性能暂时设置上限为5张)
  • 优化了菜单结构
  • 优化了奖项审核逻辑

Customize configuration

See Configuration Reference.