| | |
| | | <view :style="{ width: '100%', height: navHeight + statusbarHeight + 'px' }"></view> |
| | | <view class="head-bar" :style="{ height: navHeight + statusbarHeight + 'px' }"> |
| | | <view :style="{ width: '100%', height: statusbarHeight + 'px' }"></view> |
| | | <view class="head-bar-nav" :style="{ height: navHeight + 'px' }" @click="openLoacing"> |
| | | <image src="/static/icon/nav_ic_bac@2x.png" mode="widthFix"></image> |
| | | <view class="head-bar-nav" :style="{ height: navHeight + 'px' }"> |
| | | <image src="/static/icon/nav_ic_bac@2x.png" mode="widthFix" @click="fanhui"></image> |
| | | <text>我的积分</text> |
| | | <image src="/static/icon/nav_ic_bac@2x.png" mode="widthFix" style="opacity: 0;"></image> |
| | | </view> |
| | | </view> |
| | | <view class="info"> |
| | | <view class="info" v-if="info"> |
| | | <view class="info-a">当前积分</view> |
| | | <view class="info-b">120</view> |
| | | <view class="info-b">{{info.surplusIntegral}}</view> |
| | | <view class="info-c"> |
| | | <image src="/static/icon/ic_tixing@2x.png" mode="widthFix"></image> |
| | | <text>200积分即将过期</text> |
| | | <text>{{info.expiredIntegral}}积分即将过期</text> |
| | | </view> |
| | | <view class="info-d" @click="jump">积分规则</view> |
| | | </view> |
| | | <view class="list"> |
| | | <view class="list-title"> |
| | | <view class="list-title-name">积分明细</view> |
| | | <view class="list-title-cate"> |
| | | <view class="list-title-cate-row active">全部</view> |
| | | <view class="list-title-cate-row">获得</view> |
| | | <view class="list-title-cate-row">扣除</view> |
| | | <view :class="row.id === type ? 'list-title-cate-row active' : 'list-title-cate-row'" v-for="(row, index) in cate" :key="index" @click="sele(row.id)">{{row.name}}</view> |
| | | </view> |
| | | </view> |
| | | <view class="list-item"> |
| | | <view class="list-item" v-for="(item, index) in list" :key="item.id"> |
| | | <view class="list-item-left"> |
| | | <text>购买商品,获得100积分</text> |
| | | <text>2025-11-21 09:00:00</text> |
| | | <text>{{item.content}}</text> |
| | | <text>{{item.createDate}}</text> |
| | | </view> |
| | | <view class="list-item-num">+100</view> |
| | | <view class="list-item-num" v-if="item.type == 0">+{{item.num}}</view> |
| | | <view class="list-item-num" v-else-if="item.type == 1">-{{item.num}}</view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | info: null, |
| | | list: [], |
| | | page: 1, |
| | | next: true, |
| | | type: '', |
| | | cate: [ |
| | | { name: '全部', id: '' }, |
| | | { name: '收入', id: '0' }, |
| | | { name: '支出', id: '1' } |
| | | ], |
| | | backImage: require('@/static/images/jifen_bg@2x.png') |
| | | }; |
| | | }, |
| | | onLoad() { |
| | | this.getPoints() |
| | | this.getList() |
| | | }, |
| | | onReachBottom() { |
| | | this.getList() |
| | | }, |
| | | methods: { |
| | | fanhui() { |
| | | uni.navigateBack({ delta: 1 }); |
| | | }, |
| | | jump() { |
| | | uni.navigateTo({ |
| | | url: '/pagesA/pages/rich-text-page/rich-text-page?flag=' + 2 |
| | | }) |
| | | }, |
| | | sele(id) { |
| | | this.type = id |
| | | this.next = true |
| | | this.page = 1 |
| | | this.list = [] |
| | | this.getList() |
| | | }, |
| | | getPoints() { |
| | | this.$u.api.getUserIntegralData({}) |
| | | .then(res => { |
| | | if (res.code === 200) { |
| | | console.log(res) |
| | | this.info = res.data |
| | | } |
| | | }) |
| | | }, |
| | | getList() { |
| | | if (!this.next) return; |
| | | this.$u.api.findUserIntegralRecordPage({ |
| | | capacity: 10, |
| | | page: this.page, |
| | | model: { |
| | | type: this.type, |
| | | userType: 0 |
| | | } |
| | | }).then(res => { |
| | | if (res.code === 200) { |
| | | this.list.push(...res.data.records) |
| | | this.page++ |
| | | if (this.list.length === res.data.total) { |
| | | this.next = false |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | width: 100%; |
| | | padding: 30rpx 0; |
| | | box-sizing: border-box; |
| | | position: relative; |
| | | .info-a { |
| | | font-weight: 400; |
| | | font-size: 26rpx; |
| | |
| | | color: #777777; |
| | | } |
| | | } |
| | | .info-d { |
| | | position: absolute; |
| | | top: 30rpx; |
| | | right: -30rpx; |
| | | width: 140rpx; |
| | | height: 52rpx; |
| | | line-height: 52rpx; |
| | | text-align: center; |
| | | font-weight: 400; |
| | | font-size: 24rpx; |
| | | color: #333333; |
| | | background: #FFFFFF; |
| | | border-radius: 36rpx 0rpx 0rpx 36rpx; |
| | | } |
| | | } |
| | | |
| | | .head-bar { |