<template>
  <el-result class="mainPadding" :icon="query.type as IconType" :title="query.title as string">
    <template #sub-title>
      <p>{{ query.content }}</p>
    </template>
    <template #extra>
      <el-button v-if="query.mode === 'back'" type="primary" @click="onBack">返回</el-button>
      <el-button v-else type="primary" @click="onClose">关闭</el-button>
    </template>
  </el-result>
</template>

<script setup lang="ts">
import { toRefs } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import type { ResultProps } from 'element-plus'

type IconType = ResultProps['icon']

const route = useRoute()
const router = useRouter()
const { query } = toRefs(route)

function onBack() {
  router.replace({
    path: query.value.backUrl as string
  })
}

function onClose() {
  window.close()
}
</script>
