@page "/calendars"
@inject IStringLocalizer<Calendars> Localizer

<div>
    <h3>Calendar</h3>

    <h4>Containers that display data as calendars. When the data is date or by date, such as schedule, schedule, price calendar, etc., lunar calendar, etc. Year/month switching is currently supported.</h4>

    <DemoBlock Title="Basic usage" Introduction="The underlying calendar is displayed." Name="Normal">
        <Calendar ValueChanged="@OnValueChanged" />
        <BlockLogger @ref="Trace" class="mt-3" />
    </DemoBlock>

    <DemoBlock Title="Data is bound in both directions" Introduction="The calendar box automatically updates the text box when the time is selected" Name="Bind">
        <Calendar @bind-Value="@BindValue" />
        <BootstrapInput @bind-Value="@BindValue" Formatter="@Formatter" style="margin-top: 1rem;" />
    </DemoBlock>

    <DemoBlock Title="Cell Template" Introduction="customer the cell template via <code>CellTemplate</code>" Name="CellTemplate">
        <Calendar>
            <CellTemplate>
                <td class="@context.DefaultCss">
                    <div class="calendar-day">
                        <div>@context.CellValue.Day</div>
                    </div>
                </td>
            </CellTemplate>
        </Calendar>
    </DemoBlock>

    <DemoBlock Title="Show by week" Introduction="By setting the property <code>CalendarViewMode.Week</code>" Name="ViewModel">
        <Calendar ViewMode="CalendarViewMode.Week" />
    </DemoBlock>

    <DemoBlock Title="Practical applications" Introduction="Curriculum" Name="App">
        <p>Currently, the <code>ChildContext</code> is temporarily rendered by the week component, and the data-related operating components in all cells are not encapsulated and will be refined later</p>
        <Calendar ViewMode="CalendarViewMode.Week">
            <tr>
                <td class="none">None</td>
                <td rowspan="4"><div class="less ch">Chinese</div></td>
                <td>Math</td>
                <td>Chinese</td>
                <td>Math</td>
                <td>English</td>
                <td class="none">None</td>
            </tr>
            <tr>
                <td class="none">None</td>
                <td>Math</td>
                <td rowspan="3"><div class="less en">English</div></td>
                <td>Math</td>
                <td>English</td>
                <td class="none">None</td>
            </tr>
            <tr>
                <td class="none">None</td>
                <td>Math</td>
                <td>Math</td>
                <td>English</td>
                <td class="none">None</td>
            </tr>
            <tr>
                <td class="none">None</td>
                <td>Math</td>
                <td>Math</td>
                <td>English</td>
                <td class="none">None</td>
            </tr>
            <tr>
                <td style="background-color: #f8f9fa;" colspan="7">午休</td>
            </tr>
            <tr>
                <td class="none">None</td>
                <td>Math</td>
                <td>Chinese</td>
                <td>English</td>
                <td>Math</td>
                <td>English</td>
                <td class="none">None</td>
            </tr>
            <tr>
                <td class="none">None</td>
                <td>Study</td>
                <td>Study</td>
                <td>Study</td>
                <td>Study</td>
                <td>Study</td>
                <td class="none">None</td>
            </tr>
            <tr>
                <td class="none">None</td>
                <td>Study</td>
                <td>Study</td>
                <td>Study</td>
                <td>Study</td>
                <td>Study</td>
                <td class="none">None</td>
            </tr>
        </Calendar>
    </DemoBlock>

    <DemoBlock Title="Example of actual man hour system" Introduction="Click the cell pop-up window to edit the working hours, and then close the pop-up window to re summarize the statistical data" Name="CellTemplateDemo">
        <Calendar @bind-Value="CrewInfoValue">
            <CellTemplate>
                <td class="@context.DefaultCss">
                    <CalendarCrewCell @bind-Value="@context" Crews="GetCrewsByDate(context.CellValue)" />
                </td>
            </CellTemplate>
        </Calendar>
        <div class="mt-2 sum">
            <b>Work hour statistics of the month</b>
            <div class="row g-2 mt-1">
                @foreach (var crew in CalendarDemoDataHelper.Crews)
                {
                    <div class="col-12">
                        <div>@crew.Name</div>
                        <div>@GetSumByName(crew.Name)</div>
                    </div>
                }
            </div>
        </div>
    </DemoBlock>

    <AttributeTable Items="@GetAttributes()" />

    <EventTable Items="@GetEvents()" />
</div>

// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/

using System.Collections.Concurrent;

namespace BootstrapBlazor.Shared.Samples;

/// <summary>
/// 
/// </summary>
public sealed partial class Calendars
{
    private BlockLogger? Trace { get; set; }

    private DateTime BindValue { get; set; } = DateTime.Today;

    private void OnValueChanged(DateTime ts)
    {
        Trace?.Log($"{ts:yyyy-MM-dd}");
    }

    private static string Formatter(DateTime ts) => ts.ToString("yyyy-MM-dd");

    private ConcurrentDictionary<DateTime, List<Crew>> Data { get; } = new();

    private DateTime CrewInfoValue { get; set; } = DateTime.Today;

    private List<Crew> GetCrewsByDate(DateTime d) => Data.GetOrAdd(d, CalendarDemoDataHelper.GetCrewsByDate);

    private int GetSumByName(string name) => Data.Where(d => d.Key.Month == CrewInfoValue.Month).Sum(d => d.Value.FirstOrDefault(v => v.Name == name)?.Value ?? 0);

    /// <summary>
    /// 获得事件方法
    /// </summary>
    /// <returns></returns>
    private IEnumerable<EventItem> GetEvents() => new EventItem[]
    {
        new EventItem()
        {
            Name = "ValueChanged",
            Description = Localizer["ValueChanged"],
            Type ="EventCallback<DateTime>"
        }
    };

    /// <summary>
    /// 获得属性方法
    /// </summary>
    /// <returns></returns>
    private IEnumerable<AttributeItem> GetAttributes() => new AttributeItem[]
    {
        // TODO: 移动到数据库中
        new AttributeItem() {
            Name = "Value",
            Description = Localizer["Value"],
            Type = "DateTime",
            ValueList = " — ",
            DefaultValue = " — "
        },
        new AttributeItem() {
            Name = "ChildContent",
            Description = Localizer["ChildContent"],
            Type = "RenderFragment",
            ValueList = " — ",
            DefaultValue = " — "
        },
        new AttributeItem() {
            Name = "CellTemplate",
            Description = Localizer["CellTemplate"],
            Type = "RenderFragment<CalendarCellValue>",
            ValueList = " — ",
            DefaultValue = " — "
        }
    };
}