SSM小项目（会议管理系统）五左边菜单抽取和用户注册准备（图解超详细）

最新推荐文章于 2021-05-20 23:44:00 发布

关切得大神

最新推荐文章于 2021-05-20 23:44:00 发布

阅读量588

点赞数

分类专栏： SSM项目

本文链接：https://blog.csdn.net/qq_41115379/article/details/114334907

版权

SSM项目专栏收录该内容

24 篇文章 5 订阅

订阅专栏

上一篇博客地址：https://blog.csdn.net/qq_41115379/article/details/114334194
下一篇博客地址：https://blog.csdn.net/qq_41115379/article/details/114336585
左边菜单抽取
在login.ftl这边，针对于admin和普通员工，需要进行一些区分。
<#if currentuser??> 这个是一种freemarker的标签
经过这样子配置，admin 也就是role是2的，才拥有查看部门管理，注册审批，搜索员工，以及添加会议室的这些功能。
login.ftl

<!DOCTYPE html>
<html>
    <head>
        <title>CoolMeeting会议管理系统</title>
        <link rel="stylesheet" href="styles/common.css"/>
    </head>
    <body>
    <#include 'top.ftl'>
        <div class="page-body">
            <div class="page-sidebar">
                <div class="sidebar-menugroup">
                    <div class="sidebar-grouptitle">个人中心</div>
                    <ul class="sidebar-menu">
                        <li class="sidebar-menuitem"><a href="notifications.ftl">最新通知</a></li>
                        <li class="sidebar-menuitem active"><a href="mybookings.ftl">我的预定</a></li>
                        <li class="sidebar-menuitem"><a href="mymeetings.ftl">我的会议</a></li>
                    </ul>
                </div>
                <div class="sidebar-menugroup">
                    <div class="sidebar-grouptitle">人员管理</div>
                    <ul class="sidebar-menu">
                        <li class="sidebar-menuitem"><a href="register.ftl">员工注册</a></li>
                        <#if currentuser??&&(current.role==2)>
                        <li class="sidebar-menuitem"><a href="departments.ftl">部门管理</a></li>
                        <li class="sidebar-menuitem"><a href="approveaccount.ftl">注册审批</a></li>
                        <li class="sidebar-menuitem"><a href="searchemployees.ftl">搜索员工</a></li>
                        </#if>
                    </ul>
                </div>
                <div class="sidebar-menugroup">
                    <div class="sidebar-grouptitle">会议预定</div>
                    <ul class="sidebar-menu">
                        <#if currentuser??&&(current.role==2)>
                        <li class="sidebar-menuitem"><a href="addmeetingroom.ftl">添加会议室</a></li>
                        </#if>
                        <li class="sidebar-menuitem"><a href="meetingrooms.ftl">查看会议室</a></li>
                        <li class="sidebar-menuitem"><a href="bookmeeting.ftl">预定会议</a></li>
                        <li class="sidebar-menuitem"><a href="searchmeetings.ftl">搜索会议</a></li>
                    </ul>
                </div>
            </div>
            <div class="page-content">
                <div class="content-nav">
                    登录
                </div>
                <form action="/dologin" method="post">
                    <fieldset>
                        <legend>登录信息</legend>
                        <table class="formtable" style="width:50%">
                            <tr>
                                <td>账号名:</td>
                                <td>
                                    <input name="username" id="accountname" type="text" />
                                </td>
                            </tr>
                            <tr>
                                <td>密码:</td>
                                <td>
                                    <input name="password" id="new" type="password" />
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2" class="command">
                                    <input type="submit" value="登录" class="clickbutton" onclick="window.location.href='notifiactions.html';"/>
                                    <input type="button" value="返回" class="clickbutton" onclick="window.history.back();"/>
                                </td>
                            </tr>
                        </table>
                        <div style="color: red">${error!''}</div>
                    </fieldset>
                </form>
            </div>
        </div>
        <div class="page-footer">
            <hr/>
            更多问题，欢迎联系<a href="mailto:webmaster@eeg.com">管理员</a>
            <img src="images/footer.png" alt="CoolMeeting"/>
        </div>
    </body>
</html>

再运行一下
登录前
在这里插入图片描述
以管理员登录后

并对这个功能进行抽取，和top一样来对每一个都进行这样的操作
leftMenu.ftl

<div class="page-sidebar">
    <div class="sidebar-menugroup">
        <div class="sidebar-grouptitle">个人中心</div>
        <ul class="sidebar-menu">
            <li class="sidebar-menuitem"><a href="notifications">最新通知</a></li>
            <li class="sidebar-menuitem active"><a href="mybookings">我的预定</a></li>
            <li class="sidebar-menuitem"><a href="mymeetings">我的会议</a></li>
        </ul>
    </div>
    <div class="sidebar-menugroup">
        <div class="sidebar-grouptitle">人员管理</div>
        <ul class="sidebar-menu">
            <li class="sidebar-menuitem"><a href="register">员工注册</a></li>
            <#if currentuser??&&(currentuser.role==2)>
                <li class="sidebar-menuitem"><a href="departments">部门管理</a></li>
                <li class="sidebar-menuitem"><a href="approveaccount">注册审批</a></li>
                <li class="sidebar-menuitem"><a href="searchemployees">搜索员工</a></li>
            </#if>
        </ul>
    </div>
    <div class="sidebar-menugroup">
        <div class="sidebar-grouptitle">会议预定</div>
        <ul class="sidebar-menu">
            <#if currentuser??&&(currentuser.role==2)>
                <li class="sidebar-menuitem"><a href="addmeetingroom">添加会议室</a></li>
            </#if>
            <li class="sidebar-menuitem"><a href="meetingrooms">查看会议室</a></li>
            <li class="sidebar-menuitem"><a href="bookmeeting">预定会议</a></li>
            <li class="sidebar-menuitem"><a href="searchmeetings">搜索会议</a></li>
        </ul>
    </div>
</div>

然后删去login中的部分，并以下面的代码引入

<#include 'leftMenu.ftl'>

然后再每一个ftl文件都进行对应的修改
再运行就发现没什么问题了

用户注册准备
先在loginController这边做一个映射

@RequestMapping("/register")
public  String register(){
    return "register";
}

再运行看一下
可以输入：http://localhost:8080/register 也可以直接点击右边菜单的员工注册
在这里插入图片描述
还有些细节：
首先是关于部门的：

这边代码这样子写是不太对的，应该是通过查询数据库，通过departmentId来知道这些部门
所以先对LoginController进行修改

@RequestMapping("/register")
public  String register(Model model){
    //先注入DepartmentService
    List<Department> deps=departmentService.getAllDeps();
    //再把数据注入到model里
    model.addAttribute("deps",deps);
    return "register";
}

再增加departmentService那边的getAllDeps方法

public List<Department> getAllDeps() {
    return departmentMapper.getAllDeps();
}

再套娃，到departmentMapper 这边进行对应的getAllDeps

List<Department> getAllDeps();

最后是DepartmentMapper.xml

<select id="getDepAllDeps" resultType="org.javaboy.meeting.model.Department">
    select * from department;
</select>

最后在register.ftl这边，就会有model 那边过来到前端的deps变量过来，然后会进行判断

<td>所在部门：</td>
                         <td>
                             <select name="deptid">    
                               <#if deps??>
                                   <#list deps as dep>
                                       <option value="${dep.departmentid}">${dep.departmentname}</option>
                                   </#list>
                               </#if>
                              </select>
                         </td>

再者就是确认密码的问题：
主要的核心就是，写一个check方法，将两次密码进行比对

<!DOCTYPE html>
<html>
    <head>
        <title>CoolMeeting会议管理系统</title>
        <link rel="stylesheet" href="styles/common.css"/>
        <style type="text/css">
            
        </style>
    </head>
    <body>
    <#include 'top.ftl'>
        <div class="page-body">
            <#include 'leftMenu.ftl'>
            <div class="page-content">
                <div class="content-nav">
                    人员管理 > 员工注册
                </div>
                <form>
                    <fieldset>
                        <legend>员工信息</legend>
                        <table class="formtable" style="width:50%">
                            <tr>
                                <td>姓名：</td>
                                <td>
                                    <input type="text" id="employeename" maxlength="20"/>
                                </td>
                            </tr>
                            <tr>
                                <td>账户名：</td>
                                <td>
                                    <input type="text" id="accountname" maxlength="20"/>
                                </td>
                            </tr>
                            <tr>
                                <td>密码：</td>
                                <td>
                                    <input type="password" id="password" maxlength="20" placeholder="请输入6位以上的密码"/>
                                </td>
                            </tr>
                            <tr>
                                <td>确认密码：</td>
                                <td>
                                    <input type="password" id="confirm" maxlength="20" onchange="check()"/>
                                    <div style="color: red" id="confirminfo"></div>
                                </td>
                            </tr>
                            <tr>
                                <td>联系电话：</td>
                                <td>
                                    <input type="text" id="phone" maxlength="20"/>
                                </td>
                            </tr>
                            <tr>
                                <td>电子邮件：</td>
                                <td>
                                    <input type="text" id="email" maxlength="20"/>
                                </td>
                            </tr>
                     <td>所在部门：</td>
                                <td>
                                    <select name="deptid">    
                                       <#if deps??>
                                           <#list deps as dep>
                                               <option value="${dep.departmentid}">${dep.departmentname}</option>
                                           </#list>
                                       </#if>
                                     </select>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="6" class="command">
                                    <input type="button" class="clickbutton" value="注册"/>
                                    <input type="reset" class="clickbutton" value="重置"/>
                                </td>
                            </tr>
                        </table>
                    </fieldset>
                </form>
            </div>
        </div>
        <div class="page-footer">
            <hr/>
            更多问题，欢迎联系<a href="mailto:webmaster@eeg.com">管理员</a>
            <img src="images/footer.png" alt="CoolMeeting"/>
        </div>
    <script>
      function check(){
         var password=document.getElementById("password");
         var confirm=document.getElementById("confirm");
         var confirminfo=document.getElementById("confirminfo");
          if(password.value!=confirm.value){
              confirminfo.innerHTML='两次输入密码不一致';
          }
          else{
              confirminfo.innerHTML='';
          }
      }
    </script>
    </body>
</html>

运行一下
在这里插入图片描述

关切得大神

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
2
评论
SSM小项目（会议管理系统）五左边菜单抽取和用户注册准备（图解超详细）

左边菜单抽取在login.ftl这边，针对于admin和普通员工，需要进行一些区分。<#if currentuser??> 这个是一种freemarker的标签经过这样子配置，admin 也就是role是2的，才拥有查看部门管理，注册审批，搜索员工，以及添加会议室的这些功能。login.ftl<!DOCTYPE html><html> <head> <title>CoolMeeting会议管理系统</ti
复制链接

扫一扫