@{
    CurrentUser user = (CurrentUser)ViewBag.CurrentUser;
    string userName = user.UserName;
}<style>
    .alert-info {
        background-color: #d9edf7;
        border-color: #bce8f1;
        color: #31708f;
        line-height: 30px;
    }
    .alert-dismissable, .alert-dismissible {
        padding-right: 35px;
    }
    .alert {
        padding: 15px;
        padding-right: 15px;
        margin-bottom: 20px;
        border: 1px solid transparent;
        border-radius: 4px;
    }</style>
<div class="main" id="main">
    <div class="alert alert-info alert-dismissible">
        在输入框中输入用户名，点击按钮后进入用户中心！
    </div>
    <el-form ref="form" label-position="top">
        <el-form-item label="请填写用户*">
            <el-input v-model="username" v-validate="{data:username,dataType:'*',nullMsg:'请填写用户名!'}" maxlength="50">
                <el-button slot="append" type="primary" v-on:click="postSubmit">进入用户中心</el-button>
            </el-input>
            <span class="help-block validate-tips-box"></span>
        </el-form-item>
    </el-form>
    <a id="btnToMemberCenter" :href="goToMemberCenter" target="_blank"></a>
</div>

<script type="text/javascript">
    //vue实例化
    var vue = new Vue({
        el: "#main",
        data:
        {
            username: "@userName",
            uid:0,
        },
        computed:
        {
            goToMemberCenter: function ()
            {
                return "@Url.ActionUrl("RedirectToMemberCenter")?uid=" + this.uid;
            },
        },
        methods:{
            postSubmit: function () {
                var _this = this;
                var validated = this.validateForm({});//jquery表单验证
                if (validated) {
                    vue.ajax({
                        url: "@Url.ActionUrl("GetUid")",
                        data: {username: _this.username},
                        success: function (data) {
                            var uid = data.Uid;
                            if (uid == 0) {
                                _this.$notify.error({
                                    title: '错误',
                                    message: '用户名不存在！'
                                });
                            } else {
                                _this.uid = uid;
                                _this.$nextTick(function () {
                                    document.querySelector("#btnToMemberCenter").click();
                                })
                            }
                        }
                    });
                }
            }
        },
    });

</script>