Skip to content

7
7-Eleven
Commit d60f87ed by 赵雅纹
Options

Merge branch 'feature-zyw-sc' into 'dev_7.1.0' 

Feature zyw sc

See merge request !40
parents b5c54889 24b146b4
Showing with 481 additions and 46 deletions
src/component/waterFlowLayout/waterFlowLayout.wxss
......@@ -3,7 +3,7 @@ page{
background-color: rgba(0,0,0,0.05)
}
.water-wrap{
margin: 20rpx 20rpx;
margin: 50rpx 20rpx;
text-align: justify;
}
.item{
......
src/pages/user-center/user-center.js
......@@ -5,7 +5,7 @@ Page({
* 页面的初始数据
*/
data: {
unfold:false
},
/**
......@@ -15,13 +15,7 @@ Page({
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
......@@ -29,38 +23,10 @@ Page({
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
//点击展开
onTapUnfold(){
this.setData({
unfold: !this.data.unfold
})
}
})
\ No newline at end of file
src/pages/user-center/user-center.json
{
"navigationBarTitleText": "我的",
"usingComponents": {}
}
\ No newline at end of file
src/pages/user-center/user-center.wxml
<!--pages/user-center/user-center.wxml-->
<text>pages/user-center/user-center.wxml</text>
<view class="page-user-center">
<view class="top-content">
<view class="user-header-wrap">
<view class="header-content">
<view class="avatar-wrap">
<image class="avatar" src="/assets/imgs/sc-avatar.png"></image>
<image class="crown" src="/assets/imgs/crown.png"></image>
</view>
<view class="user-info">
<text class="member">分享号会员</text>
<text class="name">会员名称</text>
</view>
<view class="method-btn">不会玩看这里
<image class="small-arrow" src="/assets/imgs/small-arrow-right.png"></image>
</view>
</view>
<view class="opration-wrap">
<view class="opration-list">
<text>2268</text>
<text>积分</text>
</view>
<view class="opration-list">
<text>2268</text>
<text>优惠券</text>
</view>
<view class="opration-list">
<text>2268</text>
<text>分享值</text>
</view>
<view class="opration-list">
<image class="code" src="/assets/imgs/member-code.png"></image>
<text>会员码</text>
</view>
</view>
</view>
<view class="member-interest">
<!-- 收起 -->
<view class="interest-fold" bindtap="onTapUnfold">
<image src="/assets/imgs/plus-bg.png"></image>
<view class="interest-top">
<text class="title">PLUS 已为你节省 xxx 元</text>
</view>
<view class="recharge">
<text>一键续费PLUS会员</text>
<image src="/assets/imgs/small-arrow-right.png"></image>
</view>
</view>
<!-- 普通会员 -->
<view class="interest-fold" bindtap="onTapUnfold" wx:if="{{false}}">
<image src="/assets/imgs/regular-member.png"></image>
<view class="regular-top">
即刻成为
<text class="regular-title"> PLUS </text>
会员，立享xxx权益
</view>
<view class="recharge">
<!-- <text>一键续费PLUS会员</text> -->
<image src="/assets/imgs/small-arrow-right.png"></image>
</view>
</view>
<!-- 展开 -->
<view class="interest-unfold" wx:if="{{unfold}}">
<image class="interest-unfold-bg" src="/assets/imgs/interest-unfold.png"></image>
<view class="interest-title-line">
<image src="/assets/imgs/interest-line.png"></image>
</view>
<view class="personal-interest">
专属xxx权益
</view>
<view class="interest-name">
<view class="interest-ul">
<view class="interest-list">
<image class="interest-icon" src="/assets/imgs/interest-icon.png"></image>
<view class="interest-title">
<text>权益名称</text>
</view>
</view>
<view class="interest-list">
<image class="interest-icon" src="/assets/imgs/interest-icon.png"></image>
<view class="interest-title">
<text>权益名称</text>
</view>
</view>
<view class="interest-list">
<image class="interest-icon" src="/assets/imgs/interest-icon.png"></image>
<view class="interest-title">
<text>权益名称</text>
</view>
</view>
<view class="interest-list">
<image class="interest-icon" src="/assets/imgs/interest-icon.png"></image>
<view class="interest-title">
<text>权益名称</text>
</view>
</view>
<view class="interest-list">
<image class="interest-icon" src="/assets/imgs/interest-icon.png"></image>
<view class="interest-title">
<text>权益名称</text>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="main-content {{unfold ? '' : 'content'}}">
<view class="order-ul">
<view class="order-list">
<view class="my-order">
<text class="order-title">我的订单</text>
<text class="look-all">查看全部订单</text>
</view>
<view class="order-item">
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
</view>
</view>
</view>
<view class="banner">
<image src="/assets/imgs/invitation-bg.png"></image>
<view class="banner-title">
<view class="top-title">拉卡萨解放军</view>
<view class="bottom-title">地方的对方水电费第三方第三方</view>
</view>
</view>
<view class="order-ul">
<view class="order-list">
<view class="my-order">
<text class="order-title">常用工具？</text>
</view>
<view class="order-item">
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
<view class="item">
<image class="order-icon"></image>
<view class="order-desc">待付款</view>
</view>
</view>
<view class="tool-list" wx:if="{{false}}">
<view class="tool-item">
<image class="tool-icon"></image>
<view class="tool-desc">待付款</view>
</view>
<view class="tool-item">
<image class="tool-icon"></image>
<view class="tool-desc">待付款</view>
</view>
<view class="tool-item">
<image class="tool-icon"></image>
<view class="tool-desc">待付款</view>
</view>
<view class="tool-item">
<image class="tool-icon"></image>
<view class="tool-desc">待付款</view>
</view>
</view>
</view>
</view>
</view>
</view>
src/pages/user-center/user-center.wxss
/* pages/user-center/user-center.wxss */
\ No newline at end of file
/* pages/user-center/user-center.wxss */
page{
background-color: #F9F9F9;
}
.top-content{
background-color: #ffffff;
}
.user-header-wrap{
padding: 60rpx 30rpx 0;
}
.avatar{
width: 93rpx;
height: 93rpx;
border-radius: 50%;
border: 1px solid #000000;
}
.user-info{
display: inline-block;
margin-left: 30rpx;
}
.member,.name{
display: block;
}
.member{
font-size: 25rpx;
color: #c09a74;
margin-top: 4rpx;
}
.name{
font-size: 32rpx;
color: #666666;
margin-top: 10rpx;
}
.method-btn{
float: right;
font-size: 18rpx;
width: 160rpx;
height: 36rpx;
line-height: 36rpx;
text-align: center;
color: #c09a74;
border: 1px solid #c09a74;
border-radius: 34rpx;
}
.opration-list{
text-align: center;
min-width: 60rpx;
}
.opration-wrap{
display: flex;
justify-content: space-around;
margin-top: 50rpx;
}
.opration-list text{
display: block;
}
.opration-list text:first-child{
font-size: 32rpx;
color: #666666;
}
.opration-list text:last-child{
margin-top: 20rpx;
font-size: 20rpx;
}
.code{
display: block;
width: 36rpx;
height: 36rpx;
margin: 0 auto;
}
.small-arrow{
width: 18rpx;
height: 12rpx;
}
.avatar-wrap{
width: 93rpx;
height: 93rpx;
display: inline-block;
vertical-align: top;
position: relative;
}
.crown{
width: 26rpx;
height: 23rpx;
position: absolute;
top: -10rpx;
right: 0;
}
.member-interest{
margin-top: 30rpx;
}
.interest-fold{
width: 690rpx;
height: 76rpx;
position: relative;
margin: 0 auto -5rpx;
}
.interest-fold image{
width: 690rpx;
height: 76rpx;
}
.interest-top{
position: absolute;
top: 20rpx;
left: 24rpx;
}
.regular-top{
position: absolute;
top: 24rpx;
left: 24rpx;
font-size: 20rpx;
color: #C09A74;
}
.interest-top .title{
color: #89643f;
font-size: 20rpx;
}
.regular-title{
color: #F7B500;
font-weight: bold;
}
.recharge{
position: absolute;
top: 20rpx;
right: 24rpx;
}
.recharge text{
color: rgba(0,0,0,0.5);
font-size: 20rpx;
}
.recharge image{
width: 23rpx;
height: 16rpx;
margin-left: 9rpx;
}
.interest-unfold{
height: 225rpx;
position: relative;
}
.interest-unfold-bg{
width: 750rpx;
height:225rpx;
}
.interest-name{
position: absolute;
top: 60rpx;
left: 30rpx;
}
.interest-title-line{
position: absolute;
top: 15rpx;
left: 230rpx;
}
.interest-title-line image{
width: 286rpx;
height: 5rpx;
}
.personal-interest{
color: #89643f;
font-size: 20rpx;
position: absolute;
top: 27rpx;
left: 320rpx;
}
.interest-title{
color: #FACEA2;
font-size: 20rpx;
}
.interest-icon{
width: 72rpx;
height: 72rpx;
}
.interest-ul{
width: 630rpx;
padding: 0 30rpx;
display: flex;
justify-content: space-around;
}
.interest-list{
text-align: center;
}
.main-content{
margin-top: -4rpx;
padding: 0 20rpx;
}
.content{
margin-top: 28rpx;
}
.order-list{
width: 664rpx;
border-radius: 10rpx;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
padding: 18rpx 20rpx 43rpx 23rpx;
}
.my-order{
padding-bottom: 7rpx;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
position: relative;
}
.order-title{
font-size: 26rpx;
}
.look-all{
position: absolute;
right: 0;
bottom: 7rpx;
font-size: 21rpx;
color: #C09A74;
}
.order-icon{
width: 71rpx;
height: 69rpx;
background-color: #D8D8D8;
}
.order-desc{
font-size: 23rpx;
color: #666660;
}
.order-item{
margin-top: 50rpx;
display: flex;
flex-wrap: wrap;
}
.item{
text-align: center;
width: 25%;
margin-bottom: 20rpx;
}
.banner{
width: 710rpx;
height: 151rpx;
margin: 17rpx 0;
position: relative;
}
.banner image{
width: 710rpx;
height: 151rpx;
}
.banner-title{
position: absolute;
top: 40rpx;
left: 70rpx;
}
.top-title{
font-size: 20rpx;
color: #C09A74;
}
.bottom-title{
font-size: 30rpx;
margin-top: 7rpx;
}
.tool-item{
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
padding: 23rpx 0;
}
.tool-icon{
width: 58rpx;
height: 58rpx;
background-color: #D8D8D8;
vertical-align: middle;
}
.tool-desc{
font-size: 26rpx;
color: #666660;
display: inline-block;
margin-left: 23rpx;
vertical-align: middle;
}
\ No newline at end of file
src/project.config.json
......@@ -39,7 +39,7 @@
"list": []
},
"miniprogram": {
"current": 15,
"current": 16,
"list": [
{
"id": -1,
......@@ -136,6 +136,13 @@
"id": -1,
"name": "我的分享",
"pathName": "pages/myShare/myShare",
"query": "",
"scene": null
},
{
"id": -1,
"name": "我的",
"pathName": "pages/user-center/user-center",
"scene": null
}
]
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment