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.
217 lines
7.7 KiB
217 lines
7.7 KiB
<template>
|
|
<view class="container">
|
|
<block v-if="isload">
|
|
<view class="pages-hd" :style="'padding-top:' + menuButtonTop + 'px;height:' + (menuButtonHeight+95) + 'px'">
|
|
<image class="pages-hd__bg" :src="event_rul +'/static/images/userinfo-bg.png'" mode="widthFix"></image>
|
|
<view class="pages-hd__navigation flex al-item-center" :style="'height:' + menuButtonHeight + 'px'">
|
|
<text class="iconfont icon-icon_arrow_left"></text>
|
|
<view class="pages-hd__title">编辑资料</view>
|
|
</view>
|
|
</view>
|
|
<view class="content">
|
|
<view class="user-hd flex j-center">
|
|
<image class="user-hd__img" :src="userinfo.headimg" style="width:156rpx;height:156rpx;" />
|
|
</view>
|
|
<view class="info-item flex" >
|
|
<view class="info-item__hd flex al-item-center">
|
|
<text class="iconfont icon-wode"></text>
|
|
<text class="info-item__hd-title">昵称</text>
|
|
</view>
|
|
<view class="info-item__bd light">{{userinfo.nickname}}</view>
|
|
</view>
|
|
<view class="info-item flex" >
|
|
<view class="info-item__hd flex al-item-center">
|
|
<text class="iconfont icon-wode1"></text>
|
|
<text class="info-item__hd-title">ID</text>
|
|
</view>
|
|
<view class="info-item__bd light">{{userinfo.id}}</view>
|
|
</view>
|
|
<view class="info-item flex" @tap="goto" data-url="/pages/my/setvita">
|
|
<view class="info-item__hd flex al-item-center">
|
|
<text class="iconfont icon-jianjie-03"></text>
|
|
<text class="info-item__hd-title">个人简介</text>
|
|
</view>
|
|
<view class="info-item__bd flex" :class="{'light':userinfo.autograph}">
|
|
<view class="info-item__bd-txt">{{userinfo.autograph ? userinfo.autograph : '有趣的简介可以吸引粉丝'}}</view>
|
|
<text class="iconfont icon-arrow-right"></text>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="info-item" @tap="goto" data-url="setrealname">
|
|
<view class="t1">姓名</view>
|
|
<view class="t2">{{userinfo.realname}}</view>
|
|
<image class="t3" :src="event_rul +'/static/img/static/img/arrowright.png'"/>
|
|
</view>
|
|
<view class="info-item" @tap="goto" data-url="settel">
|
|
<view class="t1">手机号</view>
|
|
<view class="t2">{{userinfo.tel}}</view>
|
|
<image class="t3" :src="event_rul +'/static/img/static/img/arrowright.png'"/>
|
|
</view> -->
|
|
<view class="info-item flex" @tap="goto" data-url="/pages/my/setsex">
|
|
<view class="info-item__hd flex al-item-center">
|
|
<text class="iconfont icon-nvsheng"></text>
|
|
<text class="info-item__hd-title">性别</text>
|
|
</view>
|
|
<view class="info-item__bd flex" :class="{'light' : userinfo.sex == 1 || userinfo.sex == 2}">
|
|
<view class="info-item__bd-txt">{{userinfo.sex != 1 ? (userinfo.sex == 2 ? '女': '未知') : '男'}}</view>
|
|
<text class="iconfont icon-arrow-right"></text>
|
|
</view>
|
|
</view>
|
|
<view class="info-item flex" @tap="goto" data-url="/pages/my/setbirthday">
|
|
<view class="info-item__hd flex al-item-center">
|
|
<text class="iconfont icon-dangao"></text>
|
|
<text class="info-item__hd-title">生日</text>
|
|
</view>
|
|
<view class="info-item__bd flex" :class="{'light':userinfo.birthday}">
|
|
<view class="info-item__bd-txt">{{userinfo.birthday ? userinfo.birthday : '未知'}}</view>
|
|
<text class="iconfont icon-arrow-right"></text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- <view class="content">
|
|
<view class="info-item" @tap="goto" data-url="setweixin">
|
|
<view class="t1">微信号</view>
|
|
<view class="t2">{{userinfo.weixin}}</view>
|
|
<image class="t3" :src="event_rul +'/static/img/static/img/arrowright.png'"/>
|
|
</view>
|
|
<view class="info-item" @tap="goto" data-url="setaliaccount">
|
|
<view class="t1">支付宝账号</view>
|
|
<view class="t2">{{userinfo.aliaccount}}</view>
|
|
<image class="t3" :src="event_rul +'/static/img/static/img/arrowright.png'"/>
|
|
</view>
|
|
<view class="info-item" @tap="goto" data-url="setbankinfo">
|
|
<text class="t1">银行卡</text>
|
|
<text class="t2">{{userinfo.bankname ? '已设置' : ''}}</text>
|
|
<image class="t3" :src="event_rul +'/static/img/static/img/arrowright.png'"/>
|
|
</view>
|
|
</view> -->
|
|
|
|
<!-- <view class="content">
|
|
<view class="info-item" @tap="goto" data-url="/pages/address/address">
|
|
<view class="t1">收货地址</view>
|
|
<view class="t2"></view>
|
|
<image class="t3" :src="event_rul +'/static/img/static/img/arrowright.png'"/>
|
|
</view>
|
|
</view>
|
|
<view class="content" v-if="userinfo.haspwd==1">
|
|
<view class="info-item" @tap="goto" data-url="/pages/my/setpwd">
|
|
<view class="t1">修改密码</view>
|
|
<view class="t2"></view>
|
|
<image class="t3" :src="event_rul +'/static/img/static/img/arrowright.png'"/>
|
|
</view>
|
|
</view>
|
|
<view class="content">
|
|
<view class="info-item" @tap="goto" data-url="/pages/index/login">
|
|
<view class="t1">切换账号</view>
|
|
<view class="t2"></view>
|
|
<image class="t3" :src="event_rul +'/static/img/static/img/arrowright.png'"/>
|
|
</view>
|
|
</view> -->
|
|
</block>
|
|
<loading v-if="loading"></loading>
|
|
<dp-tabbar :opt="opt"></dp-tabbar>
|
|
<popmsg ref="popmsg"></popmsg>
|
|
<!-- 悬浮按钮 -->
|
|
<drag-button></drag-button>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
var app = getApp();
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
opt:{},
|
|
loading:false,
|
|
isload: false,
|
|
menuindex:-1,
|
|
menuButtonTop: 0,
|
|
menuButtonHeight: 0,
|
|
|
|
userinfo:{},
|
|
|
|
event_rul: app.globalData.event_url,
|
|
};
|
|
},
|
|
|
|
onLoad: function (opt) {
|
|
this.opt = app.getopts(opt);
|
|
this.getdata();
|
|
|
|
// #ifdef MP
|
|
// 获取右上角胶囊坐标信息
|
|
let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
|
this.menuButtonTop = menuButtonInfo.top; // 胶囊到顶部的距离
|
|
this.menuButtonHeight = menuButtonInfo.height; // 胶囊的高度
|
|
// #endif
|
|
},
|
|
onPullDownRefresh: function () {
|
|
this.getdata();
|
|
},
|
|
methods: {
|
|
getdata: function () {
|
|
var that = this;
|
|
that.loading = true;
|
|
app.get('ApiMy/set', {}, function (data) {
|
|
that.loading = false;
|
|
that.userinfo = data.userinfo;
|
|
that.loaded();
|
|
});
|
|
},
|
|
uploadHeadimg:function(){
|
|
var that = this;
|
|
app.chooseImage(function(urls){
|
|
var headimg = urls[0];
|
|
that.userinfo.headimg = headimg;
|
|
app.post('ApiMy/setfield',{headimg:headimg});
|
|
},1)
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss">
|
|
.container {background:#FFFFFF;min-height: 100vh;}
|
|
.text-overflow-tx {text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
|
|
.pages-hd {
|
|
padding: 0 30rpx;box-sizing: content-box;
|
|
&__bg {position: absolute;top: 0;left: 0;width: 100%;z-index: 0;}
|
|
.icon-icon_arrow_left {font-size: 46rpx; color: #FFFFFF;flex-shrink: 0;}
|
|
&__title {font-size: 32rpx;color: #FFFFFF; flex: 1;text-align: center;padding-right: 46rpx;}
|
|
}
|
|
.content {background:#FFFFFF;padding: 100rpx 40rpx 0; position: relative;border-radius: 12rpx 12rpx 0 0;}
|
|
.user-hd {
|
|
margin-top: -83rpx;position: absolute;left: 0;right: 0;top: 0;
|
|
&__img {width: 166rpx;height: 166rpx;border-radius: 50%;}
|
|
}
|
|
.info-item {
|
|
align-items: flex-start;padding: 24rpx 0;font-size: 28rpx;line-height: 40rpx;
|
|
&:not(:last-child) {border-bottom: 1px #f3f3f3 solid;}
|
|
&__hd {
|
|
width: 30%;
|
|
.iconfont {
|
|
font-size: 32rpx;margin-right: 22rpx;font-weight: bold;
|
|
&.dangao {font-weight: normal;}
|
|
}
|
|
&-title {font-weight: bold;color: #333333;}
|
|
}
|
|
&__bd {
|
|
flex: 1;justify-content: flex-start;text-align: right;color: #333333;
|
|
&.light {
|
|
font-weight: bold;
|
|
.info-item__bd-txt {color: #333333;}
|
|
}
|
|
&-txt {
|
|
color: #999999;flex: 1;
|
|
}
|
|
.iconfont {font-size: 38rpx;flex-shrink: 0;}
|
|
}
|
|
|
|
}
|
|
.info-item:last-child{border:none}
|
|
.info-item .t1{ width: 200rpx;color: #8B8B8B;font-weight:bold;height:92rpx;line-height:92rpx}
|
|
.info-item .t2{ color:#444444;text-align:right;flex:1;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;}
|
|
.info-item .t3{ width: 26rpx;height:26rpx;margin-left:20rpx}
|
|
.img-ac {border-radius: 400rpx;}
|
|
|
|
</style>
|