<template>
    <ie-page>
        <z-paging ref="paging" v-model="list" bg-color="#F6F8FA" safe-area-inset-bottom :scrollable="!isSorting"
                  :refresher-enabled="!isSorting" @query="handleQuery">
            <template #top>
                <ie-navbar title="志愿表"/>
            </template>
            <view class="mt-20 bg-warning-light p-28 text-23 leading-38 text-fore-title">
                <text class="font-bold">说明：</text>
                目前志愿计划为2025年，排序前两个为第一、二志愿，可通过修改排序重新选择第一、二志愿
            </view>
            <view class="p-28 flex flex-col gap-28">
                <voluntary-item v-for="(item,i) in list" :key="i" :data="item" :index="i"/>
            </view>
        </z-paging>
    </ie-page>
</template>

<script setup lang="ts">
import {VoluntaryRecord} from "@/types/voluntary";
import VoluntaryItem from "@/pagesOther/pages/voluntary/list/components/voluntary-item.vue";
import {ApiResponseList} from "@/types";
import {VOLUNTARY_SORTING} from "@/types/injectionSymbols";
import {getVoluntaryList} from "@/api/modules/voluntary";

const list = ref<VoluntaryRecord[]>([])
const paging = ref<ZPagingInstance>()
const isSorting = ref<boolean>(false)

const handleQuery = () => {
    getVoluntaryList().then(res => {
        paging.value?.completeByNoMore(res.data, true)
    }).catch(e => paging.value?.completeByError(e))
}

provide(VOLUNTARY_SORTING, isSorting)
</script>

<style lang="scss">

</style>
