theluyuan/litemall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

个人模块页面调整，添加联系客服、绑定手机号码以及关于我们功能

Browse Source
This commit is contained in:
usgeek
2018-07-19 02:32:22 +08:00
parent 761457c249
commit 6b3a05dc76
3 changed files with 160 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
litemall-wx/pages/ucenter/index/index.js
View File

@@ -80,6 +80,23 @@ Page({
wx.navigateTo({ url: "/pages/auth/login/login" });
};
},
aboutUs: function () {
// wx.navigateTo({
// url: '/page/about/index',
// })
wx.navigateTo({
url: '../../about/index',//页面跳转相对路径要写清楚且准确
success: function (res) {
console.log('跳转到news页面成功')// success
},
fail: function () {
console.log('跳转到news页面失败') // fail
},
complete: function () {
console.log('跳转到news页面完成') // complete
}
})
},
exitLogin: function () {
wx.showModal({
title: '',

26
litemall-wx/pages/ucenter/index/index.wxml
View File

@@ -2,7 +2,7 @@
<view class="profile-info" bindtap="goLogin">
<image class="avatar" src="{{userInfo.avatarUrl}}"></image>
<view class="info">
<text class="name">{{userInfo.nickName}}</text>
<text class="name">{{userInfo.nickName}}</text>
</view>
</view>
@@ -27,13 +27,13 @@
</view> -->
<view class="item">
<view class="a" bindtap="goCollect">
<text class="icon collect"></text>
<image class="user-menu .icon.collect" src="/static/images/icon_collect.png"></image>
<text class="txt">我的收藏</text>
</view>
</view>
<view class="item">
<view class="a" bindtap="goFootprint">
<text class="icon security"></text>
<image class="user-menu .icon.collect" src="/static/images/foot.png"></image>
<text class="txt">我的足迹</text>
</view>
</view>
@@ -55,19 +55,27 @@
<text class="txt">账号安全</text>
</view>
</view> -->
<!-- <view class="item no-border">
<!-- 能力有限，此添加方式开发环境看不到效果，但是线上环境可以正常使用-->
<button class="item no-border" open-type="contact" size="20" session-from="weapp">
<view class="a">
<text class="icon kefu"></text>
<text class="txt">联系客服</text>
</view>
</view> -->
<!-- <view class="item item-bottom">
</button>
<button view class="item" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">
<view class="a">
<text class="icon help"></text>
<text class="txt">帮助中心</text>
<image class="user-menu .icon.phone" src="/static/images/mobile.png"></image>
<text class="txt">绑定手机号码</text>
</view>
</view> -->
</button>
<view class="item">
<view class="a" bindtap="aboutUs">
<image class="user-menu .icon.collect" src="/static/images/about_us.png"></image>
<text class="txt">关于我们</text>
</view>
</view>
</view>
<!--<view class="logout" bindtap="exitLogin">退出登录</view>-->
</view>

232
litemall-wx/pages/ucenter/index/index.wxss
View File

@@ -1,72 +1,74 @@
page{
height: 100%;
width: 100%;
background: #f4f4f4;
}
.container{
background: #f4f4f4;
height: auto;
overflow: hidden;
width: 100%;
}
.profile-info{
width: 100%;
height: 280rpx;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-start;
padding: 0 30.25rpx;
background: #333;
page {
height: 100%;
width: 100%;
background: #f4f4f4;
}
.profile-info .avatar{
height: 148rpx;
width: 148rpx;
border-radius: 50%;
.container {
background: #f4f4f4;
height: auto;
overflow: hidden;
width: 100%;
}
.profile-info .info{
flex: 1;
height: 85rpx;
padding-left: 31.25rpx;
.profile-info {
width: 100%;
height: 280rpx;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-start;
padding: 0 30.25rpx;
background: #333;
}
.profile-info .name{
display: block;
height: 45rpx;
line-height: 45rpx;
color: #fff;
font-size: 37.5rpx;
margin-bottom: 10rpx;
.profile-info .avatar {
height: 148rpx;
width: 148rpx;
border-radius: 50%;
}
.profile-info .level{
display: block;
height: 30rpx;
line-height: 30rpx;
margin-bottom: 10rpx;
color: #7f7f7f;
font-size: 30rpx;
.profile-info .info {
flex: 1;
height: 85rpx;
padding-left: 31.25rpx;
}
.user-menu{
width: 100%;
height: auto;
overflow: hidden;
background: #fff;
.profile-info .name {
display: block;
height: 45rpx;
line-height: 45rpx;
color: #fff;
font-size: 37.5rpx;
margin-bottom: 10rpx;
}
.user-menu .item{
float: left;
width: 33.33333%;
height: 187.5rpx;
border-right: 1px solid rgba(0,0,0,.15);
border-bottom: 1px solid rgba(0,0,0,.15);
text-align: center;
.profile-info .level {
display: block;
height: 30rpx;
line-height: 30rpx;
margin-bottom: 10rpx;
color: #7f7f7f;
font-size: 30rpx;
}
.user-menu .item .a{
.user-menu {
width: 100%;
height: auto;
overflow: hidden;
background: #fff;
}
.user-menu .item {
float: left;
width: 33.33333%;
height: 187.5rpx;
border-right: 1px solid rgba(0, 0, 0, 0.15);
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
text-align: center;
}
.user-menu .item .a {
display: flex;
width: 100%;
height: 100%;
@@ -76,82 +78,100 @@ page{
}
.user-menu .item.no-border {
border-right: 0;
border-right: 0;
}
.user-menu .item.item-bottom {
border-bottom: none;
border-bottom: none;
}
.user-menu .icon{
margin: 0 auto;
display: block;
height: 52.803rpx;
width: 52.803rpx;
margin-bottom: 16rpx;
.user-menu .icon {
margin: 0 auto;
display: block;
height: 52.803rpx;
width: 52.803rpx;
margin-bottom: 16rpx;
}
.user-menu .icon.order{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -437.5rpx no-repeat;
background-size: 52.803rpx;
.user-menu .icon.order {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -437.5rpx no-repeat;
background-size: 52.803rpx;
}
.user-menu .icon.coupon{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -62.4997rpx no-repeat;
background-size: 52.803rpx;
.user-menu .icon.coupon {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -62.4997rpx no-repeat;
background-size: 52.803rpx;
}
.user-menu .icon.collect{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -62.4997rpx no-repeat;
background-size: 52.803rpx;
.user-menu .icon.phone {
display: block;
height: 55rpx;
width: 55rpx;
background-size: 52.803rpx;
}
.user-menu .icon.gift{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -187.5rpx no-repeat;
background-size: 52.803rpx;
.user-menu .icon.gift {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -187.5rpx no-repeat;
background-size: 52.803rpx;
}
.user-menu .icon.address{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 0 no-repeat;
background-size: 52.803rpx;
.user-menu .icon.address {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 0 no-repeat;
background-size: 52.803rpx;
}
.user-menu .icon.security{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -500rpx no-repeat;
background-size: 52.803rpx;
.user-menu .icon.security {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -500rpx no-repeat;
background-size: 52.803rpx;
}
.user-menu .icon.kefu{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -312.5rpx no-repeat;
background-size: 52.803rpx;
.user-menu .icon.kefu {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -312.5rpx no-repeat;
background-size: 52.803rpx;
}
.user-menu .icon.help{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -250rpx no-repeat;
background-size: 52.803rpx;
.user-menu .icon.help {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -250rpx no-repeat;
background-size: 52.803rpx;
}
.user-menu .icon.about {
/* background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -62.4997rpx no-repeat; */
display: block;
height: 55rpx;
width: 55rpx;
background-size: 52.803rpx;
}
.user-menu .icon.feedback{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -125rpx no-repeat;
background-size: 52.803rpx;
.user-menu .icon.feedback {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/sprites/ucenter-sdf6a55ee56-f2c2b9c2f0.png) 0 -125rpx no-repeat;
background-size: 52.803rpx;
}
.user-menu .txt{
display: block;
height: 24rpx;
width: 100%;
font-size: 24rpx;
color:#333;
.user-menu .txt {
display: block;
height: 24rpx;
width: 100%;
font-size: 24rpx;
color: #333;
}
.logout{
margin-top: 50rpx;
height: 101rpx;
width: 100%;
line-height: 101rpx;
text-align: center;
background: #fff;
color: #333;
font-size: 30rpx;
.logout {
margin-top: 50rpx;
height: 101rpx;
width: 100%;
line-height: 101rpx;
text-align: center;
background: #fff;
color: #333;
font-size: 30rpx;
}
.about {
width: 100%;
background: url(https://cdn.it120.cc/images/weappshop/arrow-right.png) no-repeat 750rpx center;
background-size: 16rpx auto, 750rpx auto;
margin: 20rpx 0;
height: 80rpx;
line-height: 80rpx;
padding-left: 100rpx;
}