<template>
  <z-paging ref="paging" v-model="list" :safe-area-inset-bottom="true" @query="handleQuery">
    <view v-for="item in list" :key="item.id">
      <university-item :data="item" @click="handleClick(item)" />
    </view>
  </z-paging>
</template>
<script lang="ts" setup>
import { getUniversityByMajorCode } from '@/api/modules/major';
import UniversityItem from '@/pagesOther/components/university-item.vue';
import { Major } from '@/types';
import { useTransferPage } from '@/hooks/useTransferPage';

const { transferTo, routes } = useTransferPage();

const props = defineProps<{
  data: Major.MajorOverview;
}>();
const list = ref<Major.University[]>([]);
const paging = ref<ZPagingInstance>();

const handleQuery = (page: number, size: number) => {
  getUniversityByMajorCode({ code: props.data.code, pageNum: page, pageSize: size }).then(res => {
    paging.value?.completeByTotal(res.rows, res.total);
  }).catch(() => paging.value?.complete(false));
}

const handleClick = (item: Major.University) => {
  const { id, code, name } = item
  transferTo(routes.universityDetail, {
    data: { id, code, name }
  });
}
</script>
<style lang="scss" scoped></style>