#@layout()

#define main()
<div>
    <div>当前位置：<span class="layui-breadcrumb" lay-separator=">">
    <a href=""><cite>人员上级配置</cite></a>
</span></div>
    <div >
        <div >
            <form id="searchForm" class="layui-form layui-form-pane" lay-size="sm" action="" onclick="javascript:return false;">
                <div class="layui-form-item">

                    <div class="layui-inline" >
                        <label class="layui-form-label" style="width: 100px">上级情况</label>
                        <div class="layui-input-inline" style="width: 120px">
                            <select id="sameManager" name="sameManager"  >
                                <option value="">全部</option>
                                <option value="1" #if(sameManager?? && sameManager=="1")selected #end>与HR一致</option>
                                <option value="2" #if(sameManager?? && sameManager=="2")selected #end>与HR不一致</option>
                            </select>

                        </div>
                    </div>

                    <div class="layui-inline" >
                        <label class="layui-form-label" style="width: 120px">姓名或工号</label>
                        <div class="layui-input-inline" style="width: 120px">
                            <input type="text" id="personName"  value="#(personName)" class="layui-input" >

                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" style="width: 100px">上级姓名</label>
                        <div class="layui-input-inline" style="width: 120px">
                            <input type="text" id="managerName"  value="#(managerName)" class="layui-input" >
                        </div>
                    </div>
                    <div class="layui-inline">
                        <div class="layui-input-inline">
                            <button class="layui-btn  layui-btn-sm" onclick="query()">查询</button>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <div class="layui-input-inline" style="width: 220px">
                            <!--<button id="personManagerSyncNewA" onclick="syncPersonManager('n');"class="layui-btn layui-btn-xs">增量同步</button>
                            <i id="personManagerSyncNew"  class="layui-icon alone-tips" aria-hidden="true" style="color: red;font-size: 12px">  </i> &nbsp&nbsp&nbsp&nbsp-->
                            <button id="personManagerSyncAllA" onclick="syncPersonManager('y');"class="layui-btn layui-btn-xs">全量覆盖同步</button>
                            <i id="personManagerSyncAll"  class="layui-icon alone-tips" aria-hidden="true" style="color: red;font-size: 12px">  </i>
                        </div>
                    </div>

                </div>

            </form>
        </div>

        <table id="personmanager" class="layui-table table-border" style="table-layout:fixed;width:100%;" lay-size="sm"
               lay-filter=""  >
            <tr class="tr-bgcolor" >
                <td  class="td-bgcolor" align="center"  width="2%">序号</td>
                <td  class="td-bgcolor" align="center"  width="8%">人员</td>
                <td  class="td-bgcolor" align="center"  width="14%">部门</td>
                <td  class="td-bgcolor" align="center"  width="12%">一级上级</td>
                <td  class="td-bgcolor" align="center"  width="12%">二级上级</td>
                <td  class="td-bgcolor" align="center"  width="12%">三级上级</td>
                <td  class="td-bgcolor" align="center"  width="8%">HR组长</td>
                <td  class="td-bgcolor" align="center"  width="8%">HR总监</td>
                <td  class="td-bgcolor" align="center"  width="8%">HR总经理</td>
                <td  class="td-bgcolor" align="center"  width="8%">HR直属上级</td>
                <td  class="td-bgcolor" align="center"  width="8%">操作</td>
            </tr>

            #for(personManager:personManagerList)
            <tr id = 'trflag#(for.count)' index='#(for.count)'>
                <td align="center" #if(personManager.personmanager_hrsame=='2') style="background-color: red" #end  tdpersonid="#(personManager.personmanager_id)">#(for.count)</td>
                <td align="center"  style="padding: 0px 0px;"  id="#(personManager.personmanager_id)" >#(personManager.personmanager_personname)</td>
                <td align="center"  style="padding: 0px 0px;" >#(personManager.personmanager_deptname)</td>

                <td class="td-bgcolor" align="center">
                    <div class="layui-input-inline" >
                        <div class="">
                            <input type="text"  id="pid1_#(for.count)" style="width: 180px" personid="#(personManager.personmanager_pid1)" autocomplete="off"  value="#(personManager.personmanager_pname1)"
                                   pmid="#(personManager.personmanager_id)"  class="layui-input "readonly="readonly" >
                            <span class="delOther" id="delpid1#(for.count)" #if(!personManager.personmanager_pid1??)style="display: none;"#end><i class="layui-icon">&#x1006;</i></span>
                            <span class="selectOther" id="selectpid1#(for.count)"><i class="iconfontx">&#xe60b;</i></span>
                        </div>
                    </div>
                </td>
                <td class="td-bgcolor" align="center">
                    <div class="layui-input-inline" >
                        <div class="">
                            <input type="text"  id="pid2_#(for.count)" style="width: 180px" personid="#(personManager.personmanager_pid2)" autocomplete="off"  value="#(personManager.personmanager_pname2)"
                                   pmid="#(personManager.personmanager_id)" class="layui-input "readonly="readonly" >
                            <span class="delOther" id="delpid2#(for.count)" #if(!personManager.personmanager_pid2??)style="display: none;"#end><i class="layui-icon">&#x1006;</i></span>
                            <span class="selectOther" id="selectpid2#(for.count)"><i class="iconfontx">&#xe60b;</i></span>
                        </div>
                    </div>
                </td>
                <td class="td-bgcolor" align="center">
                    <div class="layui-input-inline" >
                        <div class="">
                            <input type="text"  id="pid3_#(for.count)" style="width: 180px" personid="#(personManager.personmanager_pid3)" autocomplete="off"  value="#(personManager.personmanager_pname3)"
                                   pmid="#(personManager.personmanager_id)" class="layui-input "readonly="readonly" >
                            <span class="delOther" id="delpid3#(for.count)" #if(!personManager.personmanager_pid3??)style="display: none;"#end><i class="layui-icon">&#x1006;</i></span>
                            <span class="selectOther" id="selectpid3#(for.count)"><i class="iconfontx">&#xe60b;</i></span>
                        </div>
                    </div>
                </td>

                <!--<td align="center"  style="padding: 0px 0px;">#(personManager.entry_supername)</td>-->
                <td align="center"  style="padding: 0px 0px;"  >#(personManager.personmanager_hrpname1)</td>
                <td align="center"  style="padding: 0px 0px;"  >#(personManager.personmanager_hrpname2)</td>
                <td align="center"  style="padding: 0px 0px;"  >#(personManager.personmanager_hrpname3)</td>
                <td align="center"  style="padding: 0px 0px;"  >#(personManager.superName)</td>
                <td align="center"  style="padding: 0px 0px;"  ><button class="layui-btn  layui-btn-sm" id="unlock#(for.count)" onclick="unlockPersonManager('#(personManager.personmanager_id)','#(for.count)')" #if(personManager.personmanager_lock=="1") style="background-color:red;display: none"#else style="background-color:red" #end>解锁</button><button class="layui-btn  layui-btn-sm" onclick="lockPersonManager('#(personManager.personmanager_id)','#(for.count)')" id="lock#(for.count)" #if( personManager.personmanager_lock=="2") style="display: none"#end>锁定</button></td>

            </tr>
            #end
        </table>
        <div class="layui-input-block"  align="center">



        </div>
    </div>

    <br><br><br><br>
    #end

    #define js()


    <script>

        $(document).on('mouseenter', '#personManagerSyncNew', function () {
            layer_tips = layer.tips('仅同步新部门或与未手工调整的人员上级配置', '#personManagerSyncNewA', {
                time: 0,
                tips: 1, area: ['200px', 'auto'],
            });
        }).on('mouseleave', '#personManagerSyncNew', function () {
            layer.close( layer_tips);
        });
        $(document).on('mouseenter', '#personManagerSyncAll', function () {
            layer_tips = layer.tips('根据HR系统部门上级配置同步人员上级(锁定的数据除外)。', '#personManagerSyncAllA', {
                time: 0,
                tips: 1, area: ['200px', 'auto'],
            });
        }).on('mouseleave', '#personManagerSyncAll', function () {
            layer.close( layer_tips);
        });
        var personname;
        var selectPersonType;
        layui.use('table', function () {
            var table = layui.table;

            //初始化列表中的人员控件
            var trs = $("#personmanager").find("tr");
            for(var i=1; i <=trs.length-1; i++) {
                $("#selectpid1" + i).click(function () {
                    personname = $($(this).prev().prev());
                    //alert(personname.prop("nodeName"));
                   // alert(personname.attr("pmid"));
                    selectPersonType = "1";
                    //alert("12:"+personname.attr("id"));
                    CommTool.selectUserDialog(function (data) {
                            //data-选择的人员数据，json数组
                            personname.val(data[0].uname);
                            personname.attr("personid", data[0].id);
                            updatePersonManager(personname.attr("pmid"),"1",data[0].uname,data[0].id,personname);
                        }, false//true-允许多选，false-只能单选
                        , '#(ctx)');//ctx

                });
                $("#selectpid2" + i).click(function () {
                    personname = $($(this).prev().prev());
                    selectPersonType = "2";
                    //alert("2:"+personname.attr("id"));
                    CommTool.selectUserDialog(function (data) {
                            //data-选择的人员数据，json数组
                            personname.val(data[0].uname);
                            personname.attr("personid", data[0].id);
                            updatePersonManager(personname.attr("pmid"),"2",data[0].uname,data[0].id,personname);
                        }, false//true-允许多选，false-只能单选
                        , '#(ctx)');//ctx

                });
                $("#selectpid3" + i).click(function () {
                    personname = $($(this).prev().prev());
                    selectPersonType = "3";
                    CommTool.selectUserDialog(function (data) {
                            //data-选择的人员数据，json数组
                            personname.val(data[0].uname);
                            personname.attr("personid", data[0].id);
                            updatePersonManager(personname.attr("pmid"),"3",data[0].uname,data[0].id,personname);
                        }, false//true-允许多选，false-只能单选
                        , '#(ctx)');//ctx

                });
                $("#delpid1" + i).click(function () {
                    personname = $($(this).prev());
                    deletePersonManager(personname.attr("pmid"),"1",personname);
                });
                $("#delpid2" + i).click(function () {
                    personname = $($(this).prev());
                    deletePersonManager(personname.attr("pmid"),"2",personname);
                });
                $("#delpid3" + i).click(function () {
                    personname = $($(this).prev());
                    deletePersonManager(personname.attr("pmid"),"3",personname);
                });

            }

        });

        function lockPersonManager(id,num){
            var param = {"personId":id,};
            AjaxTool.XPost("#(ctx)/jx/lockPersonManager", param,
                function(data) {
                    if(data.code == 'success'){
                        layer.msg('锁定成功!'+(data.msg?data.msg:''),{time: 1000});
                        $("#lock"+num).css("display","none");
                        $("#unlock"+num).css("display","");
                    }else{
                        layer.msg('操作失败!'+(data.msg?data.msg:''),{time: 1000});
                    }
                }, function(data) {
                    layer.msg('操作失败，您可能已掉线，请刷新页面或关闭后重试！!'+(data.msg?data.msg:''),{time: 1000});
                });
        }
        function unlockPersonManager(id,num){
            var param = {"personId":id,};
            AjaxTool.XPost("#(ctx)/jx/unlockPersonManager", param,
                function(data) {
                    if(data.code == 'success'){
                        layer.msg('解锁成功!'+(data.msg?data.msg:''),{time: 1000});
                        $("#unlock"+num).css("display","none");
                        $("#lock"+num).css("display","");
                    }else{
                        layer.msg('操作失败!'+(data.msg?data.msg:''),{time: 1000});
                    }
                }, function(data) {
                    layer.msg('操作失败，您可能已掉线，请刷新页面或关闭后重试！!'+(data.msg?data.msg:''),{time: 1000});
                });
        }
        function updatePersonManager(personId,type,managerName,managerId,person){
            var param = {"personId":personId,"type":type,"managerId":managerId,"managerName":managerName};
            AjaxTool.XPost("#(ctx)/jx/updatePersonManager", param,
                function(data) {
                    if(data.code == 'success'){
                        layer.msg('修改成功!'+(data.msg?data.msg:''),{time: 1000});
                        $(person).parent().find(".delOther").css("display", "");

                        var tds = $("#personmanager").find("td");
                        var dtd = tds.filter('td[tdpersonid="'+personId+'"]');

                        if(data.sameManager == '1'){
                            $(dtd).css("background-color","");
                            // array.filter('tr[attr=val]')
                            //  style="background-color: red"
                        }else if(data.sameManager == '2'){
                            $(dtd).css("background-color","red");
                        }
                    }else{
                        layer.msg('修改失败!'+(data.msg?data.msg:''),{time: 1000});
                    }


                }, function(data) {
                    layer.msg('操作失败，您可能已掉线，请刷新页面或关闭后重试！!'+(data.msg?data.msg:''),{time: 1000});
                });
        }

        function deletePersonManager(personId,type,person){
            var param = {"personId":personId,"type":type,};
            layer.confirm('确认清除该上级信息？', {icon: 3, title: '提示'}, function (index) {
                AjaxTool.XPost("#(ctx)/jx/deletePersonManager", param,
                    function(data) {
                        if(data.code == 'success'){
                            layer.msg('清除成功!'+(data.msg?data.msg:''),{time: 1000});
                            $(person).val("");
                            // $(person).attr("personid","");
                            $(person).parent().find(".delOther").css("display", "none");

                            var tds = $("#personmanager").find("td");
                            var dtd = tds.filter('td[tdpersonid="'+personId+'"]');

                            if(data.sameManager == '1'){
                                //$(dtd).css("background-color","");
                            }else if(data.sameManager == '2'){
                                // $(dtd).css("background-color","red");
                            }
                        }else{
                            layer.msg('清除失败!'+(data.msg?data.msg:''),{time: 1000});
                        }


                    }, function(data) {
                        layer.msg('保存失败，您可能已掉线，请刷新页面或关闭后重试！!'+(data.msg?data.msg:''),{time: 1000});
                    });
                layer.close(index);
            });
        }

        function syncPersonManager(syncAll){
            var param = {"syncAll":syncAll};
            if(syncAll!='y') {
                AjaxTool.XPost("#(ctx)/jx/syncPersonManager", param,
                    function (data) {
                        if (data.code == 'success') {
                            //layer.msg('同步成功!'+(data.msg?data.msg:''),{time: 1000});
                            window.location.href = '#(ctx)/jx/toPersonManagerPage';
                        } else {
                            layer.msg('同步失败!' + (data.msg ? data.msg : ''), {time: 1000});
                        }
                    }, function (data) {
                        layer.msg('同步失败，您可能已掉线，请刷新页面或关闭后重试！!' + (data.msg ? data.msg : ''), {time: 1000});
                    });
            }
            if(syncAll=='y') {
                layer.confirm('确认进行覆盖同步？', {icon: 3, title: '提示'}, function (index) {
                    AjaxTool.XPost("#(ctx)/jx/syncPersonManager", param,
                        function (data) {
                            if (data.code == 'success') {
                                //layer.msg('同步成功!'+(data.msg?data.msg:''),{time: 1000});
                                window.location.href = '#(ctx)/jx/toPersonManagerPage';
                            } else {
                                layer.msg('同步失败!' + (data.msg ? data.msg : ''), {time: 1000});
                            }
                        }, function (data) {
                            layer.msg('同步失败，您可能已掉线，请刷新页面或关闭后重试！!' + (data.msg ? data.msg : ''), {time: 1000});
                        });

                    layer.close(index);
                });
            }

        }


        function query(){
            var personName = $("#personName").val();
            var managerName = $("#managerName").val();
            var sameManager = $("#sameManager").val();
            window.location.href='#(ctx)/jx/toPersonManagerPage?personName='+personName+'&managerName='+managerName+'&sameManager='+sameManager;
        }
        function getSelectUser(data) {

            layer.closeAll();
            personname.val(data.uname);
            personname.attr("personid",data.id);
            updatePersonManager(personname.attr("pmid"),selectPersonType,data.uname,data.id,personname);
        }
    </script>
    #end