159 lines
3.1 KiB
Vue
159 lines
3.1 KiB
Vue
<script setup>
|
|
import {
|
|
ref,
|
|
reactive,
|
|
computed,
|
|
} from 'vue'
|
|
import {
|
|
onLoad,
|
|
onPullDownRefresh,
|
|
onReachBottom,
|
|
} from '@dcloudio/uni-app'
|
|
import api from '@/api/index.js';
|
|
// 工具库
|
|
import util from '@/common/js/util.js'
|
|
// 积分记录
|
|
import integralLog from '@/components/index/integralLog'
|
|
|
|
//我的卷轴列表
|
|
const detail = ref({})
|
|
//积分变动记录
|
|
const scrollLog = reactive({
|
|
data: [],
|
|
pageNum: 1,
|
|
pageSize: 30,
|
|
total: 0,
|
|
})
|
|
// 卷轴id
|
|
const id = ref('')
|
|
|
|
onLoad((option) => {
|
|
if (option.id) id.value = option.id
|
|
getDetail()
|
|
getLog()
|
|
})
|
|
|
|
onPullDownRefresh(() => {
|
|
// 刷新列表
|
|
refreshList()
|
|
})
|
|
|
|
onReachBottom(() => {
|
|
// 获取更多列表
|
|
getMoreList()
|
|
})
|
|
|
|
// 刷新列表
|
|
function refreshList() {
|
|
scrollLog.homePageSize = 1
|
|
getList()
|
|
}
|
|
|
|
// 获取更多列表
|
|
function getMoreList() {
|
|
if (scrollLog.total <= scrollLog.data.length) return
|
|
scrollLog.pageNum++
|
|
getList()
|
|
}
|
|
|
|
// 查看我购买的卷轴
|
|
function getDetail() {
|
|
api.intergral.scrollinfo({
|
|
path: [id.value]
|
|
}).then(rs => {
|
|
if (rs.code == 200) {
|
|
const result = rs.data
|
|
result.formatHash = result.scrollHash.replace(/(\d{4})\d*(\d{4})/, "$1****$2")
|
|
detail.value = result
|
|
return
|
|
}
|
|
})
|
|
}
|
|
|
|
// 积分变动明细
|
|
function getLog() {
|
|
api.intergral.getDetailInfoByScrollId({
|
|
path: [id.value],
|
|
query: {
|
|
pageNum: scrollLog.pageNum,
|
|
pageSize: scrollLog.pageSize,
|
|
}
|
|
}).then(rs => {
|
|
if (rs.code == 200) {
|
|
// 第一页
|
|
if (scrollLog.pageNum == 1) scrollLog.data.length = 0
|
|
// 合并
|
|
scrollLog.data.push(...rs.rows)
|
|
// 总数
|
|
scrollLog.total = rs.total
|
|
return
|
|
}
|
|
util.alert({
|
|
content: rs.msg,
|
|
showCancel: false,
|
|
})
|
|
})
|
|
}
|
|
|
|
// 复制
|
|
function handleCopy() {
|
|
// scrollHash
|
|
util.copyText(detail.value.scrollHash)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<view class="app">
|
|
<view class="board pr oh mtb30 mlr30 ptb20 plr20 cfff f30 br20">
|
|
<view class=" df">
|
|
<view class="left f1 mr40">
|
|
<view class="key mt20 f32">卷轴可释放</view>
|
|
<view class="value mt5 ptb5 tac bfff br20">{{detail.scrollRemainPoints}}</view>
|
|
</view>
|
|
|
|
<view class="right f1">
|
|
<view class="f36">{{detail.scrollName}}</view>
|
|
</view>
|
|
|
|
<image class="image pa" src="/static/integral.png" mode="aspectFit" />
|
|
</view>
|
|
|
|
<view class="mt20 df aic f28">
|
|
<view>卷轴哈希: {{detail.formatHash}}</view>
|
|
<view class="wh30 ml15" @click="handleCopy">
|
|
<image src="/static/copy2.png" mode="aspectFit" class="wh24" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="log mtb30 mlr30 ptb20 plr40 c666 f28 bFFFBF3 br20">
|
|
<view class="line rows">
|
|
<view class="title c333 f36">当前卷轴明细</view>
|
|
</view>
|
|
<integralLog :list="scrollLog.data" />
|
|
</view>
|
|
|
|
<!-- 填充 -->
|
|
<view class="fill" style="height: 30rpx;"></view>
|
|
</view>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
//
|
|
.board {
|
|
background-image: linear-gradient(121deg, #27EFE2 0%, #A45EFF 43%, #FF004F 99%);
|
|
|
|
.value {
|
|
color: #3D3D3D;
|
|
font-size: 40rpx;
|
|
}
|
|
|
|
.image {
|
|
right: 0rpx;
|
|
bottom: -50rpx;
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
transform: rotate(-5deg);
|
|
}
|
|
}
|
|
</style> |