Browse Source

[我的,积分商城][修改][样式]

tags/河北版C.8.1.01
hurui 5 years ago
parent
commit
ade80dd268
9 changed files with 344 additions and 139 deletions
  1. +37
    -3
      pages/integralmall/index.js
  2. +2
    -0
      pages/integralmall/index.json
  3. +31
    -9
      pages/integralmall/index.wxml
  4. +143
    -40
      pages/integralmall/index.wxss
  5. +3
    -2
      pages/user/index.js
  6. +2
    -0
      pages/user/index.json
  7. +39
    -34
      pages/user/index.wxml
  8. +71
    -51
      pages/user/index.wxss
  9. +16
    -0
      utils/bgColor.js

+ 37
- 3
pages/integralmall/index.js View File

@@ -10,7 +10,7 @@ Page({
loadingUrl: imgurl.loading.url,
nodata: imgurl.nodata.url,
wmhome: imgurl.wmhome.url,
wangmeimeicredit: imgurl.wangmeimeicredit.url,
barcode: imgurl.barcode.url,
list: [],
lists: [],
myLists: [],
@@ -23,7 +23,7 @@ Page({
loading: true,
content: '数据正在加载中',
reloadIf: false,
creditAmount: 0
creditAmount: 0,
},
goback: function () {
wx.switchTab({
@@ -70,9 +70,10 @@ Page({
pageSize: 1,
}
}).then(res => {
console.log(res.data.list[0]),
wx.stopPullDownRefresh();
that.setData({
creditAmount: res.data.list[0].creditAmount
creditAmount: res.data.list[0].creditAmount,
});
})
.catch(err => {
@@ -90,6 +91,39 @@ Page({
url: '/pages/integralmall/integraHistory/index',
})
},
getmemberId: function (token) {
let that = this;
Http.get({
url: config.api.getScore,
data: {
token: token
}
}).then(res => {
that.setData({
levelName: res.data.levelName,
upgradePercent: res.data.upgradePercent,
upgradeScore: res.data.upgradeScore,
credit: res.data.credit ? res.data.credit : 0,
score: res.data.score
})
if (res.data.nickName) {
that.setData({
ismember: true,
memberId: res.data.id
})
var initUrl = JSON.stringify({
flagid: res.data.id
});
}
})
.catch(err => {
wx.showModal({
title: '提示',
content: err.message,
showCancel: false
})
})
},
getList(pageNum) {
var that = this;
console.log(pageNum)


+ 2
- 0
pages/integralmall/index.json View File

@@ -1,5 +1,7 @@
{
"navigationBarTitleText": "积分商城",
"navigationBarBackgroundColor": "#FD832D",
"navigationBarTextStyle": "white",
"enablePullDownRefresh": true,
"usingComponents": {
"c-banner": "../../components/spellbanner/index",


+ 31
- 9
pages/integralmall/index.wxml View File

@@ -1,37 +1,59 @@
<button class='goback' bindtap='goback'><image src='{{wmhome}}' mode="widthFix"></image></button>
<view class='content-box'>
<view class='topbg'>
<image bindtap='gotojifen' src='{{wangmeimeicredit}}' mode='widthFix'></image>
<text class='my'>我的积分</text>
<text class='score'>{{creditAmount}}</text>
<view class="user-avatar" bindtap='gotograde'>
<open-data class="open" type="userAvatarUrl"></open-data>
</view>
<view class='myName'>
<open-data class="name" type="userNickName"></open-data>
<view class=' usre_level'>
<text class='chengzhang '>{{levelName}}</text>
</view>
</view>
<view class="view">
<!-- 成长值<text class="score">{{score}}</text> -->
<progress percent="50" stroke-width="6" activeColor="#FFB287" />
</view>
<view class='msg'>还需1成长值升级</view>
<view class='score'>{{creditAmount}}</view>
<view class='jifen'>
<text>可用积分</text>>
</view>
<!-- 二维码 -->
<view class='qrcode' bindtap='qrcode'>
<image src="{{barcode}}" class='qrcodeimg' mode='widthFix'></image>
</view>
</view>
<view class='no-data01' wx:if='{{lists.length==0}}'>
<image src='{{nodata}}'></image>
<view class='no-data-text'>暂无数据</view>
</view>
<view class='content' wx:if='{{lists.length>0}}'>
<view class='hottitle'>
<text>热门好礼</text>
</view>
<view class='sepll-list' wx:for="{{lists}}" wx:key="{{index}}" data-couponId='{{item.couponId}}' data-id='{{item.id}}' bindtap='invite'>
<view class='spell-left'>
<image src='{{item.coverImg}}' mode="aspectFill"></image>
</view>
<view class='spell-center'>
<view class='tilte'>{{item.title}}</view>
<view class='remark'>{{item.subTitle}}</view>
<!-- <view class='remark'>{{item.subTitle}}</view> -->
<view class='price'>
<view class='price01'>
<view class='price-num'>{{item.creditPrice}}</view>
<view class='price-unit'>积分</view>
<view class='price02'>{{'原价 '+item.priceStr+'元'}}</view>
</view>
</view>
<view class='price02'>{{'原价 '+item.priceStr+'元'}}</view>
</view>
<view class='spell-right'>
<view class='right-button' wx:if="{{item.remainInventory!=0}}">立即换购</view>
<view class='right-button remainInventory' wx:if="{{item.remainInventory==0}}">已兑完</view>
<view class='right-text'>剩余{{item.remainInventory}}</view>
<!-- <view class='right-text'>剩余{{item.remainInventory}}</view> -->
</view>
<view class='line'></view>
<view class='spell-bot'>
<view class='botMsg'>可用于店内套餐消费</view>
<view class='botNum'>剩余222张</view>
</view>
</view>
</view>


+ 143
- 40
pages/integralmall/index.wxss View File

@@ -1,27 +1,113 @@
/* pages/spellGroup/spellGroup.wxss */
.topbg image{

.topbg {
margin-bottom: 30rpx;
position: relative;
width:100%;
height:234rpx;
background:linear-gradient(180deg,rgba(253,131,45,1) 0%,rgba(254,74,22,1) 100%);
}
.user-avatar {
position: absolute;
width: 82rpx;
height: 82rpx;
border-radius: 50%;
overflow: hidden;
top:26rpx;
left:60rpx;
}
.user-avatar open-data {
display: block;
width: 100%;
height: 100%;
}
.topbg {
position: relative;
.name{
float: left;
color: #FFFFFF;
font-size:32rpx;
font-family:PingFangSC-Medium;
font-weight:500;
margin:0 20rpx;
}
.usre_level{
width:70rpx;
height:32rpx;
background:linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%);
border-radius:9px 9px 9px 0px;
font-family:PingFangSC-Regular;
font-weight:400;
color:rgba(255,255,255,1);
line-height:32rpx;
float: left;
margin-top: 8rpx;
}
.chengzhang {
font-size: 24rpx;
font-weight: 400;
color: #FFFFFF;
margin-left: 10rpx;
}
.topbg text{
.myName{
position: absolute;
left: 0;
right: 0;
text-align: center;
left: 152rpx;
top:26rpx;
font-size: 32rpx;
color: #fff;
height: 82rpx;
}

.view {
position: absolute;
top: 45rpx;
left: 170rpx;
}
.topbg .my{
top:25rpx;
progress{
width:214rpx;
height: 6rpx;
display:inline-block;
border-radius:60rpx;
overflow:hidden;
}
.msg{
position: absolute;
top: 68rpx;
left:400rpx;
font-size:10px!important;
font-family:PingFangSC-Regular;
font-weight:400;
color:rgba(255,255,255,1);
width: 200rpx;
}

.jifen{
font-size: 20rpx;
font-weight: 500;
color: #FFFFFF;
width: 500rpx;
height:30rpx;
position: absolute;
top: 176rpx;
left:70rpx;
}
.topbg .score{
top:60rpx;
font-size: 56rpx;
font-weight: bold;
font-size: 40rpx;
font-weight: 500;
position: absolute;
top:122rpx;
left:70rpx;
color: #FFFFFF;
}
.qrcode{
width: 84rpx;
height: 84rpx;
position: absolute;
bottom: 38rpx;
right: 48rpx;
}
.qrcode image {
margin: auto;
width: 84rpx;
}

page {
height: auto;
overflow: auto;
@@ -87,33 +173,58 @@ image{
overflow: hidden;
}
.content .sepll-list{
width: 690rpx;
width: 714rpx;
height: 230rpx;
background: #fff;
border-radius: 30rpx;
margin: 0 auto 30rpx;
}
.content .spell-bot{
width: 674rpx;
float: left;
font-size: 24rpx;
height: 60rpx;
line-height: 60rpx;
border-top: 1rpx #E1E1E1 dashed;
margin: 0 20rpx;
}
.spell-bot .botMsg{
width: 40%;
height: 100%;
float: left;
margin-left: 20rpx;
color: #A6A6A6;
}
.spell-bot .botNum{
width: 40%;
height: 100%;
float: right;
text-align: right;
margin-right: 24rpx;
color: #FD782D;
}
.content .spell-left{
width: 230rpx;
height: 230rpx;
width: 170rpx;
height: 170rpx;
float: left;
}
.content .spell-left image{
width: 180rpx;
height: 180rpx;
width: 120rpx;
height: 120rpx;
margin: 25rpx;
border-radius: 8rpx;
}
.content .spell-center{
float: left;
width: 304rpx;
height: 100%;
height: 170rpx;
}
.content .tilte{
font-size:30rpx;
margin-top: 20rpx;
font-size:32rpx;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(51,51,51,1);
color:#3C3C3C;
line-height:44rpx;
padding-top: 16rpx;
overflow: hidden;
@@ -145,16 +256,17 @@ image{
}
.content .price{
overflow: hidden;
margin-top: 10rpx;
margin-top: 20rpx;
}
.content .price01{
font-size:50rpx;
font-size:40rpx;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(255,50,50,1);
color:#FD832D;
line-height:44rpx;
}
.content .price02{
display: inline;
font-size: 24rpx;
font-family:PingFang-SC-Medium;
font-weight:500;
@@ -170,21 +282,21 @@ image{
margin-right: 10rpx;
}
.content .spell-right{
float: left;
float: right;
width: 156rpx;
}
.right-button{
width:120rpx;
height:48rpx;
width:140rpx;
height:52rpx;
font-size:26rpx;
background:linear-gradient(90deg,rgba(236,59,45,1) 0%,rgba(248,98,52,1) 100%);
border-radius:8rpx;
background:linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%);
border-radius:20rpx;
font-family:PingFang-SC-Medium;
font-weight:500;
text-align: center;
color:rgba(255,255,255,1);
line-height:44rpx;
margin: 110rpx auto 0;
margin: 88rpx 24rpx 0 0;
margin-top: 110rpx;
}
.right-text{
@@ -313,16 +425,7 @@ image{
font-weight:500;
color:rgba(0,0,0,1);
}
.hottitle{
height: 100rpx;
line-height: 100rpx;
}
.hottitle text{
color: #333;
font-weight: bold;
font-size: 36rpx;
padding-left: 30rpx;
}

button::after{ border: none; }
.goback{
position: fixed;


+ 3
- 2
pages/user/index.js View File

@@ -4,6 +4,7 @@ var app = getApp();
const Http = require("../../utils/HttpBasics");
const QR = require("../../utils/memberqrcode.js");
const imgurl = require("../../utils/imgurl");
const bgColor = require("../../utils/bgColor.js")
Page({
/**
* 页面的初始数据
@@ -119,7 +120,7 @@ Page({
onShow: function() {
let that = this;
that.setData({
appVersion: extConfig.appVersion
appVersion: extConfig.appVersion,
})
/**
* couponNum
@@ -159,7 +160,7 @@ Page({
couponNum2: "couponNum2"
})
};
Http.get({
url: config.api.getScore,
data: {}


+ 2
- 0
pages/user/index.json View File

@@ -3,5 +3,7 @@
"i-button": "../../dist/button/index"
},
"navigationBarTitleText": "我的",
"navigationBarBackgroundColor": "#FD832D",
"navigationBarTextStyle": "white",
"disableScroll": true
}

+ 39
- 34
pages/user/index.wxml View File

@@ -1,34 +1,31 @@
<view class="user">
<view class="user-title">
<view class="top" ></view>
<view class='user_title '>
<view class="user-avatar" bindtap='gotograde'>
<open-data class="open" type="userAvatarUrl"></open-data>
</view>
<view class="user-phone" bindtap='gotograde'>
<open-data type="userNickName"></open-data>
<text class='chengzhang'>{{levelName}}</text>
<view class="view">成长值{{score}}>
<!-- <image src='{{redirectUrl}}' mode='widthFix'></image> -->
</view>
</view>
<view class='chengzhang1'>
<view class='qrcode' bindtap='qrcode' wx:if="{{ismember}}">
<image src='{{qrcodeUrl}}' mode='widthFix'></image>
<view class="user-name">
<open-data class="name" type="userNickName"></open-data>
<view class=' usre_level'>
<text class='chengzhang '>{{levelName}}</text>
</view>
<view wx:if="{{showEdit}}" class='edits' bindtap='gotoedit'>
<image class='fr' class='edit' src="{{editUrl}}" mode='widthFix'></image>
<text style="color:#01bffe;display:inline-block;margin-left:16rpx;">编辑</text>
</view>
<image class='fr' wx:if="{{!showEdit}}" bindtap='gotoedit' class='activeimg' src='{{activeUrl}}' mode='widthFix'></image>
</view>
</view>
<view class='btns_bg'>
<view class="user-phone" bindtap='gotograde'>
<text class="my">我的</text>
<text class="chengzhang_h" >成长值{{score}}</text>
<text class="my my_line">|</text>
<text class="my">更多成长值</text>
<text class="view">一键领取</text>
</view>
<view class="user-btns">
<!-- 我的订单 -->
<navigator url="/pages/order/index/index?id=all">
<view class="user-btn app-border-bottom">
<view>
<image class='icons' src="{{dingUrl}}" mode='widthFix'></image>我的订单</view>
</view>
</navigator>
<!-- 我的券包 -->
<navigator url="/pages/couponorder/index/index">
<view class="user-btn app-border-bottom">
<view>
@@ -38,44 +35,52 @@
</view>
</view>
</navigator>
<!-- 我的砍价 -->
<navigator url="/pages/bargain/bargain?from=myhtml" open-type="navigate">
<navigator url="/pages/cardorder/index/index">
<view class="user-btn app-border-bottom">
<view>
<image class='icons' src="{{wmbarginicon}}" mode='widthFix'></image>我的砍价</view>
<image class='icons' src="{{cardiconUrl}}" mode='widthFix'></image>我的卡包</view>
<view>
<text class="couponnum" wx:if="{{couponNum2=='couponNum2'}}"></text>
</view>
</view>
</navigator>
<!-- 我的拼团 -->
</view>
</view>
<view class='btns_bg'>
<view class="user-btns">
<navigator url="/pages/cardorder/index/index">
<!-- 我的砍价 -->
<navigator url="/pages/bargain/bargain?from=myhtml" open-type="navigate">
<view class="user-btn app-border-bottom">
<view>
<image class='icons' src="{{cardiconUrl}}" mode='widthFix'></image>我的卡包</view>
<view>
<text class="couponnum" wx:if="{{couponNum2=='couponNum2'}}"></text>
</view>
<image class='icons' src="{{wmbarginicon}}" mode='widthFix'></image>我的砍价</view>
</view>
</navigator>
<navigator url="/pages/integralmall/index">
<!-- 我的拼团 -->
<navigator url="/pages/spellGroup/spellGroup?from=myhtml" open-type="navigate">
<view class="user-btn app-border-bottom">
<view>
<image class='icons' src="{{wmintegral}}" mode='widthFix'></image>积分商城</view>
<image class='icons' src="{{wmspellgroup}}" mode='widthFix'></image>我的拼团</view>
</view>
</navigator>
<!-- 当商场开启使用折扣按钮的时候, -->
<navigator url="/pages/specialcourtesy/specialcourtesy">
<!-- 积分商城 -->
<navigator url="/pages/integralmall/index">
<view class="user-btn app-border-bottom">
<view>
<image class='icons' src="{{giftUrl}}" mode='widthFix'></image>特享礼遇</view>
<image class='icons' src="{{wmintegral}}" mode='widthFix'></image>积分商城</view>
</view>
</navigator>
</view>
<view class="user-btns">
<navigator url="/pages/spellGroup/spellGroup?from=myhtml" open-type="navigate">
</view>
<view class="user-btns">
<!-- 当商场开启使用折扣按钮的时候, -->
<navigator url="/pages/specialcourtesy/specialcourtesy">
<view class="user-btn app-border-bottom">
<view>
<image class='icons' src="{{wmspellgroup}}" mode='widthFix'></image>我的拼团</view>
<image class='icons' src="{{giftUrl}}" mode='widthFix'></image>特享礼遇</view>
</view>
</navigator>
<navigator url="/pages/user/myactivity/index" open-type="navigate">


+ 71
- 51
pages/user/index.wxss View File

@@ -14,20 +14,6 @@ page{
background: #fff;
}

.user-title {
position: relative;
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.10);
border-radius: 8px;
width: 94%;
padding-left: 30rpx;
display: flex;
flex-direction: row;
box-sizing: border-box;
background: #fff;
margin: 28rpx auto 0;
border-bottom: 6rpx solid orange;
}

.version {
position: absolute;
right: 0;
@@ -57,53 +43,46 @@ page{
width: 100%;
height: 100%;
}

.user-name{
font-family: PingFangSC-Medium;
height: 42rpx;
margin-left: 310rpx;
letter-spacing: 0.64rpx;
line-height: 44rpx;
margin-top: 66rpx;
font-size: 30rpx;
color: #3C3C3C;
font-weight:600;
}
.user-phone {
font-family: PingFangSC-Regular;
height: 120rpx;
margin-left: 149rpx;
height: 30rpx;
letter-spacing: 0.64rpx;
line-height: 44rpx;
margin-top: 43rpx;
font-size: 36rpx;
color: #000;
margin:20rpx 0 50rpx 149rpx;
}

.user-avatar {
position: absolute;
left: 30rpx;
top: 0;
bottom: 0;
width: 120rpx;
height: 120rpx;
width: 128rpx;
height: 128rpx;
border-radius: 50%;
overflow: hidden;
margin: auto;
top:-64rpx;
left: 300rpx;
}

.chengzhang {
font-size: 24rpx;
font-weight: 400;
color: rgba(122, 122, 122, 1);
color: #FFFFFF;
margin-left: 10rpx;
}

.chengzhang1 {
position: absolute;
right: 0;
bottom: 0;
top: 0;
margin: auto;
text-align: center;
}

.chengzhang1 text {
display: block;
}

.view {
font-size: 24rpx;
color: #AF6E34;
color: #FD832D;
}

.view image {
@@ -112,13 +91,6 @@ page{
margin-top: -6rpx;
}

.chengzhang1 text {
text-align: center;
font-size: 26rpx;
line-height: 33rpx;
margin-right: 30rpx;
}

.bannerbg {
width: 100%;
}
@@ -136,11 +108,12 @@ page{

.user-btns{
background: #fff;
margin-top: 20rpx;
/* margin-top: 20rpx; */
margin: 20rpx 20rpx 0;
display: flex;
justify-content: space-around;
text-align: center;
margin-bottom: 50rpx;
/* margin-bottom: 20rpx; */
}
.user-btns:nth-of-type(3){
margin-bottom: 0;
@@ -149,7 +122,17 @@ page{
font-size: 30rpx;
letter-spacing: 1.16rpx;
}
.user_title{
position: relative;
width: 94%;
background: #fff;
border-radius: 16rpx;
margin: -100rpx auto 0;
padding: 20rpx 0;
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.10);
}
.btns_bg{
position: relative;
width: 94%;
background: #fff;
border-radius: 16rpx;
@@ -366,5 +349,42 @@ page{
margin-top: 20rpx;
}

.memberIds {
}
.top{
width: 100%;
height: 234rpx;
background:linear-gradient(180deg,rgba(253,131,45,1) 0%,rgba(254,74,22,1) 100%)
}

.usre_level{
width:70rpx;
height:32rpx;
background:linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%);
border-radius:9px 9px 9px 0px;
font-family:PingFangSC-Regular;
font-weight:400;
color:rgba(255,255,255,1);
line-height:32rpx;
float: left;
margin-top: 8rpx;
}
.my{
font-size:24rpx;
font-family:PingFangSC-Regular;
font-weight:400;
color:rgba(166,166,166,1);
line-height:34rpx;
}
.chengzhang_h{
color: #3C3C3C;
font-size:24rpx;
font-weight: 600;
}
.my_line{
margin: 0 10rpx;
}
.usre_level{
font-size:20rpx;
}
.name{
float: left;
}

+ 16
- 0
utils/bgColor.js View File

@@ -0,0 +1,16 @@
module.exports = {
colorFirst:{
// 我的
"user": {
"banneColor": "linear-gradient(180deg,rgba(253,131,45,1) 0%,rgba(254,74,22,1) 100%))",
},
},
colorSecond:{
// 我的
"user": {
"banneColor": ''
},
}
}

Loading…
Cancel
Save