{% extends "./base.html" %}
{% block body%}

<div id="app">

    <el-row :gutter="10"  justify="center" align="middle">
        <el-col :span="12">
            <el-form :model="form" @submit.native.prevent>
                <el-form-item label="密码 " :label-width="formLabelWidth">
                    <el-input v-model="form.password" autocomplete="off" @keyup.enter.native="handleLogin" type="password"></el-input>
                </el-form-item>
            </el-form>
        </el-col>
        <el-col :span="12">
            <el-button @click="handleLogin">登录</el-button>
        </el-col>
    </el-row>

</div>
<script>
    new Vue({
        el: '#app',
        delimiters: ['{[', ']}']   , // 这句可以指定 {[ ]} 为插值表达式的新符号
        data() {
            return {
                formLabelWidth: '120px',
                form: {
                    password: ''
                }
            }
        },
        mounted() {
        },
        methods: {
            handleLogin() {
                const url = window.location.href

                axios.post(url, this.form).then(res=> {
                    if (res.data.code !== 200) {
                        return alert(res.data.msg)
                    }
                    location.reload();
                }).catch(err => {
                    console.log(err)
                    alert('服务器出现错误')
                })

            }
        }
    })
</script>


{% end %}
