@extends('Public.index')
@section('admin')
<!-- 新增 -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      </div>
      <div class="modal-body">
                <form class="form-horizontal">
                        <div class="form-group">
                            <label for="inputEmail3" class="col-sm-3 control-label"><span style="color:red">*</span> 角色名称</label>
                            <div class="col-sm-12">
                            <input type="text" class="form-control rule_name" placeholder="不能和现有的名称相同">
                            </div>
                        </div>
                        <div class="form-group">
                        <label for="inputEmail3" class="col-sm-3 control-label"><span style="color:red">*</span> 权限分配</label>
                          @foreach($node as $key => $val)
                            <div class="col-sm-12">
                              <label class="checkbox col-sm-3" style="color:#007FF9"> {{ $key }}</label>
                            </div>
                            <div class="col-sm-12">
                              @foreach($val as $v)
                                <label class="checkbox-inline">
                                  <input type="checkbox" class="access" value="{{ $v['id'] }}"> {{ $v['node_name'] }}
                                </label>　
                                @endforeach
                            </div>
                          @endforeach
                        </div>
                </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" onclick="create()">添加</button>
      </div>
    </div>
  </div>
</div>
<!-- 修改 -->
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModal2Label">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      </div>
      <div class="modal-body">
                <form class="form-horizontal">
                        <div class="form-group">
                            <label for="inputEmail3" class="col-sm-3 control-label"><span style="color:red">*</span> 角色名称</label>
                            <div class="col-sm-12">
                              <input type="text" class="form-control rule_name2">
                            </div>
                        </div>
                        <input type="hidden" class="rule_id">
                        <div class="form-group">
                        <label for="inputEmail3" class="col-sm-3 control-label"><span style="color:red">*</span> 权限分配</label>
                          @foreach($node as $key => $val)
                            <div class="col-sm-12">
                              <label class="checkbox col-sm-3" style="color:#007FF9"> {{ $key }}</label>
                            </div>
                            <div class="col-sm-12">
                              @foreach($val as $v)
                                <label class="checkbox-inline">
                                  <input type="checkbox" class="access2" value="{{ $v['id'] }}"> {{ $v['node_name'] }}
                                </label>　
                                @endforeach
                            </div>
                          @endforeach
                        </div>

                </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" onclick="update()">修改</button>
      </div>
    </div>
  </div>
</div>
<!-- 莫泰结束 -->

<div class="content-wrapper" style="min-height: 810px;">
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h4>角色列表</h4>
          </div>
          <div class="col-sm-6">
            <ol class="breadcrumb float-sm-right">
              <li class="breadcrumb-item"><a href="/admin/index">首页</a></li>
              <li class="breadcrumb-item active">权限管理</li>
              <li class="breadcrumb-item active">角色列表</li>
            </ol>
          </div>
        </div>
      </div>
    </section>
    <div class="col-xs-3">
        <button class="btn btn-primary add" data-toggle="modal" data-target="#myModal"  style="margin-left:17px;margin-bottom:15px"> 添加角色</button>
    </div>

    <section class="content">
      <div class="container-fluid">
        <div class="row">
          <div class="col-md-12">

            <div class="card">
              <div class="card-body p-0">
                <table class="table table-condensed">
                  <tbody>
               
                  <tr style="text-align:center">
                    <th>角色名</th>
                    <th>账号数量</th>
                    <th>状态</th>
                    <th style="width: 100px">操作</th>
                  </tr>
                  @foreach($rule as $key => $val)
                  <tr style="text-align:center">
                    <input type="hidden" value="{{ $val -> id }}">
                    <td>{{ $val -> rule_name }}</td>
                    <td>{{ DB::table('adminuser') -> where('rule',$val -> id) -> count() }}</td>
                    <td>
                        @if($val -> status == 1)
                        <a href="javascript:void(0)" onclick="status({{$val -> id}})"><span class="badge bg-success">使用中</span></a>
                        @else
                        <a href="javascript:void(0)" onclick="status({{$val -> id}})"><span class="badge bg-danger">停用中</span></a>
                        @endif
                    </td>
                    <td>
                        <a href="javascript:void(0)" onclick="edit({{ $val -> id }})"><i class="fa fa-edit" style="font-size: 16px;" title="编辑"></i></a>
                        @if($val -> id != 1 && $val -> id != 2)
                        <a href="javascript:void(0)" onclick="del({{$val -> id}})"><i class="fa fa-trash" style="font-size: 16px;" title="删除"></i></a>
                        @endif
                    </td>
                  </tr>
                  @endforeach
                </tbody></table>
              </div>
            </div>
          </div>
        </div>
    </section>
  </div>
  <input type="hidden" id="userid">
<script src="/admin/plugins/jquery/jquery.min.js"></script>
<script src="/admin/layer-v3.1.1/layer/layer.js"></script>
<script>
    function create()
    {
      var arr = new Array();
      $('.access:checked').each(function(k){
          arr[k] = $(this).val();
      })
      var arrs = arr.join(',');
      var rule_name = $('.rule_name').val();
        console.log(arrs,rule_name);
        if(!arrs || !rule_name) {
            layer.msg('请填写完整信息');
            return false;
        }
        $.get('/admin/admin/rule_create',{rule_name:rule_name,arrs:arrs},function(res){
          console.log(res);
            if(res.code == '1000'){
                layer.msg(res.msg);
                window.location.reload();
            }else{
                layer.msg(res.msg);
            }
        })
    }
   function del(id)
    {
        if(!id) {
            layer.msg('参数不全');
            return false;
        }
        layer.confirm('确认删除该账号吗？删除后不可恢复', {
            btn: ['确认','取消'] //按钮
            }, function(){
                $.get('/admin/admin/rule_delete',{id:id},function(res){
                    if(res.code == '1000'){
                        layer.msg(res.msg);
                        window.location.reload();
                    }else{
                        layer.alert(res.msg);
                    }
                })
        });
    }

    function status(id)
    {
        if(!id){
            layer.alert('参数错误');
            return false;
        }
        layer.confirm('确认操作吗？', {
            btn: ['确认','取消'] //按钮
            }, function(){
                $.get('/admin/admin/rule_status',{id:id},function(res){
                    if(res.code == '1000'){
                        layer.msg(res.msg);
                        window.location.reload();
                    }else{
                        layer.msg(res.msg);
                    }
                })
        });  
    }

    function edit(id)
    {
        if(!id){
            layer.alert('参数错误,请重试!');
            return false;
        }
        $.get('/admin/admin/rule_edit',{id:id},function(res){
            if(res){
              $('.rule_name2').val(res.rule_name);
              $('.rule_id').val(res.rule_id);
              $('.access2').each(function(k){
                  for(x in res.rule_node) {
                    if($(this).val() == res.rule_node[x]) {
                      $(this).attr('checked','true');
                    }
                  }
              })
            }
        })
        $('#myModal2').modal();
    }
    function update()
    {
        var rule_id = $('.rule_id').val();
        var rule_name = $('.rule_name2').val();
        var arr2 = new Array();
        $('.access2:checked').each(function(k){
            arr2[k] = $(this).val();
        })
        var arrs = arr2.join(',');
        $.get('/admin/admin/rule_update',{rule_id:rule_id,rule_name:rule_name,arrs:arrs},function(res){
            if(res.code == '1000'){
                layer.msg(res.msg);
                window.location.reload();
            }else{
                layer.alert(res.msg);
            }
        }) 
    }

</script>
@endsection
@section('title','账号列表')
@section('access','menu-open')
@section('access2','active')
@section('rule-list','active')