
<div class="layui-fluid">

    <style>
        #projectcategoryTreeBar{padding:10px 15px;border:1px solid #e6e6e6;background-color:#f2f2f2}
        #projectcategoryTree{border:1px solid #e6e6e6;border-top:none;padding:10px 5px;overflow:auto;height:-webkit-calc(100vh - 290px);height:-moz-calc(100vh - 290px);height:calc(100vh - 290px)}
        .layui-tree-entry .layui-tree-txt{padding:0 5px;border:1px transparent solid;text-decoration:none!important}
        .layui-tree-entry.organ-tree-click .layui-tree-txt{background-color:#fff3e0;border:1px #ffe6b0 solid}
        .files_itemwproject{width:30px;height:30px;line-height:30px;cursor:pointer;padding:1px;background:#fff;display:-webkit-box;-moz-box-align:center;-webkit-box-align:center;-moz-box-pack:center;-webkit-box-pack:center;}
        .files_itemwproject img{max-width:28px;max-height:28px;border:0}
    </style>
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md2">
            <div class="layui-card">
                <div class="layui-card-body" style="padding:10px;">
                    <!-- 树工具栏 -->

                    <!-- 左树 -->
                    <div id="projectcategoryTree"></div>
                </div>
            </div>
        </div>
        <div class="layui-col-md10">
            <div class="layui-card">
                <div class="layui-card-header">
                    <form class="layui-form render">
                        <input type="hidden" name="groupid" id="project-groupid" value=""/>
                        <div class="layui-form-item">

                            <div class="layui-inline" style="width:250px;"><input type="text" name="kw" placeholder="关键词" autocomplete="off" class="layui-input" lay-affix="clear"/></div>
                            <div class="layui-inline" style="width:250px;"><input type="text" name="user" placeholder="用户名，用户手机" autocomplete="off" class="layui-input" lay-affix="clear"/></div>
                            <div class="layui-inline" style="width:150px;">
                                <select name="sh_status">
                                    <option value="">审核状态</option>
                                    <option value="0">审核中</option>
                                    <option value="1">审核失败</option>
                                    <option value="2">审核通过</option>
                                </select>
                            </div>

                            <div class="layui-inline" style="width:150px;">
                                <select name="status">
                                    <option value="">项目状态</option>
                                    <option value="0">等待审核</option>
                                    <option value="1">招募中</option>
                                    <option value="2">进行中</option>
                                    <option value="3">待验收</option>
                                    <option value="4">已完成</option>
                                    <option value="5">已取消</option>
                                </select>
                            </div>
                            <div class="layui-inline">
                                <div class="layui-btn-group">
                                    <button  class="layui-btn" lay-submit lay-filter="search-project"><i class="layui-icon layui-icon-search"></i> 搜索</button>
                                    <a class="layui-btn" lay-submit lay-filter="search-project-all" onclick="$('#project-groupid').val('')"><i class="layui-icon layui-icon-light"></i>全部</a>


                                </div>
                            </div>
                        </div>
                    </form>
                </div>


                    <div class="layui-card-body">
                    <table lay-filter="project" id="project"></table>
                    </div>

            </div>
        </div>
    </div>
</div>

<script type="text/html" id="projectDemo">
    <div class="layui-clear-space">

        <a class="layui-btn layui-btn-xs" lay-event="detail">详情</a>
        <a class="layui-btn layui-btn-xs" lay-event="shenhei">审核</a>
        <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>

    </div>
</script>

<script type="text/html" id="proshstatus-demo">
    {{# if (d.sh_status === 2) { }}
    <a class="layui-btn layui-btn-xs layui-btn-normal" >{{=d.sh_status_text}}</a>
    {{# } else { }}
    {{# if(d.sh_status === 1) { }}
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="statuserror">{{=d.sh_status_text}}</a>
    {{# } else { }}
    <a class="layui-btn layui-btn-xs">{{=d.sh_status_text}}</a>
    {{# } }}
    {{# } }}
</script>
<script type="text/html" id="prostatus-demo">
    {{# if (d.status === 4) { }}
    <a class="layui-btn layui-btn-xs layui-btn-normal" >{{=d.status_text}}</a>
    {{# } else { }}
    {{# if(d.status === 5) { }}
    <a class="layui-btn layui-btn-xs layui-btn-danger" >{{=d.status_text}}</a>
    {{# } else { }}
    <a class="layui-btn layui-btn-xs">{{=d.status_text}}</a>
    {{# } }}
    {{# } }}
</script>

<script type="text/html" id="projectishot-demo">
    {{# if (d.is_hot === 1 || d.is_tj === 1) { }}

    {{# if (d.is_hot === 1) { }}
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="sethot">热门</a>
    {{# } }}
    {{# if (d.is_tj === 1) { }}
    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="sethot">推荐</a>
    {{# } }}
    {{# } else { }}
    <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="sethot">未设置</a>
    {{# } }}
</script>
<!--JS部分-->
<script>

    layui.use(['vinfo', 'buildItems','dropdown'], function(){
        var map_root = layui.cache.maps;
        var app_root = map_root + 'project.project/';
        var layer = layui.layer,table=layui.table,form=layui.form,admin=layui.admin;
        var dropdown = layui.dropdown;
        organData = admin.util.toTree({$category|raw});

        doTree(organData,'');

        function doTree(data,load){
            layui.tree.render({
                id: 'organTree',
                elem: '#projectcategoryTree',
                data: data,
                onlyIconControl: true,
                click: function(obj){
                    $('#projectcategoryTree').find('.organ-tree-click').removeClass('organ-tree-click');
                    $(obj.elem).children('.layui-tree-entry').addClass('organ-tree-click');
                    organObj = obj.data;
                    $('#project-groupid').val(obj.data.id);
                    table.reloadData('project',{where:{cate_id:obj.data.id},page:{curr:1}});

                }
            });
            // var item = $('#projectcategoryTree .layui-tree-entry:first');
            // load ? item.find('.layui-tree-main>.layui-tree-txt').trigger('click') : item.addClass('organ-tree-click');
        }
        /*初始渲染*/

        /*==============左树结构END==============*/

        /*渲染数据*/
        table.render({
            elem: '#project',
            page: true,
            limit:{$limit},
            height: 'full-341',
            url: app_root+"index?&do=json",
            // css: 'td .layui-table-cell{height:80px;line-height:80px;padding:0 5px;}',
            cols: [[
                {type:'checkbox',fixed:'left'},
                {field:'id',width:50,unresize:true,align:'center',title:'ID',sort:!0},
                {field:'sn',align:'center',title:'项目编号'},
                {field:'username',align:'center',title:'发布者',templet:'<div>{{= d.getuserdata.username}}</div>'},
                {field:'title',align:'center',title:'项目名称'},
                {field:'cate_name',width:120,align:'center',title:'类别',templet:'<div>{{= d.projectcatedata.title}}</div>'},
                {field:'yusuan',width:120,align:'center',title:'预算'},
                {field:'zhouqi',width:120,align:'center',title:'周期/天'},
                {field:'sh_status',width:100,align:'center',title:'审核状态',templet:'#proshstatus-demo'},
                {field:'status',width:100,align:'center',title:'项目状态',templet:'#prostatus-demo'},
                {field:'is_hot',width:100,align:'center',title:'推荐',templet:'#projectishot-demo'},
                {field:'createtime',width:120,align:'center',title:'发布时间'},
                {fixed:'right',width:150,align:'center', templet: '#projectDemo',title:'操作'}
            ]],
            done: function(){ admin.vShow($('[lay-table-id="project"]'));

            }
        });

        // 状态 - 开关操作
        form.on('switch(is_sell-chang)', function(obj){
            var json = JSON.parse(decodeURIComponent($(this).data('json')));
            var av = obj.elem.checked ? 1 : 0;
            admin.req(app_root+"editup",{id:json.id,av:av,af:obj.elem.name},function(res){
                layer.tips(res.msg,obj.othis,{time:1000});
                if(res.code === 0) obj.elem.checked = parseInt(obj.value);
            },'post',{headersToken:true});
        });

        /*快编监听*/
        table.on('edit(project)',function(obj){
            admin.req(app_root+"editup",{id:obj.data.id,av:obj.value,af:obj.field},function(res){
                layer.msg(res.msg,{shade:[0.4,'#000'],time:500});
            },'post',{headersToken:true});
        });/**/

        /*工具条监听*/
        table.on('tool(project)', function(obj){
            var data = obj.data;
            var id = data.id;
            if(obj.event === 'detail'){
                projectOpen(data.id);
            }else if(obj.event === 'del'){
                del(id);
            }else if(obj.event === 'project-event-image'){
                var src = $(this).attr('src'), alt = $(this).attr('alt');
                layer.photos({photos:{data:[{alt:alt,src:src}],start:'0'},anim:5,shade:[0.4,'#000']});
            }else if(obj.event === 'more'){

            }else if(obj.event === 'sethot'){
                // 在此处输入 layer 的任意代码
                layer.open({
                    type: 2, // page 层类型
                    area: ['500px', '300px'],
                    title: "课程推荐",
                    shade: 0.6, // 遮罩透明度
                    shadeClose: true, // 点击遮罩区域，关闭弹层
                    btn: ['确定', '关闭'],
                    content: '/admin/project.project/tuijian?id='+id,
                    yes: function(index, layero){
                        var data = window["layui-layer-iframe" + index].callbackdata();
                        $.ajax({
                            method: "post",
                            url: layui.cache.maps+'/project.project/tuijian',
                            data: data,
                            dataType: "json",
                            success: function (res){
                                if(res.code===1) {
                                    layer.msg(res.msg,{icon:1,shade:[0.4,'#000'],time:1500},function (){
                                        layer.close(index);
                                        table.reloadData('project');
                                    });
                                }else{
                                    layer.msg(res.msg,{icon:2,shade:[0.4,'#000'],time:1500},function (){

                                    });
                                }
                                // layer.closeAll();

                            }
                        });
                    }
                });

            }else if(obj.event === 'shenhei'){

                layer.confirm('选择审核状态？', {
                    btn: ['审核通过', '审核不通过'],
                    btn1: function(index, layero, that){

                        shajax(data.id,1);
                    },
                    btn2: function(index, layero, that){
                        layer.prompt({
                            formType: 2,
                            value: '',
                            title: '请输入失败原因',
                        }, function(value, index, elem){

                            shajax(data.id,2,value);

                        });
                    },
                });
            }else if(obj.event === 'statuserror'){
                layer.alert(data.sh_status_desc,{title:'失败原因'});
            }
        });/**/


        /*删除*/
        function del(ids){
            layer.confirm('确定要删除所选记录吗？', function(){
                admin.req(app_root+"del",{id:ids},function(res){
                    layer.msg(res.msg,{shade:[0.4,'#000'],time:1500},function(){
                        if(res.code==1) table.reloadData('project');
                    });
                },'post',{headersToken:true});
            });
        }/**/
        /*顶部删除按钮*/
        $('#project-del').on('click', function(){
            var checkRows = table.checkStatus('project').data;

            if(checkRows.length === 0){return layer.msg('请选择需删除的记录');}
            var ids = checkRows.map(function(d){return d.id;});
                console.log(ids);
            del(ids);
        });/**/

        /*弹出窗*/
        function projectOpen(id='',type=''){
            var title = "项目详情";

            layer.open({
                type: 2,
                area: ['900px', '90%'],
                title: title,
                btn: ['确定', '关闭'],
                content: app_root+'/detail?id='+id+'&type='+type,
                yes: function(index, layero){
                    layer.close(index);
                },
            });
        }/**/


        function shajax(id,shstatus,errordesc=''){
            $.ajax({
                method: "post",
                url: app_root+'/shenheproject',
                data: {id:id,shstatus:shstatus,errordesc:errordesc},
                dataType: "json",
                success: function (res){
                    if(res.code===1) {
                        layer.msg(res.msg,{icon:1,shade:[0.4,'#000'],time:1500},function (){
                            layer.closeAll();
                            table.reloadData('project');
                        });
                    }else{
                        layer.msg(res.msg,{icon:2,shade:[0.4,'#000'],time:1500},function (){

                        });
                    }


                }
            });
        }
    });
</script>