<style lang="less">
@import "./login.less";
.login-left {
  width: 50%;
  height: 96%;
  margin-left: 5%;
}
.lofooter {
  height: 30%;
  padding-top: 2%;
}
</style>

<template>
  <div class="login">
    <login-header></login-header>
   <div class="login-body" :style="{backgroundImage:'url('+require('../../assets/images/bg.png')+')'}"  >
      <div class="login-left">
        <img src="../../assets/images/login-sure-bg.png" alt="" srcset="" style="width:100%;height:100%;">
      </div>
    <div class="login-con">
      <Card icon="log-in" :title='this.title' :bordered="false">
        <div class="form-con">
          <login-form @on-success-valid="handleSubmit" :showCode="showCode" ></login-form>
          <p class="login-tip">
            <div style="text-align:right;color:#57A3F3" v-show="this.$config.showSigerLogo">
              ———工业大数据智能分析领导者
              </div>
            <div style="text-align:right;font-size:18px;font-weight:600;color:#57A3F3" v-show="this.$config.showSigerLogo">
              SIGER DATA
              </div>
          </p>
        </div>
      </Card>
    </div>
    <!-- <login-footer class="lofooter"></login-footer> -->
    <div class="gongsidescribe" v-show="this.$config.showSigerLogo">
      Copyright © 2019 江苏西格数据科技有限公司 All rights reserved <a href="http://beian.miit.gov.cn" targert="blank">苏ICP备17026289号</a>
      <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=32059002003373">&nbsp;苏公网安备32059002003373号</a>
    </div>
   </div>
  </div>
</template>
<script>
import LoginForm from "_c/login-form";
import LoginHeader from "../../testvue/login-header";
import LoginFooter from "../../testvue/login-footer";
import { mapActions, mapMutations } from "vuex";
import { getsToken, login } from "../../api/user";
import { Promise } from "q";
import md5 from "js-md5";
import { initRouter } from "@/libs/router-util"; // ①新增  引入动态菜单渲染
export default {
  components: {
    LoginForm,
    LoginHeader,
    LoginFooter,
  },
  data() {
    return {
      title: this.$t("99200032"),
      showCode: false,
    };
  },
  methods: {
    ...mapActions([
      // 'handleLogin',
      "getUserInfo",
    ]),
    ...mapMutations([
      "setToken",
      "timestamp",
      "nonce",
      "sign",
      "changetimestamp",
      "changeLogin",
      "changenonce",
      "changesign",
    ]),
    handleSubmit({ userName, password }) {
      userName = userName.trim();
      Promise((resolve, reject) => {
        getsToken()
          .then((res) => {
            if (res.data.ret === 1) {
              const data = res.data.data;
              const timestamp = new Date().getTime();
              var nonce = "";
              for (let i = 0; i < 8; i++) {
                nonce += Math.floor(Math.random() * 10);
              }
              const sign = md5("timestamp=" + timestamp + "&nonce=" + nonce);
              this.setToken(data);
              this.timestamp(timestamp);
              this.nonce(nonce);
              this.sign(sign);
              this.changetimestamp({ timestamp: timestamp });
              this.changeLogin({ token: data });
              this.changenonce({ nonce: nonce });
              this.changesign({ sign: sign });
            } else {
              return false;
            }
          })
          .then((res) => {
            login({
              userName,
              password,
            }).then((res) => {
              if (res.data.ret === 1) {
                this.showCode = false;
                // initRouter() 解决清除缓存，第一次登陆不进去的问题 2020-12-11
                this.getUserInfo().then((res) => {
                  this.$router.push({
                    name: "home",
                  });
                });
              } else {
                this.showCode = true;
                this.$Message.error(this.$t(res.data.msg));
                return false;
              }
            });
          });
      });
    },
    warning(msg) {
      this.$Modal.warning({
        title: "提示",
        content: "<p>" + this.$t(msg) + "</p>",
      });
    },
  },
};
</script>
