{{ define "kas/member_main.htm" }}
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <title>会员管理 - 后台管理 - 看丽人</title>
    <script type="text/javascript">
        const ISGOKEEP = true;
    </script>
    {{ template "_common.htm" .}}
    <script src="{{.global.host_img}}/assets/js/jsrender.min.js"></script>
    <script type="text/javascript" src="{{.global.host_img}}/assets/js/moment.min.js"></script>
    <script type="text/javascript" src="{{.global.host_img}}/assets/js/daterangepicker.min.js"></script>
    <link rel="stylesheet" type="text/css" href="{{.global.host_img}}/assets/css/daterangepicker.css" />
    <script type="text/javascript">
        LoadMemberInfo();
    </script>
</head>

<body>
    {{ template "kas/_header.htm" .}}
    <main role="main">
        <div class="album py-3 bg-light">
            <div class="container">
                {{ template "kas/_nav.htm" .}}
                <div class="alert alert-dark border-bottom"><a href="/kas/member_main">会员管理</a></div>

                <div id="frmSearch">
                    <div class="form-group">
                        <label for="iptMid">会员ID</label>
                        <input name="mid" type="text" class="form-control" id="iptMid" value=""
                            placeholder="输入会员ID（数字）">
                    </div>
                    <div class="form-group">
                        <label for="iptUserid">用户名</label>
                        <input name="userid" type="text" class="form-control" id="iptUserid" value="">
                    </div>
                    <button id="btnSearch" class="btn btn-danger btn-block" type="submit">搜索</button>
                </div><!-- end frmSearch -->

                <div class="ibox-content table-responsive-sm pt-2">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>用户名</th>
                                <th>注册时间</th>
                                <th>金币数</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody id="frmResult">
                        </tbody>
                    </table>
                    <nav id="frmPagination" style="display: none">
                        <ul class="pagination justify-content-center">
                            <li class="page-item" id="prePage">
                                <a class="page-link" href="javascript:GoPre()">上一页</a>
                            </li>
                            <li class="page-item disabled" id="totalPage">
                                <a class="page-link"><span id="spCurrentPage">..</span>/<span
                                        id="spTotalPage">..</span>页</a>
                            </li>
                            <li class="page-item" id="nextPage">
                                <a class="page-link" href="javascript:GoNext()">下一页</a>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>

    </main>

    <script id="tplOrderRow" type="text/x-jsrender">
  <tr>
    <td>{%:Userid%}</td>
    <td>{%:~unix_to_str(Jointime)%}</td>
    <td>{%:Money%}</td>
    <td>...</td>
  </tr>
</script>

    {{ template "kas/_footer.htm" .}}
    <script type="text/javascript">
        var currentpage = 1;
        const pagesize = 20;
        var gokeep_token = GetCookie(TokenName())
        if (gokeep_token == null) {
            DirectTo("/kas");
        }
        $.views.settings.delimiters("{%", "%}"); // 设置js render标签

        function unix_to_str(time) {
            time = parseInt(time) * 1000;
            var datetime = new Date();
            datetime.setTime(time);
            var year = datetime.getFullYear();
            var month = datetime.getMonth() + 1;
            var date = datetime.getDate();
            var hour = datetime.getHours();
            var minute = datetime.getMinutes();
            return year + "-" + month + "-" + date + " " + hour + ":" + minute;
        }

        $.views.helpers({
            unix_to_str: unix_to_str
        })

        var userid = "";
        var mid = 0;
        var page = currentpage;

        var urlParams = new URLSearchParams(window.location.search);
        if (parseInt(urlParams.get('mid')) > 0) {
            mid = parseInt(urlParams.get('mid'));
        }
        if (urlParams.get('userid') != "") {
            userid = urlParams.get('userid');
        }

        if (urlParams.get('page') > 0) {
            page = parseInt(urlParams.get('page'));
            currentpage = page;
        }
        if (urlParams.has('page') && urlParams.has('page_size')) {
            GotoPage(page);
        }

        function GoNext() {
            currentpage = currentpage + 1;
            GotoPage(currentpage);
        }

        function GoPre() {
            currentpage = currentpage - 1;
            GotoPage(currentpage);
        }

        function GotoPage(page) {
            if (page == 1) {
                $("#prePage").addClass('disabled');
            } else {
                $("#prePage").removeClass('disabled');
            }
            $("#spCurrentPage").text(page);

            var data = {
                mid: mid,
                userid: userid,
                page: page,
                page_size: pagesize,
            };

            window.history.pushState("searchResult", "搜索结果", "/kas/member_main?" + $.param(data));

            $.ajax({
                type: "GET",
                dataType: 'json',
                data: data,
                url: "/api/v1/auth/member/list",
                beforeSend: function (xhr) {
                    xhr.setRequestHeader('Authorization', 'Bearer ' + gokeep_token);
                }
            }).done(function (data) {
                Log(data);
                if (data.code == 0) {
                    var total = Math.ceil(data.result.total / pagesize);
                    if (total == 0) {
                        $("#noneResult").show();
                        return;
                    } else {
                        $("#noneResult").hide();
                    }
                    if ((data.result.members.length < pagesize) || (page == total)) {
                        $("#nextPage").addClass('disabled');
                    } else {
                        $("#nextPage").removeClass('disabled');
                    }

                    $("#spTotalPage").text(total);

                    var content = $("#tplOrderRow").render(data.result.members);
                    $("#frmResult").html(content);
                    $("#frmPagination").show();
                }
            }).fail(function (data) {
                Log("fail:", data);
                ShowMsg("获取列表失败");
            }); // end ajax
        }


        $("#btnSearch").click(function (event) {
            mid = $("#iptMid").val();
            userid = $("#iptUserid").val();
            GotoPage(1);
        });

        GotoPage(1);

    </script>
</body>

</html>
{{ end }}