* jquery removed

* charts auf lokal umgestellt
* Rechnungen mit Anhang
* neues Interface Sync automatische

app/Views/charts/monthly.php

@@ -0,0 +1,68 @@
+<?= $this->extend('layout'); ?>
+<?= $this->section('menu'); ?>
+    <?= $this->include('sidebar') ?>
+<?= $this->endSection(); ?>
+<?= $this->section('css'); ?>
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+
+<?= $this->endSection(); ?>
+<?= $this->section('content'); ?>
+<div class="page-content col-xxl-4 col-12">
+    <div class="row" id="chart">        
+        <canvas id="myAreaChart"></canvas>
+    </div>
+</div>
+<?= $this->endSection(); ?>
+<?= $this->section('scripts'); ?>
+<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.5/dist/chart.umd.min.js"></script>
+<script src="https://smarthome.mawim.at/assets/luxon.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-adapter-luxon/1.3.0/chartjs-adapter-luxon.umd.js" integrity="sha512-IUw+YyQA3lci8gHiGIbkEA5pHnSy9LJeujqIDBHQMhxTk019nRXvDrKi2WcEr5nf5+RNffKMqSagdI0tzXvBiA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+<script>
+const data = {
+  labels: <?=$labels?>,
+  datasets: [
+    {
+      label: '€',
+      data: <?=$data?>,
+      id:<?=$ids?>,
+      hoverOffset: 8
+    }
+  ]
+};
+const configDonut = {
+  type: 'doughnut',
+  data: data,
+  options: {
+    responsive: true,
+    plugins: {
+      legend: {
+        position: 'left',
+      },
+      title: {
+        display: true,
+        text: '<?=$title?>',
+        font: { size: 20 }
+      }
+    },
+    onClick: (e) => {
+        let ele = document.getElementById("myChartModal");
+            const canvasPosition = Chart.helpers.getRelativePosition(e, window.myLineChart);
+            // Substitute the appropriate scale IDs
+            const data = window.myLineChart.getActiveElements(e);
+            document.getElementById("modalChartBody").innerHTML = `<a href="/viewChart/${window.myLineChart.data.datasets[0].id[data[0].index]}">Zeige Details von ${window.myLineChart.data.labels[data[0].index]}</a>`;
+            bootstrap.Modal.getOrCreateInstance(ele).show();
+            const name = window.myLineChart.data.labels[data[0].index];
+//const dataY = chart.scales.y.getValueForPixel(canvasPosition.y);
+        //    alert(`http://mqtt.mawim.at/viewChart/${window.myLineChart.data.datasets[0].id[data[0].index]}`);
+        }
+  },
+};
+
+(async function () {
+    Chart.defaults.font.size = 16;
+    window.myLineChart = new Chart(document.getElementById('myAreaChart'), configDonut);
+})();
+</script>
+
+<?= $this->endSection(); ?>