<?php $parsed = $page->data ? json_decode($page->data) : false; ?>
@if(!!$parsed)
<div class="p-3 border-top mt-3 mcp-theme-1" id="remove-medication-container-{{$page->id}}">
    <form action="">
        <div class="mb-2">
            <label class="mb-1 text-secondary text-sm">Removal Reason/Memo *</label>
            <textarea class="form-control form-control-sm" name="removal_memo" required>{!! @$parsed->removal_memo ? $parsed->removal_memo : '' !!}</textarea>
        </div>
        <hr class="m-neg-4">
        <div class="d-flex align-items-center justify-content-center">
            <button class="btn btn-sm btn-danger px-3 mr-2 btn-save" type="button">Yes</button>
            <button class="btn btn-sm btn-default border btn-close-stag-popup px-3" type="button">No</button>
        </div>
    </form>
</div>
<script>
    (function() {
        function init() {
            let parent = $('#remove-medication-container-{{$page->id}}'),
                form = parent.find('form').first();
            parent.find('.btn-save')
                .off('click')
                .on('click', function() {
                    if(!form[0].checkValidity()) {
                        form[0].reportValidity();
                        return false;
                    }
                    showMask();
                    let newData = {!! $page->data !!};
                    newData.removed_during_note_uid = '{{$note->uid}}';
                    newData.removal_memo = form.find('[name="removal_memo"]').val()
                    let payload = {
                        uid: '{{$page->uid}}',
                        newData: JSON.stringify(newData)
                    };
                    $.post('/api/page/change', payload, _data => {
                        if(!hasResponseError(_data)) {
                            toastr.success('Medication updated!');
                            closeStagPopup();
                        }
                    }, 'json');
                    return false;
                });
        }
        addMCInitializer('remove-medication-{{$page->id}}', init, '#remove-medication-container-{{$page->id}}');
    }).call(window);
</script>
@else
    <div class="p-3 border-top mt-3 mcp-theme-1" id="remove-medication-container-{{$page->id}}">
        <div class="text-secondary">Invalid/corrupt input!</div>
    </div>
@endif