ERx - new UI with data input when doing "+ New" (all except DRUG)

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

@@ -375,6 +375,11 @@
     @include('app.patient.prescriptions.pro-status-form')
     @include('app.patient.prescriptions.client-status-form')
     @include('app.patient.prescriptions.transmit-form')
+
+    @include('app.patient.prescriptions.new-lab-form')
+    @include('app.patient.prescriptions.new-imaging-form')
+    @include('app.patient.prescriptions.new-referral-form')
+    @include('app.patient.prescriptions.new-other-form')
 </div>
 <?php
 $uCounts = [];
@@ -503,6 +508,30 @@ GROUP BY erx_category");
                             ]
                         }
                     },
+                    newPrescription_LAB: {
+                        noteUid: '{{ @$note ? $note->uid : '' }}',
+                        clientUid: '{{ $patient->uid }}',
+                        replacesCancelledErxUid: null, // TODO: step-2 support UI to mark a new one as replacing a cancelled one
+                        hcpProUid: '{{$pro->uid}}',
+                        erxCategory: 'LAB',
+                        clinicalDetailJson: {
+                            items: [
+                                {
+                                    tests: [
+                                        {
+                                            desc: '',
+                                        }
+                                    ],
+                                    icds: [
+                                        {
+                                            code: '',
+                                            desc: '',
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    },
                     currentPrescription_IMAGING: {
                         noteUid: '{{ @$note ? $note->uid : '' }}',
                         clientUid: '{{ $patient->uid }}',
@@ -527,6 +556,30 @@ GROUP BY erx_category");
                             ]
                         }
                     },
+                    newPrescription_IMAGING: {
+                        noteUid: '{{ @$note ? $note->uid : '' }}',
+                        clientUid: '{{ $patient->uid }}',
+                        replacesCancelledErxUid: null, // TODO: step-2 support UI to mark a new one as replacing a cancelled one
+                        hcpProUid: '{{$pro->uid}}',
+                        erxCategory: 'IMAGING',
+                        clinicalDetailJson: {
+                            items: [
+                                {
+                                    tests: [
+                                        {
+                                            desc: '',
+                                        }
+                                    ],
+                                    icds: [
+                                        {
+                                            code: '',
+                                            desc: '',
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    },
                     currentPrescription_REFERRAL: {
                         noteUid: '{{ @$note ? $note->uid : '' }}',
                         clientUid: '{{ $patient->uid }}',
@@ -538,6 +591,17 @@ GROUP BY erx_category");
                             memo: '',
                         }
                     },
+                    newPrescription_REFERRAL: {
+                        noteUid: '{{ @$note ? $note->uid : '' }}',
+                        clientUid: '{{ $patient->uid }}',
+                        replacesCancelledErxUid: null, // TODO: step-2 support UI to mark a new one as replacing a cancelled one
+                        hcpProUid: '{{$pro->uid}}',
+                        erxCategory: 'REFERRAL',
+                        clinicalDetailJson: {
+                            to: '',
+                            memo: '',
+                        }
+                    },
                     currentPrescription_OTHER: {
                         noteUid: '{{ @$note ? $note->uid : '' }}',
                         clientUid: '{{ $patient->uid }}',
@@ -549,6 +613,17 @@ GROUP BY erx_category");
                             memo: '',
                         }
                     },
+                    newPrescription_OTHER: {
+                        noteUid: '{{ @$note ? $note->uid : '' }}',
+                        clientUid: '{{ $patient->uid }}',
+                        replacesCancelledErxUid: null, // TODO: step-2 support UI to mark a new one as replacing a cancelled one
+                        hcpProUid: '{{$pro->uid}}',
+                        erxCategory: 'OTHER',
+                        clinicalDetailJson: {
+                            title: '',
+                            memo: '',
+                        }
+                    },
 
                     // for editing logistics - common
                     currentPrescriptionLogistics: {
@@ -564,6 +639,19 @@ GROUP BY erx_category");
                         }
                     },
 
+                    newPrescriptionLogistics: {
+                        uid: '',
+                        logisticsDetailJson: {
+                            facilityName: '',
+                            facilityCity: '',
+                            facilityState: '',
+                            facilityAddressMemo: '',
+                            facilityPhone: '',
+                            facilityFax: '',
+                            facilityZip: '',
+                        }
+                    },
+
                     // for editing hcp, sign, pro status & client status - common
                     currentPrescriptionHcpPro: {
                         uid: '',
@@ -618,22 +706,99 @@ GROUP BY erx_category");
                             toastr.error('There is already an unsigned ERx of type ' + _type + ' in this note.');
                             return false;
                         }
-
-                        let payload = {
-                            noteUid: '{{ @$note ? $note->uid : '' }}',
-                            clientUid: '{{$patient->uid}}',
-                            hcpProUid: '{{$patient->mcp->uid}}',
-                            erxCategory: _type
-                        };
-                        $.post('/api/erx/create', payload, _data => {
-                            if(!hasResponseError(_data)) {
-                                fastReload();
+                        if(_type === 'DRUG') {
+                            let payload = {
+                                noteUid: '{{ @$note ? $note->uid : '' }}',
+                                clientUid: '{{$patient->uid}}',
+                                hcpProUid: '{{$patient->mcp->uid}}',
+                                erxCategory: _type
+                            };
+                            $.post('/api/erx/create', payload, _data => {
+                                if(!hasResponseError(_data)) {
+                                    fastReload();
+                                }
+                            }, 'json');
+                        }
+                        else {
+                            // show popup for all others
+                            switch (_type) {
+                                case 'LAB':
+                                case 'IMAGING':
+                                    this['newPrescription_' + _type] = {
+                                        noteUid: '{{ @$note ? $note->uid : '' }}',
+                                            clientUid: '{{ $patient->uid }}',
+                                            replacesCancelledErxUid: null, // TODO: step-2 support UI to mark a new one as replacing a cancelled one
+                                            hcpProUid: '{{$pro->uid}}',
+                                            erxCategory: _type,
+                                            clinicalDetailJson: {
+                                                items: [
+                                                    {
+                                                        tests: [
+                                                            {
+                                                                desc: '',
+                                                            }
+                                                        ],
+                                                        icds: [
+                                                            {
+                                                                code: '',
+                                                                desc: '',
+                                                            }
+                                                        ]
+                                                    }
+                                                ]
+                                            }
+                                    };
+                                    break;
+                                case 'REFERRAL':
+                                    this.newPrescription_REFERRAL = {
+                                        noteUid: '{{ @$note ? $note->uid : '' }}',
+                                        clientUid: '{{ $patient->uid }}',
+                                        replacesCancelledErxUid: null, // TODO: step-2 support UI to mark a new one as replacing a cancelled one
+                                        hcpProUid: '{{$pro->uid}}',
+                                        erxCategory: 'REFERRAL',
+                                        clinicalDetailJson: {
+                                            to: '',
+                                            memo: '',
+                                        }
+                                    };
+                                    break;
+                                case 'OTHER':
+                                    newPrescription_OTHER = {
+                                        noteUid: '{{ @$note ? $note->uid : '' }}',
+                                        clientUid: '{{ $patient->uid }}',
+                                        replacesCancelledErxUid: null, // TODO: step-2 support UI to mark a new one as replacing a cancelled one
+                                        hcpProUid: '{{$pro->uid}}',
+                                        erxCategory: 'OTHER',
+                                        clinicalDetailJson: {
+                                            title: '',
+                                            memo: '',
+                                        }
+                                    };
+                                    break;
                             }
-                        }, 'json');
+                            this.newPrescriptionLogistics = {
+                                uid: '',
+                                logisticsDetailJson: {
+                                    facilityName: '',
+                                    facilityCity: '',
+                                    facilityState: '',
+                                    facilityAddressMemo: '',
+                                    facilityPhone: '',
+                                    facilityFax: '',
+                                    facilityZip: '',
+                                }
+                            };
+                            this.currentPrescriptionType = _type;
+                            Vue.nextTick(() => {
+                                showStagPopup('new-prescription-popup-' + _type, true);
+                                $('[stag-popup-key="new-prescription-popup-' + _type + '"] [stag-suggest-initialized]').removeAttr('stag-suggest-initialized');
+                                initStagSuggest();
+                            });
+                        }
                         return false;
                     },
-                    addTestSet: function() {
-                        this['currentPrescription_' + this.currentPrescriptionType].clinicalDetailJson.items.push({
+                    addTestSet: function(_new = false) {
+                        this[(_new ? 'new' : 'current') + 'Prescription_' + this.currentPrescriptionType].clinicalDetailJson.items.push({
                             tests: [
                                 {
                                     desc: '',
@@ -895,6 +1060,19 @@ GROUP BY erx_category");
                         }
                     },
 
+                    saveNewPrescription: function() {
+                        let payload = JSON.parse(JSON.stringify(this['newPrescription_' + this.currentPrescriptionType]));
+                        payload.clinicalDetailJson = JSON.stringify(payload.clinicalDetailJson);
+                        payload.logisticsDetailJson = JSON.stringify(this.newPrescriptionLogistics.logisticsDetailJson);
+                        $.post('/api/erx/create', payload, _data => {
+                            if(!hasResponseError(_data)) {
+                                toastr.success('Prescription added');
+                                closeStagPopup();
+                                fastReload();
+                            }
+                        }, 'json');
+                    },
+
                     // edit logistics
                     editLogisticsDetails: function(_prescription) {
                         this.currentPrescriptionAction = 'EDIT_LOGISTICS';
@@ -1380,6 +1558,30 @@ GROUP BY erx_category");
                             self.currentPrescriptionLogistics.logisticsDetailJson.facilityFax = _data.fax;
                         }
                     });
+
+                    $('[stag-popup-key="new-prescription-popup-LAB"] .facility-search').off('stag-suggest-selected');
+                    $('[stag-popup-key="new-prescription-popup-LAB"] .facility-search').on('stag-suggest-selected', (_e, _input, _data) => {
+                        if(self.newPrescriptionLogistics && self.newPrescriptionLogistics.logisticsDetailJson) {
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityName = _data.name;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityCity = _data.city;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityState = _data.state;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityZip = _data.zip;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityPhone = _data.phone;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityFax = _data.fax;
+                        }
+                    });
+
+                    $('[stag-popup-key="new-prescription-popup-IMAGING"] .facility-search').off('stag-suggest-selected');
+                    $('[stag-popup-key="new-prescription-popup-IMAGING"] .facility-search').on('stag-suggest-selected', (_e, _input, _data) => {
+                        if(self.newPrescriptionLogistics && self.newPrescriptionLogistics.logisticsDetailJson) {
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityName = _data.name;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityCity = _data.city;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityState = _data.state;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityZip = _data.zip;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityPhone = _data.phone;
+                            self.newPrescriptionLogistics.logisticsDetailJson.facilityFax = _data.fax;
+                        }
+                    });
                 }
             });
 

resources/views/app/patient/prescriptions/new-imaging-form.blade.php

@@ -0,0 +1,123 @@
+<div class="stag-popup stag-popup-md mcp-theme-1" stag-popup-key="new-prescription-popup-IMAGING">
+    <form method="POST" action="" class="overflow-visible">
+        <h3 class="stag-popup-title mb-2">
+            <span>Imaging Prescription</span>
+            <a href="#" class="ml-auto text-secondary"
+               onclick="return closeStagPopup()"><i class="fa fa-times-circle"></i></a>
+        </h3>
+
+        <div class="d-flex align-items-baseline mt-3">
+            <span class="font-weight-bold mr-3">Test Sets</span>
+            <a href="#" v-on:click.prevent="addTestSet(true)">Add Test Set</a>
+        </div>
+
+        <div v-for="(item, itemIndex) in newPrescription_IMAGING.clinicalDetailJson.items" class="border bg-light px-2 pt-2 pb-1 my-2">
+            <div class="row">
+                <div class="col-6 pr-2">
+                    <div class="d-flex align-items-baseline mb-1">
+                        <span class="text-secondary mr-3">Tests</span>
+                        <a href="#" v-on:click.prevent="addTest(item)">Add Test</a>
+                    </div>
+                    <div v-for="(test, testIndex) in item.tests" class="d-flex align-items-baseline mb-1">
+                        <div class="position-relative flex-grow-1">
+                            <input type="text" class="min-width-unset form-control form-control-sm" data-option-list v-model="test.desc">
+                            <div class="data-option-list">
+                                <div>Complete Blood Count</div>
+                                <div>Prothrombin Time</div>
+                                <div>Basic Metabolic Panel</div>
+                                <div>Comprehensive Metabolic Panel</div>
+                                <div>Lipid Panel</div>
+                                <div>Liver Panel</div>
+                                <div>Thyroid Stimulating Hormone</div>
+                                <div>Hemoglobin A1C</div>
+                                <div>Urinalysis</div>
+                            </div>
+                        </div>
+                        <a href="#" v-if="item.tests && item.tests.length > 1" v-on:click.prevent="deleteTest(item, testIndex)" class="pl-2">
+                            <i class="fa fa-trash-alt text-danger on-hover-opaque"></i>
+                        </a>
+                        <span v-if="item.tests && item.tests.length === 1" class="pl-2">
+                            <i class="fa fa-trash-alt text-secondary on-hover-opaque"></i>
+                        </span>
+                    </div>
+                </div>
+                <div class="col-6 pl-2 border-left">
+                    <div class="d-flex align-items-baseline mb-1">
+                        <span class="text-secondary mr-3">ICDs</span>
+                        <a href="#" v-on:click.prevent="addICD(item)">Add ICD</a>
+                    </div>
+                    <div v-for="(icd, icdIndex) in item.icds" class="d-flex align-items-baseline mb-1">
+                        <input type="text" class="min-width-unset form-control form-control-sm width-100px mr-2"
+                               data-field="icd" :data-item-index="itemIndex" :data-icd-index="icdIndex" data-category="IMAGING"
+                               v-model="icd.code">
+                        <input type="text" class="min-width-unset form-control form-control-sm flex-grow-1" v-model="icd.desc">
+                        <a href="#" v-if="item.icds && item.icds.length > 1" v-on:click.prevent="deleteICD(item, icdIndex)" class="pl-2">
+                            <i class="fa fa-trash-alt text-danger on-hover-opaque"></i>
+                        </a>
+                        <span v-if="item.icds && item.icds.length === 1" class="pl-2">
+                            <i class="fa fa-trash-alt text-secondary on-hover-opaque"></i>
+                        </span>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="font-weight-bold mt-3 mb-1">
+            <span>Logistics</span>
+        </div>
+        <div class="mb-2">
+            <label class="text-sm text-secondary mb-1">Business Name</label>
+            <input type="text" class="form-control form-control-sm min-width-unset facility-search"
+                   stag-suggest
+                   stag-suggest-ep="/search-facility/json"
+                   autocomplete="donotdoit"
+                   v-model="newPrescriptionLogistics.logisticsDetailJson.facilityName">
+        </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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="saveNewPrescription()">Submit
+            </button>
+            <button type="button" class="btn btn-sm btn-default border" onclick="return closeStagPopup()">Cancel
+            </button>
+        </div>
+    </form>
+</div>

resources/views/app/patient/prescriptions/new-lab-form.blade.php

@@ -0,0 +1,127 @@
+<div class="stag-popup stag-popup-md mcp-theme-1" stag-popup-key="new-prescription-popup-LAB">
+    <form method="POST" action="" class="overflow-visible">
+        <h3 class="stag-popup-title mb-2">
+            <span>Lab Prescription</span>
+            <a href="#" class="ml-auto text-secondary"
+               onclick="return closeStagPopup()"><i class="fa fa-times-circle"></i></a>
+        </h3>
+
+        <div class="d-flex align-items-baseline mt-3">
+            <span class="font-weight-bold mr-3">Test Sets</span>
+            <a href="#" v-on:click.prevent="addTestSet(true)">Add Test Set</a>
+        </div>
+
+        <div v-for="(item, itemIndex) in newPrescription_LAB.clinicalDetailJson.items" class="border bg-light px-2 pt-2 pb-1 my-2">
+            <div class="row">
+                <div class="col-6 pr-2">
+                    <div class="d-flex align-items-baseline mb-1">
+                        <span class="text-secondary mr-3">Tests</span>
+                        <a href="#" v-on:click.prevent="addTest(item)">Add Test</a>
+                    </div>
+                    <div v-for="(test, testIndex) in item.tests" class="d-flex align-items-baseline mb-1">
+                        <div class="position-relative flex-grow-1">
+                            <input type="text" class="min-width-unset form-control form-control-sm" data-option-list v-model="test.desc">
+                            <div class="data-option-list">
+                                <div>Complete Blood Count</div>
+                                <div>Prothrombin Time</div>
+                                <div>Basic Metabolic Panel</div>
+                                <div>Comprehensive Metabolic Panel</div>
+                                <div>Lipid Panel</div>
+                                <div>Liver Panel</div>
+                                <div>Thyroid Stimulating Hormone</div>
+                                <div>Hemoglobin A1C</div>
+                                <div>Urinalysis</div>
+                            </div>
+                        </div>
+                        <a href="#" v-if="item.tests && item.tests.length > 1" v-on:click.prevent="deleteTest(item, testIndex)" class="pl-2">
+                            <i class="fa fa-trash-alt text-danger on-hover-opaque"></i>
+                        </a>
+                        <span v-if="item.tests && item.tests.length === 1" class="pl-2">
+                            <i class="fa fa-trash-alt text-secondary on-hover-opaque"></i>
+                        </span>
+                    </div>
+                </div>
+                <div class="col-6 pl-2 border-left">
+                    <div class="d-flex align-items-baseline mb-1">
+                        <span class="text-secondary mr-3">ICDs</span>
+                        <a href="#" v-on:click.prevent="addICD(item)">Add ICD</a>
+                    </div>
+                    <div v-for="(icd, icdIndex) in item.icds" class="d-flex align-items-baseline mb-1">
+                        <input type="text" class="min-width-unset form-control form-control-sm width-100px mr-2"
+                               data-field="icd" :data-item-index="itemIndex" :data-icd-index="icdIndex" data-category="LAB"
+                               v-model="icd.code">
+                        <input type="text" class="min-width-unset form-control form-control-sm flex-grow-1" v-model="icd.desc">
+                        <a href="#" v-if="item.icds && item.icds.length > 1" v-on:click.prevent="deleteICD(item, icdIndex)" class="pl-2">
+                            <i class="fa fa-trash-alt text-danger on-hover-opaque"></i>
+                        </a>
+                        <span v-if="item.icds && item.icds.length === 1" class="pl-2">
+                            <i class="fa fa-trash-alt text-secondary on-hover-opaque"></i>
+                        </span>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="font-weight-bold mt-3 mb-1">
+            <!--<span v-if="currentPrescription && currentPrescription.erx_category === 'DRUG'">Pharmacy</span>
+            <span v-else-if="currentPrescription && currentPrescription.erx_category === 'LAB'">Lab</span>
+            <span v-else-if="currentPrescription && currentPrescription.erx_category === 'IMAGING'">Lab</span>
+            <span v-else>Logistics</span>-->
+            <span>Logistics</span>
+        </div>
+        <div class="mb-2">
+            <label class="text-sm text-secondary mb-1">Business Name</label>
+            <input type="text" class="form-control form-control-sm min-width-unset facility-search"
+                   stag-suggest
+                   stag-suggest-ep="/search-facility/json"
+                   autocomplete="donotdoit"
+                   v-model="newPrescriptionLogistics.logisticsDetailJson.facilityName">
+        </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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="saveNewPrescription()">Submit
+            </button>
+            <button type="button" class="btn btn-sm btn-default border" onclick="return closeStagPopup()">Cancel
+            </button>
+        </div>
+    </form>
+</div>

resources/views/app/patient/prescriptions/new-other-form.blade.php

@@ -0,0 +1,82 @@
+<div class="stag-popup stag-popup-md mcp-theme-1" stag-popup-key="new-prescription-popup-OTHER">
+    <form method="POST" action="" class="overflow-visible">
+        <h3 class="stag-popup-title mb-2">
+            <span>Other Prescription</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">Title</label>
+            <input type="text" class="form-control form-control-sm min-width-unset"
+                   v-model="newPrescription_OTHER.clinicalDetailJson.title">
+        </div>
+        <div class="mb-2">
+            <label class="text-sm text-secondary mb-1">Memo</label>
+            <input type="text" class="form-control form-control-sm min-width-unset"
+                   v-model="newPrescription_OTHER.clinicalDetailJson.memo">
+        </div>
+
+        <div class="font-weight-bold mt-3 mb-1">
+            <!--<span v-if="currentPrescription && currentPrescription.erx_category === 'DRUG'">Pharmacy</span>
+            <span v-else-if="currentPrescription && currentPrescription.erx_category === 'LAB'">Lab</span>
+            <span v-else-if="currentPrescription && currentPrescription.erx_category === 'IMAGING'">Lab</span>
+            <span v-else>Logistics</span>-->
+            <span>Logistics</span>
+        </div>
+        <div class="mb-2">
+            <label class="text-sm text-secondary mb-1">Business Name</label>
+            <input type="text" class="form-control form-control-sm min-width-unset facility-search"
+                   stag-suggest
+                   stag-suggest-ep="/search-facility/json"
+                   autocomplete="donotdoit"
+                   v-model="newPrescriptionLogistics.logisticsDetailJson.facilityName">
+        </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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="newPrescriptionLogistics.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="saveNewPrescription()">Submit
+            </button>
+            <button type="button" class="btn btn-sm btn-default border" onclick="return closeStagPopup()">Cancel
+            </button>
+        </div>
+    </form>
+</div>

resources/views/app/patient/prescriptions/new-referral-form.blade.php

@@ -0,0 +1,27 @@
+<div class="stag-popup stag-popup-md mcp-theme-1" stag-popup-key="new-prescription-popup-REFERRAL">
+    <form method="POST" action="" class="overflow-visible">
+        <h3 class="stag-popup-title mb-2">
+            <span>Referral Prescription</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">Refer To</label>
+            <input type="text" class="form-control form-control-sm min-width-unset"
+                   v-model="newPrescription_REFERRAL.clinicalDetailJson.to">
+        </div>
+        <div class="mb-2">
+            <label class="text-sm text-secondary mb-1">Memo</label>
+            <input type="text" class="form-control form-control-sm min-width-unset"
+                   v-model="newPrescription_REFERRAL.clinicalDetailJson.memo">
+        </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="saveNewPrescription()">Submit
+            </button>
+            <button type="button" class="btn btn-sm btn-default border" onclick="return closeStagPopup()">Cancel
+            </button>
+        </div>
+    </form>
+</div>