|
|
@@ -3,7 +3,7 @@
|
|
|
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
- <title>个人信息</title>
|
|
|
+ <title>账户信息</title>
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
|
|
<link href="../../css/mui.min.css" rel="stylesheet" />
|
|
|
<link href="../../css/animate.min.css" rel="stylesheet" />
|
|
|
@@ -12,16 +12,20 @@
|
|
|
.mui-bar-nav~.mui-content{padding-top: 60px;}
|
|
|
.r{float: right;margin-right: 20px;color: darkgray;font-size: 14px;}
|
|
|
.head{line-height: 45px;}
|
|
|
- .mui-table-view-cell{padding: 14px;font-size: 14px;}
|
|
|
+ .mui-table-view-cell{padding: 12px;font-size: 14px;}
|
|
|
.mui-table-view:before{background-color: rgba(200, 199, 204, 0);}
|
|
|
.mui-table-view:after{background-color: rgba(200, 199, 204, 0);}
|
|
|
.mui-table-view-cell:after{background-color: #dedbdb;}
|
|
|
.img{width: 40px;height: 40px;border-radius: 50%;}
|
|
|
- .m_box {padding: 0px 10px 0px 10px;margin: 15px;box-shadow: 0 1px 6px #dbdbdb;}
|
|
|
+ .m_box {padding: 0px 10px 0px 10px;margin: 10px 15px 0px 15px;overflow: hidden;}
|
|
|
#clipp{position:fixed;width:100%;height:100%;top:0;background-color:black;display:none;z-index:9999999}
|
|
|
#clipp img{max-width:100%;height:auto;vertical-align:middle;}
|
|
|
#clipp .op{position:fixed;width:100%;bottom:0;}
|
|
|
#clipp .mui-icon{color:white;font-size:50px;font-weight:bold}
|
|
|
+ .bbv{padding: 15px 18px 0px 18px;color: #7a7a7a;font-size: 14px;}
|
|
|
+ .bor{border-left: 5px solid #00a0ea;padding-right: 5px;}
|
|
|
+ .row .sm3{padding: 10px;width: 33.33%;text-align: center;font-size: 13px;color: #727171;}
|
|
|
+ .row .sm3 .img{width: 60px;height: 60px; border-radius: 3px;}
|
|
|
[v-cloak] {display: none;}
|
|
|
</style>
|
|
|
</head>
|
|
|
@@ -29,9 +33,13 @@
|
|
|
<div id="app" v-cloak>
|
|
|
<header class="mui-bar mui-bar-nav">
|
|
|
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
|
|
|
- <h1 class="mui-title">个人信息</h1>
|
|
|
+ <h1 class="mui-title">账户信息</h1>
|
|
|
</header>
|
|
|
<div class="mui-content animated fadeInUp">
|
|
|
+ <div class="bbv">
|
|
|
+ <span class="bor"></span>
|
|
|
+ <span>个人信息</span>
|
|
|
+ </div>
|
|
|
<div class="m_box">
|
|
|
<ul class="mui-table-view">
|
|
|
<li class="mui-table-view-cell">
|
|
|
@@ -39,20 +47,47 @@
|
|
|
<span class="r">
|
|
|
<img :src="item.header" class="img">
|
|
|
</span>
|
|
|
- <span class="head">头像</span>
|
|
|
+ <span class="head">头像</span>
|
|
|
</a>
|
|
|
</li>
|
|
|
<li class="mui-table-view-cell" @click="op(' 昵称',item.nickName,'nickName')">
|
|
|
- <a class="mui-navigate-right"><span class="r">{{item.nickName}}</span>昵称</a>
|
|
|
+ <a class="mui-navigate-right"><span class="r">{{item.nickName}}</span>姓名</a>
|
|
|
</li>
|
|
|
<li class="mui-table-view-cell" @click="pwd()">
|
|
|
<a class="mui-navigate-right"><span class="r">修改密码</span>密码</a>
|
|
|
</li>
|
|
|
<li class="mui-table-view-cell" @click="op(' 邮箱',item.email=='null'?'':item.email,'email')">
|
|
|
- <a class="mui-navigate-right"><span class="r">{{item.email=='null'?'未填':item.email}}</span>邮箱</a>
|
|
|
+ <a class="mui-navigate-right"><span
|
|
|
+ class="r">{{item.email=='null'?'未填':item.email}}</span>邮箱</a>
|
|
|
</li>
|
|
|
- <li class="mui-table-view-cell">
|
|
|
- <a href="#sex" class="mui-navigate-right"><span class="r">{{item.mTime}}</span>注册时间</a>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <div class="bbv">
|
|
|
+ <span class="bor"></span>
|
|
|
+ <span>收款方式</span>
|
|
|
+ </div>
|
|
|
+ <div class="m_box" style="margin-bottom: 15px;padding-bottom: 15px;">
|
|
|
+ <div class="img_list">
|
|
|
+ <div class="row">
|
|
|
+ <div class="sm3" v-for="(item,index) in list">
|
|
|
+ <img :src="item.pic" class="img" @click.stop="view(item.pic)" />
|
|
|
+ <div class="sa">{{item.name}}</div>
|
|
|
+ </div>
|
|
|
+ <div class="clear"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="divider" style="margin-top: 15px;">
|
|
|
+ <div class="line" style="width: 30%;"></div>
|
|
|
+ <div class="text" style="width: 40%;">银行卡信息</div>
|
|
|
+ <div class="line" style="width: 30%;"></div>
|
|
|
+ <div class="clear"></div>
|
|
|
+ </div>
|
|
|
+ <ul class="mui-table-view" style="margin-top: 15px;">
|
|
|
+ <li class="mui-table-view-cell" @click="op('卡号',item.kh,'kh')">
|
|
|
+ <a class="mui-navigate-right"><span class="r">{{item.kh}}</span>卡号</a>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell" @click="op('持卡人姓名',item.kName,'kName')">
|
|
|
+ <a class="mui-navigate-right"><span class="r">{{item.kName=='null'?'未填':item.kName}}</span>持卡人姓名</a>
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
@@ -85,7 +120,17 @@
|
|
|
var vm = new Vue({
|
|
|
el: "#app",
|
|
|
data: {
|
|
|
- item: {}
|
|
|
+ item: {},
|
|
|
+ list: [{
|
|
|
+ name: '微信收款码',
|
|
|
+ pic: '../../images/wx.jpg'
|
|
|
+ }, {
|
|
|
+ name: '支付宝收款码',
|
|
|
+ pic: '../../images/zfb.jpg'
|
|
|
+ }, {
|
|
|
+ name: '银行卡转账',
|
|
|
+ pic: '../../images/yhk.jpg'
|
|
|
+ }],
|
|
|
},
|
|
|
mounted: function() {
|
|
|
mui.plusReady(function() {
|
|
|
@@ -94,14 +139,16 @@
|
|
|
},
|
|
|
methods: {
|
|
|
getData: function() {
|
|
|
- request(urls().userInfo, {id: getUser().id}, function(res) {
|
|
|
- vm.item = res;
|
|
|
- localStorage.setItem("user", JSON.stringify(res));
|
|
|
- vm.item.header=urls().path+vm.item.header;
|
|
|
- setTimeout(function(){
|
|
|
- plus.webview.getWebviewById('tab/mine.html').reload(true);
|
|
|
- },500);
|
|
|
- plus.nativeUI.closeWaiting();
|
|
|
+ request(urls().userInfo, {
|
|
|
+ id: getUser().id
|
|
|
+ }, function(res) {
|
|
|
+ vm.item = res;
|
|
|
+ localStorage.setItem("user", JSON.stringify(res));
|
|
|
+ vm.item.header = urls().path + vm.item.header;
|
|
|
+ setTimeout(function() {
|
|
|
+ plus.webview.getWebviewById('tab/mine.html').reload(true);
|
|
|
+ }, 500);
|
|
|
+ plus.nativeUI.closeWaiting();
|
|
|
})
|
|
|
},
|
|
|
//拍照
|
|
|
@@ -110,7 +157,7 @@
|
|
|
takePhoto(function(path) {
|
|
|
plus.io.resolveLocalFileSystemURL(path, function(entry) {
|
|
|
plus.nativeUI.closeWaiting();
|
|
|
- if(cropper != null) {
|
|
|
+ if (cropper != null) {
|
|
|
cropper.destroy();
|
|
|
}
|
|
|
cropper = getClipper(1, entry.toLocalURL());
|
|
|
@@ -120,7 +167,7 @@
|
|
|
//选择现有
|
|
|
pickImg: function() {
|
|
|
pickImg(function(p) {
|
|
|
- if(cropper != null) {
|
|
|
+ if (cropper != null) {
|
|
|
cropper.destroy();
|
|
|
}
|
|
|
cropper = getClipper(1, p.files[0]);
|
|
|
@@ -130,10 +177,16 @@
|
|
|
save: function() {
|
|
|
plus.nativeUI.showWaiting("正在上传...");
|
|
|
//获得裁剪对象
|
|
|
- var croppedCanvas = cropper.getCroppedCanvas({width: 100,height: 100})
|
|
|
+ var croppedCanvas = cropper.getCroppedCanvas({
|
|
|
+ width: 100,
|
|
|
+ height: 100
|
|
|
+ })
|
|
|
var dataUrl = croppedCanvas.toDataURL();
|
|
|
- request(urls().user_upload,{id:getUser().id,dataImage:dataUrl},function(res) {
|
|
|
- vm.item.header=urls().path+res.url;
|
|
|
+ request(urls().user_upload, {
|
|
|
+ id: getUser().id,
|
|
|
+ dataImage: dataUrl
|
|
|
+ }, function(res) {
|
|
|
+ vm.item.header = urls().path + res.url;
|
|
|
mui.toast("上传成功");
|
|
|
vm.getData();
|
|
|
plus.nativeUI.closeWaiting();
|
|
|
@@ -145,16 +198,27 @@
|
|
|
document.getElementById("clipp").style.display = 'none';
|
|
|
},
|
|
|
//修改密码
|
|
|
- pwd:function(){
|
|
|
+ pwd: function() {
|
|
|
open('find_pass', 'find_pass.html', null, 'slide-in-bottom');
|
|
|
},
|
|
|
+ view: function(img) {
|
|
|
+ plus.nativeUI.previewImage([img], {
|
|
|
+ current: 0,
|
|
|
+ loop: true,
|
|
|
+ indicator: 'number'
|
|
|
+ });
|
|
|
+ },
|
|
|
//编辑其它
|
|
|
op: function(msg, val, op) {
|
|
|
- open('edit_info', 'edit_info.html', {msg: msg,value: val,op: op}, 'slide-in-bottom');
|
|
|
+ open('edit_info', 'edit_info.html', {
|
|
|
+ msg: msg,
|
|
|
+ value: val,
|
|
|
+ op: op
|
|
|
+ }, 'slide-in-bottom');
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
</script>
|
|
|
</body>
|
|
|
|
|
|
-</html>
|
|
|
+</html>
|
xiaoshushu
