#@layout()
#define main()
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
  <legend>学生添加</legend>
</fieldset>
 
<form class="layui-form" action="/student/save" method="post">
    <input type="hidden" name="student.id" value="#(student.id??)" />

  <div class="layui-form-item">
    <label class="layui-form-label">学生账号</label>
    <div class="layui-input-block">
      <input type="text" name="student.account" value="#(student.account??)" lay-verify="title" autocomplete="off" placeholder="请输入姓名" class="layui-input" required>
    </div>
  </div>
  
  <div class="layui-form-item">
    <label class="layui-form-label">学生密码</label>
    <div class="layui-input-block">
      <input type="password" name="student.password" value="#(student.password??)" lay-verify="title" autocomplete="off" placeholder="请输入密码" class="layui-input" required>
    </div>
  </div>
  
  <div class="layui-form-item">
    <label class="layui-form-label">学生姓名</label>
    <div class="layui-input-block">
      <input type="text" name="student.xueName" value="#(student.xueName??)" lay-verify="title" autocomplete="off" placeholder="请输入姓名" class="layui-input" required>
    </div>
  </div>
  
  <div class="layui-form-item">
    <label class="layui-form-label">学生性别</label>
    <div class="layui-input-block">
      <input type="radio" name="student.xueSex" value="男" title="男" 
          #if( student.xueSex?? == '男' )
              checked=""
          #end ><div class="layui-unselect layui-form-radio layui-form-radioed"><i class="layui-anim layui-icon"></i><div>男</div></div>
      <input type="radio" name="student.xueSex" value="女" title="女" 
          #if( student.xueSex?? == '女' )
              checked=""
          #end ><div class="layui-unselect layui-form-radio"><i class="layui-anim layui-icon"></i><div>女</div></div>
    </div>
  </div>
  
  
  <div class="layui-form-item">
    <label class="layui-form-label">学生班级</label>
    <div class="layui-input-block">
      <input type="text" name="student.xueClass" value="#(student.xueClass??)" lay-verify="title" autocomplete="off" placeholder="请输入班级" class="layui-input" required>
    </div>
  </div>
  
  <div class="layui-form-item">
    <label class="layui-form-label">学生身份</label>
    <div class="layui-input-block">
      <input type="radio" name="student.is_admin" value="0" title="普通学生" 
      #if( student.is_admin?? == 0 )
              checked=""
      #end ><div class="layui-unselect layui-form-radio layui-form-radioed"><i class="layui-anim layui-icon"></i><div>普通学生</div></div>
      <input type="radio" name="student.is_admin" value="1" title="管理员"
      #if( student.is_admin?? == 1 )
              checked=""
      #end><div class="layui-unselect layui-form-radio"><i class="layui-anim layui-icon"></i><div>管理员</div></div>
    </div>
  </div>
  
  <div class="layui-form-item">
    <label class="layui-form-label">学生邮箱</label>
    <div class="layui-input-block">
      <input type="text" name="student.xueEmail" value="#(student.xueEmail??)" lay-verify="title" autocomplete="off" placeholder="请输入班级" class="layui-input" required>
    </div>
  </div>
  
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
</form>

<script src="/static/layui/layui.js"></script>
<script>
//Demo
layui.use('form', function(){
  var form = layui.form;
  
  //监听提交
  form.render();
  
  form.on('submit(formDemo)', function(data){
    layer.msg(JSON.stringify(data.field));
    return false;
  });
});
</script>

#end
add
#@layout()
#define main()
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
  <legend>静态表格</legend>
</fieldset>
 <div style="margin-left:20px;">
 
    <div>
           <div>
             <button class="layui-btn layuiadmin-btn-list" data-type="add" onclick="window.location.href='/student/add'">添加学生</button>
           </div>
   </div>
        
    <div class="layui-form">
      <table class="layui-table">
        <colgroup>
          <col width="150">
          <col width="150">
          <col width="200">
          <col>
        </colgroup>
        <thead>
          <tr>
            <th>编号</th>
            <th>账号</th>
            <th>密码</th>
            <th>姓名</th>
            <th>性别</th>
            <th>班级</th>
            <th>身份</th>
            <th>邮箱</th>
            <th>操作</th>
          </tr> 
        </thead>
        <tbody>
        #for(x : list.getList())
          <tr>
            <td>#(x.id)</td>
            <td>#(x.account)</td>
            <td>#(x.password)</td>
            <td>#(x.xueName)</td>
            <td>#(x.xueSex)</td>
            <td>#(x.xueClass)</td>
            <td>
                #if ( x.is_admin == 1)
                    管理员
                #else
                    普通学生
                #end
               </td>
               <td>#(x.xueEmail)</td>
            <td>
                <div class="layui-table-cell laytable-cell-1-action">
                    <a class="layui-btn layui-btn-normal layui-btn-xs" href="/student/edit/#(x.id)"><i class="layui-icon layui-icon-edit"></i>编辑</a>
                    <a class="layui-btn layui-btn-warm layui-btn-xs" href="/student/delete/#(x.id)"><i class="layui-icon layui-icon-delete"></i>删除</a>
                </div>
            </td>
          </tr>
          #end
        </tbody>
      </table>
    </div>
    #@paginate(list.pageNumber, list.totalPage, "/student/list/")
 </div>
#end
list
#@layout()
#define main()

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
  <legend>动态表格</legend>
</fieldset>

<div style="margin-left:20px;" >
<div class="layui-btn-group demoTable">
  <button class="layui-btn" data-type="getCheckData">获取选中行数据</button>
  <button class="layui-btn" data-type="getCheckLength">获取选中数目</button>
  <button class="layui-btn" data-type="isAll">验证是否全选</button>
</div> 
 
<table class="layui-table" lay-data="{ url:'/student/lists', page:true, id:'id'}" lay-filter="demo">
  <thead>
    <tr>
      <th lay-data="{type:'checkbox', fixed: 'left'}"></th>
      <th lay-data="{field:'id',  width:80,sort: true, fixed: true}">编号</th>
      <th lay-data="{field:'account'}">学生账号</th>
      <th lay-data="{field:'password'}">学生姓名</th>
      <th lay-data="{field:'xueName'}">学生密码</th>
      <th lay-data="{field:'xueSex'}">学生性别</th>
      <th lay-data="{field:'xueClass'}">学生班级</th>
      <th lay-data="{field:'is_admin'}">学生身份</th>
      <th lay-data="{field:'xueEmail'}">学生邮箱</th>
      <th lay-data="{fixed: 'right', width:178, align:'center', toolbar: '#barDemo'}">操作</th>
    </tr>
  </thead>
</table>

</div>               


<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

#end      


<script src="/static/layui/layui.js" charset="utf-8"></script>
<!-- 注意:如果你直接复制所有代码到本地,上述js路径需要改成你本地的 --> 
 
<script>
layui.use('table', function(){
  var table = layui.table;

  //监听表格复选框选择
  table.on('checkbox(demo)', function(obj){
    console.log(obj)
  });

  layer.msg('这是动态表格,www.hiai.top');
  
  //监听工具条
  table.on('tool(demo)', function(obj){
    var data = obj.data;
    if(obj.event === 'detail'){
      layer.msg('ID:'+ data.id + ' 的查看操作');
    } else if(obj.event === 'del'){
      layer.confirm('真的删除行么', function(index){
        obj.del();
        layer.close(index);
         // $.post('/student/delete', {id:id}, function(str){

            //});
      });
    } else if(obj.event === 'edit'){
        //$.post("/student/edit",{"id":id}
        layer.alert('编辑行:<br>'+ JSON.stringify(data))
    }
  });
  
  
  var $ = layui.$, active = {
    getCheckData: function(){ //获取选中数据
      var checkStatus = table.checkStatus('id')
      ,data = checkStatus.data;
      layer.alert(JSON.stringify(data));
    }
    ,getCheckLength: function(){ //获取选中数目
      var checkStatus = table.checkStatus('id')
      ,data = checkStatus.data;
      layer.msg('选中了:'+ data.length + ' 个');
    }
    ,isAll: function(){ //验证是否全选
      var checkStatus = table.checkStatus('id');
      layer.msg(checkStatus.isAll ? '全选': '未全选')
    }
  };
  
  $('.demoTable .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });
});
</script>
listStu
#@layout()
#define main()
<div style="padding: 15px;">
    <fieldset class="layui-elem-field layui-field-title">
      <legend>首页</legend>
    </fieldset>
    <blockquote class="layui-elem-quote">
           欢迎用户:#(session.loginUser.account)
    </blockquote>
    <blockquote class="layui-elem-quote">
           用户姓名:#(session.loginUser.xueName)
    </blockquote>
    <blockquote class="layui-elem-quote">
           开发者:<a href="http://www.hiai.top">www.hiai.top</a>
    </blockquote>
</div>
#end
student
<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="shortcut icon" href="https://www.hiai.top/usr/themes/HIAI/favicon.ico">
    <title>找回密码</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" /> 

    <link rel="stylesheet" type="text/css" href="/static/login/vendor/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/static/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="/static/login/fonts/iconic/css/material-design-iconic-font.min.css">
    <link rel="stylesheet" type="text/css" href="/static/login/css/util.css">
    <link rel="stylesheet" type="text/css" href="/static/login/css/main.css">
</head>

<body>

    <div class="limiter">
        <div class="container-login100" style="background-image: url('/static/login/images/bg-02.jpg');">
            <div class="wrap-login100 p-l-55 p-r-55 p-t-65 p-b-54">
                <form class="login100-form validate-form" action="/emailsend" method="post">
                    <span class="login100-form-title p-b-49">找回密码</span>

                    <div class="wrap-input100 validate-input m-b-23" data-validate="请输入用户邮箱">
                        <span class="label-input100">用户邮箱</span>
                        <input class="input100" type="text" name="xueEmail" placeholder="请输入用户邮箱" autocomplete="off" >
                        <span class="focus-input100" data-symbol="&#xf206;"></span>
                    </div>
                    
                    <div class="text-right p-t-8 p-b-31">
                        <a href="/">返回登录</a>
                    </div>

                    <div class="container-login100-form-btn">
                        <div class="wrap-login100-form-btn">
                            <div class="login100-form-bgbtn"></div>
                            <button class="login100-form-btn">发送邮件</button>
                        </div>
                    </div>

                    <div class="txt1 text-center p-t-10">
                        #if(errorMsg)
                            <span style="color: red">#(errorMsg)</span>
                            #end
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script src="/static/login/vendor/jquery/jquery-3.2.1.min.js"></script>
    <script src="/static/login/js/main.js"></script>
</body>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?ce0a6af43c652c3267509e86227948e0";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>

</html>
redme
<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="shortcut icon" href="https://www.hiai.top/usr/themes/HIAI/favicon.ico">
    <title>用户登录</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" /> 

    <link rel="stylesheet" type="text/css" href="/static/login/vendor/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/static/login/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="/static/login/fonts/iconic/css/material-design-iconic-font.min.css">
    <link rel="stylesheet" type="text/css" href="/static/login/css/util.css">
    <link rel="stylesheet" type="text/css" href="/static/login/css/main.css">
</head>

<body>

    <div class="limiter">
        <div class="container-login100" style="background-image: url('/static/login/images/bg-02.jpg');">
            <div class="wrap-login100 p-l-55 p-r-55 p-t-65 p-b-54">
                <form class="login100-form validate-form" action="/login" method="post">
                    <span class="login100-form-title p-b-49">用户登录</span>

                    <div class="wrap-input100 validate-input m-b-23" data-validate="请输入用户名">
                        <span class="label-input100">用户名</span>
                        <input class="input100" type="text" name="account" placeholder="请输入用户名" autocomplete="off">
                        <span class="focus-input100" data-symbol="&#xf206;"></span>
                    </div>

                    <div class="wrap-input100 validate-input" data-validate="请输入密码">
                        <span class="label-input100">密码</span>
                        <input class="input100" type="password" name="password" placeholder="请输入密码">
                        <span class="focus-input100" data-symbol="&#xf190;"></span>
                    </div>

                    <div class="text-right p-t-8 p-b-31">
                        <a href="/redme">忘记密码?</a>
                    </div>

                    <div class="container-login100-form-btn">
                        <div class="wrap-login100-form-btn">
                            <div class="login100-form-bgbtn"></div>
                            <button class="login100-form-btn">登 录</button>
                        </div>
                    </div>

                    <div class="txt1 text-center p-t-10">
                        #if(errorMsg)
                            <span style="color: red">#(errorMsg)</span>
                            #end
                    </div>
                    <!--  
                    <div class="flex-col-c p-t-25">
                        <a href="javascript:" class="txt2">立即注册</a>
                    </div> -->
                </form>
            </div>
        </div>
    </div>

    <script src="/static/login/vendor/jquery/jquery-3.2.1.min.js"></script>
    <script src="/static/login/js/main.js"></script>
</body>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?ce0a6af43c652c3267509e86227948e0";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>

</html>
index
#define layout()
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>学生管理系统</title>
  <link rel="stylesheet" href="/static/layui/css/layui.css">
  <link rel="shortcut icon" href="https://www.hiai.top/usr/themes/HIAI/favicon.ico">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
  <div class="layui-header">
    <div class="layui-logo">layui 后台布局</div>
    <!-- 头部区域(可配合layui已有的水平导航) -->
    <ul class="layui-nav layui-layout-left">
      <li class="layui-nav-item"><a href="/student">首页</a></li>
      <li class="layui-nav-item"><a href="http://www.hiai.top">www.hiai.top</a></li>
    </ul>
    <ul class="layui-nav layui-layout-right">
      <li class="layui-nav-item">
        <a href="javascript:;">
          <img src="/static/logo.jpg" class="layui-nav-img">#(session.loginUser.xueName)
        </a>
      </li>
      <li class="layui-nav-item"><a href="/logout">退了</a></li>
    </ul>
  </div>
  
  <div class="layui-side layui-bg-black">
    <div class="layui-side-scroll">
      <!-- 左侧导航区域(可配合layui已有的垂直导航) -->
      <ul class="layui-nav layui-nav-tree"  lay-filter="test">
        <li class="layui-nav-item layui-nav-itemed">
          <a class="" href="javascript:;">学生管理</a>
          <dl class="layui-nav-child">
            <dd><a href="/student/list">静态列表</a></dd>
            <dd><a href="/student/listStu">动态列表</a></dd>
            <dd><a href="/student/add">添加学生</a></dd>
          </dl>
        </li>
      </ul>
    </div>
  </div>
  
  <div class="layui-body">
    <!-- 内容主体区域 -->
    #@main()
  </div>
  
  <div class="layui-footer">
    <!-- 底部固定区域 -->
    © hiai.top 学生管理系统
  </div>
</div>

<script src="/static/layui/layui.js"></script>
<script>
//JavaScript代码区域
layui.use('element', function(){
  var element = layui.element;
  
});
</script>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?ce0a6af43c652c3267509e86227948e0";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
</body>
</html>
#end
_layout
#define paginate(currentPage, totalPage, link)
    #if(totalPage <= 0 || currentPage > totalPage) #return #end
    #setLocal(startPage = currentPage - 4)
    #if (startPage < 1) #setLocal(startPage = 1) #end
    
    #setLocal(endPage = currentPage + 4)
    #if (endPage > totalPage) #setLocal(endPage = totalPage) #end
    
    <div class="pagination" id="demo1" style="text-align: center;">
        <div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-2">
            #if (currentPage <= 8)
                #setLocal(startPage = 1)
            #end
            #if ((totalPage - currentPage) < 8)
                #setLocal(endPage = totalPage)
            #end
            
            #if (currentPage == 1)
                <span class="disabled prev_page">上页</span>
            #else
                <a href="#(link)#(currentPage - 1)#(append)" class="prev_page">上页</a>
            #end
            
            #if (currentPage > 8)
                <a href="#(link)#(1)#(append)">#(1)</a>
                <a href="#(link)#(2)#(append)">#(2)</a>
                <span class="gap">…</span>
            #end
            
            #for(i : [startPage..endPage])
                #if (currentPage == i)
                    <span class="current">#(i)</span>
                #else
                    <a href="#(link)#(i)#(append)">#(i)</a>
                #end
            #end
            
            #if ((totalPage - currentPage) >= 8)
                <span class="gap">…</span>
                <a href="#(link)#(totalPage - 1)#(append)">#(totalPage - 1)</a>
                <a href="#(link)#(totalPage)#(append)">#(totalPage)</a>
            #end
            
            #if (currentPage == totalPage)
                <span class="disabled next_page">下页</span>
            #else
                <a href="#(link)#(currentPage + 1)#(append)" class="next_page" rel="next">下页</a>
            #end
        </div>
    </div>
#end
_paginate

 

posted on 2023-12-13 11:26  夜的第七章i  阅读(4)  评论(0编辑  收藏  举报