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.

619 lines
19 KiB

<!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" />
<script src="../../lib/js/mui.min.js"></script>
<script src="../../lib/js/mui.pullToRefresh.js"></script>
<script src="../../lib/js/mui.pullToRefresh.material.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/login/login_ajax.js"></script>
<script src="../../html/wakuang/js/eth/ajax/eth.ajaxApi.js"></script>
<script src="../../html/OTC/js/ajax/market_apply_ajax.js"></script>
</head>
<style>
.app-header {
padding-right: 0.25rem;
font-size: 0.3rem;
}
#user-info {
background: url(../img/3.png) no-repeat !important;
background-size: 100% 100% !important;
height: 2.21rem;
margin: 0.2rem 0 0.25rem 0;
display: flex;
flex-direction: row;
align-items: center;
flex-basis: 0;
flex-shrink: 0;
}
#user-info #user-img {
width: 1.2rem;
margin: 0 0.3rem;
margin-right: 0.4rem;
height: 1.2rem;
border-radius: 100%;
overflow: hidden;
font-size: 0.5rem;
text-align: center;
line-height: 1.2rem;
color: white;
}
#user-info #user-img img {
height: 100%;
width: 100%;
}
#user-info #user-img #loginNot {
height: 100%;
width: auto;
}
#user-info .user-data {
flex-grow: 1;
display: flex;
flex-direction: column;
}
#user-info .user-data span {
font-size: 0.35rem;
line-height: 0.4rem;
margin-bottom: 0.1rem;
color: white;
}
#user-info .user-data a {
font-size: 0.2rem;
color: #FFFFFF;
}
#user-info .user-data p {
font-size: 0.22rem;
line-height: 0.22rem;
margin-bottom: 0.1rem;
color: #FFFFFF;
}
#user-info .user-data .ID {
width: 10em;
height: .37rem;
background: #fff;
border-radius: 4px;
color: #F5B426;
line-height: .37rem;
font-size: .2rem;
font-family: PingFangSC-Regular;
text-align: left;
padding: 1px;
padding-left: 1em;
}
#user-info .user-data p+p {
margin-bottom: 0;
}
#ul-group .app-table-view,
#user-info {
/*border-radius: 0.2rem;*/
}
#ul-group .app-table-view .mui-table-view-cell {
/* border-color: #191C2F;*/
}
/*编辑按钮的样式*/
.mui-pull-right {
color: #fff;
display: block;
margin-top: -1.3rem;
margin-right: .2rem;
}
.mui-pull-right img {
width: .31rem;
height: .31rem;
}
/*图标的样式*/
.mui-table-view-cell .my-icon {
width: .32rem;
height: .32rem;
vertical-align: text-bottom;
margin-right: .23rem;
}
</style>
<body>
<div id="data-info">
<header class="mui-bar mui-bar-nav">
<h1 class="mui-title">{{langue.title}}</h1>
<!-- <a id="cancel-M" class=" mui-pull-right mui-icon-right-nav" style=" font-size: .24rem;bottom:15px;">{{langue.cancelMarket}}</a> -->
</header>
<div class="mui-content">
<div id="user-info" class="app-background-color">
<div id="user-img" v-html="getUserImg">
{{getUserImg}}
</div>
<div id="login" class="user-data" v-bind:class="{ 'mui-hidden': loginType}">
<span class="app-text-color" data-text="WalletMyNoLogin">{{langue.notLogin}}</span>
<a data-text="WalletMyLoginTap">{{langue.notLoginText}}</a>
</div>
<div class="user-data" v-bind:class="{'mui-hidden': !loginType}">
<span class="app-text-color">{{userLocalStorage.nickName}}</span>
<p>{{langue.username}}:{{userLocalStorage.mobilePhone}}</p>
</div>
<a id="user-info-btn" class="mui-pull-right" v-bind:class="{'mui-hidden': !loginType}"><img src="../img/icon_bianji.png" /></a>
</div>
<div id="ul-group">
<ul class="mui-table-view app-table-view app-table-view-darkly jurisdiction-ul">
<li class="mui-table-view-cell">
<a class="view-herf mui-navigate-right" id="whitePaper">
<img src="../img/baipishu.png" class="my-icon" /> {{langue.baipishu}}
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" id="account-safe">
<img src="../img/icon_account.png" class="my-icon" /> {{langue.security}}
</a>
</li>
<li class="mui-table-view-cell">
<a class="view-herf mui-navigate-right" view-id="mine/html/my/realname_identity.html" view-url="my/realname_identity.html">
<img src="../img/icon_realname.png" class="my-icon" /> {{langue.verification}}
</a>
</li>
<li class="mui-table-view-cell">
<a class="view-herf mui-navigate-right" id="transaction">
<img src="../img/icon_realname.png" class="my-icon" /> {{langue.payType}}
</a>
</li>
<li class="mui-table-view-cell">
<a class="view-herf mui-navigate-right" id="share">
<img src="../img/icon_realname.png" class="my-icon" /> {{langue.share}}
</a>
</li>
<li class="mui-table-view-cell">
<a class="view-herf mui-navigate-right" id="charges">
<img src="../img/zifei.png" class="my-icon" /> {{langue.charge}}
</a>
</li>
<li class="mui-table-view-cell">
<a class="view-herf mui-navigate-right" id="industry">
<img src="../img/zixun.png" class="my-icon" /> {{langue.information}}
</a>
</li>
<li class="mui-table-view-cell">
<a class="view-herf mui-navigate-right" id="announcement">
<img src="../img/baipishu.png" class="my-icon" /> {{langue.notice}}
</a>
</li>
<li class="mui-table-view-cell">
<a class="view-herf mui-navigate-right" id="contact">
<img src="../img/icon_realname.png" class="my-icon" /> {{langue.contactUs}}
</a>
</li>
<li class="mui-table-view-cell ">
<a class="view-herf mui-navigate-right" id="setting">
<img src="../img/icon_setup.png" class="my-icon" /> {{langue.settings}}
</a>
</li>
<li class="mui-table-view-cell ">
<a class="view-herf mui-navigate-right" view-id="mine/html/my/my_invite_friends.html" view-url="my/my_invite_friends.html">
<img src="../img/icon_setup.png" class="my-icon" /> {{langue.invite}}
</a>
</li>
<li class="mui-table-view-cell" id="aboutAs">
<a class="mui-navigate-right">
<span style="color: #FF5053;float: right;font-size: .9rem;padding-right: 15px;padding-top: .08rem;">{{point}}</span>
<img src="../img/icon_about.png" class="my-icon" /> {{langue.aboutUs}}
</a>
</li>
<li class="mui-table-view-cell" id="loginOut" v-bind:class="{ 'mui-hidden': !loginType}">
<a class="mui-navigate-right">
<img src="../img/icon_logout.png" class="my-icon" /> {{langue.logOut}}
</a>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>
<script>
// 国际化
var langues = {
zh_CN: {
title: "我的",
// 列表头部
notLogin: "未登录",
notLoginText: "点击登录享受更多功能",
username: "账号",
// 列表功能
security: "账户安全",
verification: "实名认证",
settings: "系统设置",
invite: "邀请好友",
aboutUs: "关于我们",
logOut: "退出登录",
// 页面提示
muiToast01: "刷新成功",
muiToast02: "退出成功",
muiToast02: "请登录",
baipishu: "项目中心",
payType: '交易方式',
share: '分享app',
charge: '费率说明',
information: '行业资讯',
notice: '系统公告',
contactUs: '联系我们',
cancelMarket: '取消商家申请',
waiting: '等待中...',
marketMsg: '确认是否取消商家?',
marketNote: '提示',
yes: '确认',
no: '取消',
handleSuccess: '操作成功!',
},
zh_HK: {
title: "我的",
// 列表頭部
notLogin: "未登錄",
notLoginText: "點擊登錄享受更多功能",
username: "賬號",
// 列表功能
security: "賬戶安全",
verification: "實名認證",
settings: "系統設置",
invite: "邀請好友",
aboutUs: "關於我們",
logOut: "退出登錄",
// 頁面提示
muiToast01: "刷新成功",
muiToast02: "退出成功",
muiToast02: "請登錄",
baipishu: "專案中心",
payType: '交易方式',
share: '分享app',
charge: '費率說明',
information: '行業資訊',
notice: '系統公告',
contactUs: '聯繫我們',
cancelMarket: '取消商家申請',
waiting: '等待中...',
marketMsg: '確認是否取消商家?',
marketNote: '提示',
yes: '確認',
no: '取消',
handleSuccess: '操作成功!',
},
en_US: {
title: "My",
// 列表头部
notLogin: "Not Login",
notLoginText: "Click login to enjoy more features",
username: "User",
// 列表功能
security: "Security",
verification: "Verification",
settings: "Settings",
invite: "Invitation",
aboutUs: "About Us",
logOut: "Login Out",
// 页面提示
muiToast01: "Refresh the success",
muiToast02: "Exit the success",
muiToast02: "Please log in",
baipishu: "Project Center",
payType: 'Means of transaction',
share: 'Share app',
charge: 'Rate description',
information: 'Industry information',
notice: 'System notification',
contactUs: 'Contact us',
cancelMarket: 'Cancel the market',
waiting: 'Waiting...',
marketMsg: 'Confirm whether to cancel the market?',
marketNote: 'Prompt',
yes: 'Confirm',
no: 'Cancel',
handleSuccess: 'Successful operation!',
}
}
</script>
<script>
var dataInfo = new Vue({
el: '#data-info',
data: {
langue: langues[app.getLanguageLocalStorage()],
point: '',
dataBase: {}, // 页面文字渲染
userLocalStorage: {}
},
computed: {
loginType: function() {
if (JSON.stringify(this.userLocalStorage) != '{}') {
return true;
} else {
return false;
}
},
//头像展示
getUserImg: function() {
if (JSON.stringify(this.userLocalStorage) != '{}') { //已经登录的处理
if (this.userLocalStorage.avatar == null || this.userLocalStorage.avatar == "null" || this.userLocalStorage.avatar
.trim() == "") {
return '<img src="../img/wallet/notLogin.png" />';
} else {
try {
return '<img src="' + app.walletFileUrl + this.userLocalStorage.avatar + '" />';
} catch (e) {
return '<img src="../img/wallet/notLogin.png" />';
}
}
} else { //未登录的处理
return '<img id="loginNot" src="../img/wallet/notLogin.png" />';
}
}
}
});
/**
* 更新用户为最新的缓存信息
*/
function saveUserInfoData() {
dataInfo.userLocalStorage = app.getUserLocalStorage();
}
/**
* 查询用户信息
*/
function selectUserInfo() {
mui.ajax(myAjaxJs.AJAX_GET_USER.getUrl, {
headers: {
"X-Requested-Token": app.getTokenStorage(), // token头部
"locale": app.getLanguageLocalStorage() // 语种头部
},
type: myAjaxJs.AJAX_GET_USER.getType, //HTTP请求类型
data: dataInfo.userLocalStorage,
dataType: 'json', //服务器返回json格式数据
timeout: 10000, //超时时间设置为10秒;
success: function(data) {
console.log(JSON.stringify(data))
console.log(app.getTokenStorage())
if ("200" == data.code) {
// 更新用户缓存数据
app.setUserLocalStorage(data.data);
// 渲染用户数据
dataInfo.userLocalStorage = data.data;
mui.toast(dataInfo.langue.muiToast01);
} else if (data.code == "201" || data.code == "202") { //未登录
plus.nativeUI.closeWaiting();
mui.toast(dataInfo.langue.muiToast02);
app.openWin("wallet_login.html", "mine/html/wallet_login.html");
app.setUserLocalStorage({}); //清除关于用户的缓存
} else {
mui.toast(data.msg);
}
},
error: function(xhr, type, errorThrown) {}
})
}
//退出登录
function loginOut() {
mui.ajax(loginAjaxJs.AJAX_LOG_OUT.getUrl, {
headers: {
"X-Requested-Token": app.getTokenStorage(), // token头部
"locale": app.getLanguageLocalStorage() // 语种头部
},
data: {
tokenType: 'APP'
},
type: loginAjaxJs.AJAX_LOG_OUT.getType, //HTTP请求类型
dataType: 'json', //服务器返回json格式数据
timeout: 10000, //超时时间设置为10秒;
beforeSend: function() {
plus.nativeUI.showWaiting();
},
complete: function() {
plus.nativeUI.closeWaiting();
},
success: function(data) {
if ("200" == data.code) {
localStorage.removeItem('userpass');
localStorage.removeItem('userdate');
localStorage.removeItem('nowPassNOValue');
setTimeout(function() {
saveUserInfoData();
mui.toast(dataInfo.langue.muiToast02);
// 币币页面
var CCTView = plus.webview.getWebviewById("html/cct/html/cct_index.html");
mui.fire(CCTView, "logout");
}, 1000);
} else {
plus.nativeUI.closeWaiting();
app.toast(data.msg);
}
},
error: function(xhr, type, errorThrown) {
plus.nativeUI.closeWaiting();
}
});
app.removeUserLocalStorage();
app.removeTokenStorage();
app.removeIsWalletPassLocalStorage();
}
mui.plusReady(function() {
saveUserInfoData();
//下拉刷新
mui("#data-info").pullToRefresh({
down: {
callback: function() {
selectUserInfo();
saveUserInfoData();
var self = this;
setTimeout(function() {
self.endPullDownToRefresh();
}, 1000);
}
}
});
plus.runtime.getProperty(plus.runtime.appid, function(inf) {
dataInfo.version = inf.version;
var localVersion = app.getVersionLocalStorage();
if (localVersion != "" && inf.version != localVersion) {
dataInfo.point = '·';
}
});
// 列表项跳转
mui(".jurisdiction-ul").on('tap', '.view-herf', function() {
var viewId = this.getAttribute('view-id');
var viewUrl = this.getAttribute('view-url');
if (!dataInfo.loginType) {
app.openWin("wallet_login.html", "mine/html/wallet_login.html");
} else {
app.openWin(viewUrl, viewId);
}
})
//取消市商申请
// document.getElementById("cancel-M").addEventListener("tap", function() {
// mui.confirm(dataInfo.langue.marketMsg, dataInfo.langue.marketNote, [dataInfo.langue.no, dataInfo.langue.yes],
// function(e) {
// if (e.index == 1) {
// cancelMarket();
// }
// });
// });
//登录
document.getElementById("login").addEventListener("tap", function() {
app.openWin("wallet_login.html", "my/wallet_login.html");
});
//系统设置监听
document.getElementById("setting").addEventListener("tap", function() {
app.openWin("my/my_daily_cash_system_setup.html", "my_daily_cash_system_setup.html");
});
//交易方式
document.getElementById("transaction").addEventListener("tap", function() {
// if(!dataInfo.loginType) { TODO
// app.openWin("wallet_login.html", "mine/html/wallet_login.html");
// } else {
// app.openWin("../../../html/OTC/html/binding_total.html", "../../../html/OTC/html/binding_total.html");
// }
app.openWin("../../html/OTC/html/binding_total.html", "../../../html/OTC/html/binding_total.html");
});
//编辑个人
document.getElementById("user-info-btn").addEventListener("tap", function() {
if (!dataInfo.loginType) {
app.openWin("wallet_login.html", "mine/html/wallet_login.html");
} else {
app.openWin("user/user_info_list.html", "mine/html/user/user_info_list.html");
}
});
// 账户安全
document.getElementById('account-safe').addEventListener('tap', function() {
if (!dataInfo.loginType) {
app.openWin("wallet_login.html", "mine/html/wallet_login.html");
} else {
app.openWin("safety/account_safe.html", "account_safe.html");
}
});
//关于我们
document.getElementById("aboutAs").addEventListener("tap", function() {
app.openWin("my/my_about_us.html", "mine/html/my/my_about_us.html");
});
//联系我们
document.getElementById("contact").addEventListener("tap", function() {
app.openWin("my/contact_us.html", "mine/html/my/contact_us.html");
});
//分享app
document.getElementById("share").addEventListener("tap", function() {
app.openWin("my/share_app.html", "mine/html/my/share_app.html");
});
//资费说明
document.getElementById("charges").addEventListener("tap", function() {
app.openWin("my/charges_that.html", "mine/html/my/charges_that.html");
});
//项目白皮书
document.getElementById("whitePaper").addEventListener("tap", function() {
app.openWin("my/project_white_paper.html", "mine/html/my/project_white_paper.html");
});
//行业资讯
document.getElementById("industry").addEventListener("tap", function() {
app.openWin("my/industry_information.html", "mine/html/my/industry_information.html");
});
//系统公告
document.getElementById("announcement").addEventListener("tap", function() {
app.openWin("my/system_notice.html", "mine/html/my/system_notice.html");
});
//退出登录
document.getElementById("loginOut").addEventListener("tap", function() {
loginOut();
saveUserInfoData();
});
// 国际化统一方法
window.addEventListener('switchLangueData', function(e) {
dataInfo.langue = langues[e.detail];
});
});
</script>
<script>
//申请取消市商
function cancelMarket() {
plus.nativeUI.showWaiting(dataInfo.langue.waiting);
mui.ajax(marketApplyAjax.CANCEL_APPLY.getUrl, {
headers: {
"X-Requested-Token": app.getTokenStorage(), // token头部
"locale": app.getLanguageLocalStorage() // 语种头部
},
dataType: 'json',
type: marketApplyAjax.CANCEL_APPLY.getType,
timeout: 10000, //超时时间设置为10秒
success: function(data) {
plus.nativeUI.closeWaiting();
if (data.code == 200) {
mui.toast(dataInfo.langue.handleSuccess);
} else if (data.code == 201) {
//未登录,跳转登录页面
app.openWin(requestUrl.LOGIN.getUrl, requestUrl.LOGIN.getId);
} else if (data.code == 202) {
mui.toast(dataInfo.langue.logInElse);
//未登录,跳转登录页面
app.openWin(requestUrl.LOGIN.getUrl, requestUrl.LOGIN.getId);
} else {
app.toast(data.msg);
}
},
error: function(xhr, type, errorThrown) {
plus.nativeUI.closeWaiting();
app.toast(dataInfo.langue.note15);
}
});
}
5 years ago
</script>