@model string
@{
    CurrentUser currentUser = ViewBag.CurrentUser;
    int xuhao = StringHelper.Format<int>(Request.QueryString["xuhao"]);
    if (xuhao <= 0)
    {
        xuhao = 1;
    }
    else
    {
        xuhao++;
    }
}
<link rel="stylesheet" href="~/Incs/font-awesome/css/font-awesome.min.css">
    <div class="main" id="main" v-cloak>
        <el-form label-width="120px" label-position="left">
            <el-form-item label="导航名称">
                <el-input placeholder="请填写名称" type="text" maxlength="25" v-model="Name" v-validate="{data:Name,dataType:'*',nullMsg:'请填写导航名称！'}"></el-input>
                <span class="help-block"></span>
            </el-form-item>

            <el-form-item label="导航图标">
                <icon-picker placeholder="请选择导航图标" v-model="Icon"></icon-picker>
                <span class="help-block">点击选择图标，留空则采用默认图标</span>
            </el-form-item>

            <el-form-item label="导航链接">
                <el-input placeholder="请填写名称" type="text" maxlength="150" v-model="Link" v-validate="{data:Link,dataType:'*',nullMsg:'请填写导航链接！'}"></el-input>
                <span class="help-block">链接地址可以通过浏览器复制粘贴，外部地址必须带上http://前缀</span>
            </el-form-item>


            <el-form-item label="目标窗口">
                <el-radio label="" v-model="Target">本窗口</el-radio>
                <el-radio label="_blank" v-model="Target">新窗口</el-radio>
                <span class="help-block"></span>
            </el-form-item>

            <el-form-item label="序号">
                <el-input-number :min="0" :max="999999"  placeholder="仅用于排序"  v-model="Xuhao" class="form-control form-control-xs ui-queryString"></el-input-number>
                <span class="help-block"></span>
            </el-form-item>
        </el-form>

        <div class="footer-submit-bar" style="padding-left:100px">
            <el-button type="primary" v-on:click="postSubmit">提交保存</el-button>
            <el-button onclick="closeSelf()">关闭</el-button>
        </div>
    </div>

    <script type="text/javascript">
    //绑定数据
    var id = "@Request.QueryString["id"]";
    var formData = @Html.RawModel(Model);
    if (id== "")
    {
        formData.Uid =@currentUser.Uid;
        formData.Xuhao = @xuhao;
        formData.Target = "";
        formData.State = 1;
    }
    var vue = new Vue({
        el: "#main",
        data: formData,
        methods: {
            formatLink: function (link)
            {
                link = link.trim();
                var newLink = link.toLowerCase();
                if (newLink.indexOf("https://") == 0 || newLink.indexOf("http://") == 0 || newLink.indexOf("ftp://") == 0)
                {

                }
                else if (newLink.indexOf("/") != 0)
                {
                    link = "/" + link;
                }
                return link;
            },
            postSubmit: function () {
                formData.Link = this.formatLink(formData.Link);
                var validated =this.validateForm({});//jquery表单验证
                if (validated) {
                    this.submit({ url: "@Url.ActionUrl()", data: formData,success: function () { callBack() } });
                }
            }
        },
    });
    function callBack()
    {
        parent.vue.loadMenu();
        closeSelf();
    }
    </script>
