[Java原创精品]基于Springboot+Vue的高校社团管理、学生社团招新平台

标签：1.4 Vue Springboot 社长管理申请管理员社团

项目提供：完整源码 + 数据库sql文件 + 数据库表Excel文件

1、项目功能描述

本项目角色为社团社长、学生用户、系统管理员三角色，社长登录进入后台，可切换至前台使用功能，学生用户只进入前台使用，系统管理员只进入后台管理操作。

1.1 注册

注册功能：填写用户名、密码进行注册。（“我已阅读同意《隐私政策》和《服务条款》”没有做后续，只是单纯有这样一行文字做模拟）

1.2 登录

登录功能：填写你所注册过的账号和密码以及验证码进行登录。（“我已阅读同意《隐私政策》和《服务条款》”没有做后续，只是单纯有这样一行文字做模拟）

1.3 前台界面（学生用户/社长）

1.3.1 平台首页

登录进入平台首页，分为三部分，最上面有两部分，左侧为代码内设置的视频

<div style="width: 100%; margin: 20px auto; text-align: center; flex: 3;">
  <video style="width: 100%; height: 100%; max-height: 450px;" src="../../../src/assets/社团.mp4" muted autoplay controls loop></video>
</div>

右侧为一个动图和一个创建社团的按钮

<el-card style="width: 100%; margin: 10px 0;">
  <div>
  <img src="../../../src/assets/社团招新动图.gif" alt="社团招新GIF 动图" style="width: 95%; height: auto;">
  </div>
  <el-divider></el-divider>
  <div>
    <img src="../../../src/assets/点击动图.gif" alt="点击下方GIF 动图" style="width: 50px; height: 50px; margin-bottom: 10px;">
  </div>
  <el-link type="primary" @click="handleAdd">都没兴趣，我要创建社团</el-link>
</el-card>

点击创建社团的文字按钮，弹出社团创立信息抽屉。

中间部分是后台管理员设置的精选评价，点击可进入对应社团详情页。

底部为学校社团，是所有通过管理员审核的社团的列表。

支持搜索

点击进入社团，此处以软件社为例子。上方为社团信息，下方有社团资讯、社团活动、社团公告板、社团成员等信息。

资讯详情页，如图所示：

下方有评论区：

公告板为折叠状态，每次只能打开一个

点击右上方“加入社团”，第一次申请则显示“申请成功”

再次点击则显示“申请过了”

如果用户已经加入这个社团，社团成品中会显示用户的信息，这种情况下点击“加入社团”，则会显示“您已成功加入社团”

此部分功能的实现是对申请进行了后端处理。

@PostMapping
public Result save(@RequestBody Application application) {
    try {
        Integer userId = TokenUtils.getCurrentUser().getId();
        application.setUserId(userId);

        // 检查是否已申请过相同社团
        Application existingApplication = applicationService.getApplicationByUserIdAndClubId(userId, application.getItemId());
        if (existingApplication != null) {
            // 检查状态
            if ("待审核".equals(existingApplication.getStatus())) {
                throw new ServiceException("605", "已经申请过了!");
            } else if ("已通过".equals(existingApplication.getStatus())) {
                return Result.error("604","您已成功加入社团!"); // 如果状态为已通过，返回已加入的提示
            }else if ("不通过".equals(existingApplication.getStatus())) {
                return Result.error("603","您已被拒绝加入该社团!");
            }
        }

        // 保存新的申请
        applicationService.save(application);
    } catch (ServiceException e) {
        throw e; // 重新抛出已处理的异常
    } catch (Exception e) {
        throw new ServiceException("500", "保存申请时发生错误!");
    }
    return Result.success();
}

社团活动，如图所示

1.3.2 我的社团

显示我已经成功加入的社团，支持搜索社团名称。

点击退出社团，会显示二次确认提示框是否退出。

此时，用户“张晓丽”还存在于舞蹈社团

当我确定退出，则我的社团处不再显示

且舞蹈社内成员名单也不再有“张晓丽”。

1.3.3 创社申请

我的创建申请记录表，显示我所有向管理员申请创建的社团情况，也可以在此处发起申请，和首页的是一样的，但是样式做了调整。

发起申请，如图所示

1.3.4 发表评价

此处可以点击发布社团评价，也可以查看我发布过的

发布的评价并不会全部显示出来，是通过后台管理员审核筛选可以在首页投放。

1.3.5 个人中心

支持基础个人信息修改和密码修改的同时，将平台热线留言反馈也隐藏在这。

个人信息

修改密码：

对于角色为“社长”的用户，登录进入后台，可点击右上角的前往前台回到用户前台

同时，社长无需再次加入自己创建的社团，因此，该社团详情页也不会显示“加入社团”按钮

1.4 后台界面（社长/管理员）

登录社长账号密码 111 111

进入主页（主页非功能页，但不可删除，购买源码后可自行增删主页中的内容！）

1.4.1 社团管理

社长和管理员都可以看到社团管理，但是后端做了判断，让社长仅查看个人创建的社团信息，管理员可以看到全部。

//后台查看，社长看自己的社团，管理员看全部
@GetMapping("/page")
public Result findPage(@RequestParam(defaultValue = "") String name,

                       @RequestParam Integer pageNum,
                       @RequestParam Integer pageSize) {
    QueryWrapper<Club> queryWrapper = new QueryWrapper<>();
    //后台分角色查看活动，社长也具有管理能力，因此如果登录后为社长master角色
    User user = TokenUtils.getCurrentUser();
    if ("ROLE_MASTER".equals(user.getRole())) {
        queryWrapper.eq("user_id", TokenUtils.getCurrentUser().getId());
    }
    //如果不是社长，则是管理员，那么就直接全部显示。
    queryWrapper.orderByDesc("id");
    if (!"".equals(name)) {
        queryWrapper.like("name", name);
    }

    return Result.success(clubService.page(new Page<>(pageNum, pageSize), queryWrapper));
}