...

TaxPayerFull/Layout/SaleChart.razor

@@ -1,24 +1,11 @@
-@using Color = System.Drawing.Color
+@using Shared.DTOs
-@using Shared.DTOs
+<LineChart  @ref="lineChart"  />
 
-<LineChart @ref="lineChart" Width="500" Class="mb-4" />
-
-@* <Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await RandomizeAsync()"> Randomize </Button>
-<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await AddDatasetAsync()"> Add Dataset </Button>
-<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await AddDataAsync()"> Add Data </Button>
-<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await ShowHorizontalLineChartAsync()"> Horizontal Line Chart </Button>
-<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await ShowVerticalLineChartAsync()"> Vertical Line Chart </Button>
- *@
 @code {
     private LineChart lineChart = default!;
     private LineChartOptions lineChartOptions = default!;
     private ChartData chartData = default!;
     public List<IdNameByCount<int>> items = new List<IdNameByCount<int>>();
-    private int datasetsCount = 0;
-    private int labelsCount = 0;
-
-    private Random random = new();
-
     protected override void OnInitialized()
     {
         items.AddRange(new List<IdNameByCount<int>>()
@@ -28,8 +15,39 @@
                  new IdNameByCount<int>{ID=2,Title="3",count=12},
                    new IdNameByCount<int>{ID=3,Title="4",count=21}
         });
-        chartData = new ChartData { Labels = GetDefaultDataLabels(), Datasets = GetDefaultDataSets(1) };
+
-        lineChartOptions = new() { Responsive = true, Interaction = new Interaction { Mode = InteractionMode.Index } };
+        var colors = ColorBuilder.CategoricalTwelveColors;
+
+        var labels = items.OrderBy(o => o.ID).Select(s => s.Title).ToList();
+        var datasets = new List<IChartDataset>();
+
+        var dataset1 = new LineChartDataset
+            {
+                
+                Label = "فروش",
+                Data = items.OrderBy(o => o.ID).Select(s => decimal.ToDouble(s.count.Value)).ToList(),
+                BackgroundColor = new List<string> { colors[0] },
+                BorderColor = new List<string> { colors[0] },
+                BorderWidth = new List<double> { 2 },
+                HoverBorderWidth = new List<double> { 4 },
+                PointBackgroundColor = new List<string> { colors[0] },
+                PointRadius = new List<int> { 0 }, // hide points
+                PointHoverRadius = new List<int> { 4 }
+            };
+        datasets.Add(dataset1);
+
+      
+        chartData = new ChartData { Labels = labels, Datasets = datasets };
+
+        lineChartOptions = new();
+        lineChartOptions.Responsive = true;
+        lineChartOptions.Interaction = new Interaction { Mode = InteractionMode.Index };
+
+        lineChartOptions.Scales.X!.Title = new ChartAxesTitle { Text = "روز", Display = true };
+        lineChartOptions.Scales.Y!.Title = new ChartAxesTitle { Text = "میران", Display = true };
+
+        lineChartOptions.Plugins.Title!.Text = "گزارش (ماه جاری)";
+        lineChartOptions.Plugins.Title.Display = true;
     }
 
     protected override async Task OnAfterRenderAsync(bool firstRender)
@@ -41,135 +59,4 @@
         await base.OnAfterRenderAsync(firstRender);
     }
 
-    // private async Task RandomizeAsync()
-    // {
-    //     if (chartData is null || chartData.Datasets is null || !chartData.Datasets.Any()) return;
-
-    //     var newDatasets = new List<IChartDataset>();
-
-    //     foreach (var dataset in chartData.Datasets)
-    //     {
-    //         if (dataset is LineChartDataset lineChartDataset
-    //             && lineChartDataset is not null
-    //             && lineChartDataset.Data is not null)
-    //         {
-    //             var count = lineChartDataset.Data.Count;
-
-    //             var newData = new List<double>();
-    //             for (var i = 0; i < count; i++)
-    //             {
-    //                 newData.Add(random.Next(200));
-    //             }
-
-    //             lineChartDataset.Data = newData;
-    //             newDatasets.Add(lineChartDataset);
-    //         }
-    //     }
-
-    //     chartData.Datasets = newDatasets;
-
-    //     await lineChart.UpdateAsync(chartData, lineChartOptions);
-    // }
-
-    // private async Task AddDatasetAsync()
-    // {
-    //     if (chartData is null || chartData.Datasets is null) return;
-
-    //     var chartDataset = GetRandomLineChartDataset();
-    //     chartData = await lineChart.AddDatasetAsync(chartData, chartDataset, lineChartOptions);
-    // }
-
-    // private async Task AddDataAsync()
-    // {
-    //     if (chartData is null || chartData.Datasets is null)
-    //         return;
-
-    //     var data = new List<IChartDatasetData>();
-    //     foreach (var dataset in chartData.Datasets)
-    //     {
-    //         if (dataset is LineChartDataset lineChartDataset)
-    //             data.Add(new LineChartDatasetData(lineChartDataset.Label, random.Next(200)));
-    //     }
-
-    //     chartData = await lineChart.AddDataAsync(chartData, GetNextDataLabel(), data);
-    // }
-
-    // private async Task ShowHorizontalLineChartAsync()
-    // {
-    //     lineChartOptions.IndexAxis = "y";
-    //     await lineChart.UpdateAsync(chartData, lineChartOptions);
-    // }
-
-    // private async Task ShowVerticalLineChartAsync()
-    // {
-    //     lineChartOptions.IndexAxis = "x";
-    //     await lineChart.UpdateAsync(chartData, lineChartOptions);
-    // }
-
-    #region Data Preparation
-
-    private List<IChartDataset> GetDefaultDataSets(int numberOfDatasets)
-    {
-        var datasets = new List<IChartDataset>();
-
-        for (var index = 0; index < numberOfDatasets; index++)
-        {
-            datasets.Add(GetRandomLineChartDataset());
-        }
-
-        return datasets;
-    }
-
-    private LineChartDataset GetRandomLineChartDataset()
-    {
-        var c = ColorBuilder.CategoricalTwelveColors[datasetsCount].ToColor();
-
-        datasetsCount += 1;
-
-        return new LineChartDataset()
-            {
-                Label = $"فروش",
-                Data = GetRandomData(),
-                BackgroundColor = new List<string> { c.ToRgbString() },
-                BorderColor = new List<string> { c.ToRgbString() },
-                BorderWidth = new List<double> { 2 },
-                HoverBorderWidth = new List<double> { 4 },
-                PointBackgroundColor = new List<string> { c.ToRgbString() },
-                PointRadius = new List<int> { 0 }, // hide points
-                PointHoverRadius = new List<int> { 4 },
-            };
-    }
-
-    private List<double> GetRandomData()
-    {
-        var data = new List<double>();
-        for (var index = 0; index < items.Count; index++)
-        {
-           
-            data.Add(decimal.ToDouble(items[index].count.Value));
-        }
-
-        return data;
-    }
-
-    private List<string> GetDefaultDataLabels()
-    {
-
-        var labels = new List<string>();
-        for (var index = 0; index < items.Count; index++)
-        {
-            
-            labels.Add($"روز {items[index].Title}");
-        }
-
-        return labels;
-    }
-
-    // private string GetNextDataLabel()
-    // {
-    //     labelsCount += 1;
-    //     return $"روز {labelsCount}";
-    // }
-
-    #endregion Data Preparation
 }

TaxPayerFull/Pages/UserPanel/Panel.razor

@@ -213,10 +213,10 @@
     </div>
     <!-- Total Revenue -->
     <div class="col-12 col-lg-8 order-2 order-md-3 order-lg-2 mb-4">
-        <div class="card col-7">
+        <div class="card col-12">
             <div class="row row-bordered g-0">
          
-                <div class="col-md-4">
+                <div class="col-md-12">
                     <SaleChart />
                 </div>
             </div>