Med reconcile - mark active/historic - to not affect rest of popup

resources/views/app/patient/medications-reconcile.blade.php

@@ -65,16 +65,14 @@ $medications = $points;
             ?>
             <tr>
                 <td class="bg-light font-weight-bold">
-                    {{$medication->data->name}}
+                    <span class="" if-active>{{$medication->data->name}}</span>
+                    <span class="text-secondary on-hover-opaque d-none" if-historic>{{$medication->data->name}}</span>
                     <div class="d-block font-weight-normal">
                         <div class="d-flex align-items-baseline">
                             <span class="text-secondary mr-1">Active:</span>
-                            @if($medication->is_removed)
-                                <span class="text-secondary">No</span>
-                            @else
-                                <span class="text-success">Yes</span>
-                            @endif
-                            <div moe class="ml-2">
+                            <span class="text-success font-weight-bold" if-active>Yes</span>
+                            <span class="text-warning-mellow font-weight-bold d-none" if-historic>No</span>
+                            <div moe class="ml-2" if-active>
                                 <a href="#" start show>Mark {{$medication->is_removed ? 'Active' : 'Historic'}}</a>
                                 <form url="/api/visitPoint/updateTopLevel" no-auto-focus class="mcp-theme-1">
                                     <p class="mb-2">Mark medication as {{$medication->is_removed ? 'Active' : 'Historic'}}</p>
@@ -82,7 +80,20 @@ $medications = $points;
                                     <input type="hidden" name="noteUid" value="{{$note->uid}}">
                                     <input type="hidden" name="isRemoved" value="{{$medication->is_removed ? '0' : '1'}}">
                                     <div>
-                                        <button submit class="btn btn-sm btn-primary mr-2">Save</button>
+                                        <button type="button" class="btn-mark-historic btn btn-sm btn-primary mr-2">Save</button>
+                                        <button cancel class="btn btn-sm bg-light btn-default border">Cancel</button>
+                                    </div>
+                                </form>
+                            </div>
+                            <div moe class="ml-2 d-none" if-historic>
+                                <a href="#" start show>Mark as Active</a>
+                                <form url="/api/visitPoint/updateTopLevel" no-auto-focus class="mcp-theme-1">
+                                    <p class="mb-2">Mark medication as Active</p>
+                                    <input type="hidden" name="uid" value="{{$medication->uid}}">
+                                    <input type="hidden" name="noteUid" value="{{$note->uid}}">
+                                    <input type="hidden" name="isRemoved" value="0">
+                                    <div>
+                                        <button type="button" class="btn-mark-active btn btn-sm btn-primary mr-2">Save</button>
                                         <button cancel class="btn btn-sm bg-light btn-default border">Cancel</button>
                                     </div>
                                 </form>
@@ -137,7 +148,20 @@ $medications = $points;
                                 }
                             }
                         }
-                    }
+                    },
+                    formats: [
+                        'bold',
+                        'italic',
+                        'link',
+                        'size',
+                        'strike',
+                        'underline',
+                        'blockquote',
+                        'header',
+                        'indent',
+                        'list',
+                        'align',
+                    ]
                 });
                 quill.root.innerHTML = existingContent;
                 $(quill.container)
@@ -215,6 +239,41 @@ $medications = $points;
                     });
 
                 });
+
+            $('#medications-reconcile-{{$note->id}} .btn-mark-historic')
+                .off('click')
+                .on('click', function() {
+                    showMask();
+                    let form = $(this).closest('form'), row = $(this).closest('tr');
+                    $.post(form.attr('url'), form.serialize(), _data => {
+                        if(!hasResponseError(_data)) {
+                            row.find('[if-active], [if-historic]').addClass('d-none');
+                            row.find('[if-historic]').removeClass('d-none');
+                        }
+                    }, 'json').then(() => {
+                        $('[moe] form').hide();
+                        hideMask();
+                    });
+                    return false;
+                });
+
+            $('#medications-reconcile-{{$note->id}} .btn-mark-active')
+                .off('click')
+                .on('click', function() {
+                    showMask();
+                    let form = $(this).closest('form'), row = $(this).closest('tr');
+                    $.post(form.attr('url'), form.serialize(), _data => {
+                        if(!hasResponseError(_data)) {
+                            row.find('[if-active], [if-historic]').addClass('d-none');
+                            row.find('[if-active]').removeClass('d-none');
+                        }
+                    }, 'json').then(() => {
+                        $('[moe] form').hide();
+                        hideMask();
+                    });
+                    return false;
+                });
+
             __initRTEs($('#medications-reconcile-{{$note->id}} [note-rte]'))
         }
         addMCInitializer('medications-reconcile-{{$note->id}}', init, '#medications-reconcile-{{$note->id}}')