22 changed files with 2650 additions and 1371 deletions
@ -1,8 +1,8 @@ |
|||||||
// export const VUE_APP_API_URL = 'http://192.168.10.129:48080/bxgApp'
|
// export const VUE_APP_API_URL = 'http://192.168.10.129:48080/bxgApp'
|
||||||
// export const VUE_APP_API_URL = 'http://192.168.10.113:48080/bxgApp'
|
export const VUE_APP_API_URL = 'http://192.168.10.113:48080/bxgApp' |
||||||
export const VUE_APP_API_URL = 'https://farm.lotus-wallet.com/bxgApp' |
// export const VUE_APP_API_URL = 'https://farm.lotus-wallet.com/bxgApp'
|
||||||
// export const VUE_APP_API_URL = 'https://xiaohui.shop.cyjyyjy.com/xiaohuiapp'
|
// export const VUE_APP_API_URL = 'https://xiaohui.shop.cyjyyjy.com/xiaohuiapp'
|
||||||
export const VUE_APP_RESOURCES_URL = 'https://h5.yixiang.co/static' |
export const VUE_APP_RESOURCES_URL = 'https://h5.yixiang.co/static' |
||||||
export const BXG_TENANT_ID = 129 |
// export const BXG_TENANT_ID = 129
|
||||||
// export const BXG_TENANT_ID = 138
|
export const BXG_TENANT_ID = 138 |
||||||
// export const BXG_TENANT_ID = 128
|
// export const BXG_TENANT_ID = 128
|
||||||
@ -0,0 +1,433 @@ |
|||||||
|
<template> |
||||||
|
<view class="product-con"> |
||||||
|
<view class="header"> |
||||||
|
<cu-custom :isBack="true" :isCenter="true" > |
||||||
|
<block slot="backText"> |
||||||
|
<view class="backImg"> |
||||||
|
<image src="@/static/images/back-btn.png" mode=""></image> |
||||||
|
</view> |
||||||
|
</block> |
||||||
|
</cu-custom> |
||||||
|
</view> |
||||||
|
|
||||||
|
<!-- 商品轮播 --> |
||||||
|
<product-con-swiper :imgUrls="imgUrls"></product-con-swiper> |
||||||
|
|
||||||
|
<view class="tui-pro-detail"> |
||||||
|
<view class="activity-info-box"> |
||||||
|
<view class="tui-right__box"> |
||||||
|
<view class="acea-row row-middle row-center"> |
||||||
|
<view class="iconfont icon-kanjia"></view> |
||||||
|
<text>砍价活动</text> |
||||||
|
</view> |
||||||
|
<view class="count-down-box"> |
||||||
|
<count-down :isSecond="false" :datatime="goodsDetail.stopTime" :styleAllStyle="styleAllStyle" :timeTxtStyle="timeTxtStyle"></count-down> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="tui-pro-price"> |
||||||
|
<text class="tui-price">¥{{goodsDetail.minPrice}}</text> |
||||||
|
<view class="tui-original-price">¥{{goodsDetail.price}}</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="tui-pro-title">{{ goodsDetail.title }}</view> |
||||||
|
<view class="tui-pro-info">{{ goodsDetail.info }}</view> |
||||||
|
<view class="tui-sale-info"> |
||||||
|
<view class="tips acea-row"> |
||||||
|
<view class="tip">甄选品牌</view> |
||||||
|
</view> |
||||||
|
<view>库存：{{ goodsDetail.stock }}{{ goodsDetail.unitName }}</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="safeguard-info acea-row row-between-wrapper"> |
||||||
|
<view class="safeguard-item"> |
||||||
|
<image class="img" src="@/static/images/by.png" mode=""></image> |
||||||
|
<view>满{{199}}包邮</view> |
||||||
|
</view> |
||||||
|
<view class="line"></view> |
||||||
|
<view class="safeguard-item"> |
||||||
|
<image class="img" src="@/static/images/fxt.png" mode=""></image> |
||||||
|
<view>7天无理由</view> |
||||||
|
</view> |
||||||
|
<view class="line"></view> |
||||||
|
<view class="safeguard-item"> |
||||||
|
<image class="img" src="@/static/images/bj.png" mode=""></image> |
||||||
|
<view>30天保价</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<!-- 用户评价 --> |
||||||
|
<!-- <view class="userEvaluation" v-if="replyCount"> |
||||||
|
<view class="title acea-row row-between-wrapper" @click="goEvaluateList(storeInfo.productId)"> |
||||||
|
<view class="acea-row row-middle"><text>评价</text><text class="replyCount">{{ replyCount }}</text></view> |
||||||
|
<view @click="goEvaluateList(id)" class="praise acea-row row-middle"> |
||||||
|
<view>好评率{{ replyChance }}%</view> |
||||||
|
<view class="jiantou-right"></view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<user-evaluation :reply="reply"></user-evaluation> |
||||||
|
</view> --> |
||||||
|
|
||||||
|
<view class="product-intro"> |
||||||
|
<view class="title">商品展示</view> |
||||||
|
<view class="conter" v-html="goodsDetail.description"></view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view :style="addBottom?'height: 162rpx;':'height: 122rpx;'"></view> |
||||||
|
<!--底部操作栏--> |
||||||
|
<view class="tui-operation acea-row row-between" :style="addBottom?'height: 162rpx;':'height: 122rpx;'"> |
||||||
|
<view class="tui-operation-left acea-row row-between"> |
||||||
|
<!-- #ifdef MP-WEIXIN --> |
||||||
|
<button class="tui-operation-item" open-type="contact" hover-class="tui-opcity" :hover-stay-time="150"> |
||||||
|
<image src="@/static/images/service-icon.png" mode=""></image> |
||||||
|
<view class="tui-operation-text">客服</view> |
||||||
|
</button> |
||||||
|
<!-- #endif --> |
||||||
|
|
||||||
|
<view @click="goShoppingCart" class="tui-operation-item"> |
||||||
|
<image src="@/static/images/cart-icon.png" mode=""></image> |
||||||
|
<view class="tui-operation-text">购物车</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<!-- <view class="tui-operation-item" hover-class="tui-opcity" :hover-stay-time="150" @click="setCollect"> |
||||||
|
<image v-if="userCollect" src="@/static/images/star-light.png" mode=""></image> |
||||||
|
<image v-else src="@/static/images/star.png" mode=""></image> |
||||||
|
<view class="tui-operation-text">{{userCollect?'已收藏':'收藏'}}</view> |
||||||
|
</view> --> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="tui-operation-right acea-row"> |
||||||
|
<view class="btn other-col" @click="openAlone">原价购买</view> |
||||||
|
<view class="btn" @click="goDargain">发起砍价</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import ProductConSwiper from '@/components/ProductConSwiper'; |
||||||
|
import CountDown from '@/components/CountDown'; |
||||||
|
import { getBargainDetail } from '@/api/activity'; |
||||||
|
import { handleQrCode } from '@/utils/index' |
||||||
|
export default { |
||||||
|
components: { |
||||||
|
ProductConSwiper, |
||||||
|
CountDown, |
||||||
|
}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
addBottom: this.addBottom, |
||||||
|
goodsDetail: {}, |
||||||
|
bargainId: 0, |
||||||
|
bargainUid: 0, |
||||||
|
imgUrls: [], |
||||||
|
styleAllStyle: 'width:30rpx;height:24rpx;background:#F5F6F8;border-radius:8rpx;font-size:20rpx;color:#3A3A3C;line-height:24rpx;', |
||||||
|
timeTxtStyle: 'font-size:20rpx;color:#F5F6F8;line-height:24rpx;padding:0rpx 4rpx;', |
||||||
|
}; |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
let url = handleQrCode() |
||||||
|
// bargainId 砍价商品id |
||||||
|
// bargainUid 发起砍价人 |
||||||
|
if (url) { |
||||||
|
// 通过二维码进来 |
||||||
|
this.bargainId = url.bargainId |
||||||
|
// this.bargainUid = url.partake |
||||||
|
} else { |
||||||
|
// 正常途径进来 |
||||||
|
this.bargainId = this.$yroute.query.id |
||||||
|
// this.bargainUid = this.$yroute.query.partake |
||||||
|
} |
||||||
|
// if (this.bargainUid == 0 || !this.bargainUid) { |
||||||
|
// // url未携带用户uid，填上登录用户uid，跳转 |
||||||
|
// this.bargainUid = this.userInfo.uid |
||||||
|
// } |
||||||
|
this.getBargainDetail(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 获取产品详情 |
||||||
|
getBargainDetail() { |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中', |
||||||
|
mask: true, |
||||||
|
}) |
||||||
|
getBargainDetail(this.bargainId).then(res => { |
||||||
|
uni.hideLoading() |
||||||
|
this.goodsDetail = res.data.bargain; |
||||||
|
this.imgUrls.push(this.goodsDetail.image); |
||||||
|
// console.log(this.goodsDetail); |
||||||
|
this.goodsDetail.description = this.goodsDetail.description.replace(/\<img/gi, '<img style="max-width:100%;height:auto;"'); |
||||||
|
this.goodsDetail.rule = this.goodsDetail.rule.replace(/\<img/gi, '<img style="max-width:100%;height:auto;"'); |
||||||
|
}).catch(res => { |
||||||
|
uni.hideLoading() |
||||||
|
uni.showToast({ |
||||||
|
title: res.msg, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000, |
||||||
|
}) |
||||||
|
}) |
||||||
|
}, |
||||||
|
goShoppingCart() { |
||||||
|
uni.setStorageSync('pathToCart', '/pages/activity/DargainGoodsDetails/index?id='+ this.bargainId +'&partake=0'); |
||||||
|
this.$yrouter.switchTab('/pages/shop/ShoppingCart/index'); |
||||||
|
}, |
||||||
|
// 单独购买 |
||||||
|
openAlone() { |
||||||
|
this.$yrouter.push({ |
||||||
|
path: '/pages/shop/GoodsCon/index', |
||||||
|
query: { |
||||||
|
id: this.goodsDetail.productId, |
||||||
|
}, |
||||||
|
}) |
||||||
|
}, |
||||||
|
goDargain() { |
||||||
|
this.$yrouter.push({ |
||||||
|
path: "/pages/activity/DargainDetails/index", |
||||||
|
query: { id: this.bargainId, partake: 0 } |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less" scoped> |
||||||
|
.header { |
||||||
|
.tab-title { |
||||||
|
font-size: 32rpx; |
||||||
|
font-family: PingFang SC; |
||||||
|
font-weight: 600; |
||||||
|
color: #2DB5AE; |
||||||
|
line-height: 42rpx; |
||||||
|
} |
||||||
|
.backImg { |
||||||
|
width: 88rpx; |
||||||
|
height: 62rpx; |
||||||
|
padding-left: 26rpx; |
||||||
|
image { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tui-pro-detail { |
||||||
|
margin: 8rpx 32rpx 20rpx; |
||||||
|
width: 686rpx; |
||||||
|
// height: 230rpx; |
||||||
|
background: #F5F6F8; |
||||||
|
box-shadow: 0rpx 10rpx 16rpx 0rpx rgba(0,0,0,0.15); |
||||||
|
border-radius: 16rpx; |
||||||
|
padding: 24rpx; |
||||||
|
|
||||||
|
position: relative; |
||||||
|
} |
||||||
|
|
||||||
|
.activity-info-box { |
||||||
|
position: absolute; |
||||||
|
top: 0rpx; |
||||||
|
right: 24rpx; |
||||||
|
width: 220rpx; |
||||||
|
height: 74rpx; |
||||||
|
overflow: hidden; |
||||||
|
.tui-right__box { |
||||||
|
padding-top: 8rpx; |
||||||
|
width: 188rpx; |
||||||
|
height: 74rpx; |
||||||
|
background: #2DB5AE; |
||||||
|
border-radius: 0rpx 0rpx 16rpx 16rpx; |
||||||
|
position: relative; |
||||||
|
z-index: 1; |
||||||
|
margin: 0rpx 16rpx; |
||||||
|
font-size: 20rpx; |
||||||
|
font-family: PingFang SC; |
||||||
|
font-weight: 600; |
||||||
|
color: #FFFFFF; |
||||||
|
line-height: 26rpx; |
||||||
|
.iconfont.icon-kanjia { |
||||||
|
font-size: 26rpx; |
||||||
|
font-weight: 500; |
||||||
|
line-height: 26rpx; |
||||||
|
margin-right: 6rpx; |
||||||
|
} |
||||||
|
.count-down-box { |
||||||
|
padding-top: 6rpx; |
||||||
|
padding-left: 10rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.tui-right__box::after { |
||||||
|
width: 32rpx; |
||||||
|
height: 32rpx; |
||||||
|
content: ""; |
||||||
|
position: absolute; |
||||||
|
top: 0; |
||||||
|
left: -32rpx; |
||||||
|
border-radius: 16rpx; |
||||||
|
box-shadow: 16rpx -16rpx 0rpx #2DB5AE; |
||||||
|
} |
||||||
|
.tui-right__box::before { |
||||||
|
width: 32rpx; |
||||||
|
height: 32rpx; |
||||||
|
content: ""; |
||||||
|
position: absolute; |
||||||
|
top: 0; |
||||||
|
right: -32rpx; |
||||||
|
border-radius: 16rpx; |
||||||
|
box-shadow: -16rpx -16rpx 0rpx #2DB5AE; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tui-pro-price { |
||||||
|
font-size: 48rpx; |
||||||
|
font-family: Futura; |
||||||
|
font-weight: 600; |
||||||
|
color: #3A3A3C; |
||||||
|
line-height: 64rpx; |
||||||
|
display: flex; |
||||||
|
.tui-original-price { |
||||||
|
padding-top: 18rpx; |
||||||
|
font-size: 30rpx; |
||||||
|
font-family: Futura; |
||||||
|
font-weight: 600; |
||||||
|
color: #999999; |
||||||
|
line-height: 40rpx; |
||||||
|
padding-left: 16rpx; |
||||||
|
text-decoration: line-through; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tui-pro-title { |
||||||
|
font-size: 34rpx; |
||||||
|
font-family: SourceHanSansSCVF; |
||||||
|
font-weight: 600; |
||||||
|
color: #3A3A3C; |
||||||
|
line-height: 50rpx; |
||||||
|
} |
||||||
|
.tui-pro-info { |
||||||
|
font-size: 20rpx; |
||||||
|
font-family: SourceHanSansSCVF; |
||||||
|
font-weight: 600; |
||||||
|
color: #999999; |
||||||
|
line-height: 28rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.tui-sale-info { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: space-between; |
||||||
|
padding-top: 16rpx; |
||||||
|
font-size: 20rpx; |
||||||
|
font-family: SourceHanSansSCVF; |
||||||
|
font-weight: 500; |
||||||
|
color: #999999; |
||||||
|
line-height: 28rpx; |
||||||
|
.tips { |
||||||
|
padding-top: 4rpx; |
||||||
|
.tip { |
||||||
|
width: 80rpx; |
||||||
|
height: 26rpx; |
||||||
|
background: #2DB5AE; |
||||||
|
border-radius: 6rpx; |
||||||
|
margin-right: 4rpx; |
||||||
|
font-size: 16rpx; |
||||||
|
font-family: PingFang SC; |
||||||
|
color: #FFFFFF; |
||||||
|
line-height: 26rpx; |
||||||
|
text-align: center; |
||||||
|
margin-right: 20rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.safeguard-info { |
||||||
|
width: 686rpx; |
||||||
|
height: 120rpx; |
||||||
|
background: #F5F6F8; |
||||||
|
box-shadow: 0rpx 10rpx 16rpx 0rpx rgba(0,0,0,0.15); |
||||||
|
border-radius: 16rpx; |
||||||
|
padding: 18rpx 0rpx; |
||||||
|
margin: 0rpx 32rpx 20rpx; |
||||||
|
.safeguard-item { |
||||||
|
width: 226rpx; |
||||||
|
font-size: 20rpx; |
||||||
|
font-family: SourceHanSansSCVF; |
||||||
|
font-weight: 600; |
||||||
|
color: #999999; |
||||||
|
line-height: 28rpx; |
||||||
|
text-align: center; |
||||||
|
.img { |
||||||
|
width: 46rpx; |
||||||
|
height: 46rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.line { |
||||||
|
width: 2rpx; |
||||||
|
height: 84rpx; |
||||||
|
background-color: #979797; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tui-operation { |
||||||
|
width: 100%; |
||||||
|
position: fixed; |
||||||
|
z-index: 100; |
||||||
|
bottom: 0; |
||||||
|
left: 0; |
||||||
|
background: #F1F1F1; |
||||||
|
box-shadow: 0rpx -4rpx 38rpx 0rpx rgba(0,0,0,0.2); |
||||||
|
border-radius: 28rpx 28rpx 0rpx 0rpx; |
||||||
|
.tui-operation-left { |
||||||
|
padding: 12rpx 28rpx; |
||||||
|
width: 220rpx; |
||||||
|
// width: 330rpx; |
||||||
|
.tui-operation-item { |
||||||
|
width: 60rpx; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
flex-direction: column; |
||||||
|
background: none; |
||||||
|
padding: 0; |
||||||
|
margin: 0; |
||||||
|
border: 0; |
||||||
|
|
||||||
|
image { |
||||||
|
width: 50rpx; |
||||||
|
height: 50rpx; |
||||||
|
} |
||||||
|
&:after { |
||||||
|
display: none; |
||||||
|
} |
||||||
|
.tui-operation-text { |
||||||
|
font-size: 20rpx; |
||||||
|
font-family: PingFang SC; |
||||||
|
font-weight: 500; |
||||||
|
color: #3A3A3C; |
||||||
|
line-height: 22rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.tui-operation-right { |
||||||
|
padding-top: 18rpx; |
||||||
|
padding-right: 18rpx; |
||||||
|
.btn { |
||||||
|
width: 186rpx; |
||||||
|
height: 66rpx; |
||||||
|
background: #2DB5AE; |
||||||
|
border-radius: 16rpx; |
||||||
|
font-size: 26rpx; |
||||||
|
font-family: PingFang SC; |
||||||
|
font-weight: 600; |
||||||
|
color: #FFFFFF; |
||||||
|
line-height: 66rpx; |
||||||
|
text-align: center; |
||||||
|
margin-right: 14rpx; |
||||||
|
} |
||||||
|
.other-col { |
||||||
|
background: #98DAD7; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
</style> |
||||||
File diff suppressed because it is too large
Load Diff
@ -1,302 +0,0 @@ |
|||||||
<template> |
|
||||||
<view> |
|
||||||
<view class="header"> |
|
||||||
<cu-custom :isBack="true" :isCenter="true"> |
|
||||||
<block slot="backText"> |
|
||||||
<view class="backImg"> |
|
||||||
<image src="@/static/images/back-btn.png" mode=""></image> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
<block slot="content"> |
|
||||||
<view class="tab-title">积分兑换</view> |
|
||||||
</block> |
|
||||||
</cu-custom> |
|
||||||
</view> |
|
||||||
|
|
||||||
<view class="banner-box"> |
|
||||||
<swiper class="swiper-wrapper" @change="handleChange" :autoplay="true"> |
|
||||||
<block v-for="(item, imgUrlsIndex) in imgUrls" :key="imgUrlsIndex"> |
|
||||||
<swiper-item> |
|
||||||
<view class="image">{{item}}</view> |
|
||||||
<!-- <image class="image" :src="item" class="slide-image" mode="aspectFill"/> --> |
|
||||||
</swiper-item> |
|
||||||
</block> |
|
||||||
</swiper> |
|
||||||
<view class="dots-box acea-row row-center"> |
|
||||||
<view class="dot" v-for="(item,index) in imgUrls" :key="index"> |
|
||||||
<view :class="(currents > index?'active2 ':'active ') + (currents == index?'on':(currents-1 == index?'on2':''))"></view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
|
|
||||||
<view class="integral-box acea-row row-between"> |
|
||||||
<view class="integral"> |
|
||||||
<view class="title">我的积分</view> |
|
||||||
<view class="acea-row"> |
|
||||||
<view class="item" v-for="(item, integralIndex) in integral" :key="integralIndex"> |
|
||||||
<view class="top"></view> |
|
||||||
<view class="bottom"></view> |
|
||||||
<view class="num">{{ item || 0 }}</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
<view @click="goIntegral" class="btn acea-row row-between-wrapper"> |
|
||||||
<image src="@/static/images/mingxi.png" mode=""></image> |
|
||||||
<view>明细</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
<view class="integral get-way acea-row row-column row-between"> |
|
||||||
<view class="title">获取积分</view> |
|
||||||
<view class="acea-row row-between"> |
|
||||||
<view class="btn2">去签到</view> |
|
||||||
<view class="btn2">去下单</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
|
|
||||||
<view class="list-box"> |
|
||||||
<view class="title">积分兑换</view> |
|
||||||
<PromotionGood :benefit="productList" :isIntegral="true" /> |
|
||||||
</view> |
|
||||||
|
|
||||||
</view> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import { mapGetters } from 'vuex'; |
|
||||||
import store from '@/store'; |
|
||||||
import PromotionGood from '@/components/PromotionGood'; |
|
||||||
import { getProductsIntegral } from '@/api/store'; |
|
||||||
export default { |
|
||||||
components: { |
|
||||||
PromotionGood |
|
||||||
}, |
|
||||||
data() { |
|
||||||
return { |
|
||||||
currents: 0, |
|
||||||
imgUrls: 5, |
|
||||||
integral: 0, |
|
||||||
from: { |
|
||||||
page: 1, |
|
||||||
limit: 15, |
|
||||||
// sid: 0, |
|
||||||
news: 0, |
|
||||||
isIntegral: 1 |
|
||||||
}, |
|
||||||
productList: [], |
|
||||||
}; |
|
||||||
}, |
|
||||||
computed: mapGetters(['userInfo']), |
|
||||||
onLoad() { |
|
||||||
getProductsIntegral(this.from).then(res => { |
|
||||||
this.productList.push.apply(this.productList, res.data); |
|
||||||
}) |
|
||||||
}, |
|
||||||
onShow() { |
|
||||||
if (this.$store.getters.token) { |
|
||||||
this.$store.dispatch('getUser', true); |
|
||||||
} |
|
||||||
if(this.userInfo.integral === undefined) this.userInfo.integral = 0; |
|
||||||
this.integral = this.prefixInteger(this.userInfo.integral, 5); |
|
||||||
console.log('userInfo', this.userInfo); |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
handleChange(e) { |
|
||||||
this.currents = e.mp.detail.current; |
|
||||||
}, |
|
||||||
// 给数字补0；num：需要补0的数字，length：长度（补到多少位） |
|
||||||
prefixInteger(num, length) { |
|
||||||
return (Array(length).join("0") + num).slice(-length).split(""); |
|
||||||
}, |
|
||||||
goIntegral() { |
|
||||||
this.$yrouter.push('/pages/user/signIn/Integral/index') |
|
||||||
}, |
|
||||||
}, |
|
||||||
} |
|
||||||
</script> |
|
||||||
|
|
||||||
<style lang="less" scoped> |
|
||||||
.header { |
|
||||||
.tab-title { |
|
||||||
font-size: 32rpx; |
|
||||||
font-family: PingFang SC; |
|
||||||
font-weight: 600; |
|
||||||
color: #2DB5AE; |
|
||||||
line-height: 42rpx; |
|
||||||
} |
|
||||||
.backImg { |
|
||||||
width: 88rpx; |
|
||||||
height: 62rpx; |
|
||||||
padding-left: 26rpx; |
|
||||||
image { |
|
||||||
width: 100%; |
|
||||||
height: 100%; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
.banner-box { |
|
||||||
padding: 20rpx 32rpx; |
|
||||||
.swiper-wrapper { |
|
||||||
width: 686rpx; |
|
||||||
height: 398rpx; |
|
||||||
border-radius: 16rpx; |
|
||||||
.image { |
|
||||||
width: 686rpx; |
|
||||||
height: 398rpx; |
|
||||||
border-radius: 16rpx; |
|
||||||
background-color: #FFFFFF; |
|
||||||
} |
|
||||||
} |
|
||||||
.dots-box { |
|
||||||
padding-top: 26rpx; |
|
||||||
.dot { |
|
||||||
width: 92rpx; |
|
||||||
height: 4rpx; |
|
||||||
background: #CCEDEB; |
|
||||||
margin: 0rpx 6rpx; |
|
||||||
position: relative; |
|
||||||
.active { |
|
||||||
width: 0rpx; |
|
||||||
height: 4rpx; |
|
||||||
background: #2DB5AE; |
|
||||||
position: absolute; |
|
||||||
top: 0; |
|
||||||
left: 0; |
|
||||||
transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-webkit-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-moz-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-o-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
} |
|
||||||
.active2 { |
|
||||||
width: 0rpx; |
|
||||||
height: 4rpx; |
|
||||||
background: #2DB5AE; |
|
||||||
position: absolute; |
|
||||||
top: 0; |
|
||||||
left: 92rpx; |
|
||||||
transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-webkit-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-moz-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-o-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
} |
|
||||||
.active.on { |
|
||||||
width: 92rpx; |
|
||||||
transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-webkit-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-moz-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-o-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
} |
|
||||||
.active.on2 { |
|
||||||
width: 92rpx; |
|
||||||
left: 0; |
|
||||||
transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-webkit-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-moz-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
-o-transition: all .6s cubic-bezier(.18,.89,.17,.88); |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
.integral-box { |
|
||||||
padding: 6rpx 32rpx 12rpx; |
|
||||||
.title { |
|
||||||
font-size: 26rpx; |
|
||||||
font-family: PingFangTC; |
|
||||||
font-weight: 600; |
|
||||||
color: #F5F6F8; |
|
||||||
line-height: 34rpx; |
|
||||||
padding-bottom: 8rpx; |
|
||||||
} |
|
||||||
.integral { |
|
||||||
width: 480rpx; |
|
||||||
height: 130rpx; |
|
||||||
background: linear-gradient(135deg, #39D396 0%, #2DB7AD 43%, #1B8DCC 100%); |
|
||||||
box-shadow: 0rpx 10rpx 16rpx 0rpx rgba(0,0,0,0.15); |
|
||||||
border-radius: 16rpx; |
|
||||||
padding: 18rpx; |
|
||||||
position: relative; |
|
||||||
.item { |
|
||||||
position: relative; |
|
||||||
margin-right: 6rpx; |
|
||||||
.top { |
|
||||||
width: 40rpx; |
|
||||||
height: 26rpx; |
|
||||||
background: #3A3A3C; |
|
||||||
border-radius: 8rpx 8rpx 0rpx 0rpx; |
|
||||||
margin-bottom: 4rpx; |
|
||||||
} |
|
||||||
.bottom { |
|
||||||
width: 40rpx; |
|
||||||
height: 26rpx; |
|
||||||
background: #3A3A3C; |
|
||||||
border-radius: 0rpx 0rpx 8rpx 8rpx; |
|
||||||
} |
|
||||||
.num { |
|
||||||
width: 40rpx; |
|
||||||
height: 56rpx; |
|
||||||
font-size: 40rpx; |
|
||||||
font-family: Futura; |
|
||||||
font-weight: 600; |
|
||||||
color: #F5F6F8; |
|
||||||
line-height: 56rpx; |
|
||||||
text-align: center; |
|
||||||
position: absolute; |
|
||||||
top: 0; |
|
||||||
left: 0; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
.btn { |
|
||||||
position: absolute; |
|
||||||
bottom: 18rpx; |
|
||||||
right: 18rpx; |
|
||||||
width: 70rpx; |
|
||||||
height: 26rpx; |
|
||||||
padding: 0rpx 8rpx; |
|
||||||
background: #FFFFFF; |
|
||||||
border-radius: 16rpx; |
|
||||||
font-size: 16rpx; |
|
||||||
font-family: PingFangTC; |
|
||||||
font-weight: 600; |
|
||||||
color: #2DB5AE; |
|
||||||
line-height: 26rpx; |
|
||||||
image { |
|
||||||
width: 20rpx; |
|
||||||
height: 20rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
.integral-box .get-way { |
|
||||||
width: 184rpx; |
|
||||||
height: 130rpx; |
|
||||||
background: linear-gradient(135deg, #39D396 0%, #2DB7AD 43%, #1B8DCC 100%); |
|
||||||
box-shadow: 0rpx 10rpx 16rpx 0rpx rgba(0,0,0,0.15); |
|
||||||
border-radius: 16rpx; |
|
||||||
.btn2 { |
|
||||||
width: 70rpx; |
|
||||||
height: 26rpx; |
|
||||||
background: #FFFFFF; |
|
||||||
border-radius: 16rpx; |
|
||||||
font-size: 16rpx; |
|
||||||
font-family: PingFangTC; |
|
||||||
font-weight: 600; |
|
||||||
color: #2DB5AE; |
|
||||||
line-height: 26rpx; |
|
||||||
text-align: center; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
.list-box { |
|
||||||
.title { |
|
||||||
font-size: 30rpx; |
|
||||||
font-family: SourceHanSansSCVF; |
|
||||||
font-weight: 600; |
|
||||||
color: #3A3A3C; |
|
||||||
line-height: 46rpx; |
|
||||||
padding: 20rpx 32rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
</style> |
|
||||||
|
After Width: | Height: | Size: 448 B |
|
After Width: | Height: | Size: 457 B |
Loading…
Reference in new issue