<template>
    <z-paging
        auto-show-back-to-top
        :auto="i === index"
        ref="paging"
        v-model="dataList"
        :data-key="i"
        @query="queryList"
        :fixed="false"
        height="100%"
    >
        <block v-for="(item2, index) in dataList" :key="index">
            <already
                :comment="item2.comment"
                :goods_comment_image="item2.commentUrlList"
                :reply="item2.reply"
                :create_time="item2.createTime"
                :goods_id="item2.goodsId"
                :service_comment="item2.serviceComment"
                :goods_image="item2.goodsImageUrl"
                :goods_name="item2.goodsName"
                :goods_price="item2.price"
                :unit_name="item2.unitName"
            ></already>
        </block>
    </z-paging>
</template>

<script lang="ts" setup>
import { ref, watch, nextTick, shallowRef, unref } from 'vue'
import Already from './already.vue'
import { apiEvaluateGoodsLists } from '@/api/goods'
import { useUserStore } from '@/stores/user'
import { storeToRefs } from 'pinia'

const userStore = useUserStore()
const { userInfo } = storeToRefs(userStore)
const props = withDefaults(
    defineProps<{
        type: number
        count: number
        i: number
        index: number
    }>(),
    {
        type: 0,
        count: 0
    }
)

const paging = shallowRef<any>(null)
const dataList = ref<any>([])
const isFirst = ref<boolean>(true)

watch(
    () => props.index,
    async () => {
        await nextTick()
        if (props.i == props.index && unref(isFirst)) {
            isFirst.value = false
            paging.value?.reload()
        }
    },
    { immediate: true }
)

const queryList = async (pageNo: number, pageSize: number) => {
    try {
        const { lists } = await apiEvaluateGoodsLists({
            userId: userInfo.value.id,
            pageNo,
            pageSize
        })

        paging.value.complete(lists)
        console.log('lists', lists)
    } catch (e) {
        console.log('报错=>', e)
        //TODO handle the exception
        paging.value.complete(false)
    }
}
</script>
