<template>
    <div class="card flex flex-col items-center justify-center  text-center">
        <!-- 图片插画 -->
        <img src="@/assets/images/empty.svg" alt="空状态" class="w-64 h-64" />

        <!-- 提示文字 -->
        <h2 class="text-xl font-semibold text-gray-700 mb-2">
            没有查询到相关结果
        </h2>
        <p class="text-gray-500 text-sm mb-2 leading-relaxed">
            订单已申请退款，预计
            <span class="font-medium" style="color: var(--van-theme-primary);">24小时内到账</span>。
        </p>
        <p class="text-gray-400 text-xs">
            如果已到账，您可以忽略本提示。
        </p>

        <!-- 返回按钮 -->
        <button @click="goBack"
            class="mt-4 px-6 py-2 text-white rounded-lg transition duration-300 ease-in-out"
            style="background-color: var(--van-theme-primary);"
            onmouseover="this.style.backgroundColor='var(--van-theme-primary-dark)'"
            onmouseout="this.style.backgroundColor='var(--van-theme-primary)'">
            返回上一页
        </button>
    </div>
</template>

<script setup>
const route = useRoute();


// 返回上一页逻辑
function goBack() {
    route.goBack()
}
</script>

<style scoped>
/* 你可以添加一些额外的样式（如果需要） */
</style>