|
@@ -0,0 +1,155 @@
|
|
|
+
|
|
|
+<link href="/c3/c3.min.css" rel="stylesheet">
|
|
|
+<script src="/c3/d3.v5.min.js" charset="utf-8"></script>
|
|
|
+<script src="/c3/c3.min.js"></script>
|
|
|
+
|
|
|
+<div id="vitalsGraphComponentUnified_{{$careMonth->id}}{{@$suffix ?: ''}}" class="stag-chart mb-4 pt-3">
|
|
|
+ <div id="unified-chart_{{$careMonth->id}}{{@$suffix ?: ''}}"></div>
|
|
|
+</div>
|
|
|
+
|
|
|
+<?php
|
|
|
+$dates = [];
|
|
|
+$startDate = $careMonth->start_date;
|
|
|
+$nextMonthFirstDay = date_format(date_add(date_create($startDate), date_interval_create_from_date_string("1 month")), 'Y-m-d');
|
|
|
+
|
|
|
+$nextDay = $startDate;
|
|
|
+while ($nextDay !== $nextMonthFirstDay) {
|
|
|
+ $dates[] = $nextDay;
|
|
|
+ $nextDay = date_format(date_add(date_create($nextDay), date_interval_create_from_date_string('1 day')), 'Y-m-d');
|
|
|
+}
|
|
|
+
|
|
|
+/** @var \App\Models\Client $patient */
|
|
|
+
|
|
|
+// BP
|
|
|
+$bpMeasurements = $patient->getNonZeroBpMeasurements->toArray();
|
|
|
+$weightMeasurements = $patient->getNonZeroWeightMeasurements->toArray();
|
|
|
+
|
|
|
+$bpData = [];
|
|
|
+$weightData = [];
|
|
|
+
|
|
|
+for ($i=0; $i<count($dates); $i++) {
|
|
|
+
|
|
|
+ $date = $dates[$i];
|
|
|
+
|
|
|
+ // bp
|
|
|
+ $bp = array_filter($bpMeasurements, function($_measurement) use ($date) {
|
|
|
+ return $_measurement['effective_date'] === $date;
|
|
|
+ });
|
|
|
+ if(count($bp)) {
|
|
|
+ $bp = array_values($bp);
|
|
|
+ $bp = $bp[count($bp) - 1];
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ $bp = null;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ if ($bp) {
|
|
|
+ $bpData[] = [
|
|
|
+ "date" => $date,
|
|
|
+ "sbp" => $bp["sbp_mm_hg"],
|
|
|
+ "dbp" => $bp["dbp_mm_hg"]
|
|
|
+ ];
|
|
|
+ }
|
|
|
+
|
|
|
+ // weight
|
|
|
+ $weight = array_filter($weightMeasurements, function($_measurement) use ($date) {
|
|
|
+ return $_measurement['effective_date'] === $date;
|
|
|
+ });
|
|
|
+ if(count($weight)) {
|
|
|
+ $weight = array_values($weight);
|
|
|
+ $weight = $weight[count($weight) - 1];
|
|
|
+ $weightData[] = [
|
|
|
+ "date" => $date,
|
|
|
+ "weight" => $weight["numeric_value"]
|
|
|
+ ];
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+$bpDates = [];
|
|
|
+$sbpValues = [];
|
|
|
+$dbpValues = [];
|
|
|
+for ($i = 0; $i < count($bpData); $i++) {
|
|
|
+ $bpDates[] = $bpData[$i]['date'];
|
|
|
+ $sbpValues[] = round($bpData[$i]['sbp'], 1);
|
|
|
+ $dbpValues[] = round($bpData[$i]['dbp'], 1);
|
|
|
+}
|
|
|
+
|
|
|
+$weightDates = [];
|
|
|
+$weightValues = [];
|
|
|
+for ($i = 0; $i < count($weightData); $i++) {
|
|
|
+ $weightDates[] = $weightData[$i]['date'];
|
|
|
+ $weightValues[] = round($weightData[$i]['weight'], 1);
|
|
|
+}
|
|
|
+
|
|
|
+?>
|
|
|
+
|
|
|
+<script>
|
|
|
+ (function() {
|
|
|
+ init();
|
|
|
+ function init() {
|
|
|
+ unifiedChart();
|
|
|
+ }
|
|
|
+ function unifiedChart() {
|
|
|
+ $('#vitalsGraphComponentUnified_{{$careMonth->id}}{{@$suffix ?: ''}}')
|
|
|
+ .empty()
|
|
|
+ .append('<div id="unified-chart_{{$careMonth->id}}{{@$suffix ?: ''}}"></div>');
|
|
|
+ window['vgUnifiedChart_{{$careMonth->id}}{{@$suffix ?: ''}}'] = c3.generate({
|
|
|
+ bindto: '#unified-chart_{{$careMonth->id}}{{@$suffix ?: ''}}',
|
|
|
+ data: {
|
|
|
+ xs: {
|
|
|
+ 'Systolic BP' : 'x1',
|
|
|
+ 'Diastolic BP' : 'x1',
|
|
|
+ 'Weight': 'x2',
|
|
|
+ },
|
|
|
+ axes: {
|
|
|
+ 'Systolic BP' : 'y',
|
|
|
+ 'Diastolic BP' : 'y',
|
|
|
+ 'Weight': 'y2',
|
|
|
+ },
|
|
|
+ columns: [
|
|
|
+ ['x1', <?= implode(", ", array_map(function($_x) { return "'" . $_x . "'"; }, $bpDates)) ?>],
|
|
|
+ ['x2', <?= implode(", ", array_map(function($_x) { return "'" . $_x . "'"; }, $weightDates)) ?>],
|
|
|
+ ['Systolic BP', <?= implode(", ", array_map(function($_x) { return "'" . $_x . "'"; }, $sbpValues)) ?>],
|
|
|
+ ['Diastolic BP', <?= implode(", ", array_map(function($_x) { return "'" . $_x . "'"; }, $dbpValues)) ?>],
|
|
|
+ ['Weight', <?= implode(", ", array_map(function($_x) { return "'" . $_x . "'"; }, $weightValues)) ?>]
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ axis: {
|
|
|
+ x: {
|
|
|
+ type: 'timeseries',
|
|
|
+ tick: {
|
|
|
+ format: '%Y-%m-%d',
|
|
|
+ multiline: true,
|
|
|
+ fit: true,
|
|
|
+ rotate: -45
|
|
|
+ },
|
|
|
+ },
|
|
|
+ y: {
|
|
|
+ show: true,
|
|
|
+ label: {
|
|
|
+ text: 'Blood Pressure (mmHg)',
|
|
|
+ position: 'outer-middle'
|
|
|
+ },
|
|
|
+ min: 60,
|
|
|
+ max: 220
|
|
|
+ },
|
|
|
+ y2: {
|
|
|
+ show: true,
|
|
|
+ label: {
|
|
|
+ text: 'Weight (lbs)',
|
|
|
+ position: 'outer-middle'
|
|
|
+ },
|
|
|
+ min: 80,
|
|
|
+ max: 280
|
|
|
+ },
|
|
|
+ },
|
|
|
+ regions: [
|
|
|
+ {axis: 'y', start: 100, end: 130, class: 'safe-region', label: 'Safe Systolic BP: 100 to 130 mmHg'},
|
|
|
+ {axis: 'y', start: 60, end: 90, class: 'safe-region', label: 'Safe Diastolic BP: 60 to 90 mmHg'}
|
|
|
+ ]
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }).call(window);
|
|
|
+</script>
|