<template>
  <div class="login-index">
    <div class="big-img">
      <img :src="bigImg" />
    </div>
    <div class="big-right">
      <div class="info-box">
        <router-view />
      </div>
    </div>
  </div>
</template>
<script>

export default {
  name: "loginIndex",
  data() {
    return {
      bigImg: window.localStorage.getItem('bk_pic')
    };
  },
  created() {
    let bk_pic =  window.localStorage.getItem('bk_pic');
    if(bk_pic){
      this.bigImg = bk_pic;
    }

    this.$emit("getStatus", false);
  },
};
</script>

<style scoped lang="scss">
.login-index {
  position: relative;
  min-width: 1104px;
  background: #f8f8f8;
  display: flex;
  flex-flow: row;
  .big-img{
    width: (500/1920*100%);
    min-width: 350px;
    /*height: 100%;*/
    img{
      width: 100%;
      /*height: 100%;*/
    }
  }
  .big-right{
    flex: 1;
    position: relative;
    .info-box{
      width: 520px;
      height: auto;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
  }
}
</style>
