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

@page "/setting/messagetemplate/list"
@page "/{locale}/setting/messagetemplate/list"
@inject ILogger<MessageTemplateList> Logger
@attribute [Authorize]

<PageContainer Title="消息模板">
    <Breadcrumb>
        <Breadcrumb>
            <BreadcrumbItem Href="/">管理后台</BreadcrumbItem>
            <BreadcrumbItem Href="/admin/list">系统功能</BreadcrumbItem>
            <BreadcrumbItem>系统设置</BreadcrumbItem>
        </Breadcrumb>
    </Breadcrumb>
    <ChildContent>
        <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.Key" Placeholder="名称" AllowClear />
                    </FormItem>
                    </Col>
                    <Col>
                    <div class="ant-form-item" style="width:200px;display:flex;">
                        <Button Type="ButtonType.Primary" HtmlType="submit">查询</Button>
                        <Button Style="margin: 0 8px;" OnClick="OnSearchReset">重置</Button>
                    </div>
                    </Col>
                </Row>
            </Form>
        </Card>
        <br />
        <Card Class="mt-3">
            <Table DataSource="PagingList.Items" PageSize="100" HidePagination="true" Resizable>
                <TitleTemplate>
                    <Flex Justify="FlexJustify.SpaceBetween">
                        菜单列表
                        <div>
                            <Button Class="me-3" OnClick="OnCreateClick" Type="ButtonType.Primary">新增</Button>
                        </div>
                    </Flex>
                </TitleTemplate>
                <ColumnDefinitions>
                    <PropertyColumn Property="c => c.Type" Title="模版类型" Width="150px">
                        @if (context.Type == (int)MessageTemplateType.Message)
                        {
                            <AntDesign.Text>站内信</AntDesign.Text>
                        }
                        else if (context.Type == (int)MessageTemplateType.Email)
                        {
                            <AntDesign.Text>邮件</AntDesign.Text>
                        }
                        else if (context.Type == (int)MessageTemplateType.Sms)
                        {
                            <AntDesign.Text>短信</AntDesign.Text>
                        }
                    </PropertyColumn>
                    <PropertyColumn Property="c => c.Name" Title="模版名称" />
                    <PropertyColumn Property="c => c.LanguageId" Title="语言">
                        @GetLanuageName(context.LanguageId)
                    </PropertyColumn>
                    <PropertyColumn Property="c => c.Key" Title="模版Code" Width="100px" />
                    <PropertyColumn Property="c => c.Title" Title="模版标题" />
                    <PropertyColumn Property="c => c.Enabled" Title="状态" Width="80px" Align="ColumnAlign.Center">
                        @if (context.Enabled)
                        {
                            <AntDesign.Text Type="TextElementType.Success"><Icon Type="check" Theme=" IconThemeType.Outline" Width="1.3em" Height="1.3em" /></AntDesign.Text>

                        }
                        else
                        {
                            <Icon Type="close" Theme="IconThemeType.Outline" Width="1.3em" Height="1.3em" />
                        }
                    </PropertyColumn>
                    <PropertyColumn Property="c => c.CreateTime" Title="时间" Width="190px" />
                    <ActionColumn Title="操作" Align="ColumnAlign.Right" Width="160px">
                        <Space>
                            <SpaceItem>
                                <Dropdown Trigger="@(new Trigger[] { Trigger.Click })">
                                    <Overlay>
                                        <Menu>

                                            <MenuItem>
                                                <a @onclick="(e) => HandleEdit(context)"> <Icon Type="@IconType.Outline.Edit" /> 编辑</a>
                                            </MenuItem>
                                            <MenuDivider />
                                            <MenuItem>
                                                <Popconfirm Placement="@Placement.Left" Title="@("删除这条数据无法恢复，您确定要删除吗?")"
                                                            OnConfirm="@(e=>HandleDeleteConfirmAsync(e,context.Id))"
                                                            OkText="确定"
                                                            CancelText="取消">
                                                    <a> <Icon Type="@IconType.Outline.Delete" /> 删除</a>
                                                </Popconfirm>
                                            </MenuItem>
                                        </Menu>
                                    </Overlay>
                                    <ChildContent>
                                        <a class="ant-dropdown-link" @onclick:preventDefault>
                                            <Icon Type="@IconType.Outline.Menu" />
                                        </a>
                                    </ChildContent>
                                </Dropdown>
                            </SpaceItem>
                        </Space>
                    </ActionColumn>
                </ColumnDefinitions>
            </Table>
            <br />
            <Row Justify="RowJustify.End">
                <Pagination PageIndex="PagingList.Index" Total="PagingList.Count" PageSize="PagingList.Size" ShowSizeChanger="false" OnChange="OnPageChanged"></Pagination>
            </Row>
        </Card>



        <Modal Title="@("消息模版设置")" Visible="@modalVisible" Width="700" MaskClosable="true" OkText="@("保存")" CancelText="@("取消")" OnOk="@HandleModalOk" OnCancel="@HandleCancel">
            <Form Model="@model" @ref="@editForm" LabelCol="new ColLayoutParam { Span = 5 }" WrapperCol="new ColLayoutParam { Span = 15 }" Name="modalForm" OnFinish="OnFormFinish">
                <FluentValidationValidator />
                <FormItem Label="消息模版类型">
                    <SimpleSelect DefaultValue="" Style="width:120px;" @bind-Value="@context.Type">
                        <SelectOptions>
                            <SimpleSelectOption Value="" Label="请选择消息模版类型"></SimpleSelectOption>
                            <SimpleSelectOption Value="@(((int)MessageTemplateType.Message).ToString())" Label="站内信"></SimpleSelectOption>
                            <SimpleSelectOption Value="@(((int)MessageTemplateType.Email).ToString())" Label="邮件模版"></SimpleSelectOption>
                            <SimpleSelectOption Value="@(((int)MessageTemplateType.Sms).ToString())" Label="短信模版"></SimpleSelectOption>
                        </SelectOptions>
                    </SimpleSelect>
                </FormItem>
                <FormItem Label="消息模版名称">
                    <Input Placeholder="消息模版名称" @bind-Value="@context.Name" />
                </FormItem>
                <FormItem Label="语言">
                    <Select DataSource="@languages" @bind-Value="@context.LanguageId" ItemValue="p => p.Id" ItemLabel="p => p.Title" Disabled="@(context.Id > 0)">
                    </Select>
                </FormItem>
                <FormItem Label="模版Code">
                    <Input Placeholder="模版Code" @bind-Value="@context.Key" Disabled="@(context.Id > 0)" />
                </FormItem>
                <FormItem Label="消息标题">
                    <Input Placeholder="消息标题" @bind-Value="@context.Title" />
                </FormItem>
                <FormItem Label="消息内容">
                    <TextArea Placeholder="消息内容" @bind-Value="@context.Body" />
                </FormItem>
                <FormItem Label="状态">
                    <Checkbox @bind-Value="@context.Enabled" Disabled=false>
                        启用
                    </Checkbox>
                </FormItem>
            </Form>
        </Modal>
    </ChildContent>
</PageContainer>


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

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

    [SupplyParameterFromForm]
    MessageTemplateSearch search { get; set; } = new();
    Form<MessageTemplateSearch> searchForm = null!;

    [SupplyParameterFromForm]
    MessageTemplateModel model { get; set; } = new();
    Form<MessageTemplateModel> editForm = null!;

    List<Language> languages = new();
    PagingList<MessageTemplate> PagingList = new();
    bool loading { get; set; } = true;
    bool searchExpand { get; set; } = false;
    bool modalVisible { get; set; } = false;
    bool modalLoading { get; set; } = false;

    protected override void OnInitialized()
    {
        base.OnInitialized();
    }

    protected override void OnParametersSet()
    {
        loadQueryString();
        LoadList();
        _ = LoadLanguages();
        base.OnParametersSet();
    }

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

    private async Task LoadLanguages()
    {
        var url = $"/api/language/enabled";
        var apiResult = await HttpService.Get<ApiResult<List<Language>>>(url);
        if (apiResult.Success)
        {
            if (apiResult.Data != null)
            {
                languages = apiResult.Data;
                StateHasChanged();
            }
        }
    }

    private async void LoadList()
    {

        loading = true;
        var url = "/api/messagetemplate/search";
        var apiResult = await HttpService.GetPagingList<MessageTemplate>(url, search, Page.GetValueOrDefault(1) - 1);
        if (apiResult.Success)
        {
            if (apiResult.Data != null)
            {
                PagingList = apiResult.Data;
            }
        }
        loading = false;
        StateHasChanged();
    }

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

        OnSearch(Page.Value);
    }

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

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

    private void OnReset()
    {
        search = new();
        LoadList();
    }

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


    async Task HandleDeleteConfirmAsync(MouseEventArgs e, long id)
    {
        var url = $"api/messagetemplate/delete/{id}";
        var apiResult = await HttpService.Post<ApiResult<string>>(url, new());
        if (apiResult.Success)
        {
            LoadList();
            await ModalService.InfoAsync(new ConfirmOptions() { Title = "操作提示", Content = "删除数据成功" });
        }
        else
        {
            await ModalService.ErrorAsync(new ConfirmOptions() { Title = "操作提示", Content = $"数据删除失败.{apiResult.Message}" });
        }
    }

    void OnCreateClick()
    {
        model = new();
        modalVisible = true;
    }

    void HandleEdit(MessageTemplate data)
    {
        model = data.Adapt<MessageTemplateModel>();
        modalVisible = true;
    }

    void HandleModalOk()
    {
        editForm.Submit();
    }

    async Task OnFormFinish()
    {
        if (editForm.Validate())
        {
            var result = new ApiResult<string>();
            var url = $"api/messagetemplate/save";
            result = await HttpService.Post<ApiResult<string>>(url, model);

            if (result.Code == (int)ResultCode.Success)
            {
                modalVisible = false;
                LoadList();
            }
            else
            {
                await ModalService.ErrorAsync(new ConfirmOptions() { Title = "服务异常", Content = result.Message });
            }
        }
    }

    void HandleCancel()
    {
        modalVisible = false;
    }

    string GetLanuageName(int languageId)
    {
        var language = languages.FirstOrDefault(l => l.Id == languageId);
        if (language != null)
        {
            return language.Title;
        }
        return "-";
    }
}