/xjt-springboot-travel

springboot+vue前后端分离项目-仿马蜂窝的星光旅游网

Primary LanguageJava

星光旅游网

项目功能介绍:https://www.bilibili.com/video/BV18Z4y1r7Ut

后台服务端

技术栈:

  • springboot微服务框架
  • MySQL8数据库
  • mybatis-plus
  • pagehelper+Mybatis 分页
  • hutool 工具
  • fastjson 序列化
  • Redis 缓存
  • shiro 安全框架
  • easy-captcha 验证码
  • aliyun-oss 对象存储
  • kumo 分词

项目结构图:

9fe677eef3e30908

Shiro认证和授权

即用户登录并赋予权限

Controller层,用户登录接口(用户名、密码、验证码)

@PostMapping("/toLogin")
public RespBean userLogin(@RequestBody HashMap<String, String> params, HttpSession session) {
    String username = params.get("username");
    String password = params.get("password");
    String verify_code = params.get("verify_code");

    //1、比较验证码
    String session_verify = (String) session.getAttribute("verify_code");
    log.warn("session_verify===>" + session_verify);
    if (StringUtils.hasLength(verify_code) && session_verify.equalsIgnoreCase(verify_code)) {
        try {
            Subject subject = SecurityUtils.getSubject();
            subject.login(new UsernamePasswordToken(username, password));

            //从session中获取认证的TUser对象 返回给前端
            TUser user = (TUser) session.getAttribute("USER_SESSION");
            return RespBean.success("ok", user);
        } catch (UnknownAccountException e) {
            throw new LoginException("用户名不存在!");
        } catch (IncorrectCredentialsException e) {
            throw new LoginException("密码错误!");
        } catch (Exception e) {
            throw new LoginException(e.getMessage());
        }
    } else {
        throw new LoginException("验证码错误!");
    }
}

1、首先比较验证码是否相同

全局异常定制

文件上传

多条件查询

后台管理端

技术栈

  • Vue-Cli3 + vue-router + vuex
  • axios 网络请求
  • element-ui
  • echarts 图表
  • hover.css hover样式
  • moment.js 时间日期格式化
  • nprogress 进度条
  • qs 序列化和反序列化(URL查询字符串)
  • vue-lazyload 图片懒加载
  • vue-particles 粒子特效
  • wangeditor 富文本编辑器
  • less@4.1.1 + less-loader@6.0.0 写Css样式
  • clipboard 粘贴板
  • codemirror 在线编辑代码
  • screenfull 全屏
  • vue-count-to 动态数字
  • mavon-editor markdown文本编辑器

首页

image-20221010153538033

游记管理

旅行游记

image-20221010153607338

新增游记

image-20221010153641854

系统管理

用户管理

image-20221010153654069

角色&权限

该功能未完成(后续完善...)

image-20221010153723556

旅行家管理

旅行家列表

image-20221010153755181

新增旅行家

image-20221010153818099

旅行家文章列表

image-20221010153835418

新增旅行家文章

image-20221010153849703

路线管理

路线列表

image-20221010153910994

新增路线

image-20221010153947856

旅行社

image-20221010154001057

组件管理

这部分是elAdmin框架自带的,小伙伴们写代码可以参考规范哦

### 关于我

image-20221010154643361

客户端

技术栈

  • Vue-Cli3 + vue-router + vuex
  • axios 网络请求
  • element-ui
  • echarts 图表
  • hover.css hover样式
  • moment.js 时间日期格式化
  • nprogress 进度条
  • qs 序列化和反序列化(URL查询字符串)
  • vue-lazyload 图片懒加载
  • vue-particles 粒子特效
  • wangeditor 富文本编辑器
  • less@4.1.1 + less-loader@6.0.0 写Css样式

登录页

image-20221010152508335

注册页

image-20221010152525082

注册登录演示:

111

首页

image-20221010152602758

旅行家专栏页

image-20221010152941051

去旅行页

image-20221010153000243

购物车页

image-20221010153014954

关于我页

image-20221010153033842