<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

<head>
    <title>用户管理</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/1.1.2/weui.min.css"/>
    <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.0/css/jquery-weui.css"/>
    <style type="text/css">
        body, html {
            height: 100%;
            background-color: #f4f4f4;
            -webkit-tap-highlight-color: transparent;
        }

        footer {
            text-align: center;
            font-size: 14px;
            padding: 20px;
        }

        .basic-color_bg {
            background-color: #f4f4f4;
        }

        .weui-loadmore_line .weui-loadmore__tips {
            background-color: #f4f4f4;
        }

        footer a {
            color: #999;
            text-decoration: none;
        }

    </style>
</head>

<body ontouchstart>
<div class="weui-pull-to-refresh__layer">
    <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="defaultFriends">
    <div class="weui-cells__title weui-cell default_user_lists" th:unless="${userDefaultSize} == 0">
        站点默认好友列表
    </div>
    
    <div class="weui-cells demos-content-padded default_user_lists" id='default_user_lists'
         th:unless="${userDefaultSize} == 0">
        <a class="weui-cell weui-cell_access update-site-user" th:each="user:${userList}" url-data="/user/profile"
           th:attr="id=${user.siteUserId}"
           href="javascript:;">
            <div class="weui-cell__hd" name="user_image" th:attr="id=${user.userPhoto}"></div>
            <div class="weui-cell__bd site_user_name"><p th:text="${user.userName}"></p></div>
            <div class="weui-cell__ft"></div>
        </a>
    </div>
</div>

<div class="siteMembers">
	<div class="weui-cells__title weui-cell ">
	    站点成员列表
	</div>
	<div class="weui-cells demos-content-padded" id='user-lists'>
	
	</div>
</div>

<!-- <input type='hidden' id='init_url' url-data='/user/userList'> -->
<div class="weui-loadmore weui-loadmore_line loadmore_site_user ">
    <span class="weui-loadmore__tips basic-color_bg"></span>
</div>

<script type="text/javascript" src="https://cdn.bootcss.com/jquery/2.2.4/jquery.js"></script>
<script type="text/javascript" src="https://res.wx.qq.com/open/libs/weuijs/1.1.3/weui.min.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/jquery-weui/1.2.0/js/jquery-weui.js"></script>
<script type="text/javascript">
    function getOsType() {
        var u = navigator.userAgent;
        if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1 || u.indexOf('Windows Phone') > -1) {
            return 'Android';
        } else if (u.indexOf('iPhone') > -1) {
            return 'IOS';
        } else {
            return 'PC';
        }
    }

    function reqUrl(reqUri, params, callbackName) {
        reqUri = "/akaxin" + reqUri;
        var type = getOsType();
        if (type == 'Android') {
            Android.requestPost(reqUri, params, callbackName);
        } else if (type == 'IOS') {
            ios_requestPost(reqUri, params, callbackName);
        } else {
            $.toast('暂时不支持该设备');
        }
    }

    function reqHtml(reqUri, params) {
        reqUri = "/akaxin" + reqUri;
        var type = getOsType();
        if (type == 'Android') {
            Android.requestPage(reqUri, params)
        } else if (type == 'IOS') {
            ios_requestPage(reqUri, params);
        } else {
            $.toast('暂时不支持该设备');
        }
    }

    function reqImageUpload(callback) {
        var type = getOsType();
        if (type == 'Android') {
            Android.imageUpload(callback);
        } else if (type == 'IOS') {
            ios_imageUpload(callback);
        } else {
            $.toast('暂时不支持该设备');
        }
    }

    function reqImageDownload(imageid, callback) {
        var type = getOsType();
        if (type == 'Android') {
            Android.imageDownload(imageid, callback);
        } else if (type == 'IOS') {
            ios_imageDownload(imageid, callback);
        } else {
            $.toast('暂时不支持该设备');
        }
    }

    function toast(msg) {
        var type = getOsType();
        if (type == 'Android') {
            Android.showToast(msg);
        } else if (type == 'IOS') {
            $.toast(msg);
        } else {
            $.toast('暂时不支持该设备');
        }
    }
    
    $(function () {
    	   $('#user-lists').html("");
       userList();
    });

    var page = 0;
    var loading = false;

    $(document.body).infinite().on("infinite", function () {
    	   if(page == 0){
    		   $('#user-lists').html("");
    	   }
       userList()
    });
    
    $(document).on('click', ".update-site-user", function () {
        var siteUserId = $(this).attr('id');
        var reqUri = $(this).attr('url-data');
        var userInfo = {
            'site_user_id': siteUserId,
        };
        reqHtml(reqUri, JSON.stringify(userInfo));
    });

    function userList() {
        if (loading) {
            $('.loadmore_site_user').addClass('weui-loadmore_line');
            $('.loadmore_site_user span').html('到底啦');
            return
        }
        page = page + 1;
        //var reqUri = $('#init_url').attr('url-data');
        var reqUri = "/user/userList";
        var params = {
            "page": page.toString(),
        };
        reqUrl(reqUri, JSON.stringify(params), 'addUserToList');
       
    }

    function addUserToList(results) {
        results = eval("(" + results + ")");
        var data = results.userData;
        var html = '';
        $.each(data, function (index, user) {
            var html = '<a class="weui-cell weui-cell_access update-site-user" url-data="/user/profile" id="' + user.siteUserId + '" href="javascript:;" > <div class="weui-cell__hd" name="user_image" id="' + user.userPhoto + '" > </div> <div class="weui-cell__bd site_user_name" > <p>' + user.userName + '</p> </div> <div class="weui-cell__ft"></div> </a>';
            $('#user-lists').append(html);
        });
        loading = results.loading;
        if (loading == true) {
            $(".weui-loadmore__tips").html("没有更多数据了");
        } else {
            $(".weui-loadmore__tips").html("加载更多");
        }
    }

    $(document.body).pullToRefresh(function () {
        reqUrl("/user/refresh", null, "doRefresh");
        $('#user-lists').html("");
        page = 0;
        loading = false;
        userList();
        $(document.body).pullToRefreshDone();
    });

    function doRefresh(results) {
        results = eval("(" + results + ")");
        var size = results.size;
        if (size <= 0) {
            $('.defaultFriends').html("");
        } else {
            $('.defaultFriends').html("");
            var defHtml = '<div class="weui-cells__title weui-cell default_user_lists" th:unless="${userDefaultSize} == 0">站点默认好友列表</div>' +
                '<div class="weui-cells demos-content-padded default_user_lists" id=\'default_user_lists\' th:unless="${userDefaultSize} == 0"></div>';
            $('.defaultFriends').append(defHtml);
            var data = results.data;
            var html = '';
            $.each(data, function (index, user) {
                var html = '<a class="weui-cell weui-cell_access update-site-user" url-data="/user/profile" id="' + user.siteUserId + '" href="javascript:;" > <div class="weui-cell__hd" name="user_image" id="' + user.userPhoto + '" > </div> <div class="weui-cell__bd site_user_name" > <p>' + user.userName + '</p> </div> <div class="weui-cell__ft"></div> </a>';
                $('#' + user.siteUserId).remove();
                $('#default_user_lists').append(html);
            });

        }
    }
</script>
</body>

</html>