web-africa-pc/src/App.vue

<!--
 * @Descripttion:
 * @version:
 * @Author: kBank
 * @Date: 2022-09-28 15:22:34
-->
<template>
  <div id="app" v-if="!loading">
    <div v-if="$route.meta.keepAlive">
      <HeaderTop></HeaderTop>
      <router-view></router-view>
    </div>
    <div v-if="!$route.meta.keepAlive"><router-view></router-view></div>
  </div>
</template>
<script>
import HeaderTop from "@/components/HeaderTop";
import enLocale from "element-ui/lib/locale/lang/en";
import zhLocale from "element-ui/lib/locale/lang/zh-CN";
import ruLocale from "element-ui/lib/locale/lang/ru-RU";
import frLocale from "element-ui/lib/locale/lang/fr";
import ptLocale from "element-ui/lib/locale/lang/pt";
import { env } from "echarts";
export default {
  components: {
    HeaderTop,
  },
  data() {
    return {
      loading: true,
      time: 0,
    };
  },
  created() {
    let self = this;
    self.loading = false;
    self.addScriptChild("zh-CN");
    self.addScriptChild("en-US");
    self.addScriptChild("ru-RU");
    self.addScriptChild("fr-FR");
    if (process.env.NODE_ENV != "production") {
      // self.addScriptChild("fr-FR");
      // self.addScriptChild("pt-PT");
    }
  },
  methods: {
    addScriptChild2(name) {
      let self = this;
      const s = document.createElement("script");
      s.type = "text/javascript";
      let base_url = process.env.VUE_APP_BASE_INTERAPI2;
      s.src = base_url + "/" + name + ".js";
      s.ref = "local1";
      document.body.appendChild(s);

      if (window.ActiveXObject || "ActiveXObject" in window) {
        //判断是否是ie
        if (s.readyState) {
          //判断是否支持readyState
          s.onreadystatechange = function () {
            if (this.readyState == "loaded" || this.readyState == "complete") {
              self.readyAdd(name);
              console.log("ie10及以下加载完成");
            }
          };
        } else {
          s.onload = function () {
            self.readyAdd(name);
            console.log("ie11及Edge加载完成");
          };
        }
      } else {
        //不是ie
        s.onload = function () {
          self.readyAdd(name);
          console.log("非ie浏览器第二地址加载完成:" + name);
        };
        s.onerror = function () {
          console.log("非ie浏览器加载第二地址失败:" + name);
        };
      }
    },
    addScriptChild(name) {
      let self = this;
      const s = document.createElement("script");
      s.type = "text/javascript";
      let base_url = process.env.VUE_APP_BASE_INTERAPI;
      s.src = base_url + "/" + name + ".js";
      s.ref = "local1";
      document.body.appendChild(s);

      if (window.ActiveXObject || "ActiveXObject" in window) {
        //判断是否是ie
        if (s.readyState) {
          //判断是否支持readyState
          s.onreadystatechange = function () {
            if (this.readyState == "loaded" || this.readyState == "complete") {
              self.readyAdd(name);
              console.log("ie10及以下加载完成");
            }
          };
        } else {
          s.onload = function () {
            self.readyAdd(name);
            console.log("ie11及Edge加载完成");
          };
          s.onerror = function () {
            console.log("ie11及Edge加载失败:" + name);
            self.addScriptChild2(name);
          };
        }
      } else {
        //不是ie
        s.onload = function () {
          self.readyAdd(name);
          console.log("非ie浏览器加载完成");
        };
        s.onerror = function () {
          console.log("非ie浏览器加载失败:" + name);
          self.addScriptChild2(name);
        };
      }
    },
    getJS(res, name) {
      const funcStr =
        "function test(value){" + res.data + ";return " + name + "}";
      const test = eval("(false || " + funcStr + ")");
      return test();
    },
    readyAdd(name) {
      if (name == "zh-CN") {
        if (zhCN) {
          const localzhCN = this.getJS(zhCN, "zhCN");
          var STlocalzhCN = JSON.stringify(localzhCN);
          localStorage.setItem("local-zhCN", STlocalzhCN);
        }
        this.$i18n.mergeLocaleMessage(name, {
          ...zhCN,
          ...zhLocale,
        });
      }
      if (name == "en-US") {
        if (enUS) {
          const localEnUS = this.getJS(enUS, "enUS");
          var STlocalEnUS = JSON.stringify(localEnUS);
          localStorage.setItem("local-enUS", STlocalEnUS);
        }
        this.$i18n.mergeLocaleMessage(name, {
          ...enUS,
          ...enLocale,
        });
      }
      if (name == "ru-RU") {
        if (ruRU) {
          const localruRU = this.getJS(ruRU, "ruRU");
          var STlocalruRU = JSON.stringify(localruRU);
          localStorage.setItem("local-ruRU", STlocalruRU);
        }
        this.$i18n.mergeLocaleMessage(name, ruRU);
      }
      if (name == "fr-FR") {
        if (frFR) {
          const localfrFR = this.getJS(frFR, "frFR");
          var STlocalfrFR = JSON.stringify(localfrFR);
          localStorage.setItem("local-frFR", STlocalfrFR);
        }
        this.$i18n.mergeLocaleMessage(name, frFR);
      }
      if (name == "pt-PT") {
        if (ptPT) {
          const localptPT = this.getJS(ptPT, "ptPT");
          var STlocalptPT = JSON.stringify(localptPT);
          localStorage.setItem("local-ptPT", STlocalptPT);
        }
        this.$i18n.mergeLocaleMessage(name, ptPT);
      }
      document.title = this.$t("HTML_TITL");
    },
  },
};
</script>
<style lang="scss">
html {
  width: 100%;
  height: 100%;
}

body {
  margin: 0;
  width: 100%;
  height: 100%;
  background: #f9f9f9;
}

#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  // text-align: center;
  color: #2c3e50;
  width: 100%;
  height: 100%;
}

.el-radio__input.is-checked + .el-radio__label {
  color: #d61820 !important;
}

.el-radio__input.is-checked .el-radio__inner {
  background: #d61820 !important;
  border-color: #d61820 !important;
}

// 定义滚动条高宽及背景高宽分别对应横竖滚动条的尺寸
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  // height: 250px;
}

/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track {
  border-radius: 5px;
  // background: rgba(216, 216, 216, 1);
  background: #f2f2f2;
}

/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background: #c8161d;
}
#app .el-input.is-disabled .el-input__inner {
  color: #606266;
}
</style>