>用户列表(采用tp原有的模板绑定数据)
~~~html
<div class="row">
<div class="widget-box">
<div class="widget-header">
<h4 class="smaller">
条件搜索框
</h4>
</div>
<div class="widget-body">
<div class="widget-main">
<form action="" method="get" >
<select name="query[status]">
<option value="">请选择状态</option>
<option value="1" <eq name="query['status']" value="1">selected</eq> >开启</option>
<option value="0" <eq name="query['status']" value="0">selected</eq> >关闭</option>
</select>
<input type="text" placeholder="用户名称" name="query[username]" value="{$query.username}">
<button type="submit" class="btn btn-xs btn-success">
<i class="icon-search bigger-110"></i>
<span class="bigger-110 no-text-shadow">搜索</span>
</button>
</form>
</div>
</div>
</div>
</div>
<!-- PAGE CONTENT BEGINS -->
<div class="row">
<div class="well well-sm">
<a href="{:U('member/show')}" class="btn btn-sm btn-success">
<i class="icon-plus bigger-110"></i>
<span class="bigger-110 no-text-shadow">添加</span>
</a>
<a onclick="changeStatus('off')" class="btn btn-sm btn-warning">
<i class="icon-ban-circle bigger-110"></i>
<span class="bigger-110 no-text-shadow">禁用</span>
</a>
<a onclick="changeStatus('open')" class="btn btn-sm btn-success">
<i class="icon-ok bigger-110"></i>
<span class="bigger-110 no-text-shadow">开启</span>
</a>
<a onclick="deleteCheck()" class="btn btn-sm btn-danger">
<i class="icon-trash bigger-110"></i>
<span class="bigger-110 no-text-shadow">删除</span>
</a>
</div>
</div>
<div class="row">
<div class="table-responsive">
<table id="sample-table-1" class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th class="center">
<label>
<input class="ace" type="checkbox">
<span class="lbl"></span>
</label>
</th>
<th>用户名称</th>
<th>Email</th>
<th>角色</th>
<th class="hidden-480">最后登录时间</th>
<th class="hidden-480">登录IP</th>
<th>状态</th>
<th>操作</th>
</tr>
</thead>
<form id="checkBox" method="post" action="{:U('member/remove')}">
<tbody>
<volist name="list" id="item">
<tr>
<td class="center">
<label>
<input class="ace" name="ids[]" value="{$item.id}" type="checkbox">
<span class="lbl"></span>
</label>
</td>
<td>{$item.username}</td>
<td>{$item.email}</td>
<td>{$item.role}</td>
<td class="hidden-480">{$item.login_time|date='Y-m-d H:i:s',###}</td>
<td class="hidden-480">{$item.login_ip}</td>
<td>
<eq name="item.status" value="1">
<i class="icon-ok bigger-120"></i>
<else/>
<i class="icon-ban-circle bigger-120"></i>
</eq>
</td>
<td>
<div class="visible-md visible-lg hidden-sm hidden-xs btn-group">
<a href="{:U('member/show',['id'=>$item['id']])}" class="btn btn-xs btn-info">
<i class="icon-edit bigger-120"></i>
编辑
</a>
<a onclick="actionOne(this,'delete')" class="btn btn-xs btn-danger">
<i class="icon-trash bigger-120"></i>
删除
</a>
<eq name="item.status" value="1">
<a onclick="actionOne(this,'off')" class="btn btn-xs btn-warning">
<i class="icon-ban-circle bigger-120"></i>
禁止
</a>
<else/>
<a onclick="actionOne(this,'open')" class="btn btn-xs btn-success">
<i class="icon-ok bigger-120"></i>
开启
</a>
</eq>
</div>
<div class="visible-xs visible-sm hidden-md hidden-lg">
<div class="inline position-relative">
<button class="btn btn-minier btn-primary dropdown-toggle" data-toggle="dropdown">
<i class="icon-cog icon-only bigger-110"></i>
</button>
<ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
<li>
<a href="{:U('member/show',['id'=>$item['id']])}" class="tooltip-success" data-rel="tooltip" title="" data-original-title="编辑">
<span class="green">
<i class="icon-edit bigger-120"></i>
</span>
</a>
</li>
<li>
<a onclick="actionOne(this,'delete')" class="tooltip-error" data-rel="tooltip" title="" data-original-title="删除">
<span class="red">
<i class="icon-trash bigger-120"></i>
</span>
</a>
</li>
<eq name="item.status" value="1">
<li>
<a onclick="actionOne(this,'off')" class="tooltip-info" data-rel="tooltip" title="" data-original-title="禁止">
<span class="blue">
<i class="icon-ban-circle bigger-120"></i>
</span>
</a>
</li>
<else/>
<li>
<a onclick="actionOne(this,'open')" class="tooltip-success" data-rel="tooltip" title="" data-original-title="开启">
<span class="green">
<i class="icon-ok bigger-120"></i>
</span>
</a>
</li>
</eq>
</ul>
</div>
</div>
</td>
</tr>
</volist>
</tbody>
</form>
</table>
<div class="panel-body center">
{$page}
</div>
</div>
</div>
~~~
>js部分代码
~~~JavaScript
<script type="text/javascript">
jQuery(function($) {
$('table th input:checkbox').on('click' , function(){
var that = this;
$(this).closest('table').find('tr > td:first-child input:checkbox')
.each(function(){
this.checked = that.checked;
$(this).closest('tr').toggleClass('selected');
});
});
$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
function tooltip_placement(context, source) {
var $source = $(source);
var $parent = $source.closest('table')
var off1 = $parent.offset();
var w1 = $parent.width();
var off2 = $source.offset();
var w2 = $source.width();
if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
return 'left';
}
})
//删除选中选项
function deleteCheck() {
layer.confirm('您确定要删除吗', {
btn: ['确定','取消'], //按钮
shade: false //不显示遮罩
}, function(index){
layer.close(index);
util.submit('#checkBox',function (data) {
if(data.status==true){
layer.msg(data.message, function(){
location.reload();
});
}else {
layer.msg(data.message);
}
})
});
}
function changeStatus(action) {
var params = $('#checkBox').serialize()+"&action="+action;
util.post("{:U('member/status')}",params,function (data) {
if(data.status==true){
layer.msg(data.message, function(){
location.reload();
});
}else {
layer.msg(data.message);
}
})
}
//删除/改变一个选项
function actionOne(_this,action) {
$(_this).parents('tr').find('[type="checkbox"]').prop("checked", true);
switch (action){
case 'delete':deleteCheck();return false;
case 'off':changeStatus('off');break;
case 'open':changeStatus('open');break;
}
}
</script>
~~~
php控制器相关操作
~~~php
/**
* @title 用户列表
* 用户列表
*/
public function index(){
$list = $this->search(M('admin'),15);
//显示管理员
$user_ids = array_column($list,'id');
$map['user_id'] = ['in',$user_ids];
$role = M('role_user u')->join('left join '.C('DB_PREFIX').'role r on r.id=u.role_id')->where($map)->select();
$role = array_column($role,'name','user_id');
foreach($list as $key=>$value){
$list[$key]['role'] = $role[$value['id']];
}
$this->assign('list',$list);
$this->display();
}
/**
* @title 查看用户
* 查看编辑数据及渲染添加页面
*/
public function show(){
$id = I('get.id',0);
if(IS_AJAX){
$model = new AdminModel();
$data =$model->find($id);
if($data){
$data['status'] = ($data['status']==1)?true:false;
$role = M('role_user')->where(['user_id'=>$id])->find();
$data['role_id'] = $role['role_id'];
$this->ajaxReturn($data);
}
$this->ajaxReturn(false);
}
$this->assign('role',M('role')->select());
$this->assign('show_id',$id);
$this->display();
}
/**
* @title 操作用户数据
* 添加或编辑用户
*/
public function form(){
if (IS_POST){
$data = I('post.');
$model = new AdminModel();
$this->ajaxReturn($res = $model->store($data));
}else{
new \HttpRequestMethodException('请求不合法');
}
}
/**
* @title 删除数据
*/
public function remove(){
$data = I('post.ids');
if(IS_AJAX && is_array($data)){
$map['id'] = ['in',$data];
$result = M('admin')->where($map)->delete();
if($result){
$this->ajaxReturn(['status'=>true,'message'=>'删除成功']);
}else{
$this->ajaxReturn(['status'=>false,'message'=>'删除失败']);
}
}else{
new \HttpRequestMethodException('请求不合法');
}
}
/**
* @title 用户状态
* 改变用户状态
*/
public function status(){
$ids = I('post.ids');
$action = I('post.action');
if(IS_AJAX && is_array($ids) && in_array($action,['open','off'])){
$map['id'] = ['in',$ids];
switch ($action){
case 'open': $data['status']=1;$message = '用户开启'; break;
case 'off': $data['status']=0;$message = '用户关闭'; break;
}
$result = M('admin')->where($map)->save($data);
if($result){
$this->ajaxReturn(['status'=>true,'message'=>$message]);
}else{
$this->ajaxReturn(['status'=>false,'message'=>$message.'失败']);
}
}else{
new \HttpRequestMethodException('请求不合法');
}
}
~~~