<!--pages/user/user.wxml-->
<view class="page">
<view class="userinfo">
<image class="userinfo-avatar fl_l" src="{{userInfo.avatarUrl}}" background-size="cover"></image>
<text class="fl_l">{{userInfo.nickName}}</text>
<block wx:if="{{rzinfo!='normal'}}">
<text class="fl_l" style="font-size:28rpx;margin-left:28rpx">已认证</text>
</block>
</view>
<block wx:if="{{rzinfo!='normal'}}">
<image class="ren" src="../../images/ren.png" ></image>
</block>
<!--订单详情-->
<view class="qbdd mt10">
<span class="font_14 c3">全部订单</span>
<navigator class="fl_r c9 font_12 l_h20" url="../user/dingdan?currentTab=0" hover-class="none" >查看全部订单 ></navigator>
</view>
<view class="sc df tc bte ">
<navigator class="df_1" url="../user/dingdan?currentTab=0&otype=pay" hover-class="none" >
<view>
<image src="/images/dfk.png"></image>
</view>
<text class="font_12">待付款<text style="color:red">({{orderInfo.pay_num}})</text></text>
</navigator>
<navigator class="df_1" url="../user/dingdan?currentTab=1&otype=deliver" hover-class="none" >
<view><image src="/images/dfh.png"></image></view>
<text class="font_12">待发货<text style="color:red">({{orderInfo.Has_Sum}})</text></text>
</navigator>
<navigator class="df_1" url="../user/dingdan?currentTab=2&otype=receive" hover-class="none" >
<view><image src="/images/dpl.png"></image></view>
<text class="font_12">待收货<text style="color:red">({{orderInfo.rec_num}})</text></text>
</navigator>
<navigator class="df_1" url="../user/dingdan?currentTab=3&otype=finish" hover-class="none" >
<view><image src="/images/dsh.png"></image></view>
<text class="font_12">已完成<text style="color:red">({{orderInfo.finish_num}})</text></text>
</navigator>
<navigator class="df_1" url="../user/dingdan?currentTab=4" hover-class="none" >
<view><image src="/images/tksh.png"></image></view>
<text class="font_12">退款/售后<text style="color:red">({{orderInfo.refund_num}})</text></text>
</navigator>
</view>
<!--下面-->
<view class="qbdd mt10">
<navigator url="../userinfo/userinfo">
<span class="font_14 c3">个人信息</span>
</navigator>
</view>
<view class="qbdd mt10">
<navigator url="../address/user-address/user-address">
<span class="font_14 c3">地址管理</span>
</navigator>
</view>
<view class="qbdd mt10">
<navigator url="../rituall/rituall">
<span class="font_14 c3">电子优惠劵</span>
</navigator>
</view>
<view class="qbdd mt10" wx:if="{{rzinfo=='normal'}}">
<navigator url="../real_name/real_name">
<span class="font_14 c3">我要开店</span>
</navigator>
</view>
<!--<view class="qbdd mt10">
<navigator url="../settled/settled">
<span class="font_14 c3">申请入驻商家</span>
</navigator>
</view>-->
<view class="qbdd mt10 bottom" wx:if="{{shop_status==1}}">
<navigator url="../set/set">
<span class="font_14 c3">缴纳店铺保证金</span>
</navigator>
</view>
<view class="qbdd mt10 bottom" wx:if="{{shop_status==1}}">
<navigator url="../shopmanage/shopmanage">
<span class="font_14 c3">店铺管理</span>
</navigator>
</view>
<view class="lll">
<image src="../../images/kf.png"> <contact-button></contact-button> <contact-button></contact-button></image>
</view>
</view>
|
/* pages/user/user.wxss */
.me{
height: 100%;
}
.ren{
width: 33rpx;
height: 33rpx;
position: absolute;
top:283rpx;
left:312rpx;
}
.userinfo{
position: relative;
width: 750rpx;
height: 340rpx;
background: #d9002f;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
}
.userinfo-avatar {
display: block;
width: 160rpx;
height: 160rpx;
margin: 20rpx;
margin-top: 50rpx;
border-radius: 50%;
border:2px solid #fff;
box-shadow: 3px 3px 10px rgba(0,0,0,0.2);
}
.userinfo-nickname {
color: #fff;
font-size: 14px;
}
.sc{
background: #fff;
width: 100%;
font-size: 12px;
line-height: 16px;
color: #666;
padding: 4% 0;
}
.sc image{
width: 24px;
height: 24px;
display: inline-block;
}
.bte{
border-top: 1px solid #eee;
}
.qbdd{
background: #fff;
width: 92%;
font-size: 12px;
color: #666;
padding: 4%;
}
/*在线客服*/
.lll{
width:71rpx;
height:69rpx;
position:fixed;
right:0px;
bottom: 88px;
float: right
}
.lll image{
width:100%;
height:100%;
}
contact-button{
position: relative;
top:-35px;
left:9px;
opacity: 0;
}
.bottom{
margin-bottom: 10px;
}
/* pages/user/user.wxss */
.me{
height: 100%;
}
.ren{
width: 33rpx;
height: 33rpx;
position: absolute;
top:283rpx;
left:312rpx;
}
.userinfo{
position: relative;
width: 750rpx;
height: 340rpx;
background: #d9002f;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
}
.userinfo-avatar {
display: block;
width: 160rpx;
height: 160rpx;
margin: 20rpx;
margin-top: 50rpx;
border-radius: 50%;
border:2px solid #fff;
box-shadow: 3px 3px 10px rgba(0,0,0,0.2);
}
.userinfo-nickname {
color: #fff;
font-size: 14px;
}
.sc{
background: #fff;
width: 100%;
font-size: 12px;
line-height: 16px;
color: #666;
padding: 4% 0;
}
.sc image{
width: 24px;
height: 24px;
display: inline-block;
}
.bte{
border-top: 1px solid #eee;
}
.qbdd{
background: #fff;
width: 92%;
font-size: 12px;
color: #666;
padding: 4%;
}
/*在线客服*/
.lll{
width:71rpx;
height:69rpx;
position:fixed;
right:0px;
bottom: 88px;
float: right
}
.lll image{
width:100%;
height:100%;
}
contact-button{
position: relative;
top:-35px;
left:9px;
opacity: 0;
}
.bottom{
margin-bottom: 10px;
}
|
// pages/user/user.js
var app = getApp()
Page( {
data: {
userInfo: {},
orderInfo:{},
projectSource: 'https://github.com/liuxuanqiang/wechat-weapp-mall',
userListInfo:''
},
onLoad: function () {
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function(userInfo){
//更新数据
that.setData({
userInfo:userInfo,
loadingHidden: true
})
});
this.loadOrderStatus();
},
onShow:function(){
var that=this;
this.loadOrderStatus();
wx.request({
url: app.d.ceshiUrl + '/Api/Renzheng/checkrz',
method: 'post',
data: {
uid: app.globalData.userInfo.id
},
header: {
'Content-Type': 'application/x-www-form-urlencoded'
},
success: function (res) {
//--init data
var status = res.data.status;
if (status == 1) {
that.setData({
rzinfo: res.data.respondData
});
}
},
error: function (e) {
wx.showToast({
title: '网络异常！',
duration: 2000
});
}
});
},
loadOrderStatus:function(){
//获取用户订单数据
var that = this;
console.log(app.d.userId);
console.log(app.globalData.userInfo);
wx.request({
url: app.d.ceshiUrl + '/Api/User/getorder',
method:'post',
data: {
userId: app.globalData.userInfo.id,
},
header: {
'Content-Type': 'application/x-www-form-urlencoded'
},
success: function (res) {
//--init data
var status = res.data.status;
if(status==1){
that.setData({
orderInfo:res.data.orderInfo,
shop_status:res.data.shop_status
});
}else{
wx.showToast({
title: res.data.err,
duration: 2000
});
}
},
error:function(e){
wx.showToast({
title: '网络异常！',
duration: 2000
});
}
});
},
})
|
模板简介：该模板名称为【微信小程序认证商城个人中心页面样式设计制作开发教程】，大小是，文档格式为.，推荐使用打开，作品中的图片，文字等数据均可修改，图片请在作品中选中图片替换即可，文字修改直接点击文字修改即可，您也可以新增或修改作品中的内容，该模板来自用户分享，如有侵权行为请联系网站客服处理。欢迎来懒人模板【小程序教程】栏目查找您需要的精美模板。
.jpg)
.jpg)
