ERx UI updates

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

@@ -34,10 +34,6 @@
                                 <span class="width-100px text-secondary text-sm">Strength</span>
                                 <span class="font-weight-bold">@{{ item.strength ? item.strength : '-' }}</span>
                             </div>
-                            <div class="d-flex align-items-start flex-nowrap mb-2">
-                                <span class="width-100px text-secondary text-sm">Amount</span>
-                                <span class="font-weight-bold">@{{ item.amount ? item.amount : '-' }}</span>
-                            </div>
                             <div class="d-flex align-items-start flex-nowrap mb-2">
                                 <span class="width-100px text-secondary text-sm">Route</span>
                                 <span class="font-weight-bold">@{{ item.route ? item.route : '-' }}</span>
@@ -47,7 +43,7 @@
                                 <span class="font-weight-bold">@{{ item.frequency ? item.frequency : '-' }}</span>
                             </div>
                             <div class="d-flex align-items-start flex-nowrap mb-2">
-                                <span class="width-100px text-secondary text-sm">Dispense</span>
+                                <span class="width-100px text-secondary text-sm">Dispense Amount</span>
                                 <span class="font-weight-bold">@{{ item.dispense ? item.dispense : '-' }}</span>
                             </div>
                             <div class="d-flex align-items-start flex-nowrap mb-2">
@@ -93,8 +89,13 @@
                     </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">
+                            <label class="text-sm text-secondary mb-1">Frequency</label>
+                            <input type="text" v-model="popupItem.frequency" class="form-control form-control-sm"
+                                   data-option-list="frequency-options">
+                            <div id="frequency-options" class="data-option-list">
+                                <div>Once a day</div>
+                                <div>Twice a day</div>
+                            </div>
                         </div>
                         <div class="col-6">
                             <label class="text-sm text-secondary mb-1">Route</label>
@@ -116,18 +117,7 @@
                     </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"
-                                   data-option-list="frequency-options">
-                            <div id="frequency-options" class="data-option-list">
-                                <div>Once a day</div>
-                                <div>Twice a day</div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="row mb-2">
-                        <div class="col-6">
-                            <label class="text-sm text-secondary mb-1">Dispense</label>
+                            <label class="text-sm text-secondary mb-1">Dispense Amount</label>
                             <input required type="number" v-model="popupItem.dispense" class="form-control form-control-sm">
                         </div>
                         <div class="col-6">
@@ -138,7 +128,7 @@
                     <div class="row mb-2">
                         <div class="col-12">
                             <label class="text-sm text-secondary mb-1">Purpose</label>
-                            <input required type="text" v-model="popupItem.purpose" class="form-control form-control-sm">
+                            <input required type="text" data-field="icd" v-model="popupItem.purpose" class="form-control form-control-sm">
                         </div>
                     </div>
                     <hr class="mt-3 mb-2">
@@ -340,6 +330,29 @@
                                     $(strengthElem).attr('ac-initialized', 1);
                                 });
                             },
+                            initICDAutoSuggest: function() {
+                                let self = this;
+                                $('#erxSingleApp input[type="text"][data-field="icd"]:not([ac-initialized])').each(function() {
+                                    var elem = this,
+                                        dynID = 'icd-' + Math.ceil(Math.random() * 1000000),
+                                        vueIndex = $(this).attr('data-index');
+                                    $(elem).attr('id', dynID);
+                                    new window.Def.Autocompleter.Search(dynID,
+                                        'https://clinicaltables.nlm.nih.gov/api/icd10cm/v3/search?sf=code,name&ef=name', {
+                                            tableFormat: true,
+                                            valueCols: [0],
+                                            colHeaders: ['Code', 'Name'],
+                                        }
+                                    );
+                                    window.Def.Autocompleter.Event.observeListSelections(dynID, function() {
+                                        let autocomp = elem.autocomp, acData = autocomp.getSelectedItemData();
+                                        debugger
+                                        self.popupItem.purpose = acData[0].code + ' - ' + acData[0].data.name;
+                                        return false;
+                                    });
+                                    $(elem).attr('ac-initialized', 1);
+                                });
+                            },
                             inWords: function (num) {
                                 try {
                                     num = +num;
@@ -373,6 +386,7 @@
                         },
                         mounted: function () {
                             this.initRxAutoSuggest();
+                            this.initICDAutoSuggest();
                             initFastLoad($('#erxSingleApp'));
                         }
                     })

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

@@ -30,10 +30,6 @@
                             <span class="mx-2 text-secondary">•</span>
                             <span>@{{item.strength}}</span>
                         </span>
-                        <span class="d-inline-flex align-items-center" v-if="item.amount">
-                            <span class="mx-2 text-secondary">•</span>
-                            <span>@{{item.amount}}</span>
-                        </span>
                         <span class="d-inline-flex align-items-center" v-if="item.route">
                             <span class="mx-2 text-secondary">•</span>
                             <span>@{{item.route}}</span>
@@ -96,8 +92,13 @@
             </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">
+                    <label class="text-sm text-secondary mb-1">Frequency</label>
+                    <input type="text" v-model="popupItem.frequency" class="form-control form-control-sm"
+                           data-option-list="frequency-options">
+                    <div id="frequency-options" class="data-option-list">
+                        <div>Once a day</div>
+                        <div>Twice a day</div>
+                    </div>
                 </div>
                 <div class="col-6">
                     <label class="text-sm text-secondary mb-1">Route</label>
@@ -119,18 +120,7 @@
             </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"
-                           data-option-list="frequency-options">
-                    <div id="frequency-options" class="data-option-list">
-                        <div>Once a day</div>
-                        <div>Twice a day</div>
-                    </div>
-                </div>
-            </div>
-            <div class="row mb-2">
-                <div class="col-6">
-                    <label class="text-sm text-secondary mb-1">Dispense</label>
+                    <label class="text-sm text-secondary mb-1">Dispense Amount</label>
                     <input required type="number" v-model="popupItem.dispense" class="form-control form-control-sm">
                 </div>
                 <div class="col-6">
@@ -141,7 +131,7 @@
             <div class="row mb-2">
                 <div class="col-12">
                     <label class="text-sm text-secondary mb-1">Purpose</label>
-                    <input required type="text" v-model="popupItem.purpose" class="form-control form-control-sm">
+                    <input required type="text" data-field="icd" v-model="popupItem.purpose" class="form-control form-control-sm">
                 </div>
             </div>
             <hr class="mt-3 mb-2">
@@ -353,6 +343,28 @@
                             $(strengthElem).attr('ac-initialized', 1);
                         });
                     },
+                    initICDAutoSuggest: function() {
+                        let self = this;
+                        $('#erxApp input[type="text"][data-field="icd"]:not([ac-initialized])').each(function() {
+                            var elem = this,
+                                dynID = 'icd-' + Math.ceil(Math.random() * 1000000),
+                                vueIndex = $(this).attr('data-index');
+                            $(elem).attr('id', dynID);
+                            new window.Def.Autocompleter.Search(dynID,
+                                'https://clinicaltables.nlm.nih.gov/api/icd10cm/v3/search?sf=code,name&ef=name', {
+                                    tableFormat: true,
+                                    valueCols: [0],
+                                    colHeaders: ['Code', 'Name'],
+                                }
+                            );
+                            window.Def.Autocompleter.Event.observeListSelections(dynID, function() {
+                                let autocomp = elem.autocomp, acData = autocomp.getSelectedItemData();
+                                self.popupItem.purpose = acData[0].code + ' - ' + acData[0].data.name;
+                                return false;
+                            });
+                            $(elem).attr('ac-initialized', 1);
+                        });
+                    },
                     inWords: function (num) {
                         try {
                             num = +num;
@@ -386,6 +398,7 @@
                 },
                 mounted: function () {
                     this.initRxAutoSuggest();
+                    this.initICDAutoSuggest();
                     initFastLoad($('#erxApp'));
                 }
             })