@{
    Layout = "~/Areas/Member/Views/_LoginLayoutPage.cshtml";
    ViewBag.Title = "找回密码";
}
<div class="login-box find-pass-box clearfix" id="loginbox" v-cloak>
    <a class="login-logo" href="@ViewBag.HomeLink"><img src="/Areas/Member/Css/images/Loginlogo.png" /></a>
    <div class="login-sign">找回密码</div>
    <div id="regBox" v-if="Open==0">对不起，找回密码功能已关闭！</div>
    <el-form ref="form" label-position="top" v-if="Open==1">
        <!--解决浏览器自动填充账户-->
        <input type="text" style="position:fixed;bottom:-9999px" />
        <input type="password" style="position:fixed;bottom:-9999px" />
        <el-form-item label="账号*">
            <el-input v-model.trim="formData.Account" placeholder="用户名/绑定邮箱/绑定手机" v-validate="{data:formData.Account,dataType:'*',nullMsg:'请填写账号'}" maxlength="30"></el-input>
            <span class="help-block validate-tips-box">请填写要找回的用户名、或账号绑定的邮箱或手机</span>
        </el-form-item>
        @if (ViewBag.VerificationCode == 1)
        {
            <el-form-item label="验证码*">
                <el-input v-model.trim="formData.VerificationCode" ref="verificationCode" maxlength="4" placeholder="输入右侧的验证码" v-validate="{data:formData.VerificationCode,dataType:'*',minLength:4,minLengthErrorMsg:'验证码最少4个字符',nullMsg:'请填写验证码!'}">
                    <template slot="append">
                        <ui-verification-code-image ref="verificationCodeImage" src="/E/VerificationCode/?width=100&height=30"></ui-verification-code-image>
                    </template>
                </el-input>
                <span class="help-block validate-tips-box"></span>
            </el-form-item>
        }
        <el-form-item>
            <div class="controls button-spacing">
                <el-button type="primary" v-on:click="postSubmit">下一步</el-button>
            </div>
        </el-form-item>
    </el-form>

    <div  style="margin-top:15px;">
        没有账户？<a href="@Url.ActionUrl("Index","Reg")" class="text-primary">去注册</a>
    </div>
</div>
<script type="text/javascript">
    var formData = { Account: "", VerificationCode:""};
    //vue实例化
    var vue = new Vue({
        el: "#loginbox",
        data: {
            formData: formData,
            Open:@ViewBag.Open,
        },
        methods: {
            postSubmit: function () {
                var _this = this;
                var validated = this.validateForm({});//表单验证
                if (validated) {
                  this.submit({ url: "@Url.ActionUrl("Index")", data: formData, showFailMsg: false, showSuccessMsg: false, success: findSuccess, failCallback: findFail });
                }
            },
        },
    });
    function findSuccess(result)
    {
        location.href = "@Url.ActionUrl("Confirm")";
    }

    function findFail(data) {
        vue.$message.error(data.Msg);
        if (vue.$refs.verificationCodeImage != undefined) {
            vue.$refs.verificationCodeImage.change(); //修改验证码
        }
    }
    addEvent(window, 'keyup', function (event) {
        if (event.keyCode == 13) {
            vue.postSubmit();
        }
    });
</script>
