WindChat/windchat-admin/src/main/resources/webapp/views/siteMember/siteMember.html

310 lines
9.3 KiB
HTML
Executable File
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<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>
body, html {
height: 100%;
background-color: #f4f4f4;
-webkit-tap-highlight-color: transparent;
}
.basic-title {
text-align: center;
font-weight: 400;
color: #1E88E5;
margin: 0 15%;
}
.basic-sub-title {
text-align: center;
color: #1E88E5;
}
.basic-header {
padding: 35px 0;
}
css
.basic-content-padded {
padding: 15px;
}
.basic-second-title {
text-align: center;
color: #1E88E5;
font-weight: 400;
margin: 0 15%;
}
.basic-weui-grid {
position: relative;
float: left;
padding: 5px;
width: 60px;
height: 60px;
}
.basic-color {
background-color: #1E88E5;
color: #FFFFFF;
}
.basic-weui-btn_primary {
background-color: #1E88E5;
}
.basic-weui-btn {
background-color: #1E88E5;
color: #FFFFFF;
}
.basic-weui-btn:hover {
background-color: #1E88E5;
color: #FFFFFF;
}
.basic-weui-btn:active {
background-color: #1E88E5 !important;
color: #FFFFFF;
}
.basic-weui-btn_mini {
display: inline-block;
padding: 0 1.32em;
line-height: 2.3;
}
.weui-dialog__btn {
color: #1E88E5;
}
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-cells" id='member-lists' style="margin-top: 0px;">
</div>
<input type='hidden' id='init_url' url-data="/userSquare/pullMemberList"/>
<input type='hidden' id='site_user_id' th:attr="data=${site_user_id},user-name=${site_user_name}"/>
<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 () {
$('#member-lists').html("");
loadSiteMember();
});
var page = 0;
var loading = false;
// 下拉加载更多数据
$(document.body).infinite().on("infinite", function () {
if(page == 0){
$('#member-lists').html("");
}
loadSiteMember();
});
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('暂时不支持该设备');
}
}
$(document).on("click", ".add-member-friend", function () {
var siteUserId = $(this).attr('data');
var url = $(this).attr('url-data');
var siteUserName = $('#site_user_id').attr('user-name');
var applyReason = "";
if (siteUserName.length > 0) {
applyReason = "你好,我是 " + siteUserName;
}
$.prompt({
input: applyReason,
text: "",
title: "申请添加好友",
onOK: function (text) {
var userInfo = {
'site_user_id': siteUserId,
"apply_reason": text
};
reqUrl(url, JSON.stringify(userInfo), "applyFriend");
},
onCancel: function () {
console.log('cancle');
toast('取消操作');
$.closeModal();
},
});
});
function loadSiteMember() {
if (loading) {
$('.loadmore_site_member').addClass('weui-loadmore_line');
$('.loadmore_site_member span').html('暂无数据');
$('.loadmore_site_member i').remove();
return false;
}
page = page + 1;
var reqUri = $('#init_url').attr('url-data');
var params = {
"pageNum": page.toString()
};
reqUrl(reqUri, JSON.stringify(params), 'addMemberToList');
}
function addMemberToList(results) {
results = eval("(" + results + ")");
var data = results.Data;
var currentSiteUserId = $('#site_user_id').attr('data');
$.each(data, function (index, user) {
var imageid = user.site_user_photo;
if (currentSiteUserId != user.site_user_id) {
var html = '<div class="weui-cell">'
+'<div class="weui-cell__hd user-photo" id="'+imageid+'"><img src="#" style="height:55px; width:55px;border-radius:50%" /></div>';
//+'<div class="weui-cell__bd"><p>' + user.site_user_name + '</p><p>' + user.site_user_name + '</p></div>';
if (user.site_user_relation == 1) {
html +='<div class="weui-cell__bd"><p>' + user.site_user_name + '</p><p style="color:#9b9b9b;font-size:12px;">TA是你的好友</p></div>';
html +='<p style="color:#9b9b9b;font-size:14px;"><i class="weui-icon-success-no-circle"></i></p>';
} else {
html +='<div class="weui-cell__bd"><p>' + user.site_user_name + '</p><p style="color:#9b9b9b;font-size:12px;">点击添加好友</p></div>'
+ '<a href="javascript:;" class="weui-btn basic-weui-btn weui-btn_mini add-member-friend" data="' + user.site_user_id + '" url-data="/userSquare/applyFriend">添加好友</a>';
}
html += '</div>';
$('#member-lists').append(html);
if(imageid!=null && imageid!=""){
reqImageDownload(imageid, "reloadUserPhoto");
}
}
});
loading = results.loading;
if (loading == true) {
$(".weui-loadmore__tips").html("没有更多数据了");
} else {
$(".weui-loadmore__tips").html("加载更多");
}
}
function reloadUserPhoto(success, imageid, imageLocalPath) {
var type = getOsType();
var imgSrc = imageLocalPath;
if (type == 'Android') {
imgSrc = "http://akaxin/img" + imageLocalPath;
}
var html = '<img src="' + imgSrc + '" style="height:50px; width:50px;border-radius:50%" />';
$('#'+imageid).html(html);
}
function applyFriend(result) {
result = eval("(" + result + ")");
if (result[0] == '成功') {
$.toast("发送请求成功");
var $1 = $('[data=' + result[1] + ']');
$1.attr("style", "color:#9b9b9b;font-size:14px;");
$1.attr("class", "");
$1.html("等待通过");
} else {
$.toast(result[0], "forbidden");
}
}
</script>
</body>
</html>