95 lines
2.1 KiB
Vue
95 lines
2.1 KiB
Vue
<template>
|
|
<view class="points-store u-relative">
|
|
<view class="bg-default bg u-text-center text-fff">
|
|
<view class="u-p-t-42">
|
|
<view class="sm">可用积分</view>
|
|
<view class="fraction bold-600 u-m-t-14">0.00</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="u-absolute left-0 right-0 bg-white u-p-t-34 list">
|
|
<view>
|
|
<u-tabs :list="list" :is-scroll="true" :current="current" @change="change" inactive-color="#636363" :active-color="themeColor"></u-tabs>
|
|
</view>
|
|
<view class="u-m-l-24 u-m-r-24">
|
|
<u-line color="#EEE" />
|
|
</view>
|
|
<view class="u-m-t-32 u-m-l-24 u-m-r-24">
|
|
<view class="row-start u-col-top u-m-b-42" v-for="(itme, index) in 10">
|
|
<view>
|
|
<u-image :src="cloudPath + 'img/banner.png'" width="180" height="180" border-radius="20"></u-image>
|
|
</view>
|
|
|
|
<view class="u-m-l-18 w-full">
|
|
<view>小熊早餐必备煮蛋器</view>
|
|
<view class="u-m-t-4 text-7c">兑换66人</view>
|
|
<view class="u-m-t-42 row-between">
|
|
<view>
|
|
<text class="primary">100.00</text>
|
|
<text class="text-7c">积分+</text>
|
|
<text class="primary">100.00</text>
|
|
<text class="text-7c">元</text>
|
|
</view>
|
|
<view>
|
|
<u-button @click="mpLogin" hover-class="none" :customStyle="{width: '145rpx', height: '61rpx', backgroundColor: themeColor, color: '#fff', border: 'none', borderRadius: '31rpx'}" :hair-line="false">兑换</u-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
list: [
|
|
{
|
|
name: '全部'
|
|
},
|
|
{
|
|
name: '热门推荐'
|
|
}
|
|
],
|
|
current: 0
|
|
}
|
|
},
|
|
methods: {
|
|
change(index) {
|
|
this.current = index;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.points-store {
|
|
.bg {
|
|
height: 420rpx
|
|
}
|
|
|
|
.fraction {
|
|
font-size: 64rpx;
|
|
}
|
|
|
|
.list {
|
|
top: 186rpx;
|
|
border-top-left-radius: 24rpx;
|
|
border-top-right-radius: 24rpx;
|
|
}
|
|
|
|
.text-46 {
|
|
color: #464646;
|
|
}
|
|
|
|
.text-7c {
|
|
color: #7C7C7C;
|
|
}
|
|
}
|
|
</style> |