<template>
  <div id="app" :class="{'red-theme':isRed}">
    <keep-alive>
      <router-view v-if="$route.meta.keepAlive" />
    </keep-alive>
    <router-view v-if="!$route.meta.keepAlive" />
    <viewer :images="images" :options='imageOptions' @inited="inited" class="viewer" ref="viewer">
      <img v-for="src in images" :src="src" :key="src">
    </viewer>
    <chosen-open-mode v-if="haveOpenMode" :settingSys="settingSys"></chosen-open-mode>
    <!--  -->
    <div class="showMyCareer" v-if="showCareer">
      <mycareer :show-close="true" :uid="careerId" @close="closeCareer"></mycareer>
    </div>
  </div>
</template>


<script>
  var sUserAgent = navigator.userAgent;
  if (
    sUserAgent.indexOf("Android") > -1 ||
    sUserAgent.indexOf("iPhone") > -1 ||
    sUserAgent.indexOf("iPad") > -1 ||
    sUserAgent.indexOf("iPod") > -1 ||
    sUserAgent.indexOf("Symbian") > -1
  ) {
    // document.body.style.minWidth = '100%'
    // document.body.style.maxWidth = '100%'
    // document.body.style.overflow = 'hidden'
    // document.html.style.minWidth = '100%'
  } else {
    document.body.style.minWidth = "1366px";
    // document.html.style.minWidth = '1366px'
  }
  import chosenOpenMode from "./components/commonPage/chosenOpenMode";
  import mycareer from "./components/champion/mycareer";
  import {
    clearInterval
  } from "timers";
  export default {
    name: "App",
    components: {
      chosenOpenMode,
      mycareer
    },
    created() {
      //注册禁止后退，并且不做卸载
      // history.go(-1)
      // history.forward(-1)
      if (localStorage.openMode && localStorage.openMode == 1) {
        try {
          history.pushState(null, null, document.URL);
          window.addEventListener("popstate", function () {
            history.pushState(null, null, document.URL);
          });
        } catch (err) {}
      }
    },
    data() {
      return {
        images: [],
        imageOptions: {
          navbar: false,
          title: false
        },
        dataShow: false,
        haveOpenMode: false,
        settingSys: false,
        timer: null,
        useTime: 0,
        showCareer: false,
        careerId: 0,
        isRed: false
        // sessionStorage.getItem("mazip") ? sessionStorage.getItem("mazip") : true
      };
    },
    methods: {
      inited(viewer) {
        this.$viewer = viewer;
      },
      closeCareer() {
        this.showCareer = false;
      },
      show(data) {
        this.$set(this.images, data);
        this.$viewer.show();
      },
      listeneruser() {
        let that = this;
        window.onblur = function () {
          that.plaus();
          if (that.useTime) {
            let params = {
              CreateBy: that.getLocalStorage().EmployeeId,
              UsedTime: that.useTime
            };
            if (params.CreateBy && params.CreateBy > 0) {
              // that.apipost("user_set_user_usederplog", params, r => {
              //   if (r.data.resultCode == 1) {
              //     that.UsedTime = 0;
              //   }
              // });
            }
          }
        };
        window.onfocus = function () {
          that.timekeeper();
        };
      },
      timekeeper() {
        if (!this.timer) {
          this.timer = window.setInterval(() => {
            this.useTime += 0.1;
          }, 1000 * 6);
        }
      },
      plaus() {
        if (this.timer) {
          window.clearInterval(this.timer);
          this.timer = null;
        }
      }
    },
    mounted() {
      if (
        !this.getLocalStorage() &&
        document.URL.indexOf("SupplierLogin") == -1 &&
        document.URL.indexOf("clientConfirm") == -1 &&
        document.URL.indexOf("TravelContractConfirm") == -1 &&
        document.URL.indexOf("ViittoContractConfirm") == -1
      ) {
        this.$router.push({
          path: "/login"
        });
      } else {
        if (
          document.URL.indexOf("clientConfirm") != -1 ||
          document.URL.indexOf("TravelContractConfirm") != -1 ||
          document.URL.indexOf("ViittoContractConfirm") != -1
        ) {
          localStorage.openMode = 0;
        } else {}
        this.timekeeper();
        this.listeneruser();
      }

      this.haveOpenMode = !localStorage.openMode;
      this.MsgBus.$on("imgpreviewoverflow", content => {
        this.show(content);
      });
      this.MsgBus.$on("imgpreviewshow", content => {
        this.$viewer.show();
      });
      this.MsgBus.$on("imgpreviewshowindex", content => {
        this.$viewer.view(this.images.indexOf(content));
        this.$viewer.show();
      });
      this.MsgBus.$on("settingOpen", content => {
        this.haveOpenMode = true;
        this.settingSys = true;
      });
      this.MsgBus.$on("settingClose", content => {
        this.haveOpenMode = false;
        this.settingSys = false;
      });
      this.MsgBus.$on("imgprevpush", content => {
        let isExsit = false;
        this.images.forEach(x => {
          if (x == content) isExsit = true;
        });
        if (!isExsit) this.images.push(content);
      });
      this.MsgBus.$on("imgprevclear", content => {
        this.images = [];
      });
      this.MsgBus.$on("showCareer", empId => {
        this.careerId = empId;
        this.showCareer = true;
      });
      this.MsgBus.$on("hideCareer", content => {
        this.careerId = 0;
        this.showCareer = false;
      });
      this.MsgBus.$on("changeTheme", t => {
        this.isRed = t == 1;
      });
    }
  };
</script>
<style>
  @import "//at.alicdn.com/t/font_635492_wcd7pw1105.css";
  @import "./assets/css/Semibold.css";
  @import "./assets/css/global/config.css";
  @import "./assets/css/fileIcon.css";

  /* html,body{height: 100%; min-width: 1366px; } */
  html,
  body {
    margin: 0;
    padding: 0;
    background: #f9f9f9 url(assets/img/img-bg.png) no-repeat bottom left/100% auto;
    height: 100%;
  }

  #app {
    height: 100%;
  }

  #app>div {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .BMap_cpyCtrl {
    display: none;
  }

  .anchorBL {
    display: none;
  }

  .viewer {
    display: none !important;
  }

  .showMyCareer {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.3);
    align-items: center;
    justify-content: center;
    z-index: 999999999999999;
  }

  .red-theme {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
      Helvetica Neue, Arial, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol,
      Noto Color Emoji, MicrosoftJhengHeiBoldFix, "\5FAE\8EDF\6B63\9ED1\9AD4",
      Microsoft JhengHei;
  }
</style>