【高校宿舍管理系统】第八章 学生管理和楼宇管理以及寝室管理

第八章 学生管理和楼宇管理以及宿舍管理

提示:本博客个为人独立博客,不是权威,仅供参考!所有思路只做交流之用!如有不足之处,望各位在评论区友善指正。



前言

这一章将介绍如何实现学生管理和楼宇管理


一、学生管理

1.后端的提前准备工作

在Student类中添加属性org和grade并生成set/get方法
在这里插入图片描述

在StudentMapper.xml中初始化学生密码
在这里插入图片描述

在StudentController中将student与班级和年级关联
在这里插入图片描述

在这里插入图片描述

2.前端页面

拷贝user文件夹作为模板,改名为student
在这里插入图片描述

修改list搜索栏
在这里插入图片描述

姓名搜索采用模糊查询,在StudentMapper.xml里修改一下
在这里插入图片描述

修改list表格信息
在这里插入图片描述

修改跳转路径
在这里插入图片描述

在这里插入图片描述

修改add表单
在这里插入图片描述

在这里插入图片描述

引入selectOrg模块并配置
在这里插入图片描述

删除不用的树形
在这里插入图片描述

在这里插入图片描述

请求查询并修改提交请求
在这里插入图片描述

拷贝add作为update模板并修改提交请求
在这里插入图片描述

添加隐藏域
在这里插入图片描述

表单赋值
在这里插入图片描述

在list.html中修改赋值方法
在这里插入图片描述

一般通过表单赋值都可以把数据传到update表单上,但是年级和班级是列表信息显示不出来,所以需要单独处理
通过数据拼接的方式为年级单独设置临时值
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

给班级单独赋值
在这里插入图片描述

年级也可以采取单独赋值的方式,这边给大家展示两种不同的方法,因此都写了

二、楼宇管理

1.后端的提前准备工作

在数据库中完善一下功能菜单结构
在这里插入图片描述

在Building类中添加属性user并生成set/get方法
在这里插入图片描述

在BuildingController中关联宿管员
在这里插入图片描述

2.前端页面

拷贝user文件夹下的页面作为模板
在这里插入图片描述

修改搜索栏
在这里插入图片描述

名称搜索采用模糊查询
在这里插入图片描述

修改表格信息
在这里插入图片描述

修改跳转路径
在这里插入图片描述

在这里插入图片描述

修改add表单
在这里插入图片描述

在这里插入图片描述

删除不用的树形,然后请求查询宿管员
在这里插入图片描述

拷贝add作为update模板并修改提交请求
在这里插入图片描述

添加隐藏域
在这里插入图片描述

表单赋值
在这里插入图片描述

修改设值方法
在这里插入图片描述

给宿管员单独赋值
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

三、寝室管理

1.数据库中写入数据

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

2.前端页面结构

新建dormitory包结构
在这里插入图片描述

list页面框架
在这里插入图片描述

3.加载楼宇

html(ClassName应该改为class,当时没发现,下面出现类似错误的同理,后面也会纠正)
在这里插入图片描述

script
在这里插入图片描述

改进BuildingController中的query方法,能根据用户身份来进行不同的查询
在这里插入图片描述

4.加载楼层

改进BuildingService中的create方法,能够添加楼层
在这里插入图片描述

script
在这里插入图片描述

html
在这里插入图片描述

style
在这里插入图片描述

在loadBuilding方法中调用loadStorey方法
在这里插入图片描述

5.加载寝室

script
在这里插入图片描述

html
在这里插入图片描述

style
在这里插入图片描述

在这里插入图片描述

在loadStorey方法中调用loadDormitory方法
在这里插入图片描述

6.加载床位

下载床位图片素材
链接:https://pan.baidu.com/s/1YXO1H33_35MLi4E9XfzZLA
提取码:8w6q
将两张图片解压到路径…\高校宿舍管理系统\front\images下

script
在这里插入图片描述

style
在这里插入图片描述

在loadDormitory方法中调用loadBed方法
在这里插入图片描述

7.寝室管理按钮

script
在这里插入图片描述

在这里插入图片描述

页面样式微调(纠正了之前的一个小错误)
在这里插入图片描述

<style>
    .storey li{
        height: 40px;
        line-height:40px;
        border-bottom: 1px solid #f1f1f1;
        font-size: 16px;
        cursor: pointer;
        padding-left: 50px;
    }

    .storey>li>span{
        float: right;
        margin-right: 10px;
    }

    .storey>li>span>button{
        cursor: pointer;
        color: #00998b;
        background: transparent;
        border: 0px;
        font-size: 20px;
    }

    .storey-bg{
        background-color: #f0f0f0;
        color: #000000;
    }

    .dormitory{
    }

    .dormitory>li{
        width: 100%;
        clear: both;
        margin-bottom: 5px;
    }

    .dormitory>li>p{
        height: 40px;
        background-color: #f8f8f8;
        line-height: 40px;
        font-size: 15px;
        cursor: pointer;
        padding-left: 10px;
        border: 1px solid #dddddd;
        border-radius: 4px;
    }

    .dormitory>li>p>span{
        float: right;
        margin-right: 10px;
    }

    .dormitory>li>p>span>button{
        cursor: pointer;
        color: #00998b;
        background: transparent;
        border: 0px;
        font-size: 20px;
    }

    .bed{
        display: none;
    }

    .bed li{
        float: left;
        width: 130px;
        height: 130px;
        border:1px solid #f0f0f0;
        margin: 10px;
        text-align: center;
        color: #999999;
    }

    .bed li:hover{
        background-color: #f0f0f0;
    }

    .bed li i{
        font-size: 20px;
        cursor: pointer;
    }

    .bed li i:hover{
        color: #00998b;
        font-size: 20px;
        cursor: pointer;
    }
</style>

新建addDormitory.html
在这里插入图片描述

<div class="layuimini-main">
    <div class="layui-form layuimini-form" lay-filter="addDormitoryForm">
        <div class="layui-form-item">
            <label class="layui-form-label required">宿舍号</label>
            <div class="layui-input-block">
                <input type="hidden" id="storeyId" name="storeyId">
                <input type="hidden" id="buildingId" name="buildingId">
                <input type="text" name="no" lay-verify="required" lay-reqtext="宿舍号不能为空" placeholder="请输入宿舍号" value="" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <select name="sex" lay-verify="required">
                    <option value="1"></option>
                    <option value="0"></option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">类型</label>
            <div class="layui-input-block">
                <select name="type" lay-verify="required">
                    <option value="2">2人间</option>
                    <option value="3">3人间</option>
                    <option value="4">4人间</option>
                    <option value="5">5人间</option>
                    <option value="6">6人间</option>
                    <option value="7">7人间</option>
                    <option value="8">8人间</option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">容量</label>
            <div class="layui-input-block">
                <input type="text" name="capacity" placeholder="请输入容量" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn">确认保存</button>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['form', 'table','axios'], function () {
        let form = layui.form,
            layer = layui.layer,
            axios = layui.axios,
            $ = layui.$;

        /**
         * 初始化表单,要加上,不然刷新部分组件可能会不加载
         */
        form.render();

        // 当前弹出层,防止ID被覆盖
        let parentIndex = layer.index;

        //监听提交
        form.on('submit(saveBtn)', function (data) {
            axios.post('dormitory/create',data.field).then(function(response){
                if(response.code == 200){
                    layer.msg(response.msg);
                }
                layer.close(parentIndex);
            }).catch(function (error) {
                layer.msg(error);
            });
            return false;
        });

    });
</script>

删除寝室
在这里插入图片描述

8.床位管理按钮

script
在这里插入图片描述

新建addBed.html
在这里插入图片描述

<div class="layuimini-main">
  <div class="layui-form layuimini-form" lay-filter="addBedForm">
    <div class="layui-form-item">
      <label class="layui-form-label required">床号</label>
      <div class="layui-input-block">
        <input type="hidden" id="dormitoryId" name="dormitoryId">
        <input type="text" name="bno" lay-verify="required" lay-reqtext="床号不能为空" placeholder="请输入床号" value="" class="layui-input">
      </div>
    </div>

    <div class="layui-form-item">
      <div class="layui-input-block">
        <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn">确认保存</button>
      </div>
    </div>
  </div>
</div>
<script>
  layui.use(['form', 'table','axios'], function () {
    let form = layui.form,
            layer = layui.layer,
            axios = layui.axios,
            $ = layui.$;

    /**
     * 初始化表单,要加上,不然刷新部分组件可能会不加载
     */
    form.render();

    // 当前弹出层,防止ID被覆盖
    let parentIndex = layer.index;

    //监听提交
    form.on('submit(saveBtn)', function (data) {
      axios.post('bed/create',data.field).then(function(response){
        if(response.code == 200){
          layer.msg(response.msg);
        }
        layer.close(parentIndex);
      }).catch(function (error) {
        layer.msg(error);
      });
      return false;
    });

  });
</script>

删除床位
在这里插入图片描述


总结

修改床位不是忘写了,后续根据业务需求再添加

第九章预计三天内更新,涉及寝室编号设置和宿舍初始化以及预选设置
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

313YPHU3

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值