{% 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>Document</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;
        }

        /* 发布类型 */

        .widget-title {
            position: relative;
            padding-left: 10px;
            font-size: 16px;
            padding: 5px 0 5px 10px;
        }

        .widget-title::after {
            position: absolute;
            content: '';
            left: 0;
            top: 9px;
            height: 15px;
            border-left: 5px solid #23a3ee;
            padding-left: 10px;
            font-size: 16px;
            padding: 5px 0 5px 10px;
        }

        .widget-title h2 {
            font-weight: 700;
            line-height: 33px;
        }

        .widget-title h2 span {
            font-size: 13px;
            font-weight: 100;
            margin-left: 20px;
            color: #333;
        }



        /* 上传详情 */

        .uploadContent {
            /* border-top: 7px solid #f0f0f0; */
            padding: 25px;
        }

        #selectModel {
            display: none;
        }

        .selectModel>div {
            width: 90%;
            margin-top: 30px;
        }

        /* 操作 */

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

        .delBtn,
        .delBtn:hover {
            color: #c12525;
        }
    </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="widget-title">
                    <h2>公告列表
                        <span id="Uptime"></span>

                        <form class="layui-form" action="" style="display:inline-block;vertical-align: middle;">
                            <div class="layui-form-item" style="margin-bottom: 0;">
                                <label class="layui-form-label" style="color:#029eef">类型选择：</label>
                                <div class="layui-input-inline">
                                    <select name="type" lay-verify="required" lay-filter="type">
                                        <option value=""></option>
                                        <option value="0">新闻</option>
                                        <option value="1">政策</option>
                                        <option value="2">技术</option>
                                    </select>
                                </div>
                            </div>
                        </form>
                    </h2>
                </div>

                <div>
                    <table id="dataTable" class="layui-table" lay-skin="line">
                        <thead>
                            <tr>
                                <th style="width:40%">标题</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 element, form, laypage;
        layui.use(['element', 'form', 'laypage'], function () {
            element = layui.element;
            form = layui.form;
            laypage = layui.laypage;
            //一些事件监听
            form.on('select(type)', function (data) {
                var val = data.value;
                $.ajax({
                    url: 'policy_list',
                    type: 'post',
                    data: {
                        req: data.value,
                        page: 1
                    },
                    dataType: 'html',
                    success: function (data) {
                        $('#dataTable').children('tbody').html(data);
                        laypage.render({
                            elem: 'page' //注意，这里的 test1 是 ID，不用加 # 号
                            // , limit: 3
                            , count: $('#totalPage').val()
                            , theme: '#2ca9f9'
                            , layout: ['prev', 'page', 'next', 'skip']
                            , jump: function (obj, first) {
                                if (!first) {
                                    $.ajax({
                                        url: 'policy_list',
                                        type: 'get',
                                        data: { page: obj.curr, req: val },
                                        dataType: 'html',
                                        success: function (data) {
                                            $('#dataTable').children('tbody').html(data);
                                            console.log($('#totalPage').val());
                                        },
                                        error: function (type) {
                                            console.log(type)
                                        }
                                    })
                                }
                            }
                        });
                    },
                    error: function (type) {
                        console.log(type)
                    }
                })
            });

            getData('policy_list', { page: 1, type: '' });
        });


        function getData(page, data) {
            $.ajax({
                url: 'policy_list',
                type: 'get',
                data: data,
                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: 'policy_list',
                                    type: 'get',
                                    data: { page: obj.curr },
                                    dataType: 'html',
                                    success: function (data) {
                                        $('#dataTable').children('tbody').html(data);
                                        console.log($('#totalPage').val());
                                    },
                                    error: function (type) {
                                        console.log(type)
                                    }
                                })
                            }
                        }
                    });
                },
                error: function (type) {
                    console.log(type)
                }
            })
        }

        // 编辑
        function editFun(id) {
            $.ajax({
                url: 'policy_list_view',
                type: 'post',
                data: {
                    req: 'see',
                    id: id
                },
                dataType: 'json',
                success: function (data) {
                    if (data.length) {
                        var index = layer.open({
                            title: '民宿编辑',
                            type: 2,
                            area: ['850px', '560px'],
                            content: 'policy_pub',
                            success: function (layero, index) {
                                // alert(2)
                                var body = layer.getChildFrame('body', index);
                                var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                                iframeWin.fillForm(data[0], id)
                            }
                        });
                    }

                },
                error: function (type) {
                    console.log(type)
                }
            })


        }

        // 删除
        function delFun(id) {
            layer.confirm('真的删除行么', { title: '删除' }, function (index) {
                $.ajax({
                    url: 'policy_list_view',
                    type: 'post',
                    data: {
                        req: 'del',
                        id: id,
                    },
                    dataType: 'json',
                    success: function (data) {
                        if (data) {
                            // obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                            // $(".layui-laypage-btn")[0].click();//点击分页刷新当前页
                            layer.close(index);
                            // parent.layer.msg("操作成功!", {time: 1000}, function () {
                            //重新加载父页面
                            $.ajax({
                                url: 'policy_list',
                                type: 'post',
                                data: { page: $('.layui-laypage-curr em').eq(1).html(), req: $('select[name=type]').val() },
                                dataType: 'html',
                                success: function (data) {
                                    $('#dataTable').children('tbody').html(data);
                                    console.log($('#totalPage').val());
                                },
                                error: function (type) {
                                    console.log(type)
                                }
                            })
                        }
                    }
                })
                layer.close(index);

            });
        }



        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>