Client single > RM setup (complete)

public/css/style.css

@@ -582,6 +582,12 @@ input.search_field, textarea.search_field {
     font-weight: bold !important;
     color: #000 !important;
 }
+#caremonth-measurements-calendar table.table-condensed td[has-events],
+#caremonth-measurements-calendar td.has-events a {
+    background: #c5e4ff !important;
+    font-weight: bold !important;
+    color: #000 !important;
+}
 .ui-state-active,
 .ui-widget-content .ui-state-active,
 .ui-widget-header .ui-state-active,
@@ -1685,6 +1691,16 @@ th.only-screen, td.only-screen {
     width: 100%;
     border: 0 !important;
 }
+#caremonth-measurements-calendar>.ui-datepicker-inline {
+    width: 100%;
+}
+#caremonth-measurements-calendar .ui-datepicker-prev,
+#caremonth-measurements-calendar .ui-datepicker-next {
+    display: none;
+}
+#caremonth-measurements-calendar {
+    pointer-events: none !important;
+}
 #simpleSMSReminderComponent input[type="time"] {
     max-width: 90px;
     min-width: unset !important;

resources/views/app/patient/rm-setup.blade.php

@@ -2,7 +2,7 @@
 
 @section('inner-content')
 
-    <h4 class="font-weight-bold mb-3 text-secondary font-size-16">RM Setup</h4>
+    <h4 class="font-weight-bold mb-3 text-secondary font-size-16" id="rm-setup">RM Setup</h4>
 
     <hr class="m-neg-4">
     <div class="d-flex align-items-baseline mb-3">
@@ -209,7 +209,6 @@
             ->orderBy('ts', 'DESC')
             ->first();
     }
-    // dump($bpMeasurements);
     $weightMeasurements = [];
     if($weightScale) {
         $weightMeasurements["first"] = \App\Models\Measurement
@@ -225,14 +224,14 @@
             ->orderBy('ts', 'DESC')
             ->first();
     }
-    // dump($weightMeasurements);
+    $careMonth = $patient->currentCareMonth();
     ?>
 
     <hr class="m-neg-4">
     @if($bpDevice)
         <div class="mb-3">
             <div class="d-flex align-items-baseline mb-2">
-                <span class="width-200px">Cellular BP Device</span>
+                <span class="width-200px font-weight-bold">Cellular BP Device</span>
                 <b class="ml-3">Yes</b>
                 <span class="ml-3 text-secondary">IMEI: {{$bpDevice->device->imei}}</span>
             </div>
@@ -282,7 +281,7 @@
     @if($weightScale)
         <div class="mb-3">
             <div class="d-flex align-items-baseline mb-2">
-                <span class="width-200px">Cellular Weight Scale</span>
+                <span class="width-200px font-weight-bold">Cellular Weight Scale</span>
                 <b class="ml-3">Yes</b>
                 <span class="ml-3 text-secondary">IMEI: {{$weightScale->device->imei}}</span>
             </div>
@@ -328,4 +327,71 @@
         </div>
     @endif
 
+    @if($careMonth && ($bpDevice || $weightScale))
+        <hr class="m-neg-4">
+        <div class="d-flex align-items-baseline mb-1">
+            <span class="width-200px">Measurement days this month:</span>
+            <div class="ml-3">
+                <b>{{$careMonth->number_of_days_with_remote_measurements}} days</b>
+                <div id="caremonth-measurements-calendar" class="width-300px mt-2"></div>
+            </div>
+        </div>
+
+        <hr class="m-neg-4">
+        <?php
+        $measurementsInCareMonth = $patient->measurementsInCareMonth($careMonth);
+        $datesWithMeasurements = [];
+        foreach($measurementsInCareMonth as $measurement) {
+            if(!empty($measurement->label) && !in_array($measurement->label, ["SBP", "DBP"])/* && !$measurement->is_cellular_zero*/) {
+                if ($measurement->ts) {
+                    $timestampInSec = floor($measurement->ts / 1000);
+                    $measurement->start = postgres_date_time_short_with_tz_from_timestamp($timestampInSec, 'EASTERN');
+                    $start_date_only = substr($measurement->start, 0, 10);
+                    if(!in_array($start_date_only, $datesWithMeasurements)) {
+                        $datesWithMeasurements[] = $start_date_only;
+                    }
+                }
+            }
+        }
+        ?>
+
+    @endif
+
+    <link href='/fullcalendar-5.3.2/lib/main.css' rel='stylesheet' />
+    <script src='/fullcalendar-5.3.2/lib/main.js'></script>
+    <script>
+        (function() {
+            function formatDate(date) {
+                let d = new Date(date),
+                    month = '' + (d.getMonth() + 1),
+                    day = '' + d.getDate(),
+                    year = d.getFullYear();
+                if (month.length < 2)
+                    month = '0' + month;
+                if (day.length < 2)
+                    day = '0' + day;
+                return [year, month, day].join('-');
+            }
+            function init() {
+                @if(count($datesWithMeasurements))
+                let datesWithMeasurements = {!! json_encode($datesWithMeasurements) !!};
+                let calendarElem = $('#caremonth-measurements-calendar');
+                calendarElem.datepicker({
+                    dateFormat: 'yy-mm-dd',
+                    onSelect: function(_date) {},
+                    onChangeMonthYear: function(_year, _month) {},
+                    beforeShowDay: function(d) {
+                        if(datesWithMeasurements.indexOf(formatDate(d)) !== -1) {
+                            return [true, 'has-events'];
+                        }
+                        return [true, 'no-events'];
+                    }
+                });
+
+                @endif
+            }
+            addMCInitializer('rm-setup', init, '#rm-setup')
+        }).call(window);
+    </script>
+
 @endsection