You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
52 lines
2.3 KiB
52 lines
2.3 KiB
@using Biskilog_Accounting.Shared.CustomModels;
|
|
@using Biskilog_Accounting.Shared.Interfaces;
|
|
@using Microsoft.Fast.Components.FluentUI
|
|
@inject ICalculator m_calculator
|
|
|
|
@if (!IsLoading)
|
|
{
|
|
<div class="card" style="min-height:480px;">
|
|
<div class="row row-bordered g-0">
|
|
<div class="col-md-7">
|
|
<h5 class="card-header m-0 me-2 pb-3">@Title</h5>
|
|
<ApexChart TItem="WeeklySaleItem" Options=m_options>
|
|
|
|
<ApexPointSeries TItem="WeeklySaleItem"
|
|
Items="@Series"
|
|
Name="Sales"
|
|
YValue="@(e => e.Total)"
|
|
XValue="@(e => e.Date.ToString("dd MMM"))"
|
|
SeriesType="SeriesType.Area" />
|
|
</ApexChart>
|
|
</div>
|
|
<div class="col-md-5">
|
|
@if (CategorySummary.Count() > 0)
|
|
{
|
|
<div class="text-center fw-semibold pt-3 mb-2">@SubTitle</div>
|
|
<ApexChart TItem="WeeklyCategorySummary" Options="options">
|
|
<ApexPointSeries TItem="WeeklyCategorySummary" Items="@CategorySummary" Name="Categories" YValue="@(e => e.Total)" XValue="@(e => e.Category)"
|
|
SeriesType="SeriesType.Pie" />
|
|
</ApexChart>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
else
|
|
{
|
|
<FluentCard class="card-padding">
|
|
<FluentSkeleton style="border-radius: 4px; width: 50px; height: 50px;" Shape="SkeletonShape.Circle" Shimmer="true"></FluentSkeleton>
|
|
<FluentSkeleton style="border-radius: 4px; margin-top: 10px; height: 10px;" Shape="SkeletonShape.Rect" Shimmer="true"></FluentSkeleton>
|
|
<FluentSkeleton style="border-radius: 4px; margin-top: 10px; height: 10px;" Shape="SkeletonShape.Rect" Shimmer="true"></FluentSkeleton>
|
|
<FluentSkeleton style="border-radius: 4px; margin-top: 10px; height: 10px;" Shape="SkeletonShape.Rect" Shimmer="true"></FluentSkeleton>
|
|
<FluentSkeleton style="
|
|
border-radius: 4px;
|
|
width: 75px;
|
|
height: 30px;
|
|
margin-top: 20px;
|
|
margin-bottom: 10px;
|
|
"
|
|
Shape="SkeletonShape.Rect"
|
|
Shimmer="true"></FluentSkeleton>
|
|
</FluentCard>
|
|
}
|