App.vue 3.77 KB
<template>
  <div
    id="app"
    v-loading="$store.getters.loading.type"
    :element-loading-text="$store.getters.loading.text"
  >
    <router-view />
    <el-dialog
      class="logoutTip"
      :title="$t('system.tipTitle3')"
      :visible.sync="outerVisible"
      :show-close="false"
      :close-on-click-modal="false"
      width="420px"
      @close="close"
    >
      <div class="logoutTip-content" v-if="loginType">
        <i class="el-icon-warning" style="color: #e6a23c"></i
        >{{ $t("system.loginTimeOutTip1", { a: lastTime }) }}
      </div>
      <div class="logoutTip-content" v-else>
        <i class="el-icon-warning" style="color: #e6a23c"></i
        >{{ $t("system.loginTimeOutTip2") }}
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button
          class="entrySaveButton entrySaveButton-background"
          size="mini"
          :loading="closeLoading"
          @click="close"
          >{{ $t("system.confirm") }}</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { setTime, getTime, getToken, removeToken } from "@/utils/auth";
import { getTokenTime } from "@/api/system/user.js";
export default {
  name: "App",
  data() {
    return {
      logoutTip: false,
      outerVisible: false,
      lastTime: "",
      loginType: true,
      closeLoading: false,
      timeOption: {
        updateTime: 300000,
        dialogShowTime: 5,
        tokenTimeLength: 30,
      },
    };
  },
  created() {
    this.$store.dispatch("GetLink");
    localStorage.getItem("EcomLang")
      ? (this.$i18n.locale = localStorage.getItem("EcomLang"))
      : localStorage.setItem("EcomLang", this.$i18n.locale);
  },
  mounted() {
    // if (getToken()) {
    //   this.upDateTokenTime();
    // }

    // let upDateTime = setInterval(() => {
    //   if (getToken()) {
    //     this.upDateTokenTime();
    //   }
    // }, this.timeOption.updateTime);

    // let timeInterval = setInterval(() => {
    //   if (getTime() && getToken()) {
    //     let three = 1000 * 60 * this.timeOption.tokenTimeLength;
    //     let time = Number(Number(getTime()) + three);
    //     let min =
    //       new Date(time - new Date().getTime()).getMinutes() < 10
    //         ? "0" + new Date(time - new Date().getTime()).getMinutes()
    //         : new Date(time - new Date().getTime()).getMinutes();
    //     let sec =
    //       new Date(time - new Date().getTime()).getSeconds() < 10
    //         ? "0" + new Date(time - new Date().getTime()).getSeconds()
    //         : new Date(time - new Date().getTime()).getSeconds();
    //     this.lastTime = `${min}:${sec}`;
    //     if (
    //       time - new Date().getTime() <=
    //       1000 * 60 * this.timeOption.dialogShowTime
    //     ) {
    //       this.outerVisible = true;
    //     } else {
    //       this.outerVisible = false;
    //     }
    //     if (time - new Date().getTime() <= 1000) {
    //       clearInterval(timeInterval);
    //       removeToken();
    //       this.loginType = false;
    //     }
    //   }
    // }, 1000);
  },
  methods: {
    upDateTokenTime() {
      getTokenTime().then((res) => {
        if (res.code === "200") {
          res.data.extra.expiredTime &&
          res.data.extra.expiredTime != null &&
          res.data.extra.expiredTime != ""
            ? setTime(new Date(res.data.extra.expiredTime).getTime())
            : "";
        }
      });
    },
    close() {
      if (this.loginType) {
        this.closeLoading = true;
        this.$store.dispatch("GetInfo").finally(() => {
          this.outerVisible = false;
          this.closeLoading = false;
        });
      } else {
        this.$store.dispatch("FedLogOut");
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.logoutTip-content {
  font-size: 16px;
}
</style>