<script setup>
// Copyright 2024 FlexCDN root@flexcdn.cn. All rights reserved. Official site: https://flexcdn.cn .

import ctxRef from "@/utils/ctx_ref.js"
import Context from "./index.js"
import Pager from "@/components/common/Pager.vue";
import MessageRow from "@/components/messages/MessageRow.vue";
import NotFoundInfo from "@/components/common/NotFoundInfo.vue";
import NavButtons from "@/components/common/NavButtons.vue";
import NavButton from "@/components/common/NavButton.vue";

const ctx = ctxRef(new Context())

</script>

<template>
	<NavButtons v-if="ctx.messages.length > 0">
		<NavButton @click.prevent="ctx.updatePageRead()">当前页已读</NavButton>
		<NavButton @click.prevent="ctx.updateAllRead()">全部已读</NavButton>
	</NavButtons>

	<NotFoundInfo v-if="ctx.messages.length == 0">暂时还没有消息。</NotFoundInfo>

	<MessageRow v-for="message in ctx.messages" :v-message="message" :key="message.id"></MessageRow>

	<Pager :data="ctx.page"></Pager>
</template>

<style lang="postcss" scoped>
</style>