@extends('layouts.crm')
@section('title')部门管理@endsection
@section('header')
    <style>
        .fr{
            width: 196px;
            height: 30px;
            color: #666;
            padding-left: 10px;
            background: #FFFFFF;
        }
        .choose-member-move-box .p-e-list ul li input[type='radio'] {
            margin-left: 80px;
            position: relative;
            top: 2px;
        }

    </style>
@endsection
@section('navbread')
    {{-- */ $navbread = [
        ['name' => '系统设置', 'href' =>  ''],
        ['name' => '部门管理', 'href' =>  ''],

        ] /* --}}
@endsection
@section('body')

    <div  class='parental-evaluation-box clearfix'>
        <div class='p-e-left p-l'>
            <h3>部门列表</h3>
            <div class='p-e-list'>
                @if(count($dept))
                    @foreach($dept as $k=>$v)
                        <div class='p-e-list-top'>
                            <span class='layui-icon layui-icon-triangle-d'></span>
                            <span>{{ $v['og_name'] }}</span>
                            <span>({{ isset($v['small']) ? count($v['small']) : '' }})</span>
                        </div>
                        <ul>
                            @if(isset($v['small']))
                                @foreach($v['small'] as $k1=>$v1)
                                    <li class='p-e-list-item'>
                                        <img class='avatar-img' src="/crm/img/male.png" alt="">
                                        <span>{{ $v1['og_name'] }}</span>
                                    </li>
                                @endforeach
                            @endif
                        </ul>
                    @endforeach
                @endif
            </div>
        </div>


        <div class='p-e-right p-l'>
            <div style='margin-top:20px;text-align: right;' class='main-tab-box-1  clearfix'>
                {{--<button class='layui-btn layui-btn-info add-dept'>增加</button>
                <button class='layui-btn layui-btn-delete  department-delete-btn dept-del'>删除</button>--}}
            </div>
            <div class='c-table'>
                <table style='margin-top:20px;'  class="layui-table system-s-table">
                    <colgroup>
                        <col width="10%">
                        <col width="12%">
                        <col width="12%">
                        <col width="30%">
                        <col width="15%">
                        <col width="20%">
                        <col>
                    </colgroup>
                    <thead>
                    <tr>
                        <th>
                            <input type="checkbox" name="check-all">
                        </th>
                        <th>部门序号</th>
                        <th>部门名称</th>
                        <th>上级部门</th>
                        {{--<th>人员迁移</th>
                        <th>修改</th>--}}
                    </tr>
                    </thead>
                    <tbody>
                    @if(count($deptInfoPage))
                        @foreach($deptInfoPage as $k=>$v)
                            <tr>
                                <th>
                                    @if($v['cp_id'] != 0)
                                        <input type="checkbox" name="check" value="{{ $v['og_id'] }}">
                                    @endif
                                </th>
                                <td>B{{ $v['og_id'] }}</td>
                                <td>{{ $v['og_name'] }}</td>
                                <td>{{ isset($deptName[$v['cp_id']]) ? $deptName[$v['cp_id']] : '教职工管理系统' }}</td>
                               {{-- <td>
                                    @if($v['pid'] != 0)
                                    <span class='icon-move department-move-btn' data-id="{{ $v['id'] }}"></span>
                                    @endif
                                </td>
                                <td>
                                    <span class='icon-revise edit-dept' data-id="{{ $v['id'] }}" data-pid="{{ $v['pid'] }}" data-sort="{{ $v['sort'] }}" data-name="{{ $v['name'] }}"></span>
                                </td>--}}
                            </tr>
                        @endforeach
                    @else
                        <tr>
                            <th colspan="6">
                                暂无数据
                            </th>
                        </tr>
                    @endif
                    </tbody>
                </table>
                @if(count($deptInfoPage->all()))
                    <div class="c-page">
                        {!! $deptInfoPage->links() !!}
                    </div>
                @endif
            </div>
        </div>
    </div>

    <script type='text' id='add_department'>
        <div id="form">
        <div class='add-department-box c-layer-padding'>
            <div class="ipt-box">
                <label for="">上级部门：</label>
                <select name="pid" lay-verify="required">
                    <option value="">请选择上级部门</option>
                    <option value="0">教职工管理系统</option>
                    @if(count($dept))
                        @foreach($dept as $k=>$v)
                            <option value="{{ $v['og_id'] }}">{{ $v['og_name'] }}</option>
                        @endforeach
                    @endif

                </select>
            </div>
            <div class="ipt-box">
                <label for="">部门序号：</label>
                <input type="text" name="sort" class="fr dept-sort" placeholder="请输入部门序号">
            </div>
            <div class="ipt-box">
                <label for="">部门名称：</label>
                <input type="text" name="name" class="fr dept-name" placeholder="请输入部门名称">
            </div>
        </div>
        </div>
    </script>
    <script type='text' id='edit_department'>
        <div id="form2">
        <div class='add-department-box c-layer-padding'>
            <div class="ipt-box">
                <label for="">上级部门：</label>
                <select name="pid" lay-verify="required">
                    <option value="">请选择上级部门</option>
                    <option value="0">教职工管理系统</option>
                    @if(count($dept))
                        @foreach($dept as $k=>$v)
                            <option value="{{ $v['og_id'] }}">{{ $v['og_name'] }}</option>
                        @endforeach
                    @endif

                </select>
            </div>
            <div class="ipt-box">
                <label for="">部门序号：</label>
                <input type="text" value="$$sort" name="sort" class="fr dept-sort" placeholder="请输入部门序号">
            </div>
            <div class="ipt-box">
                <label for="">部门名称：</label>
                <input type="text" value="$$name" name="name" class="fr dept-name" placeholder="请输入部门名称">
            </div>
        </div>
        </div>
    </script>

    <script type='text' id='choose_member_move'>
    <div id="form1">
    <div class='choose-member-move-box c-layer-padding'>
        <div class='choose-member-main'>
            <h3>部门列表</h3>
            <div class='p-e-list'>
            @if(count($dept))
            @foreach($dept as $k=>$v)
                <div class='p-e-list-top'>
                    <span class='layui-icon layui-icon-triangle-d'></span>
                    <span>{{ $v['og_name'] }}</span>
                    <span>({{ isset($v['small']) ? count($v['small']) : '' }})</span>
                </div>
                <ul>
                    @if(isset($v['small']))
                    @foreach($v['small'] as $k1=>$v1)
                        <li class='p-e-list-item on'>
                            <img class='avatar-img' src="/crm/img/male.png" alt="">
                            <span>{{ $v1['og_name'] }}</span>
                        <input type="radio" name="dept_id" value="{{ $v1['og_id'] }}">
                    </li>
                        @endforeach
                @endif
                </ul>
                @endforeach
        @endif
        </div>
        </div>
    </div>
    </div>
</script>

@section('footer')
@endsection
<script src="{{ asset('/crm/js/layui/layui.all.js') }}"></script>
<script src="{{ asset('/crm/js/jquery-3.2.1.min.js') }}"></script>
<script src="{{ asset('/crm/js/jq_extend.js') }}"></script>
<script src="{{ asset('/crm/js/main.js') }}"></script>

<script type="text/javascript">
    /*$(".p-e-list-top").on("click",function(){
        var isHide = $(this).next().css("display");
        if(isHide == "none"){
            $(this).find(".layui-icon").removeClass("layui-icon-triangle-r").addClass("layui-icon-triangle-d");
            $(this).next().slideDown();
        }else{
            $(this).find(".layui-icon").removeClass("layui-icon-triangle-d").addClass("layui-icon-triangle-r")
            $(this).next().slideUp();
        }
    })*/
    $(".department-move-btn").on("click",function(){
        var old_dept = $(this).attr('data-id');
        $.layer_open({
            title: "选择人员迁移",
            type:"1",
            html:$("#choose_member_move").html(),
            btn_arr:["取消","保存"],
            area:['350px', 'auto'],
            btn1:function(){

            },
            btn2:function(){
                var new_dept = ''

                if(new_dept = $('[name=dept_id]:checked').val()){
                    $.post('/system/moveDept',{
                        old_dept:old_dept,
                        new_dept:new_dept,
                        _token:"{{ csrf_token() }}"
                    },function (re) {
                        if(re.code == 1){
                            layer.msg('迁移成功',{icon:1, time:1000},function () {
                                window.location.reload();
                            })
                        }else{
                            layer.msg(re.errMsg, {icon:2});
                        }
                    })
                }


            }
        })
        $(".choose-member-move-box").parent().parent().find(".layui-layer-btn").find("a").css({
            "margin":"0 35px"
        })
    })
    $(".edit-dept").on("click",function(){
        var id = $(this).attr('data-id');
        var name = $(this).attr('data-name');
        var pid = $(this).attr('data-pid');
        var sort = $(this).attr('data-sort');
        var html = $("#edit_department").html();
            html = html.replace(/\$\$sort/g, sort).replace(/\$\$name/g, name);
        $.layer_open({
            title: "编辑",
            type:"1",
            html:html,
            btn_arr:["取消","保存"],
            area:['500px', 'auto'],
            btn1:function(){

            },
            btn2:function(){
                var pid = $('#form2').find('[name=pid]').val();
                var sort = $('#form2').find('[name=sort]').val();
                var name = $('#form2').find('[name=name]').val();

                if(!pid.length){
                    layer.msg('请选择上级部门');
                    return false;
                }
                if(!sort){
                    layer.msg('请填写部门序号');
                    return false;
                }
                if(!name){
                    layer.msg('请填写部门名称');
                    return false;
                }

                $.ajax({
                    url:'/system/editDept',
                    type:'post',
                    data:{pid:pid, name:name, sort:sort, id:id, _token: "{{ csrf_token() }}"},
                    success:function (re) {
                        if(re.code == 1){
                            layer.msg('部门编辑成功',{icon:1, time:1000},function(){
                                window.location.reload();
                            })
                        }else{
                            layer.msg(re.errMsg);
                        }
                    }
                })
            }
        })

        $('#form2').find('option[value='+pid+']').prop('selected', true);
    })
    $(".add-dept").on("click",function(){
        $.layer_open({
            title: "添加",
            type:"1",
            html:$("#add_department").html(),
            btn_arr:["取消","保存"],
            area:['500px', '290px'],
            btn1:function(){

            },
            btn2:function(){
                var pid = $('#form').find('[name=pid]').val();
                var sort = $('#form').find('[name=sort]').val();
                var name = $('#form').find('[name=name]').val();

                if(!pid.length){
                    layer.msg('请选择上级部门');
                    return false;
                }
                if(!sort){
                    layer.msg('请填写部门序号');
                    return false;
                }
                if(!name){
                    layer.msg('请填写部门名称');
                    return false;
                }

                $.ajax({
                    url:'/system/addDept',
                    type:'post',
                    data:{pid:pid, name:name, sort:sort, _token: "{{ csrf_token() }}"},
                    success:function (re) {
                        if(re.code == 1){
                            layer.msg('部门添加成功',{icon:1, time:1000},function(){
                                window.location.reload();
                            })
                        }else{
                            layer.msg(re.errMsg);
                        }
                    }
                })

            }
        })
    })

    //全选
    $(document).on('click', '[name=check-all]', function () {
        if($(this).is(":checked")){
            $('[name=check]').prop('checked', true);
        }else{
            $('[name=check]').prop('checked', false);
        }
    })

    $(document).on('click','.dept-del',function(){
        var check = $('tr').find('[name=check]:checked');
        if(check.length < 1){
            layer.msg('请选择删除对象');
            return false;
        }

        var id = ',';
        $.each(check,function(index, item){
            id+=$(this).val()+',';
        })

        layer.confirm('确定删除吗？', {
            btn: ['确定','取消'] //按钮
        }, function(){

            $.get('/system/delDeptInfo?id='+id,function (re) {
                if(re.code == 1){
                    layer.msg('删除成功', {icon:1,time:1000},function () {
                        window.location.reload();
                    })
                }else{
                    layer.msg(re.errMsg);
                }
            })
        });
    })

</script>
@endsection