119 lines
3.0 KiB
Vue
119 lines
3.0 KiB
Vue
<!--
|
||
@name: index
|
||
@author: kahu4
|
||
@date: 2024-01-19 14:26
|
||
@description：index
|
||
@update: 2024-01-19 14:26
|
||
-->
|
||
<script setup>
|
||
import './index.scss'
|
||
import Header from '@/components/Header/index.vue'
|
||
import { useScroll } from "@/hooks/useScroll";
|
||
import { onLoad, onPageScroll } from "@dcloudio/uni-app";
|
||
import { accountIntegralBg, emptyOrderIcon } from "@/utils/images";
|
||
import { ref } from "vue";
|
||
import { pageIntegralBill } from "@/api/account/integral";
|
||
import { usePaging } from "@/hooks/usePaging";
|
||
import moment from "moment";
|
||
import Empty from '@/components/Empty/index.vue'
|
||
import { useMainStore } from "@/store/store";
|
||
import { storeToRefs } from "pinia";
|
||
|
||
const {scrollTop} = useScroll();
|
||
onPageScroll(() => {
|
||
})
|
||
|
||
const mainStore = useMainStore()
|
||
const {user} = storeToRefs(mainStore);
|
||
|
||
const filterTabs = [
|
||
{label: '全部', value: 99},
|
||
{label: '收入', value: 1},
|
||
{label: '支出', value: 0}
|
||
]
|
||
|
||
const tabCurrent = ref(99)
|
||
|
||
async function tabCurrentChange(item) {
|
||
tabCurrent.value = item.value
|
||
if (item.value === 99) {
|
||
delete otherParams.value.pm
|
||
} else {
|
||
otherParams.value.pm = item.value
|
||
}
|
||
await refreshPage()
|
||
}
|
||
|
||
// 账单列表
|
||
const {otherParams, list, loading, refreshPage} = usePaging({
|
||
request: pageIntegralBill,
|
||
load: false
|
||
})
|
||
|
||
onLoad(() => {
|
||
otherParams.value = {}
|
||
otherParams.value.category = "integral"
|
||
refreshPage()
|
||
})
|
||
|
||
</script>
|
||
|
||
<template>
|
||
<view>
|
||
<Header
|
||
:scroll-top="scrollTop"
|
||
system-bar-area-bg="#fff"
|
||
header-area-bg="#fff"> 我的积分
|
||
</Header>
|
||
<view class="integral">
|
||
<!-- 积分展示 -->
|
||
<view
|
||
class="num-card"
|
||
:style="{backgroundImage:`url(${accountIntegralBg})`}">
|
||
<view class="title">当前积分</view>
|
||
<view class="num"> {{ user.integral || '0.00' }}</view>
|
||
</view>
|
||
<!-- tabs -->
|
||
<view class="tabs-row flex flex-ai__center flex-jc__sb">
|
||
<view
|
||
class="tab-item"
|
||
:class="{current:tabCurrent === tab.value}"
|
||
v-for="tab in filterTabs"
|
||
:key="tab.value"
|
||
@click="tabCurrentChange(tab)">
|
||
{{ tab.label }}
|
||
</view>
|
||
</view>
|
||
<!-- list -->
|
||
<view class="integral-list">
|
||
<template v-if="list.length>0">
|
||
<view
|
||
class="row flex flex-jc__sb flex-ai__center"
|
||
v-for="item in list">
|
||
<view class="left">
|
||
<view class="name">{{ item.title }}</view>
|
||
<view class="time">{{ moment(item.createTime).format("YYYY-MM-DD HH:mm:ss") }}</view>
|
||
</view>
|
||
<view
|
||
class="right"
|
||
:class="{error:item.pm===0,success:item.pm===1}">
|
||
{{ item.pm === 0 ? '-' : '+' }}{{ item.number }}
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<template v-if="!loading && list.length===0">
|
||
<Empty
|
||
:icon-src="emptyOrderIcon"
|
||
padding="0 0" />
|
||
</template>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<style
|
||
scoped
|
||
lang="scss">
|
||
|
||
</style>
|