Yodashboard 11.0.2

Yodashboard

Overview

Features

• Chart Integration: Uses YomoneyChartHelper to generate bar, pie, and line charts based on sample data.
• Bootstrap Panels: Organizes charts inside Bootstrap panels for better UI presentation.

Chart Data

Chart data is stored as lists and used to generate various charts:

var chartData = new List<int> { 10, 20, 30, 40 };
var chartLabels = new List<string> { "January", "February", "March", "April" };

Charts

Charts are generated using the YomoneyChartHelper:

• Bar Chart: YomoneyChartHelper.GenerateChartHtml("bar", chartData, chartLabels, "myBarChart");
• Pie Chart: YomoneyChartHelper.GenerateChartHtml("pie", chartData, chartLabels, "pieBarChart");
• Line Chart: YomoneyChartHelper.GenerateApexChartHtml("line", chartData, chartLabels, "lineapexdats");

Dynamic Table

The table is generated dynamically using:

var tableHtml = YomoneyChartHelper.GenerateDynamicCustomerTableHtml(
    "customerTable",
    customers,
    columnHeaders,
    "dateFrom",
    "dateTo",
    3
);

UI Layout

The UI consists of:

1. A Customer Table (Currently commented out)
2. Two Chart Panels (Bar Charts)
3. Two Additional Chart Panels (Pie and Line Charts)

Dependencies

• Chartjs and APEXCHARTS
• Bootstrap for UI styling
• YomoneyChartHelper for dynamic chart generation

How to Use

1. Ensure YomoneyChartHelper is available in your project.
2. Populate the Data list with real data if necessary.
3. Un-comment @Html.Raw(tableHtml) to display the dynamic table.

Future Improvements

• Add AJAX support for dynamic data fetching.
• Implement pagination for large customer lists.
• Improve chart styles and responsiveness.

Author: Innocent Tauzeni

Date: 08-02-2024