Equipment/device UI

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

@@ -17,7 +17,7 @@
         <tbody>
             <tr v-for="(item, index) in items" :class="item.is_open ? '' : 'opacity-60'">
                 <td class="px-2">#</td>
-                <td class="px-2">@{{item.items}}</td>
+                <td class="px-2" v-html="item.items && Array.isArray(item.items) ? item.items.join('<br>') : item.items"></td>
                 <td class="px-2">@{{item.purpose}}</td>
                 <td class="px-2">@{{item.memo}}</td>
                 <td class="px-2 text-nowrap">
@@ -36,15 +36,31 @@
                    onclick="return closeStagPopup()"><i class="fa fa-times-circle"></i></a>
             </h3>
             <div class="mb-2">
-                    <equipmentel class="text-sm text-secondary mb-1">Items</equipmentel>
-                    <input type="text" v-model="popupItem.items" class="form-control form-control-sm">
+                <div class="d-flex align-items-center mb-1">
+                    <label class="text-sm text-secondary mb-0">Items</label>
+                    <span class="text-sm mx-2 text-secondary">|</span>
+                    <a href="#" class="text-sm" v-on:click.prevent="popupItem.items.push('')">Add</a>
+                </div>
+                <div class="d-flex align-items-center mb-2" v-for="(item, itemIndex) in popupItem.items">
+                    <div class="position-relative flex-grow-1">
+                        <input type="text" data-option-list v-model="popupItem.items[itemIndex]" class="form-control form-control-sm">
+                        <div class="data-option-list">
+                            <div>Weight Scale</div>
+                            <div>Pulse Ox</div>
+                            <div>Temperature Gun</div>
+                        </div>
+                    </div>
+                    <a v-if="popupItem.items.length > 1" class="ml-2 text-danger" href="#" v-on:click.prevent="popupItem.items.splice(itemIndex, 1)">
+                        <i class="fa fa-trash-alt"></i>
+                    </a>
+                </div>
             </div>
             <div class="mb-2">
-                <equipmentel class="text-sm text-secondary mb-1">Purpose</equipmentel>
+                <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 class="mb-2">
-                <equipmentel class="text-sm text-secondary mb-1">Memo</equipmentel>
+                <label class="text-sm text-secondary mb-1">Memo</label>
                 <input type="text" v-model="popupItem.memo" class="form-control form-control-sm">
             </div>
             <div class="d-flex align-items-center justify-content-center mt-3">
@@ -79,7 +95,7 @@
                     popupItem: {
                         uid: '',
                         is_open: true,
-                        items: '',
+                        items: [''],
                         purpose: '',
                         memo: '',
                     },
@@ -91,11 +107,11 @@
                         this.popupItem = _item ? JSON.parse(JSON.stringify(_item)) : {
                             uid: '',
                             is_open: true,
-                            items: '',
+                            items: [''],
                             purpose: '',
                             memo: '',
                         };
-                        showStagPopup('equipment-popup');
+                        showStagPopup('equipment-popup', true);
                     },
                     savePopupItem: function() {
                         let form = $('#equipmentApp form').first();

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

@@ -37,7 +37,7 @@
             </h3>
             <div class="mb-2">
                 <div class="d-flex align-items-center mb-1">
-                    <imagingel class="text-sm text-secondary mb-0">Tests</imagingel>
+                    <label class="text-sm text-secondary mb-0">Tests</label>
                     <span class="text-sm mx-2 text-secondary">|</span>
                     <a href="#" class="text-sm" v-on:click.prevent="popupItem.tests.push('')">Add</a>
                 </div>
@@ -61,7 +61,7 @@
             </div>
             <div class="mb-2">
                 <div class="d-flex align-items-center mb-1">
-                    <imagingel class="text-sm text-secondary mb-0">ICDs</imagingel>
+                    <label class="text-sm text-secondary mb-0">ICDs</label>
                     <span class="text-sm mx-2 text-secondary">|</span>
                     <a href="#" class="text-sm" v-on:click.prevent="popupItem.icds.push('')">Add</a>
                 </div>
@@ -76,7 +76,7 @@
                 </div>
             </div>
             <div class="mb-2">
-                <imagingel class="text-sm text-secondary mb-1">Memo</imagingel>
+                <label class="text-sm text-secondary mb-1">Memo</label>
                 <input type="text" v-model="popupItem.memo" class="form-control form-control-sm">
             </div>
             <div class="d-flex align-items-center justify-content-center mt-3">