<div class="main" id="main" v-cloak>
    <el-form ref="form" label-width="150px" label-position="left" data-source="@Model" style="width:80%">
        <el-form-item label="选择用户" v-show="formData.Id<=0">
            <div>
                <ui-select-popup style="width:700px;" v-model="formData.Uids"  url="@Url.ActionUrl("PopupDataList","Member")"
                                 :multiple="true" btn-title="选择用户" title="选择用户" width="60%" height="80%"
                                 v-validate="{data:formData.Uids,ignore:formData.Id>0,dataType:'*',nullMsg:'请选择要设置为管理员的用户！'}"></ui-select-popup>
            </div>
            <span class="help-block validate-tips-box">选择要设置为管理员的用户,支持同时添加多个管理员</span>
        </el-form-item>
        <el-form-item label="管理用户" v-show="formData.Id>0">
            <div>
                <el-input v-model="formData.Username" style="width:700px;" disabled></el-input>
            </div>
            <span class="help-block validate-tips-box"></span>
        </el-form-item>

        <el-form-item label="管理员类型">
            <el-radio-group v-model="formData.IsSuperAdmin">
                <el-radio :label="1">超级管理员</el-radio>
                <el-radio :label="0">普通管理员</el-radio>
            </el-radio-group>
            <span class="help-block validate-tips-box">超级管理员具备所有权限，无需分配权限</span>
        </el-form-item>

        <el-form-item label="选择可管理的站点" v-show="formData.IsSuperAdmin==0">
            <ui-select v-model="formData.AdminSiteIds" :multiple="true" style="width:100%" v-bind:options="@Html.GetOptionsJson("pa_site","remark")"></ui-select>
            <span class="help-block validate-tips-box">不选择则默认无站管理权限</span>
        </el-form-item>

        <el-form-item label="选择可管理的用户组" v-show="formData.IsSuperAdmin==0">
            <ui-select v-model="formData.AdminMemberGroupIds" :multiple="true" style="width:100%" v-bind:options="memberGroupOptions"></ui-select>
            <span class="help-block validate-tips-box">不选择则默认无用户管理权限 </span>
        </el-form-item>

        <el-form-item label="管理员角色" v-show="formData.IsSuperAdmin==0">
            <ui-select v-model="formData.RoleIds" :multiple=true :clearable="true" style="width:100%" :options="roleOptions"  v-validate="{data:formData.RoleIds,ignore:formData.IsSuperAdmin==1,dataType:'*',nullMsg:'请选择管理员角色！'}"></ui-select>
            <span class="help-block validate-tips-box">可选择多个角色灵活的组合菜单权限 </span>
        </el-form-item>


        <el-form-item label="备注">
            <el-input v-model="formData.Remark"></el-input>
            <span class="help-block validate-tips-box"></span>
        </el-form-item>
        <el-form-item label="选择默认管理的站点" v-show="false">
            <ui-select v-model="formData.DefaultSiteId" style="width:80%" v-bind:options="@Html.GetOptionsJson("pa_site")" ></ui-select>
            <span class="help-block validate-tips-box">如果是非超级管理员，默认站点必须属于可管理的站点。</span>
        </el-form-item>
    </el-form>
    <div class="footer-submit-bar" style="padding-left:170px">
        <el-button type="primary" v-on:click="postSubmit">提交保存</el-button>
        <el-button v-on:click="closeDrawer()">关闭</el-button>
    </div>
</div>
<script type="text/javascript">
         //注册树组件
        var memberGroupOptions=@Html.RawModel(Html.GetOptionsJson("pa_member_group", "name", "", "Rank asc"));
        var roleOptions=@Html.RawModel(JsonHelper.JsonParse(Html.GetRoleList().Select(c => new { label = c.Name, value = c.Id, RoleType = c.RoleType })));
        var formData =@Html.RawModel((string)Model);
        formData.Uids = "";
        var id = request("id");
        if (id == "") {
            formData.IsSuperAdmin = 0;
        }
        memberGroupOptions.unshift({ value:0,label:"所有用户组(选择后其他用户组不用选择)"})
        //vue实例化
        var vue = new Vue({
        el: "#main",
        data: {
            formData: formData,
            memberGroupOptions: memberGroupOptions,
            roleOptions: roleOptions,
        },
        methods: {
            postSubmit: function () {
                var validated = this.validateForm({});//表单验证
                if (validated) {
                    if (formData.IsSuperAdmin == 1)
                    {
                        formData.RoleIds = "";
                        formData.AdminSiteIds = "";
                        formData.AdminMemberGroupIds = "";
                    }
                    else {

                    }
                    //构造方便模糊查询
                    if (formData.RoleIds!="") {
                        formData.RoleIds = "," + unique(formData.RoleIds) + ","; 
                    }
                    if (formData.AdminSiteIds!="") {
                        formData.AdminSiteIds = "," + unique(formData.AdminSiteIds) + ",";
                    }
                    if (formData.AdminMemberGroupIds!="") {
                        formData.AdminMemberGroupIds = "," + unique(formData.AdminMemberGroupIds) + ",";
                    }
                    this.submit({ url: "@Url.ActionUrl()", data: formData, success: "postBack()" });
                }
            }
        },
    });
    function postBack() {
        if (id == "") {
            location.href = location.href;
        }
        parent.loadData();
    }
</script>
