File size: 3,392 Bytes
47f7556
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
document.addEventListener('DOMContentLoaded', function() {
    // Initialize DataTable
    if ($('#activityTable').length) {
        $('#activityTable').DataTable({
            "pageLength": 5,
            "ordering": true,
            "info": false,
            "lengthChange": false,
            "language": {
                "search": "",
                "searchPlaceholder": "Search records..."
            }
        });
    }

    // Initialize Select2
    $('.select2').select2({
        theme: 'bootstrap-5',
        width: '100%'
    });

    // Initialize charts
    renderCharts();

    // Toggle sidebar
    const sidebarToggle = document.getElementById('sidebarToggle');
    if (sidebarToggle) {
        sidebarToggle.addEventListener('click', function() {
            document.getElementById('sidebar').classList.toggle('collapsed');
        });
    }

    // SweetAlert examples
    window.showSuccessAlert = function(message) {
        Swal.fire({
            icon: 'success',
            title: 'Success!',
            text: message,
            confirmButtonColor: '#6f42c1'
        });
    };

    window.showErrorAlert = function(message) {
        Swal.fire({
            icon: 'error',
            title: 'Error!',
            text: message,
            confirmButtonColor: '#6f42c1'
        });
    };
});

function renderCharts() {
    // Line Chart
    const lineChart = new CanvasJS.Chart("chartContainer", {
        animationEnabled: true,
        backgroundColor: "#1e1e1e",
        axisX: {
            valueFormatString: "DD MMM",
            labelFontColor: "#f0f0f0",
            lineColor: "#444",
            tickColor: "#444"
        },
        axisY: {
            title: "Number of Patients",
            titleFontColor: "#f0f0f0",
            labelFontColor: "#f0f0f0",
            lineColor: "#444",
            tickColor: "#444",
            gridColor: "#333"
        },
        legend: {
            fontColor: "#f0f0f0"
        },
        data: [{
            type: "line",
            name: "Visits",
            showInLegend: true,
            color: "#6f42c1",
            markerSize: 8,
            dataPoints: [
                { x: new Date(2023, 5, 1), y: 8 },
                { x: new Date(2023, 5, 2), y: 12 },
                { x: new Date(2023, 5, 3), y: 10 },
                { x: new Date(2023, 5, 4), y: 15 },
                { x: new Date(2023, 5, 5), y: 18 },
                { x: new Date(2023, 5, 6), y: 14 },
                { x: new Date(2023, 5, 7), y: 16 }
            ]
        }]
    });
    lineChart.render();

    // Pie Chart
    const pieChart = new CanvasJS.Chart("pieChartContainer", {
        animationEnabled: true,
        backgroundColor: "#1e1e1e",
        legend: {
            fontColor: "#f0f0f0"
        },
        data: [{
            type: "pie",
            startAngle: 240,
            yValueFormatString: "##0.00\"%\"",
            indexLabel: "{label} {y}",
            indexLabelFontColor: "#f0f0f0",
            dataPoints: [
                {y: 35, label: "Anxiety Disorders", color: "#6f42c1"},
                {y: 25, label: "Depression", color: "#10b981"},
                {y: 20, label: "PTSD", color: "#f59e0b"},
                {y: 15, label: "Bipolar Disorder", color: "#3b82f6"},
                {y: 5, label: "Other", color: "#ef4444"}
            ]
        }]
    });
    pieChart.render();
}