<template>
  <div class="app w-full h-full">
    <a-config-provider :locale="zh_CN">
      <router-view />
    </a-config-provider>
    <!-- 导出进度条 -->
    <div
      v-if="progressFile.show"
      class="export w-full h-full flex justify-center items-center fixed left-0 top-0 z-50"
    >
      <div class="w-[300px]">
        <a-progress :percent="progressFile.percent" status="active" />
      </div>
    </div>
  </div>
</template>

<script>
import Vue from "vue";
import zh_CN from "ant-design-vue/lib/locale-provider/zh_CN";
export default {
  data() {
    return {
      zh_CN,
      loadingProps: {
        spinning: false,
      },
      progressFile: {
        show: false,
        percent: 1,
      },
    };
  },
  beforeCreate() {
    Vue.prototype.$app = this;
  },
  created() {
    // this.readVueXData();
  },
  methods: {
    readVueXData() {
      window.addEventListener("beforeunload", () => {
        sessionStorage.setItem("store", JSON.stringify(this.$store.state));
      });
      if (sessionStorage.getItem("store")) {
        this.$store.replaceState(
          Object.assign(
            {},
            this.$store.state,
            JSON.parse(sessionStorage.getItem("store"))
          )
        );
        sessionStorage.removeItem("store");
      }
    },
  },
};
</script>

<style lang="less">
.export {
  background-color: rgba(0, 0, 0, 0.3);
}
.ant-calendar-prev-month-btn::before,
.ant-calendar-prev-year-btn::before,
.ant-calendar-prev-year-btn::after,
.ant-calendar-next-month-btn::before,
.ant-calendar-next-year-btn::before,
.ant-calendar-next-year-btn::after {
  border-color: rgba(0, 0, 0, 1) !important;
}
.ant-progress-text {
  color: #fff !important;
}
</style>