Erx UI - Edit HCP Pro

public/css/style.css

@@ -1021,6 +1021,9 @@ body .node input[type="number"] {
     padding: 0.75rem;
     min-height: 220px;
 }
+.stag-popup.min-height-unset>form {
+    min-height: unset !important;
+}
 .stag-popup.wide>form, .stag-popup.wide>.stag-popup-content {
     width: calc(100% - 4rem);
 }

resources/views/app/patient/prescriptions/hcp-pro-form.blade.php

@@ -1,58 +1,20 @@
-<div class="stag-popup stag-popup-sm mcp-theme-1" stag-popup-key="logistics-popup">
-    <form method="POST" action="">
+<div class="stag-popup stag-popup-sm mcp-theme-1 min-height-unset" stag-popup-key="hcp-pro-popup">
+    <form method="POST" action="" class="overflow-visible">
         <h3 class="stag-popup-title mb-2">
             <span>HCP Pro</span>
             <a href="#" class="ml-auto text-secondary"
                onclick="return closeStagPopup()"><i class="fa fa-times-circle"></i></a>
         </h3>
         <div class="mb-2">
-            <label class="text-sm text-secondary mb-1">Pro</label>
-            <select class="form-control form-control-sm min-width-unset"
+            <label class="text-sm text-secondary mb-1">HCP Pro</label>
+            <select class="form-control form-control-sm min-width-unset erx-hcp-pro-select"
                     provider-search
-                    v-model="currentPrescriptionLogistics.logisticsDetailJson.facilityName">
+                    :data-pro-uid="currentPrescriptionHcpPro.newHcpProUid ?? ''"
+                    v-model="currentPrescriptionHcpPro.newHcpProUid">
             </select>
         </div>
-        <div class="row">
-            <div class="col-4 pr-0">
-                <div class="mb-2">
-                    <label class="text-sm text-secondary mb-1">City</label>
-                    <input type="text" class="form-control form-control-sm min-width-unset"
-                           v-model="currentPrescriptionLogistics.logisticsDetailJson.facilityCity">
-                </div>
-            </div>
-            <div class="col-4 pr-0">
-                <div class="mb-2">
-                    <label class="text-sm text-secondary mb-1">State</label>
-                    <input type="text" class="form-control form-control-sm min-width-unset"
-                           v-model="currentPrescriptionLogistics.logisticsDetailJson.facilityState">
-                </div>
-            </div>
-            <div class="col-4">
-                <div class="mb-2">
-                    <label class="text-sm text-secondary mb-1">ZIP</label>
-                    <input type="text" class="form-control form-control-sm min-width-unset"
-                           v-model="currentPrescriptionLogistics.logisticsDetailJson.facilityZip">
-                </div>
-            </div>
-        </div>
-        <div class="row">
-            <div class="col-6 pr-0">
-                <div class="mb-2">
-                    <label class="text-sm text-secondary mb-1">Phone</label>
-                    <input type="text" class="form-control form-control-sm min-width-unset"
-                           v-model="currentPrescriptionLogistics.logisticsDetailJson.facilityPhone">
-                </div>
-            </div>
-            <div class="col-6">
-                <div class="mb-2">
-                    <label class="text-sm text-secondary mb-1">Fax</label>
-                    <input type="text" class="form-control form-control-sm min-width-unset"
-                           v-model="currentPrescriptionLogistics.logisticsDetailJson.facilityFax">
-                </div>
-            </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="saveLogistics()">Submit
+            <button type="button" class="btn btn-sm btn-primary mr-2" v-on:click.prevent="saveHcpPro()">Submit
             </button>
             <button type="button" class="btn btn-sm btn-default border" onclick="return closeStagPopup()">Cancel
             </button>

resources/views/app/patient/prescriptions/index.blade.php

@@ -78,7 +78,12 @@
                         <div v-else>-</div>
                     </div>
                 </td>
-                <td class="px-2">@{{prescription.hcpProDisplayName}}</td>
+                <td class="px-2">
+                    <div class="d-flex align-items-baseline">
+                        <a class="mr-2" href="#" v-on:click.prevent="editHcpPro(prescription)"><i class="fa fa-edit on-hover-opaque"></i></a>
+                        <div>@{{prescription.hcpProDisplayName}}</div>
+                    </div>
+                </td>
                 <td class="px-2"></td>
                 <td class="px-2">@{{prescription.pro_declared_status}}</td>
                 <td class="px-2">@{{prescription.client_declared_status}}</td>
@@ -93,6 +98,7 @@
         @include('app.patient.prescriptions.supply-form')
         @include('app.patient.prescriptions.other-form')
         @include('app.patient.prescriptions.logistics-form')
+        @include('app.patient.prescriptions.hcp-pro-form')
     </div>
     <script>
         (function() {
@@ -108,12 +114,13 @@
                 }
                 $prescription->created_at_friendly = friendlier_date_time($prescription->created_at);
                 $prescription->hcpProDisplayName = $prescription->hcpPro ? $prescription->hcpPro->displayName() : '-';
+                $prescription->hcpProUid = $prescription->hcpPro ? $prescription->hcpPro->uid : '';
             }
             ?>
 
             function init() {
 
-                new Vue({
+                window.booApp = new Vue({
                     el: '#prescriptions-{{$patient->id}}',
                     delimiters: ['@{{', '}}'],
                     data: {
@@ -121,6 +128,8 @@
 
                         currentPrescriptionAction: '',
                         currentPrescriptionType: '',
+
+                        // for editing clinical details
                         currentPrescription_DRUG: {
                             noteUid: null, // TODO: this won't be null if created from a note
                             clientUid: '{{ $patient->uid }}',
@@ -197,7 +206,7 @@
                             }
                         },
 
-
+                        // for editing logistics - common
                         currentPrescriptionLogistics: {
                             uid: '',
                             logisticsDetailJson: {
@@ -209,7 +218,27 @@
                                 facilityFax: '',
                                 facilityZip: '',
                             }
-                        }
+                        },
+
+                        // for editing hcp, sign, pro status & client status - common
+                        currentPrescriptionHcpPro: {
+                            uid: '',
+                            newHcpProUid: '',
+                        },
+                        currentPrescriptionSign: {
+                            uid: '',
+                            declaredVersionNumber: '',
+                        },
+                        currentPrescriptionProStatus: {
+                            uid: '',
+                            status: '',
+                            memo: '',
+                        },
+                        currentPrescriptionClientStatus: {
+                            uid: '',
+                            status: '',
+                            memo: '',
+                        },
                     },
                     methods: {
 
@@ -362,13 +391,65 @@
                                     fastReload();
                                 }
                             }, 'json');
-                        }
+                        },
 
                         // edit hcp (ordering) pro
+                        editHcpPro: function(_prescription) {
+                            this.currentPrescriptionAction = 'EDIT_HCP_PRO';
+                            this.currentPrescriptionType = _prescription.erx_category;
+                            this.currentPrescriptionHcpPro = {
+                                uid: _prescription.uid,
+                                newHcpProUid: _prescription.hcpProUid
+                            };
+                            Vue.nextTick(() => {
+                                showStagPopup('hcp-pro-popup', true);
+                                $('.erx-hcp-pro-select').removeAttr('pro-suggest-initialized');
+                                initProSuggest();
+                            });
+                        },
+                        saveHcpPro: function() {
+                            let payload = JSON.parse(JSON.stringify(this.currentPrescriptionHcpPro));
+                            $.post('/api/erx/updateHcpPro', payload, _data => {
+                                if(!hasResponseError(_data)) {
+                                    toastr.success('HCP Pro updated');
+                                    closeStagPopup();
+                                    fastReload();
+                                }
+                            }, 'json');
+                        },
+
+                        // edit sign
+                        editHcpProSign: function(_prescription) {
+
+                        },
+                        saveHcpProSign: function() {
+
+                        },
+
+                        // edit pro status
+                        editHcpProStatus: function(_prescription) {
+
+                        },
+                        saveHcpProStatus: function() {
+
+                        },
+
+                        // edit sign
+                        editHcpClientStatus: function(_prescription) {
+
+                        },
+                        saveHcpClientStatus: function() {
+
+                        },
+
+                        // cancel, etc.
 
                     },
                     mounted: function() {
-
+                        let self = this;
+                        $(document).on('pro-changed', '.erx-hcp-pro-select', function() {
+                            self.currentPrescriptionHcpPro.newHcpProUid = this.value;
+                        });
                     }
                 });