@using VberZero.Tools.StringModel
@model VberAdmin.Web.Views.Shared.Components.TableToolBar.TableToolBarViewModel

<div class="d-flex @(Model?.Search==null?"":"flex-stack") ">

    @if (Model != null)
    {
        if (Model.Search != null)
        {
            @await Html.PartialAsync("_Search",Model.Search)
        }
        <style>
            [data-kt-table-toolbar="ex-tool"]:empty{
                margin-right: 0!important;
            }
            [data-kt-table-toolbar="ex-tool"]{
                white-space: nowrap;
            }
        </style>
        <div class="d-flex justify-content-end me-3 flex-nowrap" data-kt-table-toolbar="ex-tool"></div>
        @if (Model.Menu is {Count:>0})
        {
            <!--begin::Toolbar-->
            <div class="d-flex justify-content-end flex-nowrap" data-kt-table-toolbar="base">
                <!--begin::Create-->
                <button type="button" class="btn btn-primary btn-sm" style="white-space: nowrap" data-kt-menu-trigger="hover" data-kt-menu-placement="bottom-end" data-kt-menu-flip="top-end">
                    操作
                    <span class="svg-icon svg-icon-5">
                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                            <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                <polygon points="0 0 24 0 24 24 0 24"></polygon>
                                <path d="M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z" fill="#000000" fill-rule="nonzero" transform="translate(12.000003, 11.999999) rotate(-180.000000) translate(-12.000003, -11.999999)"></path>
                            </g>
                        </svg>
                    </span>
                </button>
                <div class="menu menu-sub menu-sub-dropdown  w-150px " data-kt-menu="true" id="menu_@DateTime.Now.Ticks" data-popper-placement="bottom-end">
                    <div class="p-3 pb-1">
                        @foreach (var menu in Model.Menu)
                        {
                            string btnType =menu.Script.Empty()?"btn" + menu.Name: menu.Script, url = menu.Url??"";
                            
                            <button type="button" class="btn btn-light-primary btn-sm w-100 mb-2" data-vb-tool-menu-type="@(btnType)" data-vb-tool-menu-url="@(url)">
                                <i class="@(menu.Icon)"></i>
                                @(menu.DisplayName)
                            </button>
                        }
                    </div>
                </div>
                <!--end::Create-->
            </div>
            <!--end::Toolbar-->
        }
        @if (Model.SelectionMenu is {Count:>0})
        {
            <!--begin::Group actions-->
            <div class="d-flex flex-nowrap justify-content-end align-items-center d-none" data-kt-table-toolbar="selected">
                <div class="fw-bolder me-5 " style="white-space: nowrap">
                    选中 <span class="mx-1" data-kt-table-select="selected_count"></span> 条
                </div>

                <button type="button" class="btn btn-danger btn-sm" style="white-space: nowrap" title="选中后操作" data-kt-menu-trigger="hover" data-kt-menu-placement="bottom-end" data-kt-menu-flip="top-end">
                    操作
                    <span class="svg-icon svg-icon-5 ms-2 ">
                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                            <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                <polygon points="0 0 24 0 24 24 0 24"></polygon>
                                <path d="M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z" fill="#000000" fill-rule="nonzero" transform="translate(12.000003, 11.999999) rotate(-180.000000) translate(-12.000003, -11.999999)"></path>
                            </g>
                        </svg>
                    </span>
                </button>
                <div class="menu menu-sub menu-sub-dropdown w-150px " data-kt-menu="true" id="menu2_@DateTime.Now.Ticks" data-popper-placement="bottom-end">
                    <div class="p-3 pb-1">
                        @foreach (var menu in Model.SelectionMenu)
                        {
                            string btnType =menu.Script.Empty()?"btn" + menu.Name: menu.Script, url = menu.Url??"";
                            
                            <button type="button" class="btn btn-light-danger btn-sm w-100 mb-2" data-vb-tool-menu-type="@(btnType)" data-vb-tool-menu-url="@(url)">
                                <i class="@(menu.Icon)"></i>
                                @(menu.DisplayName)
                            </button>
                        }
                    </div>
                </div>
            </div>
            <!--end::Group actions-->
        }
     
      
    }

</div>