Atomx/Atomx.Admin/Atomx.Admin.Client/Pages/Settings/CurrencyList.razor

@page "/currency/list"
@page "/{locale}/currency/list"
@inject ILogger<CurrencyList> Logger
@attribute [Authorize]


<PageContainer Title="货币管理">
    <Breadcrumb>
        <Breadcrumb>
            <BreadcrumbItem Href="/">管理后台</BreadcrumbItem>
            <BreadcrumbItem Href="/settings">系统配置</BreadcrumbItem>
            <BreadcrumbItem>货币管理</BreadcrumbItem>
        </Breadcrumb>
    </Breadcrumb>
    <ChildContent>
        <Spin Spinning="pageLoading">
             <Card>
                <Form @ref="searchForm" Model="search" Layout="FormLayout.Inline" Class="search-form" OnFinish="OnSearchFinish">
                    <Row Justify="RowJustify.Start" Gutter="16">
                        <Col>
                        <FormItem Label="名称">
                            <Input @bind-Value="search.Name" Placeholder="名称" AllowClear />
                        </FormItem>
                        </Col>
                        @if (searchExpand)
                        {
                            <AntDesign.Col>
                                <FormItem Label="发布时间">
                                    <RangePicker @bind-Value="search.RangeTime"></RangePicker>
                                </FormItem>
                            </AntDesign.Col>
                            <AntDesign.Col>
                                <FormItem Label="状态">
                                    <SimpleSelect DefaultValue="" Style="width:120px;" @bind-Value="@search.Status">
                                        <SelectOptions>
                                            <SimpleSelectOption Value="" Label="全部"></SimpleSelectOption>
                                    <SimpleSelectOption Value="1" Label="草稿"></SimpleSelectOption>
                                    <SimpleSelectOption Value="2" Label="已发布"></SimpleSelectOption>
                                    <SimpleSelectOption Value="3" Label="已删除"></SimpleSelectOption>
                                        </SelectOptions>
                                    </SimpleSelect>
                                </FormItem>
                            </AntDesign.Col>
                        }
                        <Col>
                        <div class="ant-form-item">
                            <Button Type="ButtonType.Primary" HtmlType="submit">查询</Button>
                            <Button Style="margin: 0 8px;" OnClick="OnSearchReset">重置</Button>
                            <a style="font-size:12px; display:flex; align-items:center;text-align:center;" @onclick="()=>{searchExpand=!searchExpand;}">
                                <Icon Type="@(searchExpand?"up":"down")"></Icon>  @if (searchExpand)
                                    {
                                    <span>收起</span>
                                    }
                                    else
                                    {
                                    <span>展开</span>
                                    }
                            </a>
                        </div>
                        </Col>
                    </Row>
                </Form>
            </Card>
            <Card Title="" Class="hideborder">
                <Extra>
                    <div class="extraContent">
                        <Button Type="ButtonType.Primary" HtmlType="submit" OnClick="HandleAddNew">新增货币</Button>
                    </div>
                </Extra>
                <ChildContent>
                    <Table DataSource="PagingList.Items" PageSize="100" HidePagination="true">
                        <Selection CheckStrictly />
                        <PropertyColumn Property="c => c.Name" Title="名称" />
                        <PropertyColumn Property="c => c.CurrencyCode" Title="货币代码" />
                        <PropertyColumn Property="c => c.Rate" Title="汇率" />
                        <PropertyColumn Property="c => c.PrimaryCurrency" Title="默认货币">
                             @if (context.PrimaryCurrency)
                            {
                                <AntDesign.Text Type="TextElementType.Success"><Icon Type="check" Theme="IconThemeType.Outline" /></AntDesign.Text>
                            }
                            else
                            {
                                <Icon Type="minus" Theme="IconThemeType.Outline" />
                            }
                        </PropertyColumn>
                        <PropertyColumn Property="c => c.Enabled" Title="状态">
                            @if (context.Enabled)
                            {
                                <Text>已激活</text>
                            }
                            else
                            {
                               <Text>未激活</text> 
                            }
                        </PropertyColumn>
                        <PropertyColumn Property="c => c.DisplayOrder" Title="排序" />
                        <ActionColumn Title="操作" Align="ColumnAlign.Right">
                            <Space>
                                <SpaceItem>
                                    <a @onclick="(e)=>HandleEdit(context)">编辑</a>
                                </SpaceItem>
                                @*<SpaceItem>
                                    <Popconfirm Placement="@Placement.Left" Title="@("删除这条数据无法恢复，您确定要删除吗?")"
                                                OnConfirm="@(e=>HandleDeleteConfirmAsync(e,context.Id))"
                                                OkText="确定"
                                                CancelText="取消">
                                        <a>删除</a>
                                    </Popconfirm>
                                </SpaceItem>*@
                            </Space>
                        </ActionColumn>
                    </Table>
                    <br />
                    <Row Justify="RowJustify.End">
                        @if (PagingList.Count > 0)
                        {
                            <Pagination Current="PagingList.Index" Total="PagingList.Count" PageSize="PagingList.Size" ShowSizeChanger="false" OnChange="OnPageChanged"></Pagination>
                        }
                    </Row>
                </ChildContent>
            </Card>
        </Spin>
    </ChildContent>
</PageContainer>

@code {
    [Parameter]
    public string Locale { get; set; } = string.Empty;

    [SupplyParameterFromQuery]
    int? Page { get; set; }

    [SupplyParameterFromQuery(Name = "size")]
    int? PageSize { get; set; }

    bool pageLoading = false;
    bool searchExpand = false;

    Form<CurrencySearchModel> searchForm = new();
    CurrencySearchModel search = new();

    PagingList<CurrencyModel> PagingList = new() { Size = 20 };


    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();
    }

    protected override async Task OnParametersSetAsync()
    {
        loadQueryString();
        await LoadListAsync();
        await base.OnParametersSetAsync();
    }

    void loadQueryString()
    {
        var uri = new Uri(Navigation.Uri);
        var query = uri.Query;
        search.Name = query.GetQueryString("Name");
        search.Status = query.GetQueryString("Status");

        var data = query.GetQueryString("RangeTime");
        if (!string.IsNullOrEmpty(data))
        {
            var rangetime = data.Split("-");
            if (rangetime != null && rangetime.Length > 0)
            {
                searchExpand = true;
                search.RangeTime[0] = rangetime[0].NumberToDateTime();
                search.RangeTime[1] = rangetime[1].NumberToDateTime();
                StateHasChanged();
            }
        }

    }

    async Task LoadListAsync()
    {
        try
        {
            pageLoading = true;
            var url = "/api/currency/search";
            var apiResult = await HttpService.GetPagingList<CurrencyModel>(url, search, Page.GetValueOrDefault(1), PageSize.GetValueOrDefault(20));
            if (apiResult.Success)
            {
                if (apiResult.Data != null)
                {
                    PagingList = apiResult.Data;
                }
            }
            else if (apiResult.Code == 403)
            {
                ModalService.Error(new ConfirmOptions() { Title = "权限不足", Content = apiResult.Message });
            }

            StateHasChanged();
        }
        finally
        {
            pageLoading = false;
        }
    }

    void OnSearchReset()
    {
        search = new CurrencySearchModel();
        searchForm?.Reset();
    }

    private void OnSearch(int page)
    {
        var queryString = search.BuildQueryString();
        if (string.IsNullOrEmpty(queryString))
        {
            if (page > 1)
            {
                Navigation.NavigateTo($"/currency/list?page={page}");
            }
            else
            {
                Navigation.NavigateTo($"/currency/list");
            }
        }
        else
        {
            if (page > 1)
            {
                Navigation.NavigateTo($"/currency/list?page={page}&{queryString}");
            }
            else
            {
                Navigation.NavigateTo($"/currency/list?{queryString}");
            }
        }
    }

    void OnSearchFinish()
    {
        Page = Page.GetValueOrDefault(1) - 1;

        OnSearch(Page.Value);
    }

    private void OnPageChanged(PaginationEventArgs args)
    {
        OnSearch(args.Page);
    }

    void HandleAddNew()
    {
        Navigation.NavigateTo($"/currency/create");
    }


    void HandleEdit(CurrencyModel model)
    {
        Navigation.NavigateTo($"/currency/edit/{model.Id}");
    }

}