<!-- 操作日志弹窗 -->
<template>
    <ele-modal
        v-model="visible"
        title="操作日志"
        :width="1200"
        @open="handleDialogOpen"
    >
        <!-- 搜索栏 -->
        <operation-log-search ref="searchRef" @search="handleSearch" />

        <common-table
            ref="tableRef"
            :pageConfig="pageConfig"
            :columns="columns"
            :tools="false"
            :bodyStyle="{ padding: 0 }"
            height="50vh"
        >
            <template #actions="{ row }">
                <el-button
                    link
                    type="primary"
                    @click="handleDownloadSuccess(row)"
                    v-if="row.successNum > 0"
                    >下载成功数据</el-button
                >
                <el-button
                    link
                    type="danger"
                    @click="handleDownloadFail(row)"
                    v-if="row.failNum > 0"
                    >下载失败数据</el-button
                >
                <el-button
                    link
                    type="primary"
                    @click="handleDownloadSource(row)"
                    >下载源文件</el-button
                >
            </template>
        </common-table>

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

<script setup>
    import { ref, reactive, defineExpose, nextTick } from 'vue';
    import CommonTable from '@/components/CommonPage/CommonTable.vue';
    import OperationLogSearch from './operation-log-search.vue';
    import { ElMessage } from 'element-plus';

    defineOptions({ name: 'OperationLogModal' });

    // 弹窗可见性
    // const visible = defineModel({ type: Boolean });
    const visible = ref(false);

    // 搜索组件引用
    const searchRef = ref(null);

    // 表格组件实例
    const tableRef = ref(null);

    // 表格列配置
    const columns = ref([
        { label: '任务ID', prop: 'id', align: 'center', width: 100 },
        {
            label: '类型',
            prop: 'taskType',
            align: 'center',
            width: 100,
            formatter: (row) => {
                const map = { 1: '更新价格', 2: '上下架' };
                return map[row.taskType] || '未知';
            }
        },
        {
            label: '文件名称',
            prop: 'fileName',
            align: 'center',
            minWidth: 200,
            showOverflowTooltip: true
        },
        { label: '商品总数', prop: 'shopTotalNum', align: 'center' },
        { label: '成功数', prop: 'successNum', align: 'center' },
        { label: '失败数', prop: 'failNum', align: 'center' },
        {
            label: '状态',
            prop: 'taskStatus',
            align: 'center',
            formatter: (row) => {
                const map = { 0: '进行中', 1: '已完成', 2: '失败' };
                return map[row.taskStatus] || '未知';
            }
        },
        { label: '时间', prop: 'createTime', align: 'center', width: 160 },
        { label: '操作人', prop: 'createName', align: 'center' },
        {
            label: '操作',
            prop: 'actions',
            slot: 'actions',
            align: 'center',
            width: 150,
            fixed: 'right'
        }
    ]);

    // 页面配置
    const pageConfig = reactive({
        pageUrl: '/shop/shopbook/operationLog',
        fileName: '操作日志',
        cacheKey: 'operation-log-data',
        params: {}
    });

    // 移除 Mock 数据源，直接使用 CommonTable
    const mockDatasource = null;

    // 搜索
    function handleSearch(params) {
        tableRef.value?.reload(params);
    }

    // 弹窗打开处理函数
    function handleDialogOpen() {
        nextTick(() => {
            // 重置搜索表单，应使用默认参数触发搜索/重新加载
            if (searchRef.value) {
                searchRef.value.reset();
            } else {
                tableRef.value?.reload({});
            }
        });
    }

    function handleDownloadSuccess(row) {
        if (row.successField) {
            window.open(row.successField);
        } else {
            ElMessage.warning('无成功文件');
        }
    }

    function handleDownloadFail(row) {
        if (row.failField) {
            window.open(row.failField);
        } else {
            ElMessage.warning('无失败文件');
        }
    }

    function handleDownloadSource(row) {
        if (row.fileName) {
            window.open(row.fileName);
        } else {
            ElMessage.warning('无源文件');
        }
    }

    // 打开弹窗
    function open() {
        visible.value = true;
    }

    defineExpose({
        open
    });
</script>

<style scoped></style>
