今日学习笔记
利用AdminLTE搭建框架，编写前段页面
登录页面
<body class="hold-transition login-page">
<div class="login-box">
<div class="login-logo">
<a href="all-admin-index.html"><b></b>后台管理系统</a>
</div>
<!-- /.login-logo -->
<div class="login-box-body">
<p class="login-box-msg">登录系统</p>
<form action="all-admin-index.html" method="get">
<div class="form-group has-feedback">
<input type="userId" class="form-control" placeholder="用户名">
<span class="glyphicon glyphicon-user form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
<input type="password" class="form-control" placeholder="密码">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<div class="row">
<div class="col-xs-8">
<div class="checkbox icheck">
<label><input type="checkbox"> 下次自动登录</label>
</div>
</div>
<!-- /.col -->
<div class="col-xs-4">
<button type="submit" class="btn btn-primary btn-block btn-flat" >登录</button>
</div>
<!-- /.col -->
</div>
</form>
<a href="#">忘记密码</a><br>
</div>
用户添加
<div class="panel panel-default">
<div class="panel-heading">用户信息</div>
<div class="row data-type">
<div class="col-md-2 title">用户名称</div>
<div class="col-md-4 data">
<input type="text" class="form-control" name="username"
placeholder="用户名称" value="">
</div>
<div class="col-md-2 title">密码</div>
<div class="col-md-4 data">
<input type="password" class="form-control" name="password"
placeholder="密码" value="">
</div>
<div class="col-md-2 title">邮箱</div>
<div class="col-md-4 data">
<input type="text" class="form-control" name="email"
placeholder="邮箱" value="">
</div>
<div class="col-md-2 title">联系电话</div>
<div class="col-md-4 data">
<input type="text" class="form-control" name="phoneNum"
placeholder="联系电话" value="">
</div>
<div class="col-md-2 title">用户状态</div>
<div class="col-md-4 data">
<select class="form-control select2" style="width: 100%"
name="status">
<option value="0" selected="selected">关闭</option>
<option value="1">开启</option>
</select>
</div>
</div>
</div>
<section class="content"> <!-- .box-body -->
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">列表</h3>
</div>
<div class="box-body">
<!-- 数据表格 -->
<div class="table-box">
<!--工具栏-->
<div class="pull-left">
<div class="form-group form-inline">
<div class="btn-group">
<button type="button" class="btn btn-default" title=
"新建">
<i class="fa fa-file-o"></i> 新建
</button>
<button type="button" class="btn btn-default" title=
"刷新">
<i class="fa fa-refresh"></i> 刷新
</button>
</div>
</div>
</div>
<div class="box-tools pull-right">
<div class="has-feedback">
<input type="text" class="form-control input-sm"
placeholder="搜索">
<section class="content-header">
<h1>
用户管理 <small>全部用户</small>
</h1>
<ol class="breadcrumb">
<li><a href="../index.jsp"><i
class="fa fa-dashboard"></i> 首页</a></li>
<li><a
href="../user/findAll.do">用户管理</a></li>
<li class="active">全部用户</li>
</ol>
</section>
<!-- 内容头部 /-->
<!-- 正文区域 -->
<section class="content"> <!-- .box-body -->
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">列表</h3>
</div>
<div class="box-body">
<!-- 数据表格 -->
<div class="table-box">
<!--工具栏-->
<div class="pull-left">
<div class="form-group form-inline">
<div class="btn-group">
<button type="button" class="btn btn-default" t
itle="新建">
<i class="fa fa-file-o"></i> 新建
</button>
<button type="button" class="btn btn-default" t
itle="刷新">
<i class="fa fa-refresh"></i> 刷新
</button>
</div>
</div>
</div>
<div class="box-tools pull-right">
<div class="has-feedback">
<input type="text" class="form-control input-sm" placeholder="搜索">
</div>
</div>
角色添加
<section class="content"> <input type="hidden" name="userId"
value="1">
<table id="dataList"
class="table table-bordered table-striped table-hover dataT
able">
<thead>
<tr>
<th class="" style="padding-right: 0px">
<input id="selall"
type="checkbox" class="icheckbox_square-blue"></
th>
<th class="sorting_asc">ID</th>
<th class="sorting">角色名称</th>
<th class="sorting">角色描述</th>
</tr>
</thead>
<tbody>
<tr>
<td><input name="ids" type="checkbox" value="1">
</td>
<td>1</td>
<td>VV</td>
<div class="tab-pane" id="tab-select">
</div>
</div>
</tr>
<div class="row data-type">
<div class="col-md-2 title">角色设置</div>
<div class="col-md-4 data">
<select class="form-control">
<option>超级管理员</option>
<option>管理员</option>
<option>普通用户</option>
<option>只读用户</option>
</select>
</div>
<tr>
<td><input name="ids" type="checkbox" value="2">
</td>
<td>2</td>
<td>user1</td>
<td>普通用户</td>
</tr>
<tr>
<td><input name="ids" type="checkbox" value="3">
</td>
<td>3</td>
<td>user2</td>
<td>普通用户</td>
</tr>
<tr>
<td><input name="ids" type="checkbox" value="4">
</td>
<td>4</td>
<td>guest</td>
<td>测试帐号</td>
</tr>
</tbody>
</table>
<!--订单信息/--> <!--工具栏-->
<div class="box-tools text-center">
<button type="submit" class="btn bg-maroon">保存</button>
<button type="button" class="btn bg-default"
onclick="history.back(-1);">返回</button>
</div>
<!--工具栏/--> </section>
<!-- 正文区域 /-->
</form>
</div>
浙公网安备 33010602011771号