<template>
  <div class="bg">
    <div class="login_hd">
      <div class="login_hd_logo" :style="logoStyle">
        <!-- <div class="login_hd_logo_tip">登录</div>-->
      </div>
    </div>
    <div class="login_bd">
      <div class="login_bd_bg" :style="bgStyle"></div>
      <div class="login_form_box">
         <login-panel
            @loginSuccess="handleLoginSuccess"
          >
          </login-panel>
      </div>
     
    </div>
    <div class="login_ft">
      <div class="login_ft_main" id="login_copyright" v-html="config.copyright"></div>
    </div>
  </div>
</template>

<script>
import { projectName } from "../config";
import {
  getToken,
  setToken,
  removeToken,
  getUserId,
  setUserId,
  removeUserId,
} from "../utils/auth.js";
import {setUrlValue,getUrlValue} from "../utils/index.js";
import LoginPanel from "../components/LoginPanel.vue";
import _loginLogoImg from "../assets/Logo1.png"
import _loginBgImg from "../assets/background.png"

export default {
  name: "login",
  components: {
    LoginPanel
  },
  data() {
    return {
      config: {
        title: window.customSysCofig?.loginTitle||this.$t('hivuiLogin_main_def_title'),
        loginLogoImg: window.customSysCofig?.loginLogo||_loginLogoImg,
        loginLogoImg_height: window.customSysCofig?.loginLogo_h||56,
        loginLogoImg_width: window.customSysCofig?.loginLogo_w||206,
        loginBgImg: window.customSysCofig?.loginBgImg||_loginBgImg,
        copyright: window.customSysCofig?.copyright||this.$t('hivuiLogin_main_def_copyright'),
      },
    };
  },
  computed: {
    bgStyle() {
      return {
        "background-image": "url(" + this.config.loginBgImg + ")",
      };
    },
    logoStyle() {
      return {
        "background-image": "url(" + this.config.loginLogoImg + ")",
        height: this.config.loginLogoImg_height + "px",
        width: this.config.loginLogoImg_width + "px",
      };
    },
  },
  methods: {

    handleLoginSuccess(data) {
      this.goMainPage();
    },
    //跳转到主页
    goMainPage(){
      if(!window.HIVUI_SETTING.isSingleLogin&&location.hash.indexOf("eapReturnUrl=")!=-1){
        let __eapReturnUrl=decodeURIComponent(location.hash.split("eapReturnUrl=")[1]);
        let hasTokenParams=getUrlValue(__eapReturnUrl,"access_token");
        if(false&&!window._global&&hasTokenParams){//正式环境
          location=setUrlValue(__eapReturnUrl,"access_token",getToken());
        }else{
          location=__eapReturnUrl;
        }
      }else{
        location = window.HIVUI_SETTING.mainPageUrl
        ? window.HIVUI_SETTING.mainPageUrl
        : "/" + projectName + "/hivuiMain/index.html#/";
      }
    },
  }
};
</script>

<style lang="scss">
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
a {
  text-decoration: none;
}
ul,
li {
  list-style: none;
}
button {
  outline: none;
  border: none;
}
html,
body {
  height: 100%;
  width: 100%;
  background: #fff;
}
input,
body,
button {
  font-family: "Microsoft YaHei", proxima-nova, "Helvetica Neue", arial,
    helvetica, clean, sans-serif;
}
body {
  font-size: 14px;
  color: #333;
}
.bg {
  height: 100%;
  width: 100%;
  position: relative;
}
.login_hd,
.login_ft {
  height: 100px;
  width: 100%;
  position: fixed;
  z-index: 99;
  left: 0;
}
.login_hd_main,
.login_ft_main {
  width: 1000px;
  height: 100%;
  margin: 0 auto;
  a{
    color:#0f406c;
    margin-left:5px;
    &:hover{
      color:#409eff;
    }
  }
}
.login_hd {
  top: 0;
  .login_hd_logo {
    height: 60px;
    width: 265px;
    position: absolute;
    top: 50px;
    left: 50px;
    background: no-repeat;
    background-size: 100% 100%;
    img {
      height: 80px;
      width: 80px;
      margin-right: 90px;
      margin-top: 10px;
      float: right;
    }
    .login_hd_logo_tip {
      height: 32px;
      width: 84px;
      display: inline-block;
      padding: 0 20px;
      font-size: 22px;
      color: #fff;
      position: absolute;
      right: -104px;
      top: 0;
      bottom: 0;
      margin: auto;
      &:after {
        content: "";
        height: 20px;
        width: 2px;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0px;
        background-color: #8691a8;
        margin: auto;
      }
    }
  }
}
.login_bd {
  overflow: hidden;
  min-width: 1210px;
  position: relative;
  height: 100%;
  background-color: #fff;
  .login_bd_bg {
    background: no-repeat center center;
    background-size: 100%;
    position: absolute;
    height: 100%;
    width: 100%;
  }
}
.login_ft {
  bottom: 0;
  .login_ft_main {
    line-height: 60px;
    text-align: center;
    font-size: 14px;
  }
}
.login_form_box{
  width: 370px;
  height: 380px;
  margin: auto;
  position: absolute;
  top: 0;
  left: 40%;
  right: 0;
  bottom: 0;
  z-index: 100;
  background-color: #fff;
  padding: 18px 20px 0;
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.5);
}
</style>