We_Relese/App/Relese/Views/BaseSystem/SysTenants.cshtml

@using WeApp
@using WeApp.Authorization
@using WeApp.Configuration
@using WeApp.Views.Shared.Modals
@using WeApp.Views.Shared.SearchForm
@using WeApp.Views.Shared.Table
@{
    string activeMenu = PermissionNames.PagesSystemMgTenantMg; //The menu item will be active for this page.
    ViewBag.ActiveMenu = activeMenu;
    ViewBag.Title = L("TenantTitle");
    List<SelectListItem> activeType = ViewBag.IsActive;
    var searchItem = new List<SearchItem>()
    {
        new SearchItem("tenancyName", L("tenancyName")),
        new SearchItem("name", L("tenantName")),
        new SearchItem("isActive", L("activeState"), FieldType.B, ExpType.Equal).SetSelectItem(activeType,true),
    };
   
    var searchForm = new SearchFormViewModel(searchItem);
    var table = new TableViewModel(IwbConsts.ApiAppUrl + "Tenants/GetAll", activeMenu, searchForm).SetFields(new List<FieldItem>()
    {
        new FieldItem("tenancyName", L("tenancyName")),
        new FieldItem("name", L("tenantName")),
        new FieldItem("isActive", L("activeState"), "ActiveStateFormatter"),

    });
}
@section styles{ 
    <link href="~/Content/Libs/jstree/themes/default/style.min.css" rel="stylesheet" />
}
@Html.Partial("Table/_Table", table)

@section modal{
    @{
        var inputs = new List<Input>()
        {
           
            new InputHide("id"),
            new Input("tenancyName", L("tenancyName")),
            new Input("name", L("tenantName")),
            new Input("adminEmailAddress", L("adminEmailAddress")),
            new Input("isActive", L("activeState")).SetSelectOptions(activeType)
        };
       
        var modal = new ModalViewModel(L("tenant"), new ModalBodyViewModel(inputs));
    }
    @Html.Partial("Modals/_Modal", modal)
    <section>
        <!--Auth Modal -->
        <div class="modal fade" id="auth_Modal" role="dialog" aria-labelledby="ModalLabel_AUTH" aria-hidden="true">
            <div class="modal-dialog" role="document" style="min-height: 700px; width: 500px;">
                <div class="modal-content" style="">
                    @Html.Partial("Modals/_ModalHeader", new ModalHeaderViewModel(L("userAuthSetting"), ""))
                    <form>
                        <div class="modal-body" style=" padding: 10px 30px;">
                            <div class="" id="auth-tree"></div>
                        </div>
                    </form>
                    @Html.Partial("Modals/_ModalFooter", "0")

                </div>
            </div>
        </div>
    </section>
}

@section scripts
{
    <script src="~/Content/Libs/jstree/jstree.min.js"></script>
    <script type="text/javascript">
        $(function() {
            var $table = LoadTable();
            var funs = window.iwbfuns || { none: function() { console.log("No type"); } };
            funs["btnCreate"] = function() {
                BtnCreate({
                    data: { accountType: "@AbpSession.AccountType", accountTypeName: "@ViewBag.AccountTypeName" }
                });
            };
          
            funs["btnUpdate"] = function() {
                var row = $table.bootstrapTable("getSelections")[0];
                if (row) {
                    BtnUpdate({ disabled: "tenancyName,adminEmailAddress", row: row });
                }
            };

            
        });

    </script>

    <script>
       
        function ActiveStateFormatter(v) {
            var name = $('#hid-activeType option[value="' + v + '"]').text();
            if (v) {
                return '<span class="label label-success"> ' + name + '</span>';
            }
            return '<span class="label label-danger"> ' + name + '</span>';
        }
    </script>
}

<section style="display:none">
    @Html.DropDownList("hid-activeType", activeType)
</section>