<template>
    <div class="flex flex-col items-start text-sm">
        <div
            class="mb-1 font-medium text-blue-500 cursor-pointer hover:underline"
            @click="handleClickTitle"
        >
            {{ row.bookName || row.title }}
        </div>
        <div class="text-gray-600"> 作者：{{ row.author || '-' }} </div>
        <div class="text-gray-600"> ISBN：{{ row.isbn || '-' }} </div>
        <div class="text-gray-600">
            出版社：{{ row.publish || row.publisher || '-' }}
        </div>
    </div>
</template>

<script setup>
    const props = defineProps({
        row: {
            type: Object,
            default: () => ({})
        }
    });

    const emit = defineEmits(['click-title']);

    const handleClickTitle = () => {
        emit('click-title', props.row);
    };
</script>
