<template>
    <z-paging ref="paging" v-model="list" @query="handleQuery">
        <view class="p-20 fx-col gap-20">
            <ai-list-item v-for="item in list" :item="item" @delete="handleDelete"/>
        </view>
    </z-paging>
</template>

<script>
import MxConst from "@/common/MxConst";
import {getVoluntaryList} from "@/api/webApi/ie-voluntary";
import {universityDetail} from "@/api/webApi/collegemajor";
import AiListItem from "@/pages/ie/entry-ai-list/components/ai-list-item.vue";
import {useCacheStore} from "@/hooks/useCacheStore";

export default {
    name: "ai-list",
    components: {AiListItem},
    data() {
        return {
            type: MxConst.enum.ai.voluntaryType.ai,
            list: []
        }
    },
    setup() {
        const {dispatchCache} = useCacheStore()

        return {
            dispatchCache
        }
    },
    methods: {
        _mock(rows) {
            rows.forEach(r => {
                r.details?.forEach(async u => {
                    // fill university info by need.
                    if (!u.university?.name && u.university?.code) {
                        const payload = {code: u.university.code}
                        const {data} = await this.dispatchCache(universityDetail, payload)
                        u.university = data.baseInfo
                    }
                })
            })
        },
        handleQuery(pageNum, pageSize) {
            const {type} = this
            getVoluntaryList({type, pageNum, pageSize}).then(res => {
                this._mock(res.rows)
                this.$refs.paging.completeByTotal(res.rows, res.total)
            }).catch(e => this.$refs.paging.complete(false))
        },
        handleDelete(item) {
            this.$refs.paging.reload()
        }
    }
}
</script>

<style scoped>

</style>