<template>
  <div class="authen">
    <div></div>
    <span>认证中,请稍后...</span>
  </div>
</template>

<script>
import Vue from "vue";
import { getAuthen } from "../assets/util";
import querystring from "querystring";
import { mapMutations, mapActions } from "vuex";

export default Vue.extend({
  head() {
    return {
      title: "认证",
    };
  },
  data() {
    return {
      redirect: "",
    };
  },
  created() {
    if (!this.$route.query.state) {
      alert("此页面不支持直接访问");
      return;
    }
    const [url, str] = this.$route.query.state.split(".");
    this.redirect = url;
    /**
     * 这一段作用是直接微信接口跳转
     **/
    if (str !== undefined) {
      const search = querystring.parse(
        str.replace(/-/g, "&").replace(/_/g, "=")
      );
      if (!search.stationId) {
        alert("你没有传递站点参数");
        return;
      }
      this.setStationId(search.stationId);
      if (!!search.appId) {
        this.setAppId(search.appId);
        this.havingAuthen();
      } else {
        this.getAppId(search.stationId).then((res) => {
          this.setStationId(res.stationId);
          this.havingAuthen();
        });
      }
    } else {
      alert("你没有传递站点参数");
      return;
    }
  },
  methods: {
    handleGoto() {
      this.$router.replace({
        path: this.redirect,
      });
    },
    havingAuthen() {
      if (!this.$route.query.code) {
        getAuthen();
      } else {
        this.$store
          .dispatch("authen/login", this.$route.query.code)
          .then((res) => {
            this.handleGoto();
          })
          .catch((res) => {
            alert(res);
            getAuthen();
          });
      }
    },
    ...mapMutations({
      setStationId: "authen/setStationId",
      setAppId: "authen/setAppId",
    }),
    ...mapActions({
      getAppId: "authen/getAppId",
    }),
  },
});
</script>

<style>
.authen {
  width: 100vw;
  height: 100vh;
  position: relative;
}
.authen div {
  position: absolute;
  top: 2.38rem;
  left: 2.7rem;
  width: 1.82rem;
  height: 2.16rem;
  background: url("data:image/png;base64,[encoded data, 11052 characters]")
    no-repeat 0 0;
  background-size: 100% 100%;
}
.authen span {
  position: absolute;
  top: 5.22rem;
  width: 7.5rem;
  text-align: center;
  height: 0.56rem;
  font-size: 0.4rem;
  font-weight: 550;
  color: #000000;
  line-height: 0.56rem;
font-family: PingFangSC-Regular, PingFang SC;
}
</style>
