@page "/table/search"
@inject IStringLocalizer<NavMenu> NavMenuLocalizer
@inject IStringLocalizer<TablesSearch> Localizer
@inject IStringLocalizer<Foo> FooLocalizer

<h3>@Localizer["TablesSearchTitle"] - @NavMenuLocalizer["TableSearch"]</h3>

<h4>@((MarkupString)Localizer["TablesSearchDesc"].Value)</h4>

<Tips>
    <p>@((MarkupString)Localizer["SearchTableTips"].Value)</p>
</Tips>

<DemoBlock Title="@Localizer["SearchTableTitle"]"
           Introduction="@Localizer["SearchTableIntro"]"
           Name="SearchTable">
    <section ignore>
        <ul class="ul-demo mb-3">
            <li>@((MarkupString)Localizer["SearchTableLi1"].Value)</li>
            <li>@((MarkupString)Localizer["SearchTableLi2"].Value)</li>
            <li>@((MarkupString)Localizer["SearchTableLi3"].Value)</li>
        </ul>
        @((MarkupString)Localizer["AutoHeightIntro"].Value)
    </section>
    <div style="height: 600px;">
        <Table TItem="Foo"
               IsPagination="true" PageItemsSource="new int[] {10, 20}"
               IsStriped="true" IsBordered="true" ShowMoreButton="true"
               ShowToolbar="true" ShowSearch="true" ShowCardView="true" IsMultipleSelect="true" ShowExtendButtons="true"
               AddModalTitle="@Localizer["AddModelTitle"]" EditModalTitle="@Localizer["EditModelTitle"]"
               SearchModel="@SearchModel" SearchMode="SearchMode.Top" ShowEmpty="true"
               OnQueryAsync="@OnSearchModelQueryAsync" OnResetSearchAsync="@OnResetSearchAsync"
               OnAddAsync="@OnAddAsync" OnSaveAsync="@OnSaveAsync" OnDeleteAsync="@OnDeleteAsync">
            <TableColumns>
                <TableColumn @bind-Field="@context.DateTime" Width="180" />
                <TableColumn @bind-Field="@context.Name" />
                <TableColumn @bind-Field="@context.Address" />
                <TableColumn @bind-Field="@context.Education" />
            </TableColumns>
            <SearchTemplate>
                <GroupBox Title="@Localizer["SearchTableGroupBoxText"]">
                    <div class="row g-3 form-inline">
                        <div class="col-12 col-sm-6">
                            <BootstrapInput @bind-Value="@context.Name" PlaceHolder="@Localizer["NamePlaceholder"]" maxlength="50" ShowLabel="true" DisplayText="@FooLocalizer[nameof(context.Name)]" />
                        </div>
                        <div class="col-12 col-sm-6">
                            <BootstrapInput @bind-Value="@context.Address" PlaceHolder="@Localizer["AddressPlaceholder"]" maxlength="500" ShowLabel="true" DisplayText="@FooLocalizer[nameof(context.Address)]" />
                        </div>
                    </div>
                </GroupBox>
            </SearchTemplate>
			<MoreButtonDropdownTemplate>
				<DropdownItem Text="Action1" Icon="fa-solid fa-flag" OnClick="@(() => OnAction(context, "Action1"))"></DropdownItem>
				<Divider></Divider>
				<DropdownItem Text="Action2" Icon="fa-solid fa-home" OnClick="@(() => OnAction(context, "Action2"))"></DropdownItem>
			</MoreButtonDropdownTemplate>
        </Table>
    </div>
</DemoBlock>

<DemoBlock Title="@Localizer["AutoGenerateSearchTitle"]"
           Introduction="@Localizer["AutoGenerateSearchIntro"]"
           Name="AutoGenerateSearch">
    <section ignore>
        <p>@((MarkupString)Localizer["AutoGenerateSearchP"].Value)</p>
        <Tips>@((MarkupString)Localizer["AutoGenerateSearchTips"].Value)</Tips>
        <Pre>if (options.Searches.Any())
{
    //@Localizer["AutoGenerateSearchComment"] FilterLogic.Or
    items = items.Where(options.Searches.GetFilterFunc&lt;Foo&gt;(FilterLogic.Or));
}</Pre>
        <GroupBox Title="@Localizer["AutoGenerateSearchGroupBoxTitle"]" class="mb-3">
            <div class="row g-3 form-inline">
                <div class="col-12 col-sm-3">
                    <Switch DisplayText="@Localizer["DisplayText1"]" ShowLabel="true" @bind-Value="SearchModeFlag" />
                </div>
                <div class="col-12 col-sm-3">
                    <Switch DisplayText="@Localizer["DisplayText2"]" ShowLabel="true" @bind-Value="ShowSearchText" />
                </div>
                <div class="col-12 col-sm-3">
                    <Switch DisplayText="@Localizer["DisplayText3"]" ShowLabel="true" @bind-Value="ShowResetButton" />
                </div>
                <div class="col-12 col-sm-3">
                    <Switch DisplayText="@Localizer["DisplayText4"]" ShowLabel="true" @bind-Value="ShowSearchButton" IsDisabled="SearchModeFlag" />
                </div>
            </div>
        </GroupBox>
    </section>
    <Table TItem="Foo"
           IsPagination="true" PageItemsSource="@PageItemsSource" SearchDialogShowMaximizeButton="true"
           IsStriped="true" IsBordered="true" SearchMode="SearchModeValue" SearchModel="@SearchModel"
           ShowToolbar="true" IsMultipleSelect="true" ShowExtendButtons="true"
           ShowSearch="true" ShowResetButton="ShowResetButton" ShowSearchButton="ShowSearchButton" ShowSearchText="ShowSearchText"
           AddModalTitle="@Localizer["AddModelTitle"]" EditModalTitle="@Localizer["EditModelTitle"]"
           OnQueryAsync="@OnQueryAsync" OnAddAsync="@OnAddAsync" OnSaveAsync="@OnSaveAsync" OnDeleteAsync="@OnDeleteAsync">
        <TableColumns>
            <TableColumn @bind-Field="@context.DateTime" Width="180" Filterable="true" />
            <TableColumn @bind-Field="@context.Name" Searchable="true" />
            <TableColumn @bind-Field="@context.Address" Searchable="true" />
            <TableColumn @bind-Field="@context.Education" />
        </TableColumns>
    </Table>
</DemoBlock>

<DemoBlock Title="@Localizer["CustomColSearchTitle"]"
           Introduction="@Localizer["CustomColSearchIntro"]"
           Name="CustomColSearch">
    <section ignore>
        <p>@((MarkupString)Localizer["CustomColSearchP"].Value)</p>
        <p>@((MarkupString)Localizer["CustomColSearchP1"].Value)</p>
        <p>@((MarkupString)Localizer["CustomColSearchP2"].Value)</p>
        <p>@((MarkupString)Localizer["CustomColSearchP3"].Value)</p>
        <p>@((MarkupString)Localizer["CustomColSearchP4"].Value)</p>
        <p>@((MarkupString)Localizer["CustomColSearchP5"].Value)</p>
        <p>@((MarkupString)Localizer["CustomColSearchP6"].Value)</p>
        <p>@((MarkupString)Localizer["CustomColSearchP7"].Value)</p>
    </section>
    <Table TItem="Foo"
           IsPagination="true" PageItemsSource="@PageItemsSource"
           IsStriped="true" IsBordered="true"
           SearchModel="@SearchModel" ShowSearch="true" ShowSearchText="false"
           ShowToolbar="true" IsMultipleSelect="true" ShowExtendButtons="true" SearchDialogIsDraggable="true"
           AddModalTitle="@Localizer["AddModelTitle"]" EditModalTitle="@Localizer["EditModelTitle"]" SearchDialogShowMaximizeButton="true"
           OnQueryAsync="@OnQueryAsync" OnAddAsync="@OnAddAsync" OnSaveAsync="@OnSaveAsync" OnDeleteAsync="@OnDeleteAsync">
        <TableColumns>
            <TableColumn @bind-Field="@context.DateTime" Width="180" Filterable="true" />
            <TableColumn @bind-Field="@context.Name" Searchable="true">
                <SearchTemplate Context="model">
                    <div class="col-12 col-sm-6">
                        <Select Items="SearchItems" @bind-Value="@model!.Name" ShowLabel="true" DisplayText="姓名"></Select>
                    </div>
                </SearchTemplate>
            </TableColumn>
            <TableColumn @bind-Field="@context.Address" Searchable="true" />
            <TableColumn @bind-Field="@context.Education" />
        </TableColumns>
    </Table>
</DemoBlock>

<DemoBlock Title="@Localizer["CustomerSearchModelTitle"]"
           Introduction="@Localizer["CustomerSearchModelIntro"]"
           Name="CustomerSearchModel">
    <section ignore>@((MarkupString)Localizer["CustomerSearchModelP"].Value)</section>
    <Table TItem="Foo"
           IsPagination="true" PageItemsSource="@PageItemsSource" SearchMode="SearchMode.Top"
           IsStriped="true" IsBordered="true"
           CustomerSearchModel="@CustomerSearchModel" ShowSearch="true"
           ShowToolbar="true" IsMultipleSelect="true" ShowExtendButtons="true"
           OnQueryAsync="@OnQueryAsync" OnAddAsync="@OnAddAsync" OnSaveAsync="@OnSaveAsync" OnDeleteAsync="@OnDeleteAsync">
        <TableColumns>
            <TableColumn @bind-Field="@context.DateTime" Width="180" />
            <TableColumn @bind-Field="@context.Name" Searchable="true" />
            <TableColumn @bind-Field="@context.Address" Searchable="true" />
            <TableColumn @bind-Field="@context.Count" />
            <TableColumn @bind-Field="@context.Education" />
        </TableColumns>
        <CustomerSearchTemplate>
            @if (context is FooSearchModel model)
            {
                <FooSearch @bind-Value="@model" />
            }
        </CustomerSearchTemplate>
    </Table>
</DemoBlock>
