{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>农场审核</title>
    <link rel="stylesheet" href="{% static '/lib/layui/css/layui.css' %}">
    <link rel="stylesheet" href="{% static '/lib/css/reset.css' %}">
    <style>
        .breadcrumbs {
            padding: 12px 0 12px 30px;
            border-bottom: 1px solid #dbdbdb;
        }

        .layui-breadcrumb>* {
            font-size: 16px;
        }

        .fixedDiv {
            position: fixed;
            width: 100%;
            z-index: 999;
            box-shadow: 0px 3px 5px 0px #ececec;
            background: #fff;
        }

        /* 详情 */

        .uploadContent {
            padding: 25px;
        }

        /* 管理员审核权限 */

        .permission {
            text-align: right;
        }

        .layui-btn.active {
            background-color: #23a3ee;
            color: #fff;
        }

        .layui-btn.active:hover {
            background-color: #23a3ee;
            color: #fff;
        }

        .layui-btn-blue {
            border: 1px solid #23a3ee;
            background-color: #ffffff;
            color: #23a3ee;
        }

        .layui-btn-blue:hover {
            color: #0c6ea8;
            border: 1px solid #0c6ea8;
        }

        /* 操作按钮 */

        .operateBtn {
            cursor: pointer;
        }

        .editBtn,
        .editBtn:hover {
            color: #23a3ee;
        }

        .passBtn,
        .passBtn:hover {
            color: #3ab851;
        }

        .delBtn,
        .delBtn:hover {
            color: #c12525;
        }

        .lokBtn,
        .lokBtn:hover {
            color: #c3ce28;
        }

        /* 编辑框 */

        .openDiv>div {
            padding: 30px;
            width: 70%;
        }

        .layui-upload-img {
            width: 92px;
            height: 92px;
            margin: 0 10px 10px 0;
        }

        #lianx {
            display: none;
        }
        .div_one {
            margin: 10px 0 0 150px;
        }
        .one {
            border: 1px solid #000;
            width: 100px;
            height: 20px;
            display: inline-block;
        }
        .layui-table{
            table-layout: fixed;
        }
        .layui-table td{
            white-space:nowrap;
            overflow:hidden;
            text-overflow: ellipsis;
        }
    </style>
</head>

<body>
    <div class="content">
        <div class="floatNav">
            <!-- 导航 -->
            <div class="breadcrumbs">
                <span class="layui-breadcrumb">
                    <a target="BoardRight">首页</a>
                    <a>
                        <cite>农场审核</cite>
                    </a>
                </span>
            </div>
        </div>

        <!-- 内容 -->
        <div>
            <!-- 新系列表 -->
            <div class="uploadContent" id="uploadContent">

                <!-- 审核 -->
                <div class="permission">
                    <button type="button" data-type="0" class="layui-btn layui-btn-sm layui-btn-blue active">待审核</button>
                    <button type="button" data-type="1" class="layui-btn layui-btn-sm layui-btn-blue">已通过</button>
                </div>
                <!-- 列表 -->
                <div>
                    <table class="layui-table" id="dataTable">
                        <thead>
                            <tr>
                                <th>农场名称</th>
                                <th>地址</th>
                                <th>面积</th>
                                <th>负责人</th>
                                <th>联系电话</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            
                        </tbody>
                    </table>
                </div>
                <div class="fenpei-bottom">
                    <div id="page"></div>
                </div>
            </div>
        </div>
    </div>


    <script src="{% static '/lib/js/jquery-2.1.4.min.js'%}"></script>
    <script src="{% static '/lib/layui/layui.js'%}"></script>
    <script src="{% static '/js/backstageNet/common.js'%}"></script>
    <script>
        var table, layer, form, laypage, element;
        layui.use(['table', 'layer', 'form', 'laypage', 'element'], function () {
            element = layui.element;
            table = layui.table;
            layer = layui.layer;
            form = layui.form;
            $ = layui.jquery;
            laypage = layui.laypage;

            //一些事件监听
            element.on('tab(demo)', function (data) {
                console.log(data);
            });

            //第一个实例
            getData('news_check_list', 1, 0) //url,page，信息类型

            //监听提交
            form.on('submit(formDemo)', function (data) {
                console.log(data)
                layer.msg(JSON.stringify(data.field));
                return false;
            });

        });

        function getData(url, page, hidden) {
            $.ajax({
                url: 'garden_check_list',
                type: 'get',
                data: {
                    page: page,
                    hidden: hidden
                },
                dataType: 'html',
                success: function (data) {
                    $('#dataTable').children('tbody').html(data);
                    laypage.render({
                        elem: 'page' //注意，这里的 test1 是 ID，不用加 # 号
                        // , count: 30
                        , count: $('#totalPage').val()
                        , theme: '#2ca9f9'
                        , layout: ['prev', 'page', 'next', 'skip']
                        , jump: function (obj, first) {
                            if (!first) {
                                $.ajax({
                                    url: 'garden_check_list',
                                    type: 'get',
                                    data: { page: obj.curr,hidden: hidden },
                                    dataType: 'html',
                                    success: function (data) {
                                        $('#dataTable').children('tbody').html(data);
                                    },
                                    error: function (type) {
                                        console.log(type)
                                    }
                                })
                            }
                        }
                    });
                },
                error: function (type) {
                    console.log(type)
                }
            })
        }

        // 编辑
        function editFun(id) {
            $.ajax({
                url: 'garden_check_list',
                type: 'post',
                data: {
                    id: id,
                    req: 'edit'
                },
                dataType: 'json',
                success: function (data) {
                    window.data = data[0]
                }
            })
            var index = layer.open({
                title: '四季编辑',
                type: 2,
                area: ['850px', '560px'],
                content: 'garden_pub',
                success: function (layero, index,data) {
                    var body = layer.getChildFrame('body', index);
                    var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                    body.find('input[name="name"]').val(window.data.name) //采摘名称
                    body.find('input[name="company"]').val(window.data.company) //采摘企业
                    body.find('input[name="img_url"]').val(window.data.pick_img) //采摘图片
                    body.find('input[name="time"]').val(window.data.time) //采摘时间
                    // $('#farmSelect').next().children().eq(0).children().eq(0).val($('#farmSelect').find("option:selected").text(data[0].farm_name));
                    body.find('input[name="id"]').val(window.data.id) //id
                }
            });
        }

        // 通过
        function passFun(id) {
            layer.confirm('是否通过此信息',{title:'通过'}, function (index) {
                $.ajax({
                    url: 'garden_check_list',
                    type: 'post',
                    data: {
                        id: id,
                        req: 'check'
                    },
                    dataType: 'json',
                    success: function (data) {
                        if (data) {
                            layer.close(index);
                            // parent.layer.msg("操作成功!", {time: 1000}, function () {
                            //重新加载父页面
                            location.reload();
                        }
                    }
                })
                layer.close(index);

            });
        }

        // 删除
        function delFun(id) {
            layer.confirm('真的删除行么',{title:'删除'}, function (index) {
                $.ajax({
                    url: 'garden_check_list',
                    type: 'post',
                    data: {
                        req: 'del',
                        id: id,
                    },
                    dataType: 'json',
                    success: function (data) {
                        if (data) {
                            location.reload();
                        }
                    }
                })
                layer.close(index);
            });
        }


        //查看
        function lokFun(id) {
            layer.open({
                type: 0,
                id: 'Layer',
                title: '农场查看',
                area: ['740px', '500px'],
                shade: 0,
                anim: -1,
                content: '<div class="table"></div>',
                success: function(layero, index) {
                    $.ajax({
                        url: 'garden_check',
                        type: 'post',
                        async: false,
                        data: {
                            ids: id,
                        },
                        dataType: 'json',
                        success: function (data) {
                            window.data = data[0]
                            layero.find('.table').html(window.data.content)
                        }
                    })
                }
            });
        }

        // 推荐热门
        function hatPush(id,flag){
            $.ajax({
                url: 'garden_check1',
                type: 'post',
                async: false,
                data: {
                    id: id,
                    type: flag,
                },
                dataType: 'json',
                success: function (data) {
                    var hidden = $('.permission .active').data('type');
                    var page = $(".layui-laypage-em").next().html();
                    $.ajax({
                        url: 'garden_check_list',
                        type: 'get',
                        data: { page: page,hidden: hidden },
                        dataType: 'html',
                        success: function (data) {
                            $('#dataTable').children('tbody').html(data);
                        },
                        error: function (type) {
                            console.log(type)
                        }
                    })
                },
                error:function(type){
                    
                }
            })
        }

        // 审核权限
        $('.permission').on('click', 'button', function () {
            if (!$(this).hasClass('active')) {
                var type = $(this).data('type'); //0待审核  1已通过
                // alert(type)
                $('.permission button').removeClass('active');
                $(this).addClass('active');
                getData('news_check_list', 1, type)
            }
        })


        // windowAddMouseWheel();
        function windowAddMouseWheel() {
            var scrollFunc = function (e) {
                e = e || window.event;
                var top = $(window).scrollTop();
                if (e.wheelDelta) {  //判断浏览器IE，谷歌滑轮事件
                    if (e.wheelDelta > 0) { //当滑轮向上滚动时
                        if (top < 60) {
                            if ($(".floatNav").hasClass("fixedDiv")) {
                                $(".floatNav").removeClass("fixedDiv");
                                $(window).scrollTop(0)
                            }
                        }
                    }
                    if (e.wheelDelta < 0) { //当滑轮向下滚动时
                        if (top >= 60) {
                            $(".floatNav").addClass("fixedDiv");
                        }
                    }
                } else if (e.detail) {  //Firefox滑轮事件
                    if (e.detail > 0) { //当滑轮向上滚动时
                        if (top < 60) {
                            if ($(".floatNav").hasClass("fixedDiv")) {
                                $(".floatNav").removeClass("fixedDiv");
                                $(window).scrollTop(0)
                            }
                        }
                    }
                    if (e.detail < 0) { //当滑轮向下滚动时
                        if (top >= 60) {
                            $(".floatNav").addClass("fixedDiv");
                        }
                    }
                }
            };
            //给页面绑定滑轮滚动事件
            if (document.addEventListener) {
                document.addEventListener('DOMMouseScroll', scrollFunc, false);
            }
            //滚动滑轮触发scrollFunc方法
            window.onmousewheel = document.onmousewheel = scrollFunc;
        }

    </script>
</body>
</html>