<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>直属代理列表</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="">
    <meta name="HandheldFriendly" content="true">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="/wap/resources/css/weui/weui.min.css">
    <link rel="stylesheet" href="/wap/resources/css/weui/jquery-weui.min.css">
<!--    <script type="text/javascript" src="/wap/resources/js/common/h5.js"></script>-->
    <style>
        body{
            background-color: #f7f7f7;
        }
        .container{
            background-color: #f7f7f7;
            width: 100%;
            height:100%;
            position: absolute;
            padding:0px;
            overflow: hidden;
            color: #000;
        }
        .records-list{
            height:100%;overflow:auto;  z-index: 1;
            background-color: #f7f7f7;
        }
        .weui-form-preview{
            margin: 10px 0 0 0;
        }
        .br{
            border-bottom: 1px solid #dcdbdbb8;
            width: 100%;
            height: 1px;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
<input type="hidden" id="token" th:value="${token}">
<div class="container">
    <div class="list-main-mian infinite weui-pull-to-refresh records-list" id="listwrap">
        <!--下拉刷新-->
        <div class="weui-pull-to-refresh__layer" style="padding: 5px;">
            <div class="weui-pull-to-refresh__arrow"></div>
            <div class="weui-pull-to-refresh__preloader"></div>
            <div class="down">下拉刷新</div>
            <div class="up">释放刷新</div>
            <div class="refresh">正在刷新</div>
        </div>
        <div class="weui-form-preview" id="Tolist">
            <!--内容展示区域-->
        </div>
        <div class="weui-loadmore" style="padding-bottom:30px;height:20px">
            <i class="weui-loading"></i>
            <span class="weui-loadmore__tips">正在加载</span>
        </div>
    </div>
<!--    <a href="javascript:;" class="weui_btn weui_btn_primary">按钮</a>-->
</div>
<script type="text/javascript" src="/wap/resources/js/jquery.min.js"></script>
<script src="/wap/resources/js/weui/jquery-weui.min.js"></script>
<script>
    var pages = 1;
    var sizes = 10;
    var loading = false;  //状态标记
    $(function () {
        loadlist();
    })
    //=========================下拉刷新
    $("#listwrap").pullToRefresh().on("pull-to-refresh", function () {
        setTimeout(function () {
            pages = 1;
            $("#Tolist").html("");
            loadlist();
            if (loading) loading = false;
            $("#listwrap").pullToRefreshDone(); // 重置下拉刷新
        }, 1500);   //模拟延迟
    });
    //============================滚动加载
    $("#listwrap").infinite().on("infinite", function () {
        if (loading) return;
        loading = true;
        pages++; //页数
        $('.weui-loadmore').show();
        setTimeout(function () {
            loadlist();
            loading = false;
        }, 2500);   //模拟延迟
    });
    // =======加载数据loadlist();
    function loadlist() {
        var html = "";
        $.ajax({
            type: "POST",
            url: "/wap/user/agent/page",
            data: { 'page': pages, 'size': sizes,'token':$("#token").val()},
            dataType: "json",
            error: function (request) {
                $(".weui-loadmore").hide();
                html += "<div class=\"weui-cells__title\" >已无更多数据</div>";
                $("#Tolist").append(html);
            },
            success: function (data) {
                if(data.code == 200){
                    if (data.data.records.length > 0) {
                        for (var i = 0; i < data.data.records.length; i++) {
                            html += ' <div class="weui-form-preview__bd"> ';
                            html += ' <div class="weui-form-preview__item"> ';
                            html += ' <label class="weui-form-preview__label">' + data.data.records[i].userName + '</label> ';
                            html += ' <div class="weui-form-preview__value">编号：' + (data.data.records[i].userNo == null ? "-" : data.data.records[i].userNo) + '</div> ';
                            html += ' </div> ';
                            html += ' </div> <span class="br"></span>';
                        }
                        $("#Tolist").append(html);
                    }
                    else {
                        html += "<div class=\"weui-cells__title\" >已无更多数据</div>";
                        $("#Tolist").append(html);
                        loading = true;
                    }
                }else{
                    $.toast(data.message,"text");
                }
                $(".weui-loadmore").hide();
            }
        });
    }
</script>
</body>
</html>