vue+springboot后台管理系统架子

最新推荐文章于 2025-03-12 17:28:44 发布
最新推荐文章于 2025-03-12 17:28:44 发布
阅读量1.2k 收藏 10
点赞数 1
文章标签： vue.js spring boot 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/yx15156537218/article/details/127513450
版权

一、前端

  1. 环境准备
    我的node是10.15.1建议直接使用nvm管理node版本不合适随时切换
  2. 代码
    gitee地址：https://gitee.com/yin-xin666/mySport.git 下载源码
    在这里插入图片描述
    在这里插入图片描述
 #登录代码
<template>
  <div class="login_container">
    <div class="login_box">
      <div class="avatar_box">
        <!--头像-->
        <img src="../assets/touxiang.png" alt />
      </div>
      <!--添加表单-->
      <el-form
        ref="loginFormRef"
        :model="loginForm"
        :rules="loginRules"
        class="login_form"
        label-width="0px"
      >
        <el-form-item prop="username">
          <el-input v-model="loginForm.username" prefix-icon="iconfont icondenglu"></el-input>
        </el-form-item>
        <el-form-item prop="password">
          <el-input v-model="loginForm.password" prefix-icon="iconfont iconmima" type="password"></el-input>
        </el-form-item>
        <el-form-item class="btns">
          <el-button type="primary" @click="login">登录</el-button>
          <el-button type="info" @click="resetLoginForm">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      loginForm: {
        username: "admin",
        password: "123456"
      },
      loginRules: {
        username: [
          { required: true, message: "请输入用户名", trigger: "blur" },
          { min: 5, max: 8, message: "长度在 5 到 8 个字符", trigger: "blur" }
        ],
        password: [
          { required: true, message: "请输入密码", trigger: "blur" },
          { min: 6, max: 8, message: "密码为 6~8 位", trigger: "blur" }
        ]
      }
    };
  },
  methods: {
    resetLoginForm() {
      this.$refs.loginFormRef.resetFields();
    },
    login() {
      this.$refs.loginFormRef.validate(async valid => {
        if (!valid) return;
        // 调用get请求
        const {data :res} = await this.$http.post("login", this.loginForm);
         if (res == "ok" ) {
           window.sessionStorage.setItem('flag','ok'); // session 放置
           this.$message.success("登陆成功！！！");
           this.$router.push({ path: "/home"});
         }else{
          this.$message.error("登录失败！！！");
         }
      });
    }
  }
};
</script>

<style lang="less" scoped>

// 跟节点样式
.login_container {
  background-color: #2b4b6b;
  height: 100%;
}
// 登录框
.login_box {
  width: 450px;
  height: 300px;
  background-color: #fff;
  border-radius: 3px;// 圆角
  position: absolute;// 绝对定位
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);// 根据自己位置 以自己为长度位移
  // 头像框
  .avatar_box {
    width: 130px;
    height: 130px;
    border: 1px solid #eee;
    border-radius: 50%; // 加圆角
    padding: 10px;
    box-shadow: 0 0 10px #ddd;// 盒子阴影
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #0ee;
    img {
      width: 100%;
      height: 100%;
      border-radius: 50%; // 加圆角
      background-color: #eee;
    }
  }
  .btns {
    display: flex;// 弹性布局
    justify-content: flex-end; // 尾部对齐
  }
  .login_form {
    position: absolute;
    bottom: 0%;
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;// 设置边框
  }
}
</style>

在这里插入图片描述

#管理模块
<template>
  <el-container class="home-container">
    <!--头部布局-->
    <el-header>
      <div>
        <img src="../assets/logo.png" alt class="logo_img" />
        <span>运动管理平台</span>
      </div>
      <el-button type="info" @click="logout">安全退出</el-button>
    </el-header>
    <el-container>
      <!--侧边布局-->
      <el-aside :width="isCollapse ?'64px':'200px'">
        <!--伸缩按钮-->
        <div class="toggle-button" @click="toggleCollapase">|||</div>
        <!--侧边栏菜单区 unique-opened="true" 只保持一个菜单展开 router开启路由 active-text-color 颜色-->
        <el-menu background-color="#545c64" text-color="#fff" active-text-color="#409eff" unique-opened :collapse="isCollapse" 
          :collapse-transition="false"  :router="true" :default-active="activePath">
          <el-submenu :index="item.id+''" v-for="item in menuList" :key="item.id">
            <template slot="title">
              <i :class="iconsObject[item.id]"></i>
              <span>{{item.title}}</span>
            </template>
            <el-menu-item  :index="it.path+''" v-for="it in item.slist" :key="it.id"  @click="saveNavState(it.path+'')">
              <template slot="title" >
                <i :class="iconsObject[it.id]"></i>
                <span>{{it.title}}</span>
              </template>
            </el-menu-item>
          </el-submenu>
        </el-menu>
      </el-aside>
      <!--主体布局-->
      <el-main>
          <!--路由占位符-->
          <router-view></router-view>
      </el-main>
    </el-container>
  </el-container>
</template>
<script>
export default {
    data() {
        return {
            // 左侧菜单
            menuList: [],
            iconsObject: {
              '100':'iconfont iconguanliyuan',
              '200':'iconfont iconsport',
              '101':'iconfont icondenglu',
              '102':'iconfont iconmima',
              '103':'iconfont iconsport',
              '104':'iconfont iconshangpin',
              '201':'iconfont iconshu',
              '202':'iconfont iconkaluli',
              '203':'iconfont iconshiwu',
              '204':'iconfont icondenglu',
              '205':'iconfont icondenglu',
            },
            isCollapse:false,
            // 被激活的连接
            activePath:'',
        }
    },
  // 类似onload
  created() {
      this.getMenuList();
      this.activePath = window.sessionStorage.getItem('activePath');// 取出session里的访问路径
  },
  methods: {
    logout() {
      window.sessionStorage.clear();
      this.$router.push("/login");
    },
    // 获取所有的导航菜单
    async getMenuList(){
      const {data:res} = await this.$http.get("menus");
      console.log(res.data);
      if( res.status != 200) return this.$message.error("操作失败！！！");
      this.menuList = res.data;
    },
    // 切换菜单折叠与展开
    toggleCollapase(){
      this.isCollapse = !this.isCollapse;
    },
    // 保存二级菜单的路径
    saveNavState(activePath){
      window.sessionStorage.setItem('activePath',activePath);// 存放点击的二级菜单
      this.activePath = activePath;// 给点击的菜单添加高亮
    },
  }
};
</script>
<style lang="less" scoped>
.el-header {
  background-color: #373d41;
  display: flex;
  justify-content: space-between;// 左右贴边
  padding-left: 0%;// 左边界
  align-items: center;// 水平
  color: #fff;
  font-size: 20px;
  > div { //左侧div加布局
    display: flex;
    align-items: center;
    span {
      margin-left: 15px;
    }
  }
}
.el-aside {
  background-color: #333744;
  .el-menu{
    border-right: none;// 对其右边框
  }
}
.el-main {
  background-color: #eaedf1;
}
.home-container {
  height: 100%;
}
.logo_img {
  width: 20%;
  height: 100%;
}
.iconfont{
  margin-right: 10px;
}
.toggle-button{
  background-color:#4A5064;
  font-size: 10px;
  line-height: 24px;
  color:#fff;
  text-align: center;
  letter-spacing: 0.2em;
  cursor: pointer;// 显示鼠标指针为：小手
}
</style>

我就不一 一列出来了，下载下来的代码很纯净基本只有一个架子，这也提供给广大的开发用户快速开发。

二、后端

实体类

import java.util.List;
public class MainMenu {
    private int id;
    private String title;
    private String path;
    List<SubMenu> slist;
    public MainMenu() {
    }
public MainMenu(int id, String title, String path, List<SubMenu> slist) {
        this.id = id;
        this.title = title;
        this.path = path;
        this.slist = slist;
    }
    public int getId() {
        return id;
    }
    public String getTitle() {
        return title;
    }
    public String getPath() {
        return path;
    }
    public List<SubMenu> getSlist() {
        return slist;
    }
    public void setId(int id) {
        this.id = id;
    }
    public void setTitle(String title) {
        this.title = title;
    }
    public void setPath(String path) {
        this.path = path;
    }
    public void setSlist(List<SubMenu> slist) {
        this.slist = slist;
    }
    @Override
    public String toString() {
        return "MainMenu{" +
                "id=" + id +
                ", title='" + title + '\'' +
                ", path='" + path + '\'' +
                ", slist=" + slist +
                '}';
    }
}

public class SubMenu {
    private int id;
    private String title;
    private String path;
    public SubMenu() {
    }
    public SubMenu(int id, String title, String path) {
        this.id = id;
        this.title = title;
        this.path = path;
    }
    public int getId() {
        return id;
    }
    public String getTitle() {
        return title;
    }
    public String getPath() {
        return path;
    }
    public void setId(int id) {
        this.id = id;
    }
    public void setTitle(String title) {
        this.title = title;
    }
    public void setPath(String path) {
        this.path = path;
    }
    @Override
    public String toString() {
        return "SubMenu{" +
                "id=" + id +
                ", title='" + title + '\'' +
                ", path='" + path + '\'' +
                '}';
    }
}


public class User {
    private int id;
    private String username;
    private String password;
    private String email;
    private String role;
    private boolean state;
    public User() {
    }
    public int getId() {
        return id;
    }
    public String getUsername() {
        return username;
    }
    public String getPassword() {
        return password;
    }
    public boolean isState() {
        return state;
    }
    public String getEmail() {
        return email;
    }
    public String getRole() {
        return role;
    }
    public void setId(int id) {
        this.id = id;
    }
    public void setUsername(String username) {
        this.username = username;
    }
    public void setPassword(String password) {
        this.password = password;
    }
    public void setEmail(String email) {
        this.email = email;
    }
    public void setRole(String role) {
        this.role = role;
    }
    public void setState(boolean state) {
        this.state = state;
    }
    @Override
    public String toString() {
        return "User{" +
                "id=" + id +
                ", username='" + username + '\'' +
                ", password='" + password + '\'' +
                ", email='" + email + '\'' +
                ", role='" + role + '\'' +
                ", state=" + state +
                '}';
    }
}


public class QueryInfo {
    private String query;
    private int pageNum=1;
    private int pageSize=1;
    public QueryInfo() {
    }
    public QueryInfo(String query, int pageNum, int pageSize) {
        this.query = query;
        this.pageNum = pageNum;
        this.pageSize = pageSize;
    }
    public String getQuery() {
        return query;
    }
    public int getPageNum() {
        return pageNum;
    }
    public int getPageSize() {
        return pageSize;
    }
    public void setQuery(String query) {
        this.query = query;
    }
    public void setPageNum(int pageNum) {
        this.pageNum = pageNum;
    }
    public void setPageSize(int pageSize) {
        this.pageSize = pageSize;
    }
    @Override
    public String toString() {
        return "QueryInfo{" +
                "query='" + query + '\'' +
                ", pageNum=" + pageNum +
                ", pageSize=" + pageSize +
                '}';
    }
}

controller层


@RestController
public class LoginController {
    @Autowired
    UserDao userDao;

    @CrossOrigin
    @RequestMapping("/login")
    public String userLogin(@RequestBody User user) {
        System.out.println("User : " + user);
        String str = "error";
        int count = userDao.getUserByMassage(user.getUsername(), user.getPassword());
        if (count > 0) {
            str = "ok";
        }
        return str;
    }
}

@RestController
public class MenuController {
    @Autowired
    MenuDao menuDao;

    @CrossOrigin
    @RequestMapping("/menus")
    public String getAllMenus(){
        HashMap<String, Object> data = new HashMap<>();
        List<MainMenu> mainMenus = menuDao.getMainMenus();
        data.put("data",mainMenus);
        data.put("status",200);
        String data_json = JSON.toJSONString(data);
        System.out.println("成功访问！！！");
        return data_json;
    }
}

@RestController
public class UserConteroller {
    @Autowired
    UserDao userDao;
    @CrossOrigin
    @RequestMapping("/allUser")
    public String getUserList(QueryInfo queryInfo){
        System.out.println(queryInfo);
        int numbers = userDao.getUserCounts("%"+queryInfo.getQuery()+"%");// 获取数据总数
        int pageStart = (queryInfo.getPageNum()-1)*queryInfo.getPageSize();
        List<User> users = userDao.getAllUser("%"+queryInfo.getQuery()+"%",pageStart,queryInfo.getPageSize());
        HashMap<String, Object> res = new HashMap<>();
        res.put("numbers",numbers);
        res.put("data",users);
        System.out.println("总条数："+numbers);
        String users_json = JSON.toJSONString(res);
        return users_json;
    }
    @RequestMapping("/userState")
    public String updateUserState(@RequestParam("id") Integer  id,
                                  @RequestParam("state") Boolean state){
        int i = userDao.updateState(id, state);
        System.out.println("用户编号:"+id);
        System.out.println("用户状态:"+state);
        String str = i >0?"success":"error";
        return str;
    }
    @RequestMapping("/addUser")
    public String addUser(@RequestBody User user){
        System.out.println(user);
        user.setRole("普通用户");
        user.setState(false);
        int i = userDao.addUser(user);
        String str = i >0?"success":"error";
        return str;
    }
    @RequestMapping("/getUpdate")
    public String getUpdateUser(int id){
        System.out.println("编号:"+id);
        User updateUser = userDao.getUpdateUser(id);
        String users_json = JSON.toJSONString(updateUser);
        return users_json;
    }
    @RequestMapping("/editUser")
    public String editUser(@RequestBody User user){
        System.out.println(user);
        int i = userDao.editUser(user);
        String str = i >0?"success":"error";
        return str;
    }
    @RequestMapping("/deleteUser")
    public String deleteUser(int id){
        System.out.println(id);
        int i = userDao.deleteUser(id);
        String str = i >0?"success":"error";
        return str;
    }
}

dao层

@Repository
public interface MenuDao {
    public List<MainMenu> getMainMenus();
}

@Repository
public interface UserDao {

    public int getUserByMassage(@Param("username") String username, @Param("password") String password);
    public List<User> getAllUser(@Param("username") String username,@Param("pageStart") int pageStart, @Param("pageSize") int pageSize);
    public int getUserCounts(@Param("username") String username);
    public int updateState(Integer id, Boolean state);
    public int addUser(User user);
    public User getUpdateUser(int id);
    public int editUser(User user);
    public int deleteUser(int id);
}

util

@Configuration
public class WebConfig extends WebMvcConfigurerAdapter {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("http://localhost:8080", "null")
                .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
                .maxAge(3600)
                .allowCredentials(true);
    }
}

启动类

@Configuration
public class WebConfig extends WebMvcConfigurerAdapter {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("http://localhost:8080", "null")
                .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
                .maxAge(3600)
                .allowCredentials(true);
    }
}

mapper的xml

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper  PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="com.naughty.userlogin02.dao.MenuDao">
    <!--映射实体-->
    <resultMap id="menuMap" type="com.naughty.userlogin02.bean.MainMenu">
        <id column="id"  property="id"></id>
        <result column="title"  property="title"></result>
        <result column="path"  property="path"></result>
        <collection  property="slist" ofType="com.naughty.userlogin02.bean.SubMenu">
            <result column="sid"  property="id"></result>
            <result column="stitle"  property="title"></result>
            <result column="spath"  property="path"></result>
        </collection>
    </resultMap>

    <select id="getMainMenus" resultMap="menuMap">
        SELECT mm.*,sm.id as sid ,sm.title as stitle,sm.path as spath FROM mainmenu mm ,submenu sm WHERE mm.id = sm.mid;
    </select>
</mapper>

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper  PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="com.naughty.userlogin02.dao.UserDao">
    <select id="getUserByMassage" resultType="java.lang.Integer">
       	SELECT count(id) FROM easyUser
       	WHERE username=#{username} AND password=#{password}
    </select>

    <select id="getAllUser" resultType="com.naughty.userlogin02.bean.User">
       	SELECT * FROM easyUser
        <if test="username !=null ">
            WHERE username like #{username}
        </if>
        LIMIT #{pageStart},#{pageSize}
    </select>

    <select id="getUserCounts" resultType="java.lang.Integer">
       	SELECT count(*) FROM `easyUser`
        <if test="username !=null ">
            WHERE username like #{username}
        </if>
    </select>

    <select id="getUpdateUser" resultType="com.naughty.userlogin02.bean.User">
        SELECT * FROM easyUser WHERE id = #{id}
    </select>

    <update id="updateState">
        UPDATE easyUser SET state = #{state} WHERE id = #{id}
    </update>

    <insert id="addUser">
        INSERT INTO easyUser
        (username,password,email,role,state)
        VALUE
        (#{username},#{password},#{email},#{role},#{state})
    </insert>

    <update id="editUser">
        UPDATE easyUser SET username = #{username} , password = #{password} ,
        email = #{email} WHERE id = #{id}
    </update>

    <delete id="deleteUser">
        DELETE FROM easyUser WHERE id = #{id}
    </delete>

</mapper>


# mysql
spring:
  datasource:
    #MySQL配置
    driverClassName:  com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://192.168.200.200:3306/easyproject?useUnicode=true&characterEncoding=UTF-8&useSSL=false&serverTimezone=UTC
    username: root
    password: xxxxxx

mybatis:
  mapper-locations: classpath:mapper/*.xml
  type-aliases-package: com.example.demo.model
server:
  port: 9000

入库sql

/*
 Navicat Premium Data Transfer

 Source Server         : 192.168.200.200
 Source Server Type    : MySQL
 Source Server Version : 50717
 Source Host           : 192.168.200.200:3306
 Source Schema         : easyproject

 Target Server Type    : MySQL
 Target Server Version : 50717
 File Encoding         : 65001

 Date: 25/10/2022 10:13:39
*/

SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;

-- ----------------------------
-- Table structure for easyUser
-- ----------------------------
DROP TABLE IF EXISTS `easyUser`;
CREATE TABLE `easyUser`  (
                             `id` int(24) NOT NULL AUTO_INCREMENT COMMENT '主键',
                             `username` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
                             `password` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
                             `email` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
                             `role` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
                             `state` tinyint(255) NOT NULL DEFAULT 0,
                             PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 10 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

-- ----------------------------
-- Records of easyUser
-- ----------------------------
INSERT INTO `easyUser` VALUES (1, 'admin', '123456', '123@qq.com', '超级管理员', 1);
INSERT INTO `easyUser` VALUES (2, 'naughty', '888888', '456@qq.com', '普通管理员', 0);
INSERT INTO `easyUser` VALUES (3, 'flysky01', '987654', 'qwe@qq.com', '普通用户', 1);
INSERT INTO `easyUser` VALUES (4, 'anglybirds', '321654', 'aaaa@163.com', '普通用户', 0);
INSERT INTO `easyUser` VALUES (7, 'admin003', 'q123456', 'c@qq.com', '普通用户', 1);
INSERT INTO `easyUser` VALUES (8, 'admin005', '123456', 'cxz@qq.com', '普通用户', 0);
INSERT INTO `easyUser` VALUES (9, 'admin007', '123456', 'rty@qq.com', '普通用户', 0);

SET FOREIGN_KEY_CHECKS = 1;
/*
Navicat MySQL Data Transfer

Source Server         : Testblog
Source Server Version : 50556
Source Host           : localhost:3306
Source Database       : easyproject

Target Server Type    : MYSQL
Target Server Version : 50556
File Encoding         : 65001

Date: 2020-05-27 14:48:51
*/

SET FOREIGN_KEY_CHECKS=0;

-- ----------------------------
-- Table structure for mainmenu
-- ----------------------------
DROP TABLE IF EXISTS `mainmenu`;
CREATE TABLE `mainmenu` (
  `id` int(50) NOT NULL AUTO_INCREMENT,
  `title` varchar(255) NOT NULL,
  `path` varchar(255) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=201 DEFAULT CHARSET=utf8;

-- ----------------------------
-- Records of mainmenu
-- ----------------------------
INSERT INTO `mainmenu` VALUES ('100', '权限管理', '/admin');
INSERT INTO `mainmenu` VALUES ('200', '运动平台', '/use');
/*
Navicat MySQL Data Transfer

Source Server         : Testblog
Source Server Version : 50556
Source Host           : localhost:3306
Source Database       : easyproject

Target Server Type    : MYSQL
Target Server Version : 50556
File Encoding         : 65001

Date: 2020-05-27 14:48:58
*/

SET FOREIGN_KEY_CHECKS=0;

-- ----------------------------
-- Table structure for submenu
-- ----------------------------
DROP TABLE IF EXISTS `submenu`;
CREATE TABLE `submenu` (
  `id` int(50) NOT NULL AUTO_INCREMENT,
  `title` varchar(255) NOT NULL,
  `path` varchar(255) NOT NULL,
  `mid` int(50) NOT NULL,
  PRIMARY KEY (`id`),
  KEY `mid` (`mid`),
  CONSTRAINT `submenu_ibfk_1` FOREIGN KEY (`mid`) REFERENCES `mainmenu` (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=204 DEFAULT CHARSET=utf8;

-- ----------------------------
-- Records of submenu
-- ----------------------------
INSERT INTO `submenu` VALUES ('101', '用户列表', '/user', '100');
INSERT INTO `submenu` VALUES ('102', '修改权限', '/rights', '100');
INSERT INTO `submenu` VALUES ('103', ' 运动模块', '/sport', '100');
INSERT INTO `submenu` VALUES ('104', '商品模块', '/goods', '100');
INSERT INTO `submenu` VALUES ('201', '运动科普', '/Introduction', '200');
INSERT INTO `submenu` VALUES ('202', '卡路里', '/calories', '200');
INSERT INTO `submenu` VALUES ('203', '营养配餐', '/food', '200');

pom文件

<parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.2.6.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>

<dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-jdbc</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>2.1.2</version>
        </dependency>

        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
            <exclusions>
                <exclusion>
                    <groupId>org.junit.vintage</groupId>
                    <artifactId>junit-vintage-engine</artifactId>
                </exclusion>
            </exclusions>
        </dependency>
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>fastjson</artifactId>
            <version>1.2.28</version>
        </dependency>
    </dependencies>

项目代码都在最上方gitee代码仓库中托管拉下去导入数据库即可运行。

Heart鑫^
关注
基于SpringBoot和Vue.js构建的后台管理系统
08-07
基于Spring Boot和Vue.js构建的后台管理系统
Java 之SpringBoot+Vue实现后台管理系统的开发
程序员小明1024
07-13 5516
.markdown-body { line-height: 1.75; font-weight: 400; font-size: 16px; overflow-x: hidden; color: rgba(51, 51, 51, 1) } .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .ma...
SpringBoot+Vue 后台管理系统
最新发布
xiaomayios的博客
03-12 1051
基于SpringBoot3、SpringSecurity、MybatisPlus、Vue3、TypeScript、Vite、ElementPlus、MySQL等技术栈实现的单体前后端分离后台管理系统；
SpringBoot+Shiro+Vue+iView 实现的后台管理系统通用模板
09-13
通用的企业级快速开发脚手架是针对企业项目的快速迭代开发而研发的后台管理系统模块。是基于Spring Boot、Shiro和Vue等技术进行开发，主要是对后台管理系统常用模块前后端整体抽取构建成通用模板。也是集中对权限管理进行再次封装，以至于简单操作，便于二次开发代码重复。主要实现管理员管理、角色管理与资源权限管理模块，后台管理系统必不可少的就是管理员与身份权限，每一次项目都必须重新对重复的表进行分析，对企业的快速效率有很大的影响。通过对基础功能的表抽取，并对功能再次进行封装，实现企业级快速开发脚手架。 注：此为源码压缩包。 解压开来会有两个文件夹：SQL 与 CODE，分别存放着数据库与源代码。此项目为前后台分离开发，后台为Springboot+shiro，前台为 Vue+iview工程化项目。 如果在使用中遇到问题，可以加QQ群：878305246 。
SpringBoot + vue 管理系统
小林的博客
07-14 8911
SpringBoot + vue 管理系统步骤： 生成的pom.xml文件 创建项目工程目录结构配置文件application.yml 设置统一返回数据 构建一个vue项目功能模块分为六部分：班级管理、学员管理、部门管理、员工管理、员工信息统计、学员信息统计开发的部门管理功能包含： 3.1.2、后端代码实现 service接口 serviceImpl 3.2、员工管理 我们可以把员工管理功能分为： 3.2.2、后端代码实现 mapper.xml 因为需要涉及到oss文件上传所
springboot+vue前后端分离项目（后台管理系统）
先养只猫的博客
08-13 5万+
学习笔记 学习资源来自于B站良心up 一、所使用的环境配置： 编译器：IDEA 后台框架：SpringBoot Mybatis-Plus 数据库：Mysql8.0 数据库工具：Navicat premium 前端框架：Vue Element UI 引用的富文本编辑器：wangEditor 二、项目简介 这是一个基于SpringBoot和Vue的后台管理系统。 主要功能： 1.实现用户信息的CRUD，以及页面的显示。 2.用户权限的分配，不同权限的用户锁能看到的的界面信息和能进行的操作是不同的。 3.实现图片
2、Vue + SpringBoot前后端项目实例
advent86的专栏
12-02 3415
Vue + SpringBoot3 前后端项目实例,SpringSecurity,Redis,MyBatis分页,文件下载,文件上传
一个基于vue3+vite的后台管理系统架子.zip
01-04
Vue3，springboot，element-ui使用技巧，实战应用开发小系统参考资料，源码参考。 详细介绍了一些Qt框架的各种功能和模块，以及如何使用Qt进行GUI开发、网络编程和跨平台应用开发等。 适用于初学者和有经验的开发者...
【项目实战】手把手教你搭建前后端分离项目 SpringBoot + Vue + Element UI + Mysql
激流丶的博客
07-08 4342
🍉🍉🍉 程序员必须得学会如何搭建一个项目，会了这个技能有很多好处，例如接一些项目，也能挣一点生活费。
私藏项目实操分享# nodejs后端+vue+mysql搭建一个管理系统
wadfdhsajd的博客
06-06 1294
NodeJs后端+Vue+MySQL搭建一个管理系统 写在前面，之前一直换着法用Java写后端，不论是SpringBoot还是MVC还是啥，就离不开那一套，忽然发现现在学校又让用node写后端的，学习一下！一、首先整一套Vue现成的开源脚手架程序并启动，作为前端架子 我这边用的是​ ​vue-manage-system​​，非常好用这边肥肠感谢！根据项目里面的Readme启动起来项注意如果install出现错误像下面这个图，那就删掉 ​​package-lock.json ​​这个文件 二、就以这个登
后台管理系统脚手架使用springboot+mysql+shiro
yixuan30的博客
09-01 640
base 这是一个后台管理系统一个脚手架 前端使用vue + element ui框架,前端源代码地址：https://github.com/yixuan30/vue_base 后台使用spring boot2 + shiro + mybatispuls + mysql数据库，后台源代码地址：https://github.com/yixuan30/base/new/master 前后台通信使用axios. 实现功能： 1.用户管理：实现用户的增删改，模糊查询，为用户分配相应的角色。 2.角色管理：实现角
springboot+vue+mysq 后台管理
11-11
前后端分离，后端springboot+mysql,前段vue+element 带系统权限，可以直接上手，直接用
项目基于SpringBootRedisVue的前后端分离后台管理系统
08-07
项目基于 Spring Boot 2.1.0 、 Spring Boot Jpa、 Spring Security、Redis、Vue的前后端分离后台管理系统， 权限控制采用 RBAC，前端菜单动态路由
基于springboot+vue的后台用户管理系统（一）
aomanaka的博客
06-27 3706
springboot是所有基于spring开发项目的起点。springboot的设计是为了尽可能快的启动spring应用程序，并且尽可能的减少配置文件。约定优于配置，一种软件设计范式。spring是javaEE的轻量化替代品，同时通过依赖注入和面向切面编程，使其功能强大；不过它的组件代码虽然是轻量化的，但是它的配置文件却是重量级的。尽管在后续的更新开发中，通过引入基于注解的组件扫描、基于java的可重构配置，一定程度上降低了程度；不过项目的依赖管理也还是一种耗时耗力的事情。
Springboot+vue后台管理系统-前后端分离数据传递
justleavel的博客
02-01 6019
一：前端项目搭建； 1:使用cmd下载vue： 2：npm install -g @vue/cli （如果安装过就不用啦） 3:vue create springboot-vue-demo(自己的名字)： 4： 5：将目标移动到第一个选项然后按回车到达下面这个界面，选择一个vue版本，我们这里选择vue3x 6：下一个界面依次按下： y in package.json y 这三个，第三个是是否保存当前配置可以按N 7： 进入： 退出打开idea去开启项目编写 8： ..
springboot+vue 后台管理
qq_31940749的博客
11-11 334
后端：springboot + mybatis + mysql 前段代码vue+element 系统已经配置用户权限，可以直接使用这套框架， 项目地址：http://124.70.29.251/ 希望能提供帮助 框架下载地址：https://download.csdn.net/download/qq_31940749/13104204 ...
【SpringBoot】54、SpringBoot+VUE后台管理系统开发脚手架
热门推荐
Asurplus
03-08 20万+
本期给大家推荐我自己写一个开源项目：Asurplus-VUE，本着减少大量重复开发工作的原则，使得在项目中能够实现快速开发 1、前言 本项目本着避免重复造轮子的原则，建立一套快速开发JavaWEB项目（Asurplus-VUE），能满足大部分后台管理系统基础开发功能，使得开发人员直接可从业务模块开始，减少大量的重复开发工作。前端框架使用 ruoyi-vue（https://gitee.com/y_project/RuoYi-Vue） 2、项目地址 https://gitee.com/asurplus/asu
基于springboot+vue的后台用户管理系统（二）
aomanaka的博客
07-01 2242
在之前已经将系统后端逻辑业务代码编写了部分，在此，需要实现前端页面的展示，使用到html、css、js的技术，借助vue等进阶技术展示更优化的界面。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值