New CGM measurement ui (include)

resources/views/app/patient/measurements.blade.php

@@ -66,6 +66,10 @@
 {{--                    </form>--}}
 {{--                </div>--}}
 {{--                @endif--}}
+
+                <span class="mx-2 text-secondary">|</span>
+                @include('app.patient.partials.add-cgm-measurement')
+
             </div>
             <table class="table table-striped table-sm table-bordered mt-2 mb-0">
                 <thead class="bg-light">

resources/views/app/patient/partials/add-cgm-measurement.blade.php

@@ -0,0 +1,100 @@
+<div id="add-cgm-measurement-container">
+    <div moe>
+        <a start show class="py-0 font-weight-normal">Add Glucose Measurement</a>
+        <form url="/api/measurement/createForCGM">
+            <input type="hidden" name="clientUid" value="{{ $patient->uid }}">
+            <p class="font-weight-bold text-secondary mb-2">Add BP Measurement</p>
+
+            <div class="mb-2">
+                <label class="text-secondary text-sm mb-1">Type:</label>
+                <select class="form-control form-control-sm" name="cgmReadingType" required>
+                    <option value="">-- select --</option>
+                    <option value="day-average">Daily Average</option>
+                    <option value="single">Single Measurement</option>
+                </select>
+            </div>
+
+            <input type="checkbox" class="d-none" name="cgmIsDailyAverage">
+
+            <div if-type-any class="d-none">
+
+                <div if-type-single class="d-none">
+                    <div class="mb-2">
+                        <label class="text-secondary text-sm mb-1">Blood Glucose Min (mg/dL):</label>
+                        <input type="number" class="form-control form-control-sm" name="cgmMin" value="">
+                    </div>
+                    <div class="mb-2">
+                        <label class="text-secondary text-sm mb-1">Blood Glucose Max (mg/dL):</label>
+                        <input type="number" class="form-control form-control-sm" name="cgmMax" value="">
+                    </div>
+                </div>
+
+                <div if-type-day-average class="d-none">
+                    <div class="mb-2">
+                        <label class="text-secondary text-sm mb-1">Blood Glucose Day Average (mg/dL):</label>
+                        <input type="number" class="form-control form-control-sm" name="cgmDailyAverage" value="">
+                    </div>
+                </div>
+
+                <div class="mb-2">
+                    <label class="text-secondary text-sm mb-1">Date:</label>
+                    <input type="date" class="form-control form-control-sm" name="effectiveDate" max="{{ date('Y-m-d') }}" value="{{ date('Y-m-d') }}">
+                </div>
+
+                <div if-type-single class="d-none">
+                    <div class="mb-2">
+                        <label class="text-secondary text-sm mb-1">Time:</label>
+                        <input type="time" class="form-control form-control-sm" name="timeOfDay" max="{{ date('H:m') }}" value="{{ date('H:m') }}">
+                    </div>
+                    <div class="mb-2">
+                        <label class="text-secondary text-sm mb-1">Timezone:</label>
+                        <select class="form-control form-control-sm" name="timeZone">
+                            <option value="EASTERN">EASTERN</option>
+                            <option value="CENTRAL">CENTRAL</option>
+                            <option value="MOUNTAIN">MOUNTAIN</option>
+                            <option value="PACIFIC">PACIFIC</option>
+                            <option value="ALASKA">ALASKA</option>
+                            <option value="HAWAII">HAWAII</option>
+                            <option value="PUERTO_RICO">PUERTO_RICO</option>
+                        </select>
+                    </div>
+                </div>
+
+                <div class="mb-2">
+                    <label class="text-secondary text-sm mb-1">Memo:</label>
+                    <textarea name="reasonMemo" class="form-control input-sm"></textarea>
+                </div>
+            </div>
+
+            <div class="d-flex align-items-center">
+                <button class="btn btn-sm btn-primary mr-2" submit>Save</button>
+                <button class="btn btn-sm btn-default mr-2 border" cancel>Cancel</button>
+            </div>
+        </form>
+    </div>
+</div>
+
+<script>
+    (function() {
+        function init() {
+            let form = $('#add-cgm-measurement-container').find('form').first();
+            form.find('[name="cgmReadingType"]')
+                .off('change')
+                .on('change', function() {
+                    form.find('[if-type-any]').addClass('d-none');
+                    form.find('[if-type-day-average]').addClass('d-none');
+                    form.find('[if-type-single]').addClass('d-none');
+                    let val = $(this).val();
+                    if(!!val) {
+                        form.find('[if-type-any]').removeClass('d-none');
+                    }
+                    if(val === 'day-average' || val === 'single') {
+                        form.find('[if-type-'+ val +']').removeClass('d-none');
+                        form.find('[name="cgmIsDailyAverage"]').prop('checked', val === 'day-average' ? true : false);
+                    }
+                    return false;
+                })
+        }
+        addMCInitializer('add-cgm-measurement', init, '#add-cgm-measurement-container')
+    }).call(window);
+</script>