<template>
  <div id="app" :lang="lang">
    <v-header class="header"></v-header>
    <main ref="container" class="main-container" :class="{'main-container-min-height':!initCss}">
      <router-view />
    </main>
    <v-footer></v-footer>
    <vhis-modal></vhis-modal>
  </div>
</template>


<script>
import Vue from "vue";
import { mapGetters, mapActions, mapState } from "vuex";
import { getCookie } from "@utils/utils.js";
import VHeader from "@components/home/header/header.vue";
import VFooter from "@components/home/footer/footer.vue";
import VhisModal from "@components/vhis-modal/vhis-modal.vue";

import api from "@/api/api";
import { httpGet, httpPost } from "@/api/fetch-api.js";

var UA = require("ua-device");

export default {
  name: "app",
  components: {
    VHeader,
    VFooter,
    VhisModal
  },
  data() {
    return {
      lang: "zh",
      initCss: false
    };
  },
  computed: {
    ...mapState({
      isMobile: state => state.isMobile
    })
  },
  methods: {
    ...mapActions(["pcorphone"]),
    // 设置UA
    refreshUA() {
      let output = new UA(navigator.userAgent);
      let deviceType = output.device.type;
      let isMobile = deviceType == "mobile";
      this.$store.commit("IS_MOBILE", isMobile);
    },
    // 设置用户Profile
    refreshProfile() {
      let userInfoStr = decodeURIComponent(getCookie("_user_profile"));
      if (userInfoStr) {
        try {
          let userInfo = JSON.parse(decodeURIComponent(userInfoStr));
          this.$store.commit("SET_USER_INFO", userInfo);
          if (userInfo && userInfo.sid) {
            httpPost({ url: api.baseInfo, sidStr: userInfo.sid }).then(res => {
              if (res) {
                this.$store.commit("SET_USER_INFO", userInfo);
              } else {
                this.$store.commit("SET_USER_INFO", null);
              }
            });
          }
        } catch (e) {}
      }
    },
    initData() {
      this.lang = this.$i18n.locale == "en" ? "en" : "zh";
    }
  },
  created() {
    this.initData();
    this.refreshUA();
    this.refreshProfile();
    this.$root.eventBus.$on("langChange", () => {
      try {
        this.initData();
      } catch (e) {}
    });
  }
};
</script>

<style lang="scss" scoped>

</style>