ERx UI [wip]

app/Models/Client.php

@@ -164,4 +164,9 @@ class Client extends Model
             ->where('is_active', true);
     }
 
+    public function tickets() {
+        return $this->hasMany(Ticket::class, 'client_id', 'id')
+            ->orderBy('created_at', 'desc');
+    }
+
 }

app/Models/Ticket.php

@@ -0,0 +1,11 @@
+<?php
+
+namespace App\Models;
+
+# use Illuminate\Database\Eloquent\Model;
+
+class Ticket extends Model
+{
+    protected $table = "ticket";
+
+}

resources/views/app/patient/action-items.blade.php

@@ -3,167 +3,12 @@
 /** @var \App\Models\Client $patient */
 ?>
 @section('inner-content')
-    <div class="">
-        <div class="d-flex align-items-center pb-2">
-            <h4 class="font-weight-bold m-0">ERx</h4>
-            <span class="mx-2 text-secondary">|</span>
-            <div moe>
-                <a start show class="py-0 font-weight-normal">Add</a>
-                <form url="/api/actionItem/create" wide>
-                    <input type="hidden" name="clientUid" value="{{ $patient->uid }}">
-                    <input type="hidden" name="prescriberProUid" value="{{ $pro->uid }}">
-                    <input type="hidden" name="category" value="DRUG">
-                    <div class="mb-2">
-                        <label for="" class="control-label text-sm text-secondary mb-1">Pharmacy</label>
-                        <select name="toFacilityUid"
-                                class="form-control form-control-sm">
-                            <option value="">-- Pharmacy --</option>
-                            @foreach ($facilities as $facility)
-                                <option value="{{$facility->uid}}">{{$facility->name}}</option>
-                            @endforeach
-                        </select>
-                    </div>
-                    <div class="mb-2">
-                        <input type="text" class="form-control form-control-sm" name="contentText" value="" placeholder="Title *" required>
-                    </div>
-                    <div class="mb-2">
-                        <input type="text" class="form-control form-control-sm" name="contentDetail" value="" placeholder="Directions">
-                    </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>
-        <table class="table table-sm table-bordered mb-0" style="table-layout: fixed">
-            <thead>
-            <tr>
-                <th class="px-2 text-secondary border-bottom-0">Pharmacy</th>
-                <th class="px-2 text-secondary border-bottom-0 w-25">Action</th>
-                <th class="px-2 text-secondary border-bottom-0">Created</th>
-                <th class="px-2 text-secondary border-bottom-0">Status</th>
-                <th class="px-2 text-secondary border-bottom-0">&nbsp;</th>
-            </tr>
-            </thead>
-            <tbody>
-            <?php $prevItemType = false; ?>
-            @foreach($patient->actionItems as $item)
-                @if($item->action_item_category === 'DRUG')
-                <tr>
-                    <td class="px-2">
-                        {{$item->facility ? $item->facility->name : ''}}
-                        <span moe>
-                            <a start show class="on-hover-opaque"><i class="fa fa-edit"></i></a>
-                            <form url="/api/actionItem/updateToFacility">
-                                <input type="hidden" name="uid" value="{{ $item->uid }}">
-                                <div class="mb-2">
-                                    <label for="" class="control-label text-sm text-secondary mb-1">Pharmacy *</label>
-                                    <select name="toFacilityUid" class="form-control form-control-sm" required>
-                                        <option value="">-- Pharmacy --</option>
-                                        @foreach ($facilities as $facility)
-                                            <option {{ $item->to_facility_id === $facility->id ? 'selected' : '' }} value="{{$facility->uid}}">{{$facility->name}}</option>
-                                        @endforeach
-                                    </select>
-                                </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>
-                        </span>
-                    </td>
-                    <td class="px-2">
-                        {{$item->content_text}}
-                        <span moe>
-                            <a start show class="on-hover-opaque"><i class="fa fa-edit"></i></a>
-                            <form url="/api/actionItem/updateContent" wide>
-                                <input type="hidden" name="uid" value="{{ $item->uid }}">
-                                <div class="mb-2">
-                                    <input type="text" class="form-control form-control-sm" name="contentText" value="{{ $item->content_text }}" placeholder="Title *" required>
-                                </div>
-                                <div class="mb-2">
-                                    <input type="text" class="form-control form-control-sm" name="contentDetail" value="{{ $item->content_detail }}" placeholder="Details">
-                                </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>
-                        </span>
-                        <div class="text-sm text-secondary">{{$item->content_detail}}</div>
-                    </td>
-                    <td class="px-2">{{friendly_date_time($item->created_at, false)}}</td>
-                    <td class="px-2">
-                        {{$item->status_category}}
-                        <span moe>
-                            <a start show class="on-hover-opaque"><i class="fa fa-edit"></i></a>
-                            <form url="/api/actionItem/updateStatus">
-                                <input type="hidden" name="uid" value="{{ $item->uid }}">
-                                <div class="mb-2">
-                                    <label for="" class="control-label text-sm text-secondary mb-1">Status *</label>
-                                    <select name="statusCategory" class="form-control form-control-sm" required>
-                                        <option {{ $item->status_category === 'OPEN' ? 'selected' : '' }} value="OPEN">Open</option>
-                                        <option {{ $item->status_category === 'CLOSED' ? 'selected' : '' }} value="CLOSED">Closed</option>
-                                    </select>
-                                </div>
-                                <div class="mb-2">
-                                    <input type="text" class="form-control form-control-sm" name="statusMemo" value="" placeholder="Memo">
-                                </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>
-                        </span>
-                    </td>
-                    <td class="px-2 text-center">
-                        <div class="d-flex align-items-center justify-content-start">
-                        @if($item->is_signed_by_prescriber)
-                            <span class="text-secondary">
-                                <i class="fa fa-check"></i>
-                                Signed
-                            </span>
-                            <span class="mx-2 text-secondary">|</span>
-                        @else
-                            @if($pro->id === $item->prescriber_pro_id)
-                                <span moe relative>
-                                    <a start show>Sign</a>
-                                    <form url="/api/actionItem/signAsPrescriber" right>
-                                        <input type="hidden" name="uid" value="{{ $item->uid }}">
-                                        <p class="small min-width-200px text-left">Sign this action items as the prescriber?</p>
-                                        <div class="d-flex align-items-center">
-                                            <button class="btn btn-sm btn-success mr-2" submit>Yes</button>
-                                            <button class="btn btn-sm btn-default mr-2 border" cancel>No</button>
-                                        </div>
-                                    </form>
-                                </span>
-                                <span class="mx-2 text-secondary">|</span>
-                            @endif
-                        @endif
-                        <span moe relative>
-                            <a start show>eFax</a>
-                            <form url="/api/actionItem/efax" right>
-                                <input type="hidden" name="uid" value="{{ $item->uid }}">
-                                <div class="mb-2">
-                                    <input type="text" class="form-control form-control-sm" name="toFaxNumber" value="" placeholder="To Number *" required>
-                                </div>
-                                <div class="d-flex align-items-center">
-                                    <button class="btn btn-sm btn-primary mr-2" submit>Send</button>
-                                    <button class="btn btn-sm btn-default mr-2 border" cancel>Cancel</button>
-                                </div>
-                            </form>
-                        </span>
-                        </div>
-                    </td>
-                </tr>
-                @endif
-            @endforeach
-            </tbody>
-        </table>
+
+    <div>
+        @include('app/patient/partials/erx')
     </div>
 
-    <div class="mt-5">
+    <div class="mt-4">
         <div class="d-flex align-items-center pb-2">
             <h4 class="font-weight-bold m-0">Orders</h4>
             <span class="mx-2 text-secondary">|</span>

resources/views/app/patient/partials/erx.blade.php

@@ -0,0 +1,261 @@
+<div id="erxApp">
+    <div class="d-flex align-items-center pb-2">
+        <h4 class="font-weight-bold m-0">ERx</h4>
+        <span class="mx-2 text-secondary">|</span>
+        <a class="py-0 font-weight-normal c-pointer" v-on:click.prevent="showPopup('erx-poppup')">Add</a>
+    </div>
+    <table class="table table-sm table-bordered mb-0" style="table-layout: fixed">
+        <thead>
+        <tr>
+            <th class="px-2 text-secondary border-bottom-0 width-30px">#</th>
+            <th class="px-2 text-secondary border-bottom-0">Medication</th>
+            <th class="px-2 text-secondary border-bottom-0">Strength</th>
+            <th class="px-2 text-secondary border-bottom-0">Amount</th>
+            <th class="px-2 text-secondary border-bottom-0">Route</th>
+            <th class="px-2 text-secondary border-bottom-0">Frequency</th>
+            <th class="px-2 text-secondary border-bottom-0">Dispense</th>
+            <th class="px-2 text-secondary border-bottom-0">Refills</th>
+            <th class="px-2 text-secondary border-bottom-0">Purpose</th>
+            <th class="px-2 text-secondary border-bottom-0">Pharmacy</th>
+            <th class="px-2 text-secondary border-bottom-0">&nbsp;</th>
+        </tr>
+        </thead>
+        <tbody>
+            <tr v-for="(item, index) in items">
+                <td class="px-2">#</td>
+                <td class="px-2">@{{item.medication}}</td>
+                <td class="px-2">@{{item.strength}}</td>
+                <td class="px-2">@{{item.amount}}</td>
+                <td class="px-2">@{{item.route}}</td>
+                <td class="px-2">@{{item.frequency}}</td>
+                <td class="px-2">@{{item.dispense}}</td>
+                <td class="px-2">@{{item.refills}}</td>
+                <td class="px-2">@{{item.purpose}}</td>
+                <td class="px-2">@{{item.pharmacy}}</td>
+                <td class="px-2 text-nowrap">
+                    <a class="mr-2 c-pointer" v-on:click.prevent="showPopup('erx-popup', item)">Edit</a>
+                    <a class="mr-2 c-pointer" v-if="item.is_open" v-on:click.prevent="closeItem(item)">Close</a>
+                    <a class="mr-2 c-pointer" v-if="!item.is_open" v-on:click.prevent="openItem(item)">Open</a>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+    <div class="stag-popup stag-popup-sm mcp-theme-1" stag-popup-key="erx-popup">
+        <form method="POST" action="/api/appointment/create">
+            <h3 class="stag-popup-title mb-2">
+                <span>@{{ popupMode === 'add' ? 'Add ERx Item' : 'Edit ERx Item' }}</span>
+                <a href="#" class="ml-auto text-secondary"
+                   onclick="return closeStagPopup()"><i class="fa fa-times-circle"></i></a>
+            </h3>
+            <div class="row mb-2">
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Medication</label>
+                    <input type="text" v-model="popupItem.medication" class="form-control form-control-sm">
+                </div>
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Strength</label>
+                    <input type="text" v-model="popupItem.strength" class="form-control form-control-sm">
+                </div>
+            </div>
+            <div class="row mb-2">
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Amount</label>
+                    <input type="text" v-model="popupItem.amount" class="form-control form-control-sm">
+                </div>
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Route</label>
+                    <input type="text" v-model="popupItem.route" class="form-control form-control-sm">
+                </div>
+            </div>
+            <div class="row mb-2">
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Frequency</label>
+                    <input type="text" v-model="popupItem.frequency" class="form-control form-control-sm">
+                </div>
+            </div>
+            <div class="row mb-2">
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Dispense</label>
+                    <input type="text" v-model="popupItem.dispense" class="form-control form-control-sm">
+                </div>
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Refills</label>
+                    <input type="text" v-model="popupItem.refills" class="form-control form-control-sm">
+                </div>
+            </div>
+            <div class="row mb-2">
+                <div class="col-12">
+                    <label class="text-sm text-secondary mb-1">Purpose</label>
+                    <input type="text" v-model="popupItem.purpose" class="form-control form-control-sm">
+                </div>
+            </div>
+            <hr class="mt-3 mb-2">
+
+            <div class="row mb-2">
+                <div class="col-12">
+                    <label class="text-sm text-secondary mb-1 font-weight-bold">Preferred Pharmacy</label>
+                </div>
+            </div>
+            <div class="row mb-2">
+                <div class="col-8">
+                    <label class="text-sm text-secondary mb-1">Business Name</label>
+                    <input type="text" v-model="popupItem.pharmacyName" class="form-control form-control-sm">
+                </div>
+            </div>
+            <div class="row mb-2">
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">City</label>
+                    <input type="text" v-model="popupItem.pharmacyCity" class="form-control form-control-sm">
+                </div>
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">State</label>
+                    <input type="text" v-model="popupItem.pharmacyState" class="form-control form-control-sm">
+                </div>
+            </div>
+            <div class="row mb-2">
+                <div class="col-12">
+                    <label class="text-sm text-secondary mb-1">Address Memo</label>
+                    <input type="text" v-model="popupItem.pharmacyAddressMemo" class="form-control form-control-sm">
+                </div>
+            </div>
+            <div class="row mb-2">
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Phone</label>
+                    <input type="text" v-model="popupItem.pharmacyPhone" class="form-control form-control-sm">
+                </div>
+                <div class="col-6">
+                    <label class="text-sm text-secondary mb-1">Fax</label>
+                    <input type="text" v-model="popupItem.pharmacyFax" class="form-control form-control-sm">
+                </div>
+            </div>
+
+            <div class="d-flex align-items-center justify-content-center mt-3">
+                <button type="button" class="btn btn-sm btn-primary mr-2" v-on:click.prevent="savePopupItem()">Submit</button>
+                <button type="button" class="btn btn-sm btn-default border" onclick="return closeStagPopup()">Cancel</button>
+            </div>
+        </form>
+    </div>
+</div>
+<script>
+    (function() {
+        <?php
+        $tickets = $patient->tickets->filter(function($_item) {
+            return $_item->category === 'erx';
+        });
+        $items = [];
+        foreach ($tickets as $ticket) {
+            $item = json_decode($ticket->data);
+            $item->uid = $ticket->uid;
+            $item->is_open = $ticket->is_open;
+            $items[] = $item;
+        }
+        ?>
+        function init() {
+            let items = [];
+            let erxApp = new Vue({
+                el: '#erxApp',
+                delimiters: ['@{{', '}}'],
+                data: {
+                    popupMode: 'add',
+                    items: {!! json_encode($items) !!},
+                    popupItem: {
+                        uid: '',
+                        is_open: true,
+                        medication: '',
+                        strength: '',
+                        amount: '',
+                        route: '',
+                        frequency: '',
+                        dispense: '',
+                        refills: '',
+                        purpose: '',
+                        pharmacyName: '',
+                        pharmacyCity: '',
+                        pharmacyState: '',
+                        pharmacyAddressMemo: '',
+                        pharmacyPhone: '',
+                        pharmacyFax: '',
+                    },
+                },
+                methods: {
+                    showPopup: function(_name, _item) {
+                        closeStagPopup();
+                        this.popupMode = _item ? 'edit' : 'add';
+                        this.popupItem = _item ? _item : {
+                            uid: '',
+                            is_open: true,
+                            medication: '',
+                            strength: '',
+                            amount: '',
+                            route: '',
+                            frequency: '',
+                            dispense: '',
+                            refills: '',
+                            purpose: '',
+                            pharmacy: '',
+                            pharmacyName: '',
+                            pharmacyCity: '',
+                            pharmacyState: '',
+                            pharmacyAddressMemo: '',
+                            pharmacyPhone: '',
+                            pharmacyFax: '',
+                        };
+                        showStagPopup('erx-popup');
+                    },
+                    savePopupItem: function() {
+                        let form = $('#erxApp form').first();
+                        if(!form[0].checkValidity()) {
+                            form[0].reportValidity();
+                            return false;
+                        }
+
+                        // showMask();
+                        let payload = {};
+                        if(this.popupMode === 'add') {
+                            payload.clientUid = '{{ $patient->uid }}';
+                            payload.category = 'erx';
+                            payload.assignedProUid = '{{ $pro->uid  }}';
+                            payload.managerProUid = '{{ $pro->uid  }}';
+                            payload.orderingProUid = '{{ $pro->uid  }}';
+                            payload.initiatingProUid = '{{ $pro->uid  }}';
+                            payload.data = JSON.stringify(this.popupItem);
+                        }
+                        else {
+                            payload.uid = this.popupItem.uid;
+                            payload.newData = JSON.stringify(this.popupItem);
+                        }
+
+                        $.post(
+                            '/api/ticket/' + (this.popupMode === 'add' ? 'create' : 'updateData'),
+                            payload,
+                            function(_data) {
+                                console.log(_data);
+                                fastReload();
+                            },
+                            'json');
+
+                        return false;
+                    },
+                    closeItem: function(_item) {
+                        $.post('/api/ticket/close', {
+                            uid: _item.uid
+                        }, function(_data) {
+                            fastReload();
+                        });
+                    },
+                    openItem: function(_item) {
+                        $.post('/api/ticket/open', {
+                            uid: _item.uid
+                        }, function(_data) {
+                            fastReload();
+                        });
+                    }
+                },
+                mounted: function () {
+
+                }
+            })
+        }
+        addMCInitializer('erx', init, '#erxApp');
+    })();
+</script>