<template>
  <div class="login">
    <div class="login-content">
      <div class="loginContent-left">
        <div class="logimg">
          <img src="http://xyqbui.lkbang.net/image/logo99.png" />
        </div>
      </div>
      <div class="loginContent-right">
        <div class="logo">
          <img src="http://xyqbui.lkbang.net/image/log.jpg" />
          <h3>登录</h3>
        </div>
        <div class="login_content">
          <Form ref="formInline" :model="formInline" :rules="ruleInline" style="height:161px">
            <FormItem prop="user" style="height:60px">
              <Input type="text" v-model="formInline.user" placeholder="请输入企业邮箱账号" class="wordStyle" size="large">
                <Icon type="ios-person-outline" slot="prepend"></Icon>
              </Input>
            </FormItem>
            <FormItem prop="password">
              <Input type="password" v-model="formInline.password" placeholder="请输入密码" class="wordStyle" @keyup.enter.native="login" size="large">
                <Icon type="ios-lock-outline" slot="prepend"></Icon>
              </Input>
              <span style="color:red;margin-top;5px" v-show="noteconTime == true">{{ notecontent }}</span>
            </FormItem>
          </Form>
          <Button type="primary" class="loginBtu" @click.prevent="login">登录</Button>
        </div>

        <div class="copy">
          <p>量化派为你提供全程服务</p>
          <p>量化派版权所有</p>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { login } from '../../api/login.server.js';
import localstorage from '../../service/localstorage.service.js';
export default {
  data() {
    return {
      channelarr: [],
      notecontent: '',
      noteconTime: false,
      ISIDMIN: '',
      formInline: {
        user: '',
        password: '',
      },
      ruleInline: {
        user: [
          {
            required: true,
            pattern: /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/,
            message: '请输入正确的邮箱账号',
            trigger: 'blur',
          },
        ],
        password: [
          { required: true, message: '请输入正确的密码', trigger: 'blur' },
          // { type: 'string', min: 4, message: '请输入正确的密码', trigger: 'blur' }
        ],
      },
    };
  },
  methods: {
    handleSubmit(name) {
      this.$refs[name].validate(valid => {
        if (valid) {
          this.$Message.success('Success!');
        } else {
          this.$Message.error('Fail!');
        }
      });
    },
    login() {
      const params = {
        userCode: this.formInline.user,
        password: this.formInline.password,
      };
      if (this.formInline.user == '' || this.formInline.password == '') {
        return;
      }
      login(params).then(res => {
        if (res.data.body.code == '100') {
          this.$router.push({
            name: 'update',
            params: { userCode: this.formInline.user },
          });
          return;
        }
        if (res.data.success == true) {
          this.ISIDMIN = res.data.body;
          localstorage.set('token', res.data.body.token);
          this.$router.push({ name: 'allResume' });
          localstorage.set('isADMIN', JSON.stringify(this.ISIDMIN));
          return;
        }
        if (res.data.success == false) {
          this.noteconTime = true;
          this.notecontent = res.data.body.message;
          setTimeout(() => {
            this.noteconTime = false;
          }, 3000);
        }
      });
    },
  },
};
</script>
<style scoped>
.login {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.login .login-content {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.loginContent-left {
  float: left;
  width: 70%;
  height: 100%;
}
.logimg {
  height: 100%;
  width: 100%;
}
.logimg img {
  width: 100%;
  height: 100%;
}
.loginBtu {
  width: 90%;
  height: 40px;
  font-size: 18px;
}
.loginContent-right {
  float: left;
  width: 30%;
  height: 100%;
  border: 1px solid GhostWhite;
}
.logo {
  width: 70%;
  height: 180px;
  margin-top: 160px;
  /* border: 1px solid black; */
  margin-left: 15%;
}
.logo img {
  width: 50%;
  height: 50%;
  /* margin-left: 30px */
}
.logo h3 {
  font-size: 30px;
  color: black;
  margin-top: 0px;
}
.login_content {
  height: 300px;
  width: 70%;
  /* border:1px solid black; */
  margin-left: 15%;
  margin-top: 0px;
}
.copy {
  width: 100%;
  height: 100px;
  margin-top: 80px;
  margin-left: 7%;
}
.copy p {
  font-size: 17px;
  color: #999;
}
.wordStyle {
  width: 90%;
  line-height: 50px;
  /* margin-left: 30px */
}
</style>
