@inherits UserPointManagement.Web.Pages.UserPointPage.UserPointDetailBase
@page "/user-point"
@using System.ComponentModel.DataAnnotations
@using System.Text.Json
@using global::UserPointManagement.Model.Dtos.User
@using global::UserPointManagement.Model.Dtos.UserPoint
@using UserPointManagement.Application.Services
@inject IUserPointService UserPointService;

<PageContainer Title="用户积分明细">
    <GridRow Style="margin: 10px 0">
        <GridCol Span="12">
            <Space Direction="@DirectionVHType.Horizontal">
                <SpaceItem>
                    <Select TItem="UserDto"
                            TItemValue="int?"
                            DataSource="@_users"
                            @bind-Value="@_selectedUserId"
                            LabelName="@nameof(UserDto.Name)"
                            ValueName="@nameof(UserDto.Id)"
                            Placeholder="请选择用户"
                            DefaultActiveFirstOption="false"
                            EnableSearch
                            OnSelectedItemChanged="OnSelectedItemChangedHandler"
                            AllowClear
                            Style="width: 200px">
                    </Select>
                </SpaceItem>
            </Space>
        </GridCol>
        <GridCol Span="12">
            <Space Direction="@DirectionVHType.Horizontal" Style="display: flex; justify-content: flex-end">
                <SpaceItem>
                    <Button type="primary" OnClick="@ShowModal">新增积分</Button>
                </SpaceItem>
            </Space>
        </GridCol>
    </GridRow>
    <Table TItem="UserPointInfoDto" DataSource="@_userPoints"
           Total="_total"
           Loading="_loading"
           PageIndex="@_pageIndex"
           PageSize="@_pageSize"
           OnPageIndexChange="OnPageIndexChanged"
           OnPageSizeChange="OnPageSizeChange">
        <PropertyColumn Property="c => c.Name" title="用户姓名"/>
        <PropertyColumn Property="c => c.TotalPoint" title="总积分"/>
    </Table>
</PageContainer>

<Modal Title="@("新增积分")"
       Visible="@_visible"
       OnOk="@HandleOk"
       OnCancel="@HandleCancel">
    <Form Loading="loading" Model="@model"
          LabelColSpan="8"
          WrapperColSpan="16"
          OnFinish="OnFinish"
          OnFinishFailed="OnFinishFailed"
          @ref="@_form">
        <FormItem Label="姓名">
            <Select TItem="UserDto"
                    TItemValue="int"
                    Mode="default"
                    DataSource="@_users"
                    @bind-Value="@context.UserId"
                    LabelName="@nameof(UserDto.Name)"
                    ValueName="@nameof(UserDto.Id)"
                    Placeholder="请选择用户"
                    DefaultActiveFirstOption="false"
                    EnableSearch
                    AllowClear>
            </Select>
        </FormItem>
        <FormItem Label="积分">
            <AntDesign.InputNumber @bind-Value="@context.Point"/>
        </FormItem>
    </Form>
</Modal>

@code {

    #region original form coding

    public class Model
    {
        [Required]
        public int UserId { get; set; }

        [Required]
        public int Point { get; set; }
    }

    private Model model = new Model();

    private void OnFinishFailed(EditContext editContext)
    {
        Console.WriteLine($"Failed:{JsonSerializer.Serialize(model)}");
    }

    bool loading = false;

    void toggle(bool value) => loading = value;

    #endregion

    #region original modal coding

    bool _visible = false;

    private void ShowModal()
    {
        _visible = true;
    }

    private void HandleCancel(MouseEventArgs e)
    {
        _visible = false;
    }

    #endregion

    /*
     * Careful! 
     * 
     * next bind submit event to modal OK button 
     */

    private Form<Model> _form;

    /// <summary>
    /// when form is submited, close the modal
    /// </summary>
    /// <param name="args"></param>
    private void OnFinish(EditContext editContext)
    {
        Console.WriteLine("e");
        _visible = false;
    }

    /// <summary>
    /// on modal OK button is click, submit form manually
    /// </summary>
    /// <param name="e"></param>
    private async Task HandleOk(MouseEventArgs e)
    {
        _form.Submit();
        await UserPointService.CreateUserPoint(new CreateUserPointDto()
        {
            UserId = model.UserId,
            Point = model.Point
        }).ConfigureAwait(false);
        await RefreshTable().ConfigureAwait(false);
    }

}