{extend name="Public/base" /}
{block name="css"}
<!--<link rel="stylesheet" href="__PUBLIC__/item/css/layui.css?v={$Think.const.APP_VERSION}">-->
<link rel="stylesheet" href="__PUBLIC__/css/customer.css?v={$Think.const.APP_VERSION}">
<link rel="stylesheet" href="__PUBLIC__/css/set.css?v={$Think.const.APP_VERSION}">

{/block}
{block name="js"}

<script src="__PUBLIC__/js/jquery-1.9.0.min.js?v={$Think.const.APP_VERSION}" type="text/jscript"></script>
<script>
    // $(function () {
    //     $(".nul_bli").eq(8).find(".navb").addClass("active");
    //    // $(".navb.active").parent().find(".nul_s .nul_sli").eq(9).find(".navs").addClass("active");
    // })
</script>

{/block}
{block name="main"}
<div class="if_wrap">
    <div class="cus-con">

        <div class="set_tit"><span>薪资发放</span></div>

        <div class="cus-top-left layui-form layui-form-pane1">

            <div class="layui-input-block w-120" >
                 <span id="start_choose" value="点击选择部门" style="border: 1px solid #beccdc; border-radius: 2px; text-align: center; line-height: 28px; font-size: 12px; color: #757575; height: 28px; display: block;">选择部门</span>
            </div>
            <div class="layui-inline"> <!-- 注意：这一层元素并不是必须的 -->
                <input type="text" class="layui-input" style="width:70px;position: relative;right: 57px;bottom: 1px;" placeholder="选择月份" id="test1">
            </div>
            <input type="text" class="layui-input"  name="username" id="username" placeholder="请输入名称" style="width: 186px; position: relative; left: 130px;bottom:0px; display: inline; ">
            <button lay-submit lay-filter="search" id="dosearch" data-type="reload"  value="查询" class="search-span" style="border-radius: 3px; position: relative;left:390px; ">查询</button>
            <button class="layui-btn fp-btn" id="singleAccount" style="height: 30px; position: relative; bottom: 1px; right: 230px;" data-type="add">标注选择人已发放</button>
        <table id="demo" lay-filter="table1"></div>
           
        </table>
    </div>
</div>

<!--隐藏域-->
<div style="display: none;">
    <input type="hidden" id="addDaily_php" value="{:url('papi/Salary/addDaily')}"/>
    <input type="hidden" id="distributionTask_php" value="{:url('papi/Salary/distributionTask')}"/>
    <input type="hidden" id="inquireDetail_php" value="{:url('papi/Salary/inquireDetail')}"/>
</div>

<script type="text/html" id="operationModal">
    <span lay-event="cat" class="layui-btn layui-btn-normal" style="margin-top: -4px;">查看</span>
    <span lay-event="delete" class="layui-btn layui-btn-danger del" style="margin-top: -4px;">删除</span>
</script>

<script type="text/html" id="enabledModal">
    {{#  if(d.state == 0){ }}
        已发放
    {{#  } else if(d.state == 1){ }}
        <font style="color:red">待审批</font>
    {{#  } else if(d.state == 2){ }}
        审批中 <span lay-event="back" class="layui-btn layui-btn-danger del" style="margin-top: -7px; padding:2px; border-radius:3px;">点击撤回</span>
    {{#  } else if(d.state == 3){ }}
        待发放
    {{#  } }}
</script>

<script>
    $('#start_choose').click(function(){
        load_page('/oa/Dept/selector', '选择组织架构',
                function(){
                    get_select(function(res){
                        console.log(res);
                        sel_content = res;

                    });
                },
                ['确定','取消'], 900,600
        );
    });
    layui.use('laydate', function(){
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
            elem: '#test1' //指定元素
            ,type: 'month'
        });
    });
    layui.use(['table','jquery'],function(){
        // alert($);
        var table = layui.table;

        var table1;
        table1_init();

        // 初次table数据渲染
        function table1_init()
        {
            table1=table.render({
                elem: '#demo' //指定原始表格元素选择器（推荐id选择器）
                ,height: 'auto' //容器高度
                ,url:'/oa/Salary/Payroll_out'
                ,response: {
                    statusName: 'code' //数据状态的字段名称，默认：code
                    ,statusCode: 200 //成功的状态码，默认：0
                    ,msgName: 'msg' //状态信息的字段名称，默认：msg
                    ,countName: 'count' //数据总数的字段名称，默认： count
                    ,dataName: 'data' //数据列表的字段名称，默认：data
                } 
                ,page:{
                    curr:1,
                    limit:10,
                    limits:[10,20,30],
                }
                ,cols: [[ //表头
                    {field:'department_name', title: '部门', align: 'center', width:'5%'},
                    {field:'staffname', title: '姓名', align: 'center',width:'10%'},
                    {field:'main_position_name', title: '岗位', align: 'center',width:'15%'},
                    {field:'minimum_guarantee_salary', title: '基础薪资', align: 'center',width:'15%'},
                    {field:'payroll', title: '实发薪资', sort: true, align: 'center',width:'10%'},
                    {field:'state', title: '状态', align: 'center',width:'10%',toolbar:'#enabledModal'},
                    {title: '操作', align: 'center',width:'35%', toolbar: '#operationModal'},
                ]] //设置表头
                //,…… //更多参数参考右侧目录：基本参数选项
            });
        }
        // table数据重载
        function table1_reload()
        {
            var search = $('#username').val()
            table1.reload({
                where: { //设定异步数据接口的额外参数，任意设
                    search: search,
                }
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        }
        //添加功能事件
        $(".fp-btn").click(function () {
            location.href= "{:url('/oa/Salary/add')}";
        });
        // 点击搜索
        $('#dosearch').click(function(){
            table1_reload();
        })

        $('#singleAccount').click(function(){
            location.href="{:url('/oa/Form/choose_one_write')}"+'?form_id=5'
        })

        // 添加对于工具条的监控 完成查看/删除
        table.on('tool(table1)', function(obj){
            var layEvent = obj.event;
            var data = obj.data; //获得当前行数据

            if(layEvent === 'cat'){ //查看
                // location.href= "{:url('/oa/Salary/cat')}"+'?id=' + id;
                layer.alert('后续数据正在衔接 暂不支持查看范围');

            } else if(layEvent === 'delete'){
                layer.alert('后续数据正在衔接 暂不支持删除');

                // layui.form.render();
                // var id = $(this).attr("data-id");
                // location.href= "{:url('/oa/Teamtask/distributionTask')}"+'?id=' + id;
            } else if(layEvent === 'back'){
                layer.alert('将会从审批流中撤销操作');

                // var id = $(this).attr("data-id");
                // location.href= "{:url('/oa/Teamtask/inquireDetail')}"+'?tid=' + id;
            }
        });

    })
</script>
{/block}