<template>
    <div class="withdraw-order-list-page table_form-container">
        <!-- 搜索 -->
        <Search :search-form="searchForm" :search-options="searchOptions" :button-loading="loading"
            @search="handleSearch" @reset="handleReset" />

        <!-- 表格 -->
        <Table ref="tableRef" :table-data="tableData" :columns="tableColumnsOptions" row-key="id" :loading="loading"
            @rowClick="handleRowClick" />

        <!-- 分页 -->
        <Pagination v-model="queryParams.page" v-model:pageSizeValue="queryParams.page_size" :total="total"
            :layout="'prev, pager, next'" @pagination-change="getList" />
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import Search from '@/components/common/Search.vue'
import Table from '@/components/common/Table.vue'
import Pagination from '@/components/common/Pagination.vue'
import { usePageLoading } from '@/composables/useLoading'
import { tableColumns, searchOptions } from './options'
import { getLast7DaysRange } from '@/utils/timeUtils'
import { getWithdrawOrderList } from '@/api/modules/wallet/wallet'

defineOptions({
    name: 'WithdrawOrderList'
})

interface WithdrawOrderRow {
    id: number
    user_id: number
    order_n: string
    notify_n: string | null
    from: string
    to: string
    amount: string
    addressType: string | null
    balance: string | null
    status: number
    create_time: number
    success_time: number | null
    tx_id: string | null
    created_at: string
    updated_at: string
}

const tableRef = ref()
const tableData = ref<WithdrawOrderRow[]>([])
const { loading, startLoading, stopLoading } = usePageLoading()

// 分页参数
const queryParams = reactive({
    page: 1,
    page_size: 20,
})
const total = ref(0)

// 获取近七天时间范围（格式化字符串）
const getDefaultTimeRange = () => {
    const range = getLast7DaysRange()
    const formatDate = (d: Date): string => {
        const year = d.getFullYear()
        const month = String(d.getMonth() + 1).padStart(2, '0')
        const day = String(d.getDate()).padStart(2, '0')
        const hours = String(d.getHours()).padStart(2, '0')
        const minutes = String(d.getMinutes()).padStart(2, '0')
        const seconds = String(d.getSeconds()).padStart(2, '0')
        return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
    }
    return {
        start_time: formatDate(range.startTime),
        end_time: formatDate(range.endTime),
    }
}

// 搜索表单
const searchForm = ref({
    status: '',
    start_time: '',
    end_time: '',
})

// 表格列配置
const tableColumnsOptions = tableColumns

// 获取列表数据
const getList = async () => {
    startLoading()
    try {
        const res = await getWithdrawOrderList({
            status: searchForm.value.status || '',
            start_time: searchForm.value.start_time || '',
            end_time: searchForm.value.end_time || '',
            page: queryParams.page || 1,
            page_size: queryParams.page_size || 20,
        })
        if (res) {
            tableData.value = res?.data || []
            total.value = res?.total || 0
        }
    } catch (error) {
        console.error('获取列表失败', error)
    } finally {
        stopLoading()
    }
}

// 搜索
const handleSearch = () => {
    queryParams.page = 1
    getList()
}

// 重置
const handleReset = () => {
    const range = getDefaultTimeRange()
    searchForm.value = {
        status: '',
        start_time: range.start_time,
        end_time: range.end_time,
    }
    queryParams.page = 1
    getList()
}

// 行点击
const handleRowClick = (row: WithdrawOrderRow) => {
    console.log('选中行', row)
}

onMounted(() => {
    // 初始化默认时间范围
    const range = getDefaultTimeRange()
    searchForm.value.start_time = range.start_time
    searchForm.value.end_time = range.end_time
    getList()
})
</script>

<style scoped lang="scss">
.withdraw-order-list-page {}
</style>
