You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
207 lines
7.6 KiB
207 lines
7.6 KiB
5 years ago
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
||
|
|
<title>昵称设置</title>
|
||
|
|
<!--REM自适应布局JS-->
|
||
|
|
<link rel="stylesheet" type="text/css" href="../../../lib/css/mui.min.css">
|
||
|
|
<link rel="stylesheet" type="text/css" href="../../../lib/css/basic.css"/>
|
||
|
|
<link rel="stylesheet" type="text/css" href="../../css/base.css" />
|
||
|
|
<link rel="stylesheet" type="text/css" href="../../../css/c2c/base/dom-flex.css" />
|
||
|
|
<script src="../../../lib/js/mui.min.js"></script>
|
||
|
|
<script src="../../../lib/js/vue.js"></script>
|
||
|
|
<script src="../../../lib/js/app.js"></script>
|
||
|
|
<script src="../../js/base/rem-layout.js"></script>
|
||
|
|
<script src="../../js/my/my_ajax.js"></script>
|
||
|
|
<script type="text/javascript" src="../../js/base/regular.js"></script>
|
||
|
|
<script src="../../../lib/js/require2.1.11.js"></script>
|
||
|
|
</head>
|
||
|
|
<style>
|
||
|
|
#contents {
|
||
|
|
margin: 0.5rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.alert-text div {
|
||
|
|
margin-bottom: 0.08rem;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<div id="data-info">
|
||
|
|
<header class="mui-bar mui-bar-nav app-header app-header-darkly">
|
||
|
|
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
|
||
|
|
<h1 class="mui-title">{{langue.UserSaveNickNameTitle}}</h1>
|
||
|
|
</header>
|
||
|
|
<div class="mui-content">
|
||
|
|
<div id="contents">
|
||
|
|
<input type="text" class="app-input app-input-darkly" v-model="dataParameter.nickname" :placeholder="userLocalStorage.nickname" />
|
||
|
|
<div class="app-text-color app-text-warning-color alert-text">
|
||
|
|
<div>{{langue.UserSaveNickNameAlert1}}</div>
|
||
|
|
<div>{{langue.UserSaveNickNameAlert2}}</div>
|
||
|
|
<div>{{langue.UserSaveNickNameAlert3}}</div>
|
||
|
|
</div>
|
||
|
|
<button id="save" class="app-btn-darkly">{{langue.NotarizeText2}}</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|
||
|
|
<script>
|
||
|
|
// 国际化
|
||
|
|
var langues = {
|
||
|
|
zh_CN: {
|
||
|
|
UserSaveNickNameTitle: "昵称设置",
|
||
|
|
UserSaveNickNameMsgRepetitionError: "昵称没有变化",
|
||
|
|
UserSaveNickNameMsgNullError: "昵称不能为空",
|
||
|
|
UserSaveNickNameMsgLengthError: "昵称长度请控制在 1-10 个字符",
|
||
|
|
UserSaveNickNameMsgError: "您输入的昵称不合法，请重新输入！",
|
||
|
|
UserSaveNickNameAlert1: "请输入10位字符的昵称",
|
||
|
|
UserSaveNickNameAlert2: "可以输入的字符包含：",
|
||
|
|
UserSaveNickNameAlert3: "中文、英文、数字、下划线",
|
||
|
|
|
||
|
|
NotarizeText2: "确定",
|
||
|
|
ShowWaiting: "等待中...",
|
||
|
|
AlterSuccessMsg: "修改成功！"
|
||
|
|
|
||
|
|
},
|
||
|
|
zh_HK: {
|
||
|
|
UserSaveNickNameTitle: "暱稱設置",
|
||
|
|
UserSaveNickNameMsgRepetitionError: "暱稱沒有變化",
|
||
|
|
UserSaveNickNameMsgNullError: "暱稱不能為空",
|
||
|
|
UserSaveNickNameMsgLengthError: "暱稱長度請控制在 1-10 個字符",
|
||
|
|
UserSaveNickNameMsgError: "您輸入的暱稱不合法，請重新輸入！",
|
||
|
|
UserSaveNickNameAlert1: "請輸入10位字符的暱稱",
|
||
|
|
UserSaveNickNameAlert2: "可以輸入的字符包含：",
|
||
|
|
UserSaveNickNameAlert3: "中文、英文、數字、下劃線",
|
||
|
|
|
||
|
|
NotarizeText2: "確定",
|
||
|
|
ShowWaiting: "等待中...",
|
||
|
|
AlterSuccessMsg: "修改成功！"
|
||
|
|
},
|
||
|
|
en_US: {
|
||
|
|
UserSaveNickNameTitle: "Nickname",
|
||
|
|
UserSaveNickNameMsgRepetitionError: "The nickname has not changed",
|
||
|
|
UserSaveNickNameMsgNullError: "The nickname cannot be empty",
|
||
|
|
UserSaveNickNameMsgLengthError: "Please control the nickname length to 1-10 characters",
|
||
|
|
UserSaveNickNameMsgError: "The nickname you entered is not valid, please re-enter!",
|
||
|
|
UserSaveNickNameAlert1: "Please enter a nickname of 10 characters",
|
||
|
|
UserSaveNickNameAlert2: "The characters that can be entered contain:",
|
||
|
|
UserSaveNickNameAlert3: "Chinese, English, Number, Underline",
|
||
|
|
|
||
|
|
NotarizeText2: "OK",
|
||
|
|
ShowWaiting: "Waiting...",
|
||
|
|
AlterSuccessMsg: "Modified successfully!"
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<script>
|
||
|
|
var dataInfo = new Vue({
|
||
|
|
el: '#data-info',
|
||
|
|
data: {
|
||
|
|
langue: langues[app.getLanguageLocalStorage()],
|
||
|
|
userLocalStorage: app.getUserLocalStorage(), // 缓存的用户数据
|
||
|
|
dataParameter: {
|
||
|
|
nickname: "" // 新昵称
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
trimeAll: function() {
|
||
|
|
this.dataParameter.nickname = this.dataParameter.nickname.replace(/^ +| +$/g, ''); // v-on:keyup="trimeAll"
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
mui.plusReady(function() {
|
||
|
|
var saveBtn = document.getElementById("save");
|
||
|
|
// 确认
|
||
|
|
saveBtn.addEventListener("tap", function() {
|
||
|
|
if(verifyNickName()) {
|
||
|
|
plus.nativeUI.showWaiting(dataInfo.langue.ShowWaiting);
|
||
|
|
saveBtn.setAttribute("disabled", true);
|
||
|
|
console.log(dataInfo.dataParameter.nickname)
|
||
|
|
mui.ajax(myAjaxJs.AJAX_UPDATE_NICK_NAME.getUrl, {
|
||
|
|
headers: {
|
||
|
|
"X-Requested-Token": app.getTokenStorage(), // token头部
|
||
|
|
"locale": app.getLanguageLocalStorage() // 语种头部
|
||
|
|
},
|
||
|
|
type: myAjaxJs.AJAX_UPDATE_NICK_NAME.getType, //HTTP请求类型
|
||
|
|
data: {
|
||
|
|
nickName: dataInfo.dataParameter.nickname
|
||
|
|
},
|
||
|
|
dataType: 'json', //服务器返回json格式数据
|
||
|
|
timeout: 10000, //超时时间设置为10秒；
|
||
|
|
success: function(data) {
|
||
|
|
if("200" == data.code) {
|
||
|
|
//用户数据加入缓存
|
||
|
|
var userData = app.getUserLocalStorage();
|
||
|
|
userData.nickName = dataInfo.dataParameter.nickname;
|
||
|
|
app.setUserLocalStorage(userData);
|
||
|
|
synchrodataFun();
|
||
|
|
plus.nativeUI.closeWaiting();
|
||
|
|
mui.back();
|
||
|
|
var center = plus.webview.currentWebview().opener();
|
||
|
|
center.evalJS("saveUserInfoData();");
|
||
|
|
plus.webview.currentWebview().close();
|
||
|
|
mui.toast(dataInfo.langue.AlterSuccessMsg);
|
||
|
|
} else if(data.code == "201" || data.code == "202") { //未登录
|
||
|
|
plus.nativeUI.closeWaiting();
|
||
|
|
mui.openWindow({
|
||
|
|
id: "mine/html/wallet_login.html",
|
||
|
|
url: "../wallet_login.html"
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
saveBtn.removeAttribute("disabled", true);
|
||
|
|
plus.nativeUI.closeWaiting();
|
||
|
|
app.toast(data.msg);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
error: function(xhr, type, errorThrown) {
|
||
|
|
saveBtn.removeAttribute("disabled", true);
|
||
|
|
plus.nativeUI.closeWaiting();
|
||
|
|
// app.toast(langue.AjaxError);
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
});
|
||
|
|
})
|
||
|
|
|
||
|
|
function verifyNickName() {
|
||
|
|
var nickNameNew = dataInfo.dataParameter.nickname == null ? "" : dataInfo.dataParameter.nickname; // 新昵称
|
||
|
|
var nickNameOld = dataInfo.userLocalStorage.nickname == null ? "" : dataInfo.userLocalStorage.nickname; // 旧昵称
|
||
|
|
var regular_emoji = /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/ig;
|
||
|
|
var emoji_test = regular_emoji.test(nickNameNew);
|
||
|
|
if("" == nickNameNew) {
|
||
|
|
app.toast(dataInfo.langue.UserSaveNickNameMsgNullError);
|
||
|
|
} else if(nickNameNew == nickNameOld) {
|
||
|
|
app.toast(dataInfo.langue.UserSaveNickNameMsgRepetitionError);
|
||
|
|
} else if(nickNameNew.length < 1 || nickNameNew.length > 10) {
|
||
|
|
app.toast(dataInfo.langue.UserSaveNickNameMsgLengthError);
|
||
|
|
} else if(emoji_test) {
|
||
|
|
app.toast(dataInfo.langue.UserSaveNickNameMsgError);
|
||
|
|
} else if(!regular.chinese_english2.test(nickNameNew)) {
|
||
|
|
app.toast(dataInfo.langue.UserSaveNickNameMsgError);
|
||
|
|
} else {
|
||
|
|
return true;
|
||
|
|
}
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 数据同步
|
||
|
|
*/
|
||
|
|
function synchrodataFun() {
|
||
|
|
//获取首页窗口，账户信息页窗口
|
||
|
|
var walletMyView = plus.webview.getWebviewById("mine/html/wallet_my.html");
|
||
|
|
var walletUserInfoListView = plus.webview.getWebviewById("mine/html/user/user_info_list.html");
|
||
|
|
walletMyView.evalJS("saveUserInfoData();");
|
||
|
|
walletUserInfoListView.evalJS("saveUserInfoData();");
|
||
|
|
}
|
||
|
|
|
||
|
|
// 国际化统一方法
|
||
|
|
window.addEventListener('switchLangueData', function(e) {
|
||
|
|
dataInfo.langue = langues[e.detail];
|
||
|
|
});
|
||
|
|
</script>
|