@extends ('layouts/template')

@section('content')
    <?php
    $modeLabel = '';
    switch(+$mode) {
        case 1: $modeLabel = 'Not Yet Signed'; break;
        case 2: $modeLabel = 'Billing Not Marked Done'; break;
        case 3: $modeLabel = 'Billing Not Closed'; break;
        case 4: $modeLabel = 'Claiming Not Closed'; break;
        case 5: $modeLabel = 'Has Unsubmitted Claims'; break;
	case 8: $modeLabel = 'Claiming Not Closed - Note Good!'; break;
    }
    ?>
    <div id="process-notes" class="p-3 mcp-theme-1">
        <div class="d-flex align-items-baseline pb-3 border-bottom mb-3">
            <h2 class="font-size-16 font-weight-bold m-0">Process Notes</h2>
		<div class=" d-flex align-items-center justify-content-center">
            <button class="btn btn-primary font-weight-normal px-4 ml-3" id="btn-pick">
                <b class="">{{$modeLabel}} ({{$counts["mode-" . $mode]}})</b>&nbsp;&nbsp;<i class="fa fa-arrow-right"></i>&nbsp;&nbsp;Pick Up Next Available Note
            </button>
                <a href="/practice-management/process-notes?mode={{$mode}}" class="btn btn-warning px-4 ml-3" style="display: none; color: black;" id="btn-pick-refresh">
			<b class="">CLICK TO REFRESH DATA! {{$modeLabel}} ({{$counts["mode-" . $mode]}})</b>&nbsp;&nbsp;<i class="fa fa-sync on-hover-opaque"></i>&nbsp;&nbsp;
		</a>
        </div>

<!--            <a class="ml-auto" href="{{route('practice-management.picked-notes')}}">Picked Notes ({{$counts['picked']}})</a>
            <span class="mx-2 text-secondary">|</span>-->
            <a class="ml-auto text-danger" href="{{route('practice-management.bad-notes')}}">Bad Notes ({{$counts['bad']}})</a>
            <span class="mx-2 text-secondary">|</span>
            <a class="" href="{{route('practice-management.done-notes')}}">Done Notes ({{$counts['mode-6']}})</a>
        </div>
        <div class="d-flex align-items-center border-bottom mb-3 pb-3">
            <span class="mr-3">Notes: </span>
            <a href="{{route('practice-management.process-notes')}}?mode=1"
               class="process-notes-badge mr-3 {{$mode === '1' ? 'active' : ''}}" data-index="1">
                <div class="text-nowrap">Not Yet Signed</div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-1"]}}</div>
            </a>
            <a href="{{route('practice-management.process-notes')}}?mode=2"
               class="process-notes-badge mr-3 {{$mode === '2' ? 'active' : ''}}" data-index="2">
                <div class="text-nowrap">Billing Not Marked Done</div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-2"]}}</div>
            </a>
            <a href="{{route('practice-management.process-notes')}}?mode=3"
               class="process-notes-badge mr-3 {{$mode === '3' ? 'active' : ''}}" data-index="3">
                <div class="text-nowrap">Billing Not Closed</div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-3"]}}</div>
            </a>
<!--            <a href="{{route('practice-management.process-notes')}}?mode=4"
               class="process-notes-badge mr-3 {{$mode === '4' ? 'active' : ''}}" data-index="4">
                <div class="text-nowrap">Claims Not Created</div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-4"]}}</div>
            </a>-->
            <a href="{{route('practice-management.process-notes')}}?mode=4"
               class="process-notes-badge mr-3 {{$mode === '4' ? 'active' : ''}}" data-index="4">
                <div class="text-nowrap">Claiming Not Closed</div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-4"]}}</div>
            </a>
            <a href="{{route('practice-management.process-notes')}}?mode=8"
               class="process-notes-badge mr-3 {{$mode === '8' ? 'active' : ''}}" data-index="8">
                <div class="text-nowrap">Claiming Not Closed - Note Good!</div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-8"]}}</div>
            </a>
	    <a href="{{route('practice-management.process-notes')}}?mode=5"
               class="process-notes-badge mr-3 {{$mode === '5' ? 'active' : ''}}" data-index="5">
                <div class="text-nowrap">Has Unsubmitted Claims</div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-5"]}}</div>
            </a>
            <div class="ml-auto process-notes-badge success" data-index="6">
                <div class="text-nowrap">
                    <i class="fa fa-check"></i>&nbsp;
                    All Claims Submitted
                </div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-6"]}}</div>
            </div>
            <div class="process-notes-badge ml-3 error" data-index="7">
                <div class="text-nowrap">
                    <i class="fa fa-exclamation-triangle"></i>&nbsp;
                    Bad
                </div>
                <div class="text-right font-size-16 font-weight-bold">{{$counts["mode-7"]}}</div>
            </div>
        </div>


	<hr>

	<style>
        .iframes iframe {
                width: 100%;
                height: 800px;
        }
        </style>
        <div class="row iframes">
                <div class="col-md-5">
                        <iframe id="target-chart" native></iframe>
                </div>
                <div class="col-md-7">
                        <iframe id="target-note" native></iframe>
                </div>
        </div>
    </div>
    <script>
        (function() {
            function init() {

                function hasError(_data) {
                    let msg = 'Unknown error!';
                    if (_data) {
                        if (_data.success) return false;
                        else if (_data.message) msg = _data.message;
                    }
                    toastr.error(msg);
                    return true;
                }

                $('#btn-pick')
                    .off('click')
                    .on('click', function() {
			showMask();
                        $.get('{{route('practice-management.get-next-note', ['mode' => $mode])}}', _data => {
                            if(_data) {

                                let clientUid = _data.client_uid, noteUid = _data.uid;

                                // mark as picked up
                                $.post('/api/note/pickUpForProcessing', {
                                    uid: noteUid
                                }, _data => {
                                    if (!hasError(_data)) {
					var here = window.location.pathname;					
					var notePrefix = 'https://care.leadershiphealth.org';
					var noteUrl = notePrefix + '/patients/view/' + clientUid + '/notes/view/' + noteUid;
					var chartUrl = notePrefix + '/patients/view/' + clientUid + '/notes?xy=1';
					$('#target-chart').attr('src', chartUrl);
					$('#target-note').attr('src', noteUrl);
					$('#btn-pick').hide();
					$('#btn-pick-refresh').removeClass('d-none');
					$('#btn-pick-refresh').show();
					// @Vj, why doesn't this show?
                                        
					hideMask();
					// open in popup
					return;
                                        openDynamicStagPopup(
                                            '/patients/view/' + clientUid + '/notes/view/' + noteUid,
                                            'note-single',
                                            'Note - {{$modeLabel}}',
                                            true
                                        );
                                    }
                                }, 'json');

                            }
                            else {
				hideMask();
                                toastr.error('No notes available for pickup in the selected mode')
                            }
                        }, 'json');
                        return false;
                    });
            }
            addMCInitializer('process-notes', init, '#process-notes')
        }).call(window);
    </script>

@endsection
