<template>
  <window-size :show-back-nav="false">
    <div class="icon-wrapper">
      <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" class="icon-success">
        <path fill="currentColor" d="M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.272 38.272 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336L456.192 600.384z"></path>
      </svg>
      <div class="result_title">
        <p>{{params.title}}</p>
      </div>
      <div class="result_subtitle">
        <p>{{params.subtitle}}</p>
      </div>
    </div>
    <div class="button-wrapper">
      <div>
        <van-button square type="primary" icon="home-o" block @click="toHome">首页</van-button>
      </div>
      <div>
        <van-button square type="warning" icon="close" block @click="closePage">关闭</van-button>
      </div>
    </div>
  </window-size>
</template>

<script setup>
import {useRouter} from "vue-router";

const router = useRouter()
const params = router.currentRoute.value.params;

const toHome = () => {
  window.open('https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxbde6b16acad84204&redirect_uri=https://staticweb.hnthyy.cn/wxserver/redirect/page&response_type=code&scope=snsapi_base&state=1#wechat_redirect')
}

const closePage = () => {
  WeixinJSBridge.call('closeWindow')
}
</script>

<style scoped>
.icon-wrapper {
  width: 100%;
  text-align: center;
  margin-top: 80px;
}

.icon-success {
  color: #67c23a;
  width: 128px;
  height: 128px;
}
.result_title {
  margin-top: 20px;
}
.result_title > p {
  margin: 0;
  font-size: 20px;
  color: #303133;
  line-height: 1.3;
}
.result_subtitle {
  margin-top: 10px;
}
.result_subtitle > p {
  margin: 0;
  font-size: 14px;
  color: #606266;
  line-height: 1.3;
}
.button-wrapper {
  padding: 0 80px;
  margin-top: 40px;
  width: calc(100% - 160px);
  display: flex;
  flex-wrap: nowrap;
}
.button-wrapper > div {
  width: 50%;
  box-sizing: border-box;
}
</style>