<template>
    <div class="mt-4">
        <div v-if="posts.length === 0" class="text-center">
            게시물이 없습니다.
        </div>
        <div v-for="post in posts" :key="post.id" @click="handleClick(post.id)">
            <BoardCard
                :img="post.img"
                :category="post.category"
                :title="post.title"
                :content="post.content"
                :date="post.date"
                :views="post.views"
                :likes="post.likes"
                :comments="post.comments"
                :attachment="post.attachment"
                />
        </div>
    </div>
</template>

<script>
import BoardCard from './BoardCard.vue';

export default {
    components: {
        BoardCard,
    },
    props: {
        posts: {
            type: Array,
            required: true,
        },
    },
    emits: ['click'],
    methods: {
        handleClick(id) {
            this.$emit('click', id);
        },
    },
};
</script>

<style>
</style>
