<template>
    <scroll-view refresher-enabled :refresher-triggered="isRefreshing" @refresherrefresh="onCustomRefresh"
        class="scroll-view-class" scroll-y>
        <view class="list-page">
            <view v-for="(item, index) in data" :key="index">
                    <ListItem :data="item" v-if="userType === 2"/>
                    <UserItem :data="item" v-else/>
                </view>
                <up-loadmore :line="true" status="nomore"></up-loadmore>
        </view>
    </scroll-view>
</template>

<script setup>
import ListItem from './listItem.vue';
import UserItem from './userItem.vue';
import { ref, defineExpose, defineProps, defineEmits } from 'vue';

const props = defineProps({
    data: {
        type: Array,
        default: [],
    },
    type: {
        type: String,
        default: 'ordinary', // ordinary: 普通 ranking: 排行
    }
});

const emit = defineEmits(['refresh']);
const userType = uni.getStorageSync('userType') //读取本地存储
const isRefreshing = ref(false)


const scrolltolower = () => {
    console.log('底部');
    // emit('refresh');
};

const onCustomRefresh = () => {
    console.log('下拉刷新');
    isRefreshing.value = true;
    emit('refresh');
};

const handleRefreshing = (status) => {
    isRefreshing.value = status;
}
defineExpose({
    handleRefreshing
});

</script>

<style lang="scss" scoped>
.list-page {

    background: rgba(245, 245, 245, 1);
    padding: 12px;
    // height: 100%;
    // overflow-y: auto;

    .item {
        height: 120px;
        border-radius: 10px;
        background: rgba(255, 255, 255, 1);
        padding: 12px;
    }
}

.scroll-view-class {
    height: 100%;
}
</style>