<template>
    <el-form :model="userModel" :rules="rules" ref="ruleForm" label-position="left" label-width="0px" class="demo-ruleForm card-box loginform">
        <h3 class="title">系统登录</h3>
        <el-form-item prop="username">
            <el-input type="text" v-model="userModel.username" auto-complete="off" placeholder="账号"></el-input>
        </el-form-item>
        <el-form-item prop="password">
            <el-input type="password" v-model="userModel.password" auto-complete="off" placeholder="密码"></el-input>
        </el-form-item>
        <el-checkbox v-model="checked" checked style="margin:0px 0px 35px 0px;">记住密码</el-checkbox>
        <el-form-item style="width:100%;">
            <el-button type="primary" style="width:100%;" @click.native.prevent="login">登录</el-button>
        </el-form-item>
    </el-form>
</template>
<script>
    import {mapGetters, mapActions} from 'vuex'
    export default {
        data () {
            return {
                userModel: {
                    username: 'sys',
                    password: 'sk123654',
                    needMenu: true
                },
                rules: {
                    username: [
                        { required: true, message: '请输入账号', trigger: 'blur' },
                    ],
                    password: [
                        { required: true, message: '请输入密码', trigger: 'blur' },
                    ]
                },
                checked: true

            }
        },
        created: function () {

        },
        mounted: function () {

        },
        computed: {
            ...mapGetters(
                    [""])
        },
        methods: {
            ...mapActions(
                    ["loginUser"]),
            login(ev) {
                var _this=this;
                this.$refs.ruleForm.validate((valid) => {
                    if (valid) {
                        if(this.userModel.username==""||this.userModel.password=="")
                        {
                            this.$message("用户名或密码不能为空");
                            return;
                        }
                        this.loginUser (this.userModel).then((requestData) => {
                            if(requestData!=null&&requestData.code=="1") {
                                this.$message('账号或者密码错误!');
                            }
                            else {
                                this.$router.replace("/mainView")
                            }
                        });
                    } else {
                        this.$message('账号或者密码错误!');
                        return false;
                    }
                });
            },
        }
    }
</script>
<style>
</style>