<!-- 编辑弹窗 -->
<template>
    <ele-modal form :width="1080" v-model="visible" title="售价日志">
        <ele-data-table
            ref="tableRef"
            style="width: 100%"
            :columns="columns"
            :data="dataList"
            :loading="loading"
            border
            rowKey="id"
            :pagination="false"
        />

        <template #footer>
            <el-button @click="handleCancel">关闭</el-button>
        </template>
    </ele-modal>
</template>

<script setup>
    import { ref, reactive, nextTick } from 'vue';
    import request from '@/utils/request';
    import { EleMessage } from 'ele-admin-plus/es';

    /** 弹窗是否打开 */
    const visible = defineModel({ type: Boolean });

    /** 加载状态 */
    const loading = ref(false);

    /** 表格数据 */
    const dataList = ref([]);

    /** 当前ISBN */
    const currentIsbn = ref('');

    /** 关闭弹窗 */
    const handleCancel = () => {
        visible.value = false;
        dataList.value = [];
        currentIsbn.value = '';
    };

    /** 弹窗打开事件 */
    const handleOpen = (row) => {
        if (row && row.isbn) {
            currentIsbn.value = row.isbn;
            visible.value = true;
            nextTick(() => {
                fetchPriceLog();
            });
        } else {
            EleMessage.warning('缺少ISBN信息');
        }
    };

    /** 获取售价日志数据 */
    const fetchPriceLog = async () => {
        if (!currentIsbn.value) return;

        loading.value = true;
        try {
            const res = await request.post(
                `/book/bookInfo/getProductPriceLog/${currentIsbn.value}`
            );
            if (res.data.code === 200) {
                dataList.value = res.data.data || [];
            } else {
                EleMessage.error(res.data.msg || '获取售价日志失败');
                dataList.value = [];
            }
        } catch (error) {
            console.error('获取售价日志失败:', error);
            EleMessage.error('获取售价日志失败');
            dataList.value = [];
        } finally {
            loading.value = false;
        }
    };

    // 表格列配置
    const columns = reactive([
        { label: 'ISBN', prop: 'bookIsbn', align: 'center' },
        { label: '操作人', prop: 'userName', align: 'center' },
        { label: '操作时间', prop: 'changeTime', align: 'center' },
        { label: '修改价格', prop: 'changeInfo', align: 'center' }
    ]);

    defineExpose({
        handleOpen
    });
</script>
