基于springboot+vue的江西旅游网(前后端分离)

简介: 本系统为原创项目,以江西旅游为主题,采用前后端分离,创作于2022年4月,项目代码工整,结构清晰,适合选题:旅游、旅游攻略、**旅游网、前后端分离类其他旅游系统等。系统采用springboot+vue整合开发,前端主要使用了element-ui框架、项目后端主要使用了springboot,数据层采用mybatis。

项目介绍:



本系统为原创项目,以江西旅游为主题,采用前后端分离,创作于2022年4月,项目代码工整,结构清晰,适合选题:旅游、旅游攻略、**旅游网、前后端分离类其他旅游系统等。系统采用springboot+vue整合开发,前端主要使用了element-ui框架、项目后端主要使用了springboot,数据层采用mybatis。


项目功能:



60bdbdfd7e474062b438eaf144ca45e5.png


数据模型:



3ff6a38d59c646f9ba89cd51065e0222.png


数据库表结构:



fcd09205518c43dc85c141c10f6ca0df.png


系统包含技术:



后端:springboot,mybatis

前端:element-ui、js、css等

开发工具:idea/vscode

数据库:mysql 5.7

JDK版本:jdk1.8


部分截图说明:



下面是首页,展示景点、攻略等


3c36af032f1548fb94f3543e536a89ef.png


前台登录


 80cab80552ff4e8ca880d6ae7bc7b93a.png


旅游攻略,可以分类查看,也可以分页查看


d9046b2d06ac47ed933c8f56d2820f5b.png


攻略详情


02023ec028d74e88b0b8c6b5176503dc.png


旅游路线,可以分类查看,也可以分页查看


4e1353c1489d413d9585a1f484004be1.png


路线详情


6ebe87f9ed6944eaab703a5841cb10bb.png


景点


ca1162a9773e4698b62df76a7bec9a2a.png


酒店住宿信息


eb92f7b3fd8749e9b8b0d9239e5a184f.png


下面是个人中心,登录后可以看到


2c4e3178a83b42cba8b51779ade34b8c.png


用户也可以反馈留言


d79f567cb0bb4bae9e097e59f40bc008.png


后台登录


58d3f2b208e5499588967292d8d89b98.png


管理员对用户进行管理


30d3666c57034b869034efc0a5beb650.png


管理员对旅游路线管理员对用户进行管理进行管理


c7802c058dd14446bcd466845e2e1e2f.png


管理员对用景点推荐进行管理


51999dacaa864b20880acb67b171b681.png


管理员对推荐进行编辑


b9d3d548d7ba4315a4f755b302fc86d6.png


项目前端结构


873f7b189fdc4460a81f360bbc1cd19e.png


项目后端结构


cb7112d48bd74d7b9cb19d254c9c72c7.png


部分代码:



 /**
     * 分页查询
     */
    @PostMapping("selectAll")
    public PageInfo<Hotel> selectAll(@RequestBody Map<String,String> mp) {
        PageHelper.startPage(Integer.parseInt(mp.get("currentPage").toString()), Integer.parseInt(mp.get("pagesize").toString()));
        List<Hotel> list = hotelService.queryAllByLimit(mp);
        PageInfo<Hotel> pageInfo = new PageInfo<Hotel>(list);
        return pageInfo;
    }
    /**
     * 修改
     */
    @RequestMapping("edit")
    public String edit(@RequestBody Hotel hotel) {
        try {
            hotelService.update(hotel);
            return "200";
        }catch (Exception e){
            e.printStackTrace();
            return "201";
        }
    }
    /**
     * 新增
     */
    @RequestMapping("add")
    public String add(@RequestBody Hotel hotel) {
        try {
            Date date = new Date();
            hotel.setCreateTime(date);
            hotelService.insert(hotel);
            return "200";
        }catch (Exception e){
            e.printStackTrace();
            return "201";
        }
    }
    /**
     * 通过主键查询单条数据
     */
    @GetMapping("selectOne")
    public Hotel selectOne(Integer id) {
        return hotelService.queryById(id);
    }
    /**
     * 通过主键删除数据
     */
    @GetMapping("deleteById")
    public String deleteById(Integer id) {
        try {
            hotelService.deleteById(id);
            return "200";
        }catch (Exception e){
            e.printStackTrace();
            return "201";
        }
    }
    /**
     * 导出excel
     */
    @RequestMapping("/downExcel")
    public List<Hotel> downExcel(){
        Hotel hotel = new Hotel();
        return hotelService.queryCondition(hotel);
    }


文件上传



@RequestMapping("/imgUpload")
  public Map<String, Object> yunUploadFile(@RequestParam("file") MultipartFile multiFile) {
    Map<String, Object> outMap = new HashMap<>();
    try {
      SimpleDateFormat sf = new SimpleDateFormat("yyyyMMddHHmmss");
      String name = sf.format(new Date());
      //获取文件的扩展名
      String ext = FilenameUtils.getExtension(multiFile.getOriginalFilename());
      //以绝对路径保存重名命后的图片
      multiFile.transferTo(new File(uploadDir+"/"+name + "." + ext));
      //jsonObject.put("code",name + "." + ext);
      outMap.put("imgUrl", "/api/upload/"+name + "." + ext);
      outMap.put("url", "http://127.0.0.1:8080/api/upload/"+name + "." + ext);
      outMap.put("message", "图片上传成功!");
      outMap.put("result", "true");
      return outMap;
    } catch (IOException e) {
      e.printStackTrace();
      outMap.put("result", "false");
      outMap.put("message", "图片上传失败,请重新上传!");
    }
    return outMap;
  }


以上就是部分功能展示,从整体上来看,本系统功能是十分完整的,界面设计简洁大方,交互友好,数据库设计也很合理,规模适中,代码工整,清晰,适合学习使用。


好了,今天就到这儿吧,小伙伴们点赞、收藏、评论,一键三连走起呀,下期见~~


相关文章
|
22天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,包括版本兼容性、安全性、性能调优等方面。
113 1
|
6天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,创建并配置 Spring Boot 项目,实现后端 API;然后,使用 Ant Design Pro Vue 创建前端项目,配置动态路由和菜单。通过具体案例,展示了如何快速搭建高效、易维护的项目框架。
84 62
|
4天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个前后端分离的应用框架,实现动态路由和菜单功能
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个前后端分离的应用框架,实现动态路由和菜单功能。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,帮助开发者提高开发效率和应用的可维护性。
13 2
|
6天前
|
JavaScript Java 项目管理
Java毕设学习 基于SpringBoot + Vue 的医院管理系统 持续给大家寻找Java毕设学习项目(附源码)
基于SpringBoot + Vue的医院管理系统,涵盖医院、患者、挂号、药物、检查、病床、排班管理和数据分析等功能。开发工具为IDEA和HBuilder X,环境需配置jdk8、Node.js14、MySQL8。文末提供源码下载链接。
|
23天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用
【10月更文挑战第8天】本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,通过 Spring Initializr 创建并配置 Spring Boot 项目,实现后端 API 和安全配置。接着,使用 Ant Design Pro Vue 脚手架创建前端项目,配置动态路由和菜单,并创建相应的页面组件。最后,通过具体实践心得,分享了版本兼容性、安全性、性能调优等注意事项,帮助读者快速搭建高效且易维护的应用框架。
30 3
|
24天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用
【10月更文挑战第7天】本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,通过 Spring Initializr 创建 Spring Boot 项目并配置 Spring Security。接着,实现后端 API 以提供菜单数据。在前端部分,使用 Ant Design Pro Vue 脚手架创建项目,并配置动态路由和菜单。最后,启动前后端服务,实现高效、美观且功能强大的应用框架。
34 2
|
2天前
|
JavaScript NoSQL Java
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
19 0
|
数据库
基于springboot+mybatisplus+vue的课程学分管理系统
基于springboot+mybatisplus+vue的课程学分管理系统
134 0
基于springboot+mybatisplus+vue的课程学分管理系统
基于Springboot+MybatisPlus+Vue的在线课程管理系统
基于Springboot+MybatisPlus+Vue的在线课程管理系统
139 0
基于Springboot+MybatisPlus+Vue的在线课程管理系统
|
JavaScript 前端开发 Java
基于Springboot+MybatisPlus+Vue的前后端分离的学生选课课程教务管理系统
基于Springboot+MybatisPlus+Vue的前后端分离的学生选课课程教务管理系统
231 0
基于Springboot+MybatisPlus+Vue的前后端分离的学生选课课程教务管理系统