<template>
    <div v-loading="loading">
        <div v-show="isShow">
            <el-image :src="require('../assets/bg_main_new.jpg')"/>

            <div class="login_title">民政信息采集系统</div>

            <el-form :rules="rules" ref="loginForm" :model="formData" class="login_form">
                <el-form-item prop="name">
                    <el-input
                            v-model="formData.name"
                            autocomplete="off"
                            prefix-icon="el-icon-user"
                            placeholder="请输入账号"
                            clearable
                    ></el-input>
                </el-form-item>
                <el-form-item prop="pwd">
                    <el-input
                            v-model="formData.pwd"
                            autocomplete="off"
                            type="password"
                            show-password
                            clearable
                            prefix-icon="el-icon-lock"
                            placeholder="请输入密码"
                    ></el-input>
                </el-form-item>
            </el-form>

            <div class="login_bottom">
                <el-button type="primary" @click="login" class="login_bottom_button">登录并绑定微信号</el-button>
            </div>
        </div>
    </div>
</template>

<script>
    import {checkOpenId, userLogin} from "../api";
    import openId from "../util/getOpenId";

    export default {
        name: "Login",
        data() {
            return {
                loading: false,
                isShow: true,
                formData: {
                    openid: "",
                    name: "",
                    pwd: ""
                },
                rules: {
                    //数据校验规则
                    name: [{required: true, message: "请输入账号", trigger: "blur"}],
                    pwd: [{required: true, message: "请输入密码", trigger: "blur"}]
                }
            };
        },
        methods: {
            async check(openid) {
                this.loading = true;
                let result = await checkOpenId({openId: openid}, "GET");
                this.loading = false;
                if (result.code === 0) {
                    if (result.data && result.data.loginPwd === this.$md5("123456")) {
                        const h = this.$createElement;
                        this.$notify({
                            title: "提示",
                            message: h(
                                "b",
                                "当前密码为初始密码,为了信息采集的安全，请尽快修改密码!"
                            ),
                            type: "warning",
                            duration: 0
                        });
                      this.$router.replace("/my/ChangePwdByLogin");
                    }else{
                      this.$router.replace("/main");
                    }
                } else {
                    this.isShow = true;
                }
            },
            login() {
                this.$refs["loginForm"].validate(v => {
                    if (v) {
                        this.requestLogin();
                    }
                });
            },
            async requestLogin() {
                this.loading = true;
                let result = await userLogin({
                    name: this.formData.name,
                    pwd: this.$md5(this.formData.pwd)
                });
                this.loading = false;

                if (result.code === 0) {
                    this.$message.success("登陆成功");

                    if (this.formData.pwd === "123456") {
                        const h = this.$createElement;
                        this.$notify({
                            title: "提示",
                            message: h(
                                "b",
                                "当前密码为初始密码,为了信息采集的安全，请尽快修改密码!"
                            ),
                            type: "warning",
                            duration: 0
                        });
                    }
                    this.$router.replace("/main");
                }
            }
        },
        mounted() {
            openId.getOpenId(() => {
                this.formData.openid = window.localStorage.getItem('openId');
                this.check(this.formData.openid);
            });
          // window.localStorage.setItem("openId", "oQDnHw8adY-9vaWi7LDxpOPBPzOE"); // sks
          // window.localStorage.setItem("openId", "o6k9xwtRP94yJM3OwxMMoD7dRexo"); // 陈航
            openId.getOpenId(() => {
              this.formData.openid = window.localStorage.getItem("openId");
              this.check(this.formData.openid);
            });
        }
    };
</script>


<style scoped>
    .login_title {
        text-align: center;
        font-size: 18px;
        margin-top: 5vh;
    }

    .login_form {
        margin-left: 10%;
        margin-right: 10%;
        margin-top: 10%;
    }

    .login_bottom {
        margin-top: 50px;
        margin-left: 10%;
        margin-right: 10%;
    }

    .login_bottom_button {
        width: 100%;
    }
</style>
