<?php
/**
 * 管理员登录登陆
 * $RCSfile: login_form.inc,v $
 * @package template.manager
 */
$title = "管理员登陆";
?>
<!--<table class="msg_display">
<tr>
<td><b><?=$title ?>:</b><br />


请输入帐号登陆管理。<br />
<br />
</td>
</tr>
</table>

<form method="post" name="login_form" action="login.php">


<table class="login_display" align="center">
<!--
<tr>
<th colspan="2" class="contents_title">ログイン</th>
</th>
-->
<!--<tr>
<td align="right">帐号名</td>
<td><input type="text" name="login" value="" size="20" /></td>
</tr>
<tr>
<td align="right">密码</td>
<td><input type="password" name="password" value="" size="20" /></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" class="button_width_normal" value="登陆" /></td>
</tr>
</table>
</form>-->
<div id="app">
	<div style="width: 370px;margin: 10% auto 0;">
		<div style="width: 100%;text-align: center;font-size: 25px;margin-bottom: 20px;">管理系统</div>
	  	<div class="grid-content bg-purple">
		  	<el-form :model="ruleForm" status-icon ref="ruleForm" :rules="rules" label-width="100px" class="demo-ruleForm">
			  <el-form-item label="用户名" prop="login">
			    <el-input v-model.number="ruleForm.login"></el-input>
			  </el-form-item>
			  <el-form-item label="密码" prop="password">
			    <el-input type="password" v-model="ruleForm.password" autocomplete="off"></el-input>
			  </el-form-item>
			  <el-form-item>
			    <el-button type="primary" @click="submitForm('ruleForm')" style="margin-left: 87px;">登陆</el-button
			  </el-form-item>
			</el-form>
	  	</div>
	</div>
</div>
</body>
  <!-- import Vue before Element -->
  <script src="https://unpkg.com/vue/dist/vue.js"></script>
  <!-- import JavaScript -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
  <script>
    new Vue({
      el: '#app',
      data: function() {
      return {
        ruleForm: {
          password: '',
          login: ''
        },
        rules: {
          password: [
            { required: true, message: '请输入密码', trigger: 'blur' },
          ],
          login: [
            { required: true, message: '请输入用户名', trigger: 'blur' },
            { min: 1, message: '用户名不能为空', trigger: 'blur' }
          ]
        }
      };
    },
     methods: {
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
          	var login = this.ruleForm.login;
          	var password = this.ruleForm.password;
          	axios.get('./if/ajax_login.php', {
			    params:{
			    	login: login,
			    	password: password
			    }
			}).then(function (response) {
			    if(response.status==200){
			    	if(response.data.status=='OK'){
			    		window.location.href='./index.php'
			    	}
			    }
			}).catch(function (error) {
			    console.log(error);
			});
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      }
    }
    }
    )
  </script>

