<template>
    <ele-modal
        :width="800"
        v-model="visible"
        title="短信记录"
        @open="handleOpen"
    >
        <common-table
            ref="tableRef"
            row-key="id"
            :columns="columns"
            :page-config="pageConfig"
            height="400px"
            :show-overflow-tooltip="true"
            :tools="false"
            :flex-table="false"
        />

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

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

    const emit = defineEmits(['success']);

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

    const pageConfig = reactive({
        pageUrl: '', // Will be set dynamically
        cacheKey: 'sms-log-table-refund',
        params: {}
    });

    // 表格列配置
    const columns = reactive([
        { label: '发送人', prop: 'createName', width: 100, align: 'center' },
        {
            label: '发送内容',
            prop: 'smsContent',
            align: 'center',
            minWidth: 200
        },
        { label: '发送时间', prop: 'createTime', width: 160, align: 'center' },
        {
            label: '发送状态',
            prop: 'status',
            width: 100,
            align: 'center',
            formatter: (row) => (row.status == 1 ? '成功' : '失败')
        }
    ]);

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

    /** 弹窗打开事件 */
    const handleOpen = (row) => {
        if (row && row.orderId) {
            currentOrderId.value = row.orderId;
            pageConfig.pageUrl = `/shop/shopOrderSmsLog/orderSmsLogList/${row.orderId}`;
        }
        visible.value = true;
        nextTick(() => {
            if (tableRef.value) {
                tableRef.value.reload({ page: 1 });
            }
        });
    };

    defineExpose({
        handleOpen
    });
</script>

<style scoped></style>
