Create bill - moe UI update

resources/views/app/patient/note/_create-bill.blade.php

@@ -1,5 +1,6 @@
+<?php $noteRates = $pro->noteRates(); ?>
 <span class="mx-2 text-secondary">|</span>
-<span moe class="">
+<div moe wide class="">
     <a class="" href="" show start>Create Bill</a>
     <form url="/api/bill/createForNote">
         <input type="hidden" name="noteUid" value="{{$note->uid}}">
@@ -8,25 +9,97 @@
             <input type="date" name="effectiveDate" class="form-control form-control-sm" value="{{date('Y-m-d')}}" required>
         </div>
         <div class="mb-2">
-            <select autofocus class="form-control" name="code">
-                <option value="">-- Select Code --</option>
-                <?php $noteRates = $pro->noteRates(); ?>
-                @if($noteRates && count($noteRates))
-                    @foreach($noteRates as $noteRate)
-                        <option value="{{ $noteRate->code }}">{{ $noteRate->code }}</option>
-                    @endforeach
+            @if($noteRates && count($noteRates))
+                @if(count($noteRates) === 1)
+                    <input type="hidden" name="code" value="{{$noteRates[0]->code}}">
+                    <p class="mb-2">Service: <b>{{ $noteRates[0]->code }} (${{ $noteRates[0]->amount }}/hr)</b></p>
+                @else
+                    <select autofocus class="form-control" name="code" onchange="switchNumberOfUnitsByType(this)">
+                        <option value="">-- Select Code --</option>
+                        @foreach($noteRates as $noteRate)
+                            <option data-amount="{{ $noteRate->amount }}" value="{{ $noteRate->code }}">{{ $noteRate->code }} (${{ $noteRate->amount }}/hr)</option>
+                        @endforeach
+                    </select>
                 @endif
-            </select>
-        </div>
-        <div class="mb-2">
-            <input type="text" name="reason1" placeholder="Reason 1" class="form-control form-control-sm">
+            @endif
         </div>
-        <div class="mb-2">
-            <input type="text" name="reason2" placeholder="Reason 2" class="form-control form-control-sm">
+
+        @if($noteRates && count($noteRates) && count($noteRates) === 1)
+            @if(strpos(strtolower($noteRates[0]->code), "hourly") !== FALSE)
+                <div class="mb-2">
+                    <select name="numberOfUnits" class="form-control form-control-sm"
+                            onchange="calculateBillAmount(this)">
+                        <option value=""> -- select -- </option>
+                        <?php for ($i = 5; $i <= 120; $i+=5) { ?>
+                        <option value="{{ $i/60 }}">{{ $i }} minutes</option>
+                        <?php } ?>
+                    </select>
+                </div>
+                <div class="mb-2" calculated-amount></div>
+            @else
+                <input type="hidden" name="numberOfUnits" value="1">
+            @endif
+        @endif
+        <div class="bill-conditional">
+
         </div>
         <div class="">
             <button class="btn btn-primary btn-sm" submit>Submit</button>
             <button class="btn btn-default border btn-sm" cancel>Cancel</button>
         </div>
     </form>
-</span>
+    <div class="d-none" hourly-template>
+        <div class="mb-2">
+            <select name="numberOfUnits" class="form-control form-control-sm"
+                    onchange="calculateBillAmount(this)">
+                <option value=""> -- select -- </option>
+                <?php for ($i = 5; $i <= 120; $i+=5) { ?>
+                    <option value="{{ $i/60 }}">{{ $i }} minutes</option>
+                <?php } ?>
+            </select>
+        </div>
+        <div class="mb-2" calculated-amount></div>
+    </div>
+    <div class="d-none" non-hourly-template>
+        <input type="hidden" name="numberOfUnits" value="1">
+    </div>
+</div>
+<script>
+    (function() {
+        let selectedCodeHourlyRate = 0;
+        @if($noteRates && count($noteRates) && count($noteRates) === 1)
+            selectedCodeHourlyRate = {{ $noteRates[0]->amount }};
+        @endif
+        window.switchNumberOfUnitsByType = function(_trigger) {
+            let container = $('.bill-conditional').empty();
+            let selected  = $(_trigger).find('option:selected');
+            if(!selected.length) return;
+            let clone = null;
+            selectedCodeHourlyRate = +selected.attr('data-amount');
+            $('[calculated-amount]').text('');
+            if(selected.text().toLowerCase().indexOf('hourly') !== -1) {
+                clone = $('[hourly-template]').clone()
+                    .removeAttr('hourly-template')
+                    .removeClass('d-none');
+            }
+            else {
+                clone = $('[non-hourly-template]').clone()
+                    .removeAttr('non-hourly-template')
+                    .removeClass('d-none');
+            }
+            clone.appendTo(container)
+            clone.focus();
+        }
+        window.calculateBillAmount = function(_trigger) {
+            let amountTarget = $('[calculated-amount]');
+            _trigger = $(_trigger);
+            if(!_trigger.find('option:selected').length) {
+                amountTarget.text('');
+                return;
+            }
+            let hours = +_trigger.find('option:selected').attr('value');
+            amountTarget.html('<b>Reimbursable Amount:</b> $' + (hours * selectedCodeHourlyRate).toFixed(2));
+        }
+    })();
+
+</script>

resources/views/app/patient/note/dashboard.blade.php

@@ -257,7 +257,7 @@
                             <tr>
                                 <th class="border-bottom-0 w-25 pl-3">HCP</th>
                                 <th class="border-bottom-0 w-25 pl-3">Code</th>
-                                <th class="border-bottom-0 w-25 pl-2">Reason</th>
+                                {{--<th class="border-bottom-0 w-25 pl-2">Reason</th>--}}
                                 <th class="border-bottom-0 pl-2">Amount</th>
                                 <th class="border-bottom-0"></th>
                             </tr>
@@ -267,10 +267,10 @@
                                 <tr>
                                     <td class="pl-3">{{ $bill->hcp->displayName() }}</td>
                                     <td class="pl-3 {{ $bill->is_cancelled ? 'text-secondary' : '' }}">{{$bill->code}}</td>
-                                    <td class="pl-2">
+                                    {{--<td class="pl-2">
                                         {{ $bill->reason1 }}
                                         <div class="text-secondary small">{{ $bill->reason2 }}</div>
-                                    </td>
+                                    </td>--}}
                                     <td class="pl-2">
                                         @if($bill->has_hcp_been_paid)
                                             <span class="text-dark">Received:</span><span class="font-weight-bold text-success ml-2">${{ $bill->hcp_payment_amount }}</span>