<!-- 编辑弹窗 -->
<template>
    <ele-modal
        form
        :width="1160"
        v-model="visible"
        title="导出记录"
        @open="handleOpen"
        :body-style="{ padding: '0 20px' }"
    >
        <common-table
            ref="pageRef"
            :pageConfig="pageConfig"
            :columns="columns"
            :tools="false"
        >
            <template #toolbar>
                <ProDatePicker
                    start-placeholder="申请时间（开始时间）"
                    end-placeholder="申请时间（结束时间）"
                    v-model="searchData"
                />
                <el-button type="primary" @click="reload" class="ml-4"
                    >查询</el-button
                >
                <el-button type="info" @click="handleReset">重置</el-button>
            </template>

            <template #action="{ row }">
                <el-button
                    type="primary"
                    link
                    :disabled="row.exportStatus != 3 || row.cleanStatus == 1"
                    :loading="row.loading"
                    @click="handleDownload(row)"
                    class="ml-4"
                    >[下载]</el-button
                >
                <el-button
                    type="danger"
                    link
                    @click="handleDelete(row)"
                    :disabled="row.exportStatus == 1"
                    >[删除]</el-button
                >
            </template>
        </common-table>
        <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 CommonTable from '@/components/CommonPage/CommonTable.vue';
    import ProDatePicker from '@/components/CommonPage/ProDatePicker.vue';
    import { download, toFormData, checkDownloadRes } from '@/utils/common';

    const searchData = ref({ createTimeStart: '', createTimeEnd: '' });

    const pageRef = ref(null);
    function reload() {
        pageRef.value?.reload(searchData.value);
    }
    function handleReset() {
        searchData.value.createTimeStart = '';
        searchData.value.createTimeEnd = '';
        reload();
    }

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

    /** 关闭弹窗 */
    const handleCancel = () => {
        visible.value = false;
    };

    /** 弹窗打开事件 */
    const handleOpen = () => {
        visible.value = true;
    };

    let statusKeys = ['', '处理中', '失败', '成功'];
    // cleanStatus 文件清理状态 0未清理 1已清理
    /** 表格列配置 */
    const columns = ref([
        { label: '申请时间', prop: 'createTime', align: 'center', width: 160 },
        { label: '导出名', prop: 'exportName', align: 'center' },
        { label: '条数', prop: 'dataCount', align: 'center', width: 90 },
        { label: '操作员', prop: 'createName', align: 'center', width: 120 },
        {
            label: '处理状态',
            prop: 'exportStatus',
            align: 'center',
            formatter: (row) => statusKeys[row.exportStatus],
            width: 90
        },
        {
            label: '上次下载时间',
            prop: 'downloadTime',
            align: 'center',
            width: 160
        },
        { label: '下载次数', prop: 'downloadNum', align: 'center', width: 90 },
        {
            columnKey: 'action',
            label: '操作',
            width: 180,
            align: 'center',
            slot: 'action'
        }
    ]);

    const pageConfig = reactive({
        pageUrl: '/common/exportrecord/pagelist',
        fileName: '操作记录',
        cacheKey: 'data-operation-log',
        params: { logType: 1 }
    });

    async function handleDownload(row) {
        row.loading = true;
        try {
            const res = await request({
                url: '/common/exportrecord/downLoadFile?id=' + row.id,
                method: 'get',
                responseType: 'blob'
            });
            await checkDownloadRes(res);
            download(res.data, row.fileName);
        } catch (e) {
            console.error(e);
        } finally {
            row.loading = false;
        }
    }

    //删除
    function handleDelete(row) {
        pageRef.value?.messageBoxConfirm({
            message: '确定删除吗？',
            fetch: () =>
                request.get('/common/exportrecord/deleteRecord?id=' + row.id)
        });
    }

    defineExpose({
        handleOpen
    });
</script>
