1327 lines
33 KiB
Vue
1327 lines
33 KiB
Vue
<template>
|
|
<view class="page">
|
|
<scroll-view
|
|
class="u-pa1"
|
|
@scrolltolower="scrollbottom"
|
|
scroll-y="true"
|
|
@scroll="scrolltoupper"
|
|
>
|
|
<view :class="flag || flag1 ? 'cover' : ''" style="z-index: 9"></view>
|
|
<view style="width: 100%; height: 38rpx; background: #db384c"></view>
|
|
<view style="background: #f7f7f7; position: relative">
|
|
<view class="header">
|
|
<view :class="member.IsEnabled ? 'header-top' : 'if_carh1'">
|
|
<view
|
|
style="width: 94%; margin: 0 auto; border-radius: 12px"
|
|
:class="member.IsEnabled ? 'if_carh2' : 'if_carh3'"
|
|
>
|
|
<view
|
|
style="width: 100%; display: flex"
|
|
:class="member.IsEnabled ? '' : 'if_carh'"
|
|
>
|
|
<view
|
|
class="message"
|
|
style="
|
|
flex: 1;
|
|
margin-top: 4%;
|
|
width: 140rpx;
|
|
height: 140rpx;
|
|
border-radius: 120rpx;
|
|
border: 1px solid #fff;
|
|
vertical-align: middle;
|
|
overflow: hidden;
|
|
margin-left: 4%;
|
|
"
|
|
>
|
|
<image
|
|
lazy-load
|
|
style="width: 140rpx; height: 140rpx"
|
|
:src="UserInfo.user_avatar"
|
|
></image>
|
|
</view>
|
|
<view
|
|
class="grade"
|
|
style="
|
|
flex: 4;
|
|
text-align: left;
|
|
text-align: left;
|
|
font-family: PingFangSC-Semibold;
|
|
font-size: 14px;
|
|
color: #4a4a4a;
|
|
font-weight: bold;
|
|
"
|
|
>
|
|
<view>{{ message.user_nickname }}</view>
|
|
<view
|
|
style="
|
|
margin: 2% 0 0 0;
|
|
text-align: left;
|
|
font-family: PingFangSC-Regular;
|
|
font-size: 22rpx;
|
|
color: #ff9f1a;
|
|
"
|
|
>
|
|
{{ message.user_level_name || __("普通会员") }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
v-if="member.IsEnabled == true"
|
|
class="card_vip"
|
|
style="overflow: hidden"
|
|
>
|
|
<view
|
|
class="show_card"
|
|
data-index="index"
|
|
style="position: relative"
|
|
>
|
|
<view
|
|
class="name_card"
|
|
v-if="member.IsReceive == false"
|
|
style="
|
|
position: absolute;
|
|
top: 13%;
|
|
left: 24%;
|
|
font-family: PingFangSC-Semibold;
|
|
color: #4a4a4a;
|
|
letter-spacing: 0;
|
|
width: 54%;
|
|
text-align: center;
|
|
"
|
|
>
|
|
{{ message.user_level_name }}{{ __("会员卡") }}
|
|
</view>
|
|
<view
|
|
class="name_card"
|
|
v-if="member.IsReceive == true"
|
|
style="
|
|
position: absolute;
|
|
top: 23%;
|
|
left: 5%;
|
|
font-family: PingFangSC-Semibold;
|
|
color: black;
|
|
"
|
|
>
|
|
{{ message.user_level_name }}{{ __("会员卡") }}
|
|
</view>
|
|
<view
|
|
v-if="
|
|
member.IsEnabled &&
|
|
member.IsReceive &&
|
|
member.ReciveStatus == 1 &&
|
|
member.IsToWeixin
|
|
"
|
|
@tap="openCard"
|
|
style="
|
|
position: absolute;
|
|
top: 54%;
|
|
left: 5%;
|
|
font-size: 22rpx;
|
|
color: #9b9b9b;
|
|
font-family: PingFangSC-Semibold;
|
|
"
|
|
class="num_card"
|
|
>{{ message.user_level_card }}
|
|
</view>
|
|
<view
|
|
v-if="
|
|
false &&
|
|
message.user_level_card != null &&
|
|
member.IsReceive &&
|
|
member.IsToWeixin == false
|
|
"
|
|
style="
|
|
position: absolute;
|
|
top: 54%;
|
|
left: 5%;
|
|
font-size: 22rpx;
|
|
color: #9b9b9b;
|
|
font-family: PingFangSC-Semibold;
|
|
"
|
|
@tap="cardvip"
|
|
class="num_card"
|
|
>{{ message.user_level_card }}
|
|
</view>
|
|
<view
|
|
v-if="
|
|
member.ReciveStatus == 2 &&
|
|
member.IsToWeixin &&
|
|
message.user_level_card != null &&
|
|
member.DrawMethod == 1
|
|
"
|
|
style="position: absolute;top: 56%;left:-2%;font-size:22rpxcolor: #9B9B9B;font-family: PingFangSC-Semibold;"
|
|
class="num_card"
|
|
>
|
|
<button
|
|
style="
|
|
background: #fcf3f4;
|
|
width: 200rpx;
|
|
text-align: center;
|
|
position: absolute;
|
|
top: 54%;
|
|
border-radius: 49rpx;
|
|
font-family: PingFangSC-Semibold;
|
|
font-size: 22rpx;
|
|
"
|
|
class="num_card"
|
|
open-type="getPhoneNumber"
|
|
@getphonenumber="getPhoneNumber"
|
|
hidden="showPhoneNumber"
|
|
>
|
|
<view style="color: #9b9b9b">{{
|
|
message.user_level_card
|
|
}}</view>
|
|
</button>
|
|
</view>
|
|
<view
|
|
@click.stop="cardDetail"
|
|
v-if="
|
|
member.ReciveStatus == 2 &&
|
|
member.IsToWeixin &&
|
|
message.user_level_card != null &&
|
|
member.DrawMethod == 2
|
|
"
|
|
style="
|
|
position: absolute;
|
|
top: 56%;
|
|
left: 5%;
|
|
font-size: 22rpx;
|
|
color: #9b9b9b;
|
|
font-family: PingFangSC-Semibold;
|
|
"
|
|
class="num_card"
|
|
>{{ message.user_level_card }}
|
|
</view>
|
|
<view
|
|
v-if="
|
|
member.IsEnabled &&
|
|
member.IsReceive &&
|
|
member.ReciveStatus == 1 &&
|
|
member.IsToWeixin
|
|
"
|
|
@tap="openCard"
|
|
style="
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
background: #f92c46;
|
|
border-radius: 50%;
|
|
position: absolute;
|
|
top: 32%;
|
|
right: 6%;
|
|
"
|
|
>
|
|
<image
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/erweima.png"
|
|
style="
|
|
border-radius: 0;
|
|
width: 49%;
|
|
height: 49%;
|
|
position: absolute;
|
|
top: 25%;
|
|
left: 25%;
|
|
"
|
|
></image>
|
|
</view>
|
|
<view
|
|
v-if="
|
|
false &&
|
|
message.user_level_card != null &&
|
|
member.IsReceive &&
|
|
member.IsToWeixin == false
|
|
"
|
|
@tap="cardvip"
|
|
style="
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
background: #f92c46;
|
|
border-radius: 50%;
|
|
position: absolute;
|
|
top: 32%;
|
|
right: 6%;
|
|
"
|
|
>
|
|
<image
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/erweima.png"
|
|
style="
|
|
border-radius: 0;
|
|
width: 49%;
|
|
height: 49%;
|
|
position: absolute;
|
|
top: 25%;
|
|
left: 25%;
|
|
"
|
|
></image>
|
|
</view>
|
|
<view
|
|
v-if="
|
|
member.ReciveStatus == 2 &&
|
|
member.IsToWeixin &&
|
|
message.user_level_card != null
|
|
"
|
|
@tap="getPhoneNumber"
|
|
style="
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
background: #f92c46;
|
|
border-radius: 50%;
|
|
position: absolute;
|
|
top: 32%;
|
|
right: 6%;
|
|
"
|
|
>
|
|
<image
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/erweima.png"
|
|
style="
|
|
border-radius: 0;
|
|
width: 49%;
|
|
height: 49%;
|
|
position: absolute;
|
|
top: 25%;
|
|
left: 25%;
|
|
"
|
|
></image>
|
|
</view>
|
|
<button
|
|
style="
|
|
background: #f92c46;
|
|
width: 41%; /*padding-right: 47%*/
|
|
text-align: center;
|
|
position: absolute;
|
|
top: 60%;
|
|
right: 29%;
|
|
border-radius: 27px;
|
|
"
|
|
class="num_card"
|
|
v-if="member.DrawMethod == 1 && member.IsReceive == false"
|
|
open-type="getPhoneNumber"
|
|
@getphonenumber="getPhoneNumber"
|
|
hidden="showPhoneNumber"
|
|
>
|
|
<view>立即领取</view>
|
|
</button>
|
|
<view
|
|
style="
|
|
background: #f92c46;
|
|
width: 48%;
|
|
text-align: center;
|
|
position: absolute;
|
|
top: 60%;
|
|
right: 24%;
|
|
border-radius: 49rpx;
|
|
"
|
|
@click.stop="cardDetail"
|
|
v-if="member.DrawMethod == 2 && member.IsReceive == false"
|
|
class="num_card"
|
|
>立即领取
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
v-if="
|
|
member.IsEnabled &&
|
|
member.IsReceive &&
|
|
member.ReciveStatus == 1 &&
|
|
member.IsToWeixin
|
|
"
|
|
@tap="openCard"
|
|
class="wx_kb grade"
|
|
>
|
|
<image
|
|
style="width: 106px; height: 29px; border-radius: 0"
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/cardp-bg.png"
|
|
></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view :class="member.IsEnabled ? 'header-bottom' : 'if_carh4'">
|
|
<navigator url="/member/member/growth" class="growth">
|
|
<view class="num">{{ message.user_growth }}</view>
|
|
<view style="color: #9b9b9b">{{ __("成长值") }}</view>
|
|
</navigator>
|
|
<navigator url="/member/cash/predeposit" class="growth">
|
|
<view class="num">{{ number_format(message.user_money, 2) }}</view>
|
|
<view style="color: #9b9b9b">{{ __("余额") }}</view>
|
|
</navigator>
|
|
<navigator url="/member/member/coupon" class="growth">
|
|
<view class="num">{{ message.voucher }}</view>
|
|
<view style="color: #9b9b9b">{{ __("优惠券") }}</view>
|
|
</navigator>
|
|
<navigator url="/integral/integral/integral" class="integral">
|
|
<view class="num">{{ number_format(message.user_points) }}</view>
|
|
<view style="color: #9b9b9b">{{ __("积分") }}</view>
|
|
</navigator>
|
|
</view>
|
|
|
|
<view
|
|
class="prerogative"
|
|
style="padding: 108rpx 0 20rpx 0; margin-top: 0"
|
|
>
|
|
<view class="prerogative-top">
|
|
<text style="margin-left: 5px; color: #dd233a; font-size: 32rpx"
|
|
>会员权益</text
|
|
>
|
|
</view>
|
|
</view>
|
|
|
|
<view
|
|
class="prerogative1"
|
|
v-if="message.user_level_rate == 100 || message.user_level_rate == 0"
|
|
>
|
|
<view class="prerogative-bottom"
|
|
>尊敬的会员，您现在无会员折扣可以使用。
|
|
</view>
|
|
</view>
|
|
<view class="prerogative1" v-else>
|
|
<view class="prerogative-bottom"
|
|
>尊敬的会员，您在购物时可享受{{
|
|
message.user_level_rate / 10
|
|
}}折优惠
|
|
</view>
|
|
</view>
|
|
<view style="background: #fff">
|
|
<view class="prerogative">
|
|
<view class="prerogative-top">
|
|
<text style="margin-left: 5px; color: #dd233a; font-size: 32rpx"
|
|
>任务中心</text
|
|
>
|
|
</view>
|
|
</view>
|
|
<view class="mission" style="padding: 26rpx 0rpx">
|
|
<view class="draw">
|
|
<image
|
|
style="width: 12px; height: 12px"
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/qiandao.png"
|
|
></image>
|
|
<text>签到领积分</text>
|
|
</view>
|
|
<button
|
|
style="margin-right: 0px; padding-left: 9rpx; padding-right: 9rpx"
|
|
@click="click"
|
|
v-if="isSign == false"
|
|
:class="isSign ? 'color' : 'button'"
|
|
>
|
|
签到
|
|
</button>
|
|
<view v-if="isSign == true" :class="isSign ? 'color' : 'button'"
|
|
>已签到
|
|
</view>
|
|
</view>
|
|
<view class="mission" style="padding: 26rpx 0rpx">
|
|
<view class="draw">
|
|
<image
|
|
style="width: 12px; height: 10px"
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/gouwu.png"
|
|
></image>
|
|
<text>购物领积分</text>
|
|
</view>
|
|
<navigator
|
|
open-type="switchTab"
|
|
class="button"
|
|
url="/pages/index/index"
|
|
>去购物
|
|
</navigator>
|
|
</view>
|
|
<view class="mission" style="padding: 26rpx 0rpx">
|
|
<view class="draw">
|
|
<image
|
|
style="width: 12px; height: 12px"
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/pinglun.png"
|
|
></image>
|
|
<text>评价领积分</text>
|
|
</view>
|
|
<navigator class="button" url="/member/order/list?type=2060&sl=4"
|
|
>去评价
|
|
</navigator>
|
|
</view>
|
|
<view class="alert" v-if="flag" style="z-index: 1000">
|
|
<image
|
|
style="width: 50rpx; height: 50rpx"
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/true.png"
|
|
></image>
|
|
<text style="margin-left: 20rpx">{{ signMsg }}</text>
|
|
</view>
|
|
<view class="alert1" v-if="flag1" style="z-index: 1000">
|
|
<view>{{ __("抱歉！今日您已签到") }}</view>
|
|
<view style="margin-top: 20rpx">{{ __("~明天再来哦~") }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<guess-you-like
|
|
ref="guessYouLike"
|
|
:titleText="__('——猜你喜欢——')"
|
|
></guess-you-like>
|
|
</scroll-view>
|
|
<view class="u-top-default">
|
|
<navigator url="../index/index" open-type="switchTab" class="u-back2">
|
|
<image
|
|
src="http://appicon-1253690476.file.myqcloud.com/endorsement/gohome.png"
|
|
></image>
|
|
</navigator>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
import { mapState, mapMutations } from "vuex";
|
|
|
|
import guessYouLike from "@/components/guess-you-like.vue";
|
|
import diy from "../../components/themes/diy";
|
|
import statusBar from "../../components/status-bar";
|
|
import coupon from "../../components/coupon/coupon";
|
|
|
|
export default {
|
|
data: function () {
|
|
return {
|
|
message: "",
|
|
member: {
|
|
IsEnabled: true,
|
|
IsReceive: true,
|
|
CardNum: 111,
|
|
CardName: "sss",
|
|
ReciveStatus: 2,
|
|
IsToWeixin: false,
|
|
DrawMethod: 2,
|
|
},
|
|
con: "",
|
|
Info: "",
|
|
UserInfo: "",
|
|
flag: false,
|
|
flag2: false,
|
|
flag1: false,
|
|
flag3: false,
|
|
isSign: true,
|
|
signMsg: "",
|
|
screenHeight: 0,
|
|
isquicknav: false,
|
|
};
|
|
},
|
|
computed: mapState([
|
|
"Config",
|
|
"StateCode",
|
|
"notice",
|
|
"plantformInfo",
|
|
"shopInfo",
|
|
"userInfo",
|
|
"hasLogin",
|
|
]),
|
|
components: {
|
|
guessYouLike,
|
|
},
|
|
onLoad: function (options) {
|
|
uni.setNavigationBarTitle({
|
|
title: this.__("任务中心"),
|
|
});
|
|
|
|
var that = this;
|
|
|
|
this.forceUserInfo(function (user) {
|
|
that.setData({
|
|
UserInfo: user,
|
|
});
|
|
that.load();
|
|
});
|
|
},
|
|
methods: {
|
|
...mapMutations([
|
|
"login",
|
|
"logout",
|
|
"getPlantformInfo",
|
|
"forceUserInfo",
|
|
"getUserInfo",
|
|
"reloadUserResource",
|
|
]),
|
|
|
|
scrollbottom: function (a) {
|
|
this.$refs.guessYouLike.scrollbottom();
|
|
},
|
|
scrolltoupper: function (a) {
|
|
a.detail.scrollTop >= this.screenHeight
|
|
? this.setData({ isquicknav: true })
|
|
: this.setData({ isquicknav: false });
|
|
},
|
|
|
|
getPhoneNumber: function (a) {
|
|
if (-1 < a.detail.errMsg.indexOf("ok")) {
|
|
if (0 == (o = this).member.IsToWeixin) {
|
|
var e = {
|
|
userId: app.globalData.UserInfo.Id,
|
|
vendorId: app.globalData.VendorInfo.Id,
|
|
cardId: o.member.Id,
|
|
phone: app.globalData.UserInfo.Phone,
|
|
};
|
|
$.xsr($.makeUrl(user.AddMemberCard, e), function (a) {
|
|
//console.log("buzhidao:", a), 0 == a.Code && $.alert(a.Info.Msg), o.onLoad()
|
|
});
|
|
} else {
|
|
o.GetMemberCard();
|
|
var o = this,
|
|
t = {
|
|
vendorId: app.globalData.VendorInfo.Id,
|
|
cardInfo: o.member.WeixinId,
|
|
};
|
|
$.xsr($.makeUrl(user.GetMemberCardPostInfo, t), function (a) {
|
|
o.setData({
|
|
id: a.Info.id,
|
|
tsamp: a.Info.tsamp,
|
|
nonstr: a.Info.nonstr,
|
|
sign: a.Info.sign,
|
|
}),
|
|
wx.addCard({
|
|
cardList: [
|
|
{
|
|
cardId: o.id,
|
|
cardExt:
|
|
'{ "timestamp":' +
|
|
o.tsamp +
|
|
', "signature":"' +
|
|
o.sign +
|
|
'","nonce_str":"' +
|
|
o.nonstr +
|
|
'"}',
|
|
},
|
|
],
|
|
success: function (a) {
|
|
o.onLoad();
|
|
var e = {
|
|
vendorId: app.globalData.VendorInfo.Id,
|
|
userId: app.globalData.UserInfo.Id,
|
|
cCode: a.cardList[0].code,
|
|
cCard: a.cardList[0].cardId,
|
|
cardId: o.member.Id,
|
|
};
|
|
$.xsr($.makeUrl(user.GetMCardRelationInfo, e), function (a) {
|
|
o.onLoad();
|
|
});
|
|
var t = {
|
|
userId: app.globalData.UserInfo.Id,
|
|
vendorId: app.globalData.VendorInfo.Id,
|
|
cardId: o.member.Id,
|
|
phone: app.globalData.UserInfo.Phone,
|
|
};
|
|
$.xsr($.makeUrl(user.AddMemberCard, t), function (a) {
|
|
0 == a.Code && ($.alert(a.Info.Msg), o.onLoad());
|
|
});
|
|
},
|
|
fail: function (a) {},
|
|
});
|
|
});
|
|
}
|
|
}
|
|
},
|
|
|
|
openCard: function () {},
|
|
|
|
load: function () {
|
|
var that = this,
|
|
params = {
|
|
user_id: this.userInfo.user_id,
|
|
};
|
|
|
|
that.$.request({
|
|
url: this.Config.URL.user.signState,
|
|
data: params,
|
|
success: function (data, status, msg, code) {
|
|
that.setData({
|
|
isSign: data.state == 250 ? 1 : 0,
|
|
});
|
|
},
|
|
});
|
|
|
|
that.setData({
|
|
message: this.userInfo,
|
|
});
|
|
},
|
|
|
|
click: function () {
|
|
var that = this,
|
|
param = {
|
|
user_id: this.userInfo.user_id,
|
|
};
|
|
|
|
that.$.request({
|
|
url: this.Config.URL.user.signIn,
|
|
data: param,
|
|
success: function (data, status, msg, code) {
|
|
that.reloadUserResource(function (user_info) {});
|
|
that.setData({
|
|
flag: !that.$.isNull(data),
|
|
});
|
|
that.setData({
|
|
signMsg: msg,
|
|
});
|
|
if (200 == status) {
|
|
that.setData({
|
|
flag: true,
|
|
});
|
|
setTimeout(function () {
|
|
that.setData({
|
|
flag: false,
|
|
});
|
|
}, 2e3);
|
|
} else {
|
|
that.setData({
|
|
flag1: true,
|
|
});
|
|
setTimeout(function () {
|
|
that.setData({
|
|
flag1: false,
|
|
});
|
|
}, 2e3);
|
|
}
|
|
|
|
that.load();
|
|
},
|
|
});
|
|
},
|
|
cardDetail: function (a) {
|
|
wx.navigateTo({ url: "../vip_ind/vip_ind?cardid=" + this.member.Id });
|
|
},
|
|
cardvip: function (a) {
|
|
wx.navigateTo({ url: "/member/member/card" });
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
@import "../../styles/_variables";
|
|
|
|
.header {
|
|
width: 100%;
|
|
background: #db384c;
|
|
}
|
|
|
|
.header-top {
|
|
width: 100%;
|
|
height: 529rpx;
|
|
background: #db384c;
|
|
justify-content: left;
|
|
}
|
|
|
|
.cover {
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0px;
|
|
background: rgba(0, 0, 0, 0.4);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.butoo {
|
|
background-color: #f7f7f7;
|
|
width: 200px;
|
|
color: red;
|
|
text-align: left;
|
|
padding-left: 5px;
|
|
margin-top: 0px;
|
|
margin-left: 15px;
|
|
}
|
|
|
|
/* .message { margin-top: 30rpx; } */
|
|
.grade {
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
text-align: center;
|
|
padding: 49rpx 0 0 20rpx;
|
|
}
|
|
|
|
.header-top image {
|
|
width: 118rpx;
|
|
height: 118rpx;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.header-bottom {
|
|
width: 94%;
|
|
height: 120rpx;
|
|
background: #fff;
|
|
padding: 20rpx 0;
|
|
display: flex;
|
|
margin: 0 auto;
|
|
border-radius: 21rpx;
|
|
position: absolute;
|
|
top: 38%;
|
|
left: 3%;
|
|
box-shadow: 0 8px 8px rgba(0, 0, 0, 0.048);
|
|
}
|
|
|
|
.growth {
|
|
width: 50%;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
text-align: center;
|
|
margin-top: 4%;
|
|
}
|
|
|
|
.integral {
|
|
width: 50%;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
text-align: center;
|
|
margin-top: 4%;
|
|
}
|
|
|
|
.num {
|
|
margin-bottom: 10rpx;
|
|
color: #db384c;
|
|
font-family: Tahoma-Bold;
|
|
font-size: 26rpx;
|
|
}
|
|
|
|
.prerogative {
|
|
margin-top: 20rpx;
|
|
padding: 45rpx 0 20rpx 0;
|
|
background: #fff;
|
|
}
|
|
|
|
.prerogative-top {
|
|
border-left: 6rpx solid #fff;
|
|
font-size: 28rpx;
|
|
height: 28rpx;
|
|
margin-left: 5%;
|
|
line-height: 28rpx;
|
|
}
|
|
|
|
.prerogative1 {
|
|
padding: 0 0 50rpx 0;
|
|
background: #fff;
|
|
}
|
|
|
|
.prerogative-bottom {
|
|
font-size: 26rpx;
|
|
height: 28rpx;
|
|
margin-left: 7%;
|
|
color: #9b9b9b;
|
|
}
|
|
|
|
.color {
|
|
width: 106rpx;
|
|
height: 48rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
line-height: 48rpx;
|
|
font-size: 24rpx;
|
|
background: rgb(160, 160, 160);
|
|
color: #fff;
|
|
border-radius: 10rpx;
|
|
}
|
|
|
|
/* .mission{ padding: 26rpx 0; border-top:1px solid #d9d9d9; position: relative; background: #fff; display: flex; justify-content: space-between; align-items: center } .mission::before{ content:" "; position:absolute; top:0; right:0; height:1px; border-top:1px solid #ebebe7; color:#ebebe7; -webkit-transform-origin:0 0; transform-origin:0 0; -webkit-transform:scaleY(0.5); transform:scaleY(0.5); } */
|
|
.mission {
|
|
padding: 20rpx 0rpx;
|
|
display: -webkit-box;
|
|
position: relative;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-webkit-align-items: center;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
background: #fff;
|
|
width: 85%;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.mission::before {
|
|
content: " ";
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
right: 0;
|
|
height: 1px;
|
|
border-top: 1px solid #f1f1f1;
|
|
color: #d9d9d9;
|
|
-webkit-transform-origin: 0 0;
|
|
transform-origin: 0 0;
|
|
-webkit-transform: scaleY(0.5);
|
|
transform: scaleY(0.5);
|
|
}
|
|
|
|
.button {
|
|
width: 106rpx;
|
|
height: 48rpx; /* text-align: center; */
|
|
display: flex;
|
|
justify-content: center;
|
|
line-height: 48rpx;
|
|
font-size: 24rpx;
|
|
background: #db384c;
|
|
color: #fff;
|
|
border-radius: 10rpx;
|
|
}
|
|
|
|
.draw {
|
|
font-size: 28rpx;
|
|
height: 40rpx;
|
|
line-height: 40rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.draw image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
}
|
|
|
|
.draw text {
|
|
margin-left: 20rpx;
|
|
}
|
|
|
|
.alert {
|
|
font-size: 32rpx;
|
|
width: 70%;
|
|
height: 200rpx;
|
|
position: absolute;
|
|
left: 15%;
|
|
top: 40%;
|
|
background: #fff;
|
|
border-radius: 10rpx;
|
|
justify-content: center;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.alert1 {
|
|
font-size: 32rpx;
|
|
width: 70%;
|
|
height: 200rpx;
|
|
position: absolute;
|
|
left: 15%;
|
|
top: 40%;
|
|
background: #fff;
|
|
border-radius: 10rpx;
|
|
justify-content: center;
|
|
display: flex;
|
|
flex-flow: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.u-back2 image {
|
|
border-radius: 100%;
|
|
width: 77rpx;
|
|
height: 77rpx;
|
|
border: 1px solid #eee;
|
|
font-size: 20rpx;
|
|
text-align: center;
|
|
background-color: #fff;
|
|
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.35);
|
|
z-index: 999;
|
|
opacity: 0.8;
|
|
line-height: 77rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.wx_kb {
|
|
width: 100%;
|
|
text-align: right;
|
|
position: absolute;
|
|
top: 1%;
|
|
right: 3%;
|
|
}
|
|
|
|
.if_carh {
|
|
height: 205rpx;
|
|
}
|
|
|
|
.if_carh1 {
|
|
width: 100%;
|
|
height: 223rpx;
|
|
background: #db384c;
|
|
justify-content: left;
|
|
}
|
|
|
|
.if_carh2 {
|
|
background: #fcf3f4;
|
|
}
|
|
|
|
.if_carh3 {
|
|
background: #fff;
|
|
}
|
|
|
|
.if_carh4 {
|
|
position: absolute;
|
|
top: 17%;
|
|
left: 3%;
|
|
width: 94%;
|
|
height: 153rpx;
|
|
background: #fff;
|
|
padding: 20rpx 0;
|
|
display: flex;
|
|
margin: 0 auto;
|
|
border-radius: 21rpx;
|
|
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.if_carh5 {
|
|
background: #fff;
|
|
}
|
|
|
|
.card_vip {
|
|
width: 100%;
|
|
height: 253rpx;
|
|
}
|
|
|
|
.show_card {
|
|
width: 91%;
|
|
height: 192rpx;
|
|
border-top-left-radius: 10px;
|
|
border-top-right-radius: 10px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.name_card {
|
|
float: left;
|
|
color: white;
|
|
line-height: 102rpx;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.num_card {
|
|
color: white;
|
|
line-height: 75rpx;
|
|
font-size: 32rpx;
|
|
}
|
|
|
|
.overbalance {
|
|
width: 100%;
|
|
margin: 22rpx auto;
|
|
box-sizing: border-box;
|
|
background: #fff;
|
|
}
|
|
|
|
.overbalanceTitle {
|
|
width: 100%;
|
|
height: 88rpx;
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 26rpx;
|
|
color: #000;
|
|
font-weight: 500;
|
|
line-height: 37rpx;
|
|
padding-top: 27rpx;
|
|
padding-bottom: 24rpx;
|
|
box-sizing: border-box; /* letter-spacing: 0; */
|
|
background: #fff;
|
|
box-shadow: 0 2rpx 0 0 #efefef;
|
|
padding-right: 24rpx;
|
|
}
|
|
|
|
.overbalanceTitle image {
|
|
width: 23rpx;
|
|
height: 26rpx;
|
|
margin-right: 15rpx;
|
|
}
|
|
|
|
.overbalanceConversion {
|
|
width: 100%;
|
|
height: 469rpx;
|
|
padding: 30rpx;
|
|
box-sizing: border-box;
|
|
white-space: nowrap;
|
|
display: flex;
|
|
}
|
|
|
|
.everyConversion {
|
|
display: inline-block;
|
|
width: 300rpx;
|
|
height: 430rpx;
|
|
margin-right: 20rpx;
|
|
padding: 20rpx 25rpx 34rpx;
|
|
box-sizing: border-box;
|
|
background: #fff;
|
|
box-shadow: 0 5rpx 10rpx 0 rgba(0, 0, 0, 0.06);
|
|
border-radius: 8rpx;
|
|
}
|
|
|
|
.everyConversion .moreCoupon {
|
|
width: 250rpx;
|
|
height: 250rpx;
|
|
background-image: linear-gradient(-225deg, #f87c5e 0%, #db384c 100%);
|
|
margin-bottom: 24rpx;
|
|
border-radius: 8rpx;
|
|
text-align: center;
|
|
box-sizing: border-box;
|
|
font-size: 24rpx;
|
|
line-height: 33rpx;
|
|
padding-top: 55rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
.moreCoupon view:first-child {
|
|
width: 100%;
|
|
height: 90rpx;
|
|
margin: 0 auto;
|
|
text-align: center;
|
|
font-size: 40rpx;
|
|
}
|
|
|
|
.moreCoupon view:first-child text {
|
|
font-size: 64rpx;
|
|
line-height: 90rpx;
|
|
}
|
|
|
|
.moreCoupon view:last-child {
|
|
width: 100%;
|
|
text-align: center;
|
|
padding: 0 10rpx;
|
|
box-sizing: border-box;
|
|
word-wrap: break-word;
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
.everyConversion image {
|
|
display: block;
|
|
width: 250rpx;
|
|
height: 250rpx;
|
|
margin-bottom: 24rpx;
|
|
}
|
|
|
|
.everyConversion .titel {
|
|
display: block;
|
|
width: 100%;
|
|
font-family: PingFangSC-Regular;
|
|
font-size: 24rpx;
|
|
line-height: 33rpx;
|
|
color: #000; /* letter-spacing: 0; */
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
margin-bottom: 19rpx;
|
|
}
|
|
|
|
.everyConversion .integralBtn {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.everyConversion .integralBtn text {
|
|
font-family: PingFangSC-Semibold;
|
|
font-size: 28rpx;
|
|
line-height: 40rpx;
|
|
color: #db384c; /* letter-spacing: 0; */
|
|
}
|
|
|
|
.everyConversion .integralBtn button {
|
|
width: 100rpx;
|
|
height: 50rpx;
|
|
background: #db384c;
|
|
border-radius: 10rpx;
|
|
font-family: PingFangSC-Regular;
|
|
font-size: 24rpx;
|
|
color: #fff; /* letter-spacing: 0; */
|
|
padding: 0;
|
|
margin: 0;
|
|
line-height: 50rpx;
|
|
}
|
|
|
|
.m-listv {
|
|
margin-top: 20rpx;
|
|
background: #f8f8f8;
|
|
padding: 0 4rpx 0 16rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.recommend {
|
|
text-align: center;
|
|
padding: 20rpx 0;
|
|
color: #db384c;
|
|
font-size: 30rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.m-listv .m-product-item {
|
|
margin: 10rpx;
|
|
width: 345rpx;
|
|
height: 520rpx;
|
|
overflow: hidden;
|
|
float: left;
|
|
border-radius: 8rpx;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.m-listv .m-product-img {
|
|
width: 345rpx;
|
|
height: 345rpx;
|
|
float: left;
|
|
text-align: center;
|
|
}
|
|
|
|
.m-product-img image {
|
|
width: 100%;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.m-product-info {
|
|
height: 210rpx;
|
|
width: 538rpx;
|
|
float: left;
|
|
box-sizing: border-box;
|
|
padding: 20rpx 0;
|
|
position: relative;
|
|
}
|
|
|
|
.m-listv .m-product-name {
|
|
width: 345rpx;
|
|
height: 100rpx;
|
|
box-sizing: border-box;
|
|
padding: 10rpx 20rpx;
|
|
font-size: 28rpx;
|
|
line-height: 40rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.m-product-name label {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 2;
|
|
}
|
|
|
|
.m-listv .m-product-price {
|
|
padding: 0 20rpx;
|
|
font-size: 32rpx;
|
|
line-height: 40rpx;
|
|
color: #db384c;
|
|
}
|
|
|
|
.m-product-price label {
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.msk2 {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
z-index: 10;
|
|
}
|
|
|
|
.m-coupon-box {
|
|
background-color: #db384c;
|
|
padding: 10rpx 25rpx 35rpx 25rpx;
|
|
border-radius: 35rpx;
|
|
width: 62%;
|
|
margin: 25% auto;
|
|
}
|
|
|
|
.coupon_title {
|
|
font-size: 52rpx;
|
|
color: #fff;
|
|
margin: 30rpx auto;
|
|
text-align: center;
|
|
letter-spacing: 3rpx;
|
|
}
|
|
|
|
.coupon_back {
|
|
width: 468rpx;
|
|
height: 450rpx;
|
|
}
|
|
|
|
.shopbox {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 28rpx 48rpx 22rpx 38rpx;
|
|
}
|
|
|
|
.shop_name {
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.context_box {
|
|
margin: 10rpx auto 0;
|
|
display: flex;
|
|
align-items: center;
|
|
color: #db384c;
|
|
}
|
|
|
|
.left {
|
|
margin-right: 20rpx;
|
|
text-align: center;
|
|
width: 30%;
|
|
max-width: 45%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.left2 {
|
|
margin-right: 20rpx;
|
|
text-align: center;
|
|
width: 35%;
|
|
max-width: 50%;
|
|
overflow: hidden;
|
|
line-height: 53px;
|
|
font-size: 38rpx;
|
|
}
|
|
|
|
.right {
|
|
margin: auto 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.youhuiquan {
|
|
border-bottom: 1rpx solid #db384c;
|
|
overflow: hidden;
|
|
height: 47rpx;
|
|
max-width: 280rpx;
|
|
line-height: 43rpx;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.manjian {
|
|
max-width: 306rpx;
|
|
line-height: 50rpx;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.youxiaoqi {
|
|
font-size: 24rpx;
|
|
color: #999;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
padding-top: 22rpx; /* text-align: center; */
|
|
padding-left: 38rpx;
|
|
}
|
|
|
|
.lijishiyong_box {
|
|
width: 100%;
|
|
background: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.lijishiyong {
|
|
width: 250rpx;
|
|
height: 60rpx;
|
|
background-color: #db384c;
|
|
color: #fff;
|
|
border-radius: 35rpx;
|
|
letter-spacing: 4rpx;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
line-height: 60rpx;
|
|
margin-top: 32rpx;
|
|
}
|
|
|
|
.close_msk1 {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-top: 124rpx;
|
|
}
|
|
</style>
|