THJ_Mobile/src/packages/mobile/views/credit/statement/index.vue

<template>
    <app-view class="logoff">
        <template #header>
            <app-navbar ref="navbarRef" title="积分流水" />
        </template>
        <app-pull-refresh v-model:dataList="tableList" v-model:loading="loading" :total="total" @refresh="onRefresh">
            <template #header>
                <Sticky :offset-top="50">
                    <ul class="tablelist">
                        <li class="tablelist-cell">时间</li>
                        <li class="tablelist-cell">操作类型</li>
                        <li class="tablelist-cell">金额</li>
                    </ul>
                </Sticky>
            </template>
            <template #default="{ item }">
                <ul class="tablelist">
                    <li class="tablelist-cell">{{ item.createtime }}</li>
                    <li class="tablelist-cell">{{ item.scoreconfigtype }}</li>
                    <li class="tablelist-cell">{{ item.score }}</li>
                </ul>
            </template>
        </app-pull-refresh>
    </app-view>
</template>

<script lang="ts" setup>
import { reactive } from 'vue'
import { Sticky } from 'vant'
import { useCreditList } from '@/business/credit'
import AppPullRefresh from '@mobile/components/base/pull-refresh/index.vue'

const { dataList, loading, total, getCreditList } = useCreditList()
const tableList = reactive<Model.UserScoreLogRsp[]>([])

const onRefresh = (resolve: (data: Model.UserScoreLogRsp[]) => void) => {
    getCreditList().then(() => {
        resolve(dataList.value)
    })
}
</script>

<style lang="less">
.tablelist {
    display: flex;

    &-cell {
        flex: 1;
        background-color: #fff;
    }
}
</style>