<?php
/** @var App\Models\Note $note */

use App\Models\Handout;

/** @var App\Models\Pro $pro */
/** @var App\Models\Section $section */
/** @var $allSections */
?>
@extends ('layouts.patient')

@section('inner-content')

    <?php
    $hasBills = false;
    if ($note->bills->count()) {
        foreach ($note->bills as $bill) {
            if (!$bill->is_cancelled) {
                $hasBills = true;
                break;
            }
        }
    }

    // is based on visit template
    $isVisitTemplateBased = !!$note->visitTemplate;

    $uiConfigsPath = $isVisitTemplateBased ? storage_path("visit-template-ui-configs/{$note->visitTemplate->internal_name}.json") : null;
    $doesVisitTemplateUiConfigExist = $uiConfigsPath && file_exists($uiConfigsPath);
    $visitTemplateUiConfig = $doesVisitTemplateUiConfigExist ? json_decode(file_get_contents($uiConfigsPath), true) : null;

    $visitLayoutPath = '';
    $doesVisitTemplateLayoutExist = false;

    if($isVisitTemplateBased) {
        $visitLayoutPath = "app.patient.note.visit-template-ui-layouts.{$note->visitTemplate->internal_name}";
        $doesVisitTemplateLayoutExist = $isVisitTemplateBased && \Illuminate\Support\Facades\View::exists($visitLayoutPath);
    }

    $segmentMap = [];
    foreach($note->segments as $segment):
        $segmentMap[$segment->segmentTemplate->internal_name] = $segment;
    endforeach;

    $hasRightSegments = $isVisitTemplateBased && !!count($note->segmentsRight);

    ?>
    <div id="note-single-header" class="pb-3 d-flex align-items-start screen-only zero-height note_template_{{$note->visitTemplate ? $note->visitTemplate->internal_name : ''}}">
        <h6 class="my-0 text-secondary d-flex align-items-center w-100">
            <a href="/patients/view/{{ $patient->uid }}/notes" class="small text-decoration-none mr-3">
                <i class="fa fa-chevron-left"></i>
            </a>
            <div class="mr-auto d-inline-flex align-items-center">
                <span class="text-dark font-weight-bold">Note
                    <span class="text-secondary font-weight-normal">{{ $note->is_cancelled ? '(CANCELLED)' : '' }}</span>
                </span>
                @if($pro->pro_type === 'ADMIN')
                    @if(!!$note->visitTemplate)
                        <a native target="_blank"
                           href="{{route('note-pdf', ['note' => $note])}}"
                           class="ml-3 btn btn-sm btn-primary text-white font-weight-bold"><i class="fa fa-print"></i> Print</a>
                    @else
                        <a href="#" class="print-note ml-3 btn btn-sm btn-primary text-white font-weight-bold invisible"><i class="fa fa-print"></i> Print</a>
                    @endif
                    <?php
                    $isBad = false;
                    $isGood = false;
		            if($note->detail_json) {
                        $parsed = json_decode($note->detail_json);
                        $isBad = $parsed && @$parsed->isBad;
			            $isGood = $parsed && @$parsed->isGood;
                    }
                    ?>
                    @if(!$isBad)
                        <div moe relative>
                            <a href="#" start show  class="print-note ml-2 btn btn-sm btn-danger text-white font-weight-bold invisible"><i class="fa fa-exclamation-triangle"></i> Mark as Bad Note</a>
                            <form url="/api/note/markNoteAsBad" class="mcp-theme-1">
                                <input type="hidden" name="uid" value="{{$note->uid}}">
                                <p class="min-width-200px">Mark this note as <b>bad</b>?</p>
                                <div>
                                    <button submit class="btn btn-sm btn-primary mr-1">Yes</button>
                                    <button cancel class="btn btn-sm btn-default border">No</button>
                                </div>
                            </form>
                        </div>
                    @else
                        <div moe relative>
                            <a href="#" start show class="print-note ml-2 btn btn-sm btn-info text-white font-weight-bold invisible"><i class="fa fa-undo"></i> Marked as bad! Click to undo.</a>
                            <form url="/api/note/undoMarkNoteAsBad" class="mcp-theme-1">
                                <input type="hidden" name="uid" value="{{$note->uid}}">
                                <p class="min-width-200px">Mark this note as <b>not bad</b>?</p>
                                <div>
                                    <button submit class="btn btn-sm btn-primary mr-1">Yes</button>
                                    <button cancel class="btn btn-sm btn-default border">No</button>
                                </div>
                            </form>
                        </div>
                    @endif
		            @if(!$isGood)
                        <div moe relative>
                            <a href="#" start show  class="print-note ml-2 btn btn-sm btn-success text-white font-weight-bold invisible"><i class="fa fa-check"></i> Mark as Good Note</a>
                            <form url="/api/note/markNoteAsGood" class="mcp-theme-1">
                                <input type="hidden" name="uid" value="{{$note->uid}}">
                                <p class="min-width-200px">Mark this note as <b>good</b>?</p>
                                <div>
                                    <button submit class="btn btn-sm btn-primary mr-1">Yes</button>
                                    <button cancel class="btn btn-sm btn-default border">No</button>
                                </div>
                            </form>
                        </div>
                    @else
                        <div moe relative>
                            <a href="#" start show class="print-note ml-2 btn btn-sm btn-info text-white font-weight-bold invisible"><i class="fa fa-undo"></i> Marked as good! Click to undo.</a>
                            <form url="/api/note/undoMarkNoteAsGood" class="mcp-theme-1">
                                <input type="hidden" name="uid" value="{{$note->uid}}">
                                <p class="min-width-200px">Mark this note as <b>not good</b>?</p>
                                <div>
                                    <button submit class="btn btn-sm btn-primary mr-1">Yes</button>
                                    <button cancel class="btn btn-sm btn-default border">No</button>
                                </div>
                            </form>
                        </div>
                    @endif
                @endif
            </div>
            @if($patient->has_mcp_done_onboarding_visit !== 'YES')
                <div class="ml-auto">
                    <div moe relative>
                        <a start show class="font-weight-bold">Mark as Onboarding Visit Note</a>
                        <form url="/api/client/updateMcpOnboardingVisitInfo" class="mcp-theme-1" right>
                            <input type="hidden" name="uid" value="{{$patient->uid}}">
                            <input type="hidden" name="mcpOnboardingVisitNoteUid" value="{{$note->uid}}">
                            <input type="hidden" name="hasMcpDoneOnboardingVisit" value="YES">
                            <input type="hidden" name="mcpOnboardingVisitDate" value="{{$note->effective_dateest}}">
                            <p class="min-width-200px">Mark this patient's onboarding as completed using this note?</p>
                            <div>
                                <button submit class="btn btn-sm btn-primary mr-1">Yes</button>
                                <button cancel class="btn btn-sm btn-default border">No</button>
                            </div>
                        </form>
                    </div>
                </div>
            @endif
        </h6>
    </div>

    <div class="card mb-0 {{ $note->is_cancelled ? 'cancelled-item' : '' }} border-0 rounded-0">
        <div class="card-header d-flex align-items-start px-3 py-2 border-bottom rounded-0" id="note-card-header">
            <div class="pr-2">
                {{$note->title}}
                @if(!$note->is_signed_by_hcp || $pro->pro_type === 'ADMIN')
                    <div moe class="d-inline" relative id="note-edit-title">
                        <a href="" show start></a>
                        <form url="/api/note/putTitle">
                            <input type="hidden" name="uid" value="{{$note->uid}}">
                            <div class="mb-2">
                                <input type="text" name="title" value="{{$note->title}}" class="form-control form-control-sm"
                                       placeholder="Title">
                            </div>
                            <div class="form-group mb-0">
                                <button class="btn btn-primary btn-sm" submit>Submit</button>
                                <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                            </div>
                        </form>
                    </div>
                @endif
                @if($pro->pro_type === 'ADMIN')
                    <div moe relative class="d-inline" id="note-clone">
                        <a start show></a>
                        <form url="/api/visit/clone" class="mcp-theme-1" left
                              redir="/patients/view/{{$patient->uid}}/notes/view/[data]">
                            <p class="text-secondary mb-2 font-weight-bold">Clone Note</p>
                            <input type="hidden" name="visitToCloneUid" value="{{$note->uid}}">
                            <div class="mb-2">
                                <label for="" class="text-sm text-secondary mb-1">Effective Date</label>
                                <input type="date" name="effectiveDate" class="form-control input-sm" value="{{get_current_date($pro->display_timezone)}}">
                            </div>
                            <div class="mb-2">
                                <label for="" class="text-secondary text-sm mb-1">New/Follow-up</label>
                                <div class="d-flex align-items-baseline py-1">
                                    <label class="mr-3 my-0 d-inline-flex align-items-center c-pointer">
                                        <input type="radio" name="newOrFuOrNa" value="NEW" required>
                                        <span class="ml-1 text-dark">New</span>
                                    </label>
                                    <label class="my-0 d-inline-flex align-items-center c-pointer">
                                        <input type="radio" name="newOrFuOrNa" value="FU" required checked>
                                        <span class="ml-1 text-dark">Follow-Up</span>
                                    </label>
                                </div>
                            </div>

                            <div class="mb-2">
                                <label for="" class="text-sm text-secondary mb-1">Method</label>
                                <select name="noteContactMethod" id="" class="form-control input-sm">
                                    <option value="">--select--</option>
                                    <option value="VIDEO">Video</option>
                                    <option value="AUDIO">Audio</option>
                                    <option value="IN_CLINIC">In Clinic</option>
                                    <option value="HOUSE_CALL">House Call</option>
                                </select>
                            </div>
                            <div class="m-0">
                                <button submit class="btn btn-primary btn-sm">submit</button>
                            </div>
                        </form>
                    </div>
                @endif
            </div>
            <div class="pl-2 pr-3">
                <div class="d-flex">
                    <span>{{friendly_date_time($note->effective_dateest, false, '')}}</span>
                </div>
                @if(!$note->is_signed_by_hcp || $pro->pro_type === 'ADMIN')
                    <div moe relative class="d-block ml-auto" id="note-edit-date">
                        <a href="" show start></a>
                        <form url="/api/note/putEffectiveDateEST">
                            <input type="hidden" name="uid" value="{{$note->uid}}">
                            <div class="mb-2">
                                <label for="" class="text-secondary text-sm">Effective date EST</label>
                                <input type="date" name="effectiveDateEST" value="{{$note->effective_dateest}}"
                                       class="form-control form-control-sm">
                            </div>
                            <div class="mb-0">
                                <button class="btn btn-primary btn-sm" submit>Submit</button>
                                <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                            </div>
                        </form>
                    </div>
                @endif
            </div>

            <div class="pr-3">
                <div class="d-flex">
                    <span><span class="text-secondary">{{$note->hcpPro && $note->hcpPro->is_hcp ? 'HCP' : 'Pro'}}:</span> @if($note->hcpPro) {{$note->hcpPro->name_first}} {{$note->hcpPro->name_last}} @endif</span>
                </div>
                @if($pro->pro_type === 'ADMIN')
                    <div moe relative class="d-block ml-2" id="note-edit-hcp">
                        <a href="" show start></a>
                        <form url="/api/note/putHcp">
                            <input type="hidden" name="uid" value="{{$note->uid}}">
                            <div class="mb-2">
                                <select provider-search data-pro-uid="{{ $note->hcpPro ? @$note->hcpPro->uid : '' }}"
                                        name="hcpProUid" class="form-control form-control-sm">
                                    <option value="">-- Select HCP Pro --</option>
                                </select>
                            </div>
                            <div class="mb-0">
                                <button class="btn btn-primary btn-sm" submit>Submit</button>
                                <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                            </div>
                        </form>
                    </div>
                    <div moe relative class="d-block ml-2" id="note-remove-hcp">
                        <a href="" show start></a>
                        <form url="/api/note/removeHcp">
                            <input type="hidden" name="uid" value="{{$note->uid}}">
                            <p class="mb-2">Remove HCP?</p>
                            <div class="mb-0">
                                <button class="btn btn-primary btn-sm" submit>Submit</button>
                                <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                            </div>
                        </form>
                    </div>
                @endif
            </div>

            <div class="pr-3">
                <div class="d-flex">
                    <span><span class="text-secondary">NA:</span> @if($note->allyPro) {{$note->allyPro->name_first}} {{$note->allyPro->name_last}} @endif</span>
                </div>
                @if($pro->pro_type === 'ADMIN')
                    <div moe relative class="d-block ml-2" id="note-edit-na">
                        <a href="" show start></a>
                        <form url="/api/note/putNa">
                            <input type="hidden" name="uid" value="{{$note->uid}}">
                            <div class="mb-2">
                                <select provider-search data-pro-uid="{{ $note->allyPro ? @$note->allyPro->uid : '' }}"
                                        name="naProUid" class="form-control form-control-sm">
                                    <option value="">-- Select NA Pro --</option>
                                </select>
                            </div>
                            <div class="mb-0">
                                <button class="btn btn-primary btn-sm" submit>Submit</button>
                                <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                            </div>
                        </form>
                    </div>
                    <div moe relative class="d-block ml-2" id="note-remove-na">
                        <a href="" show start></a>
                        <form url="/api/note/removeNa">
                            <input type="hidden" name="uid" value="{{$note->uid}}">
                            <p class="mb-2">Remove NA?</p>
                            <div class="mb-0">
                                <button class="btn btn-primary btn-sm" submit>Submit</button>
                                <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                            </div>
                        </form>
                    </div>
                @endif
            </div>

            <div class="pr-3">
                <div class="d-flex">
                    <span><span class="text-secondary">Type:</span> {{$note->new_or_fu_or_na ? ($note->new_or_fu_or_na === 'NEW' ? 'New Patient' : $note->new_or_fu_or_na) : '-'}}</span>
                </div>
                @if(!$note->is_signed_by_hcp || $pro->pro_type === 'ADMIN')
                    <div moe class="ml-auto d-block" relative id="note-edit-type">
                        <a href="" show start></a>
                        <form url="/api/note/updateNewOrFuOrNa">
                            <input type="hidden" name="uid" value="{{$note->uid}}">
                            <div class="mb-2">
                                <select name="newOrFuOrNa" class="form-control form-control-sm" required>
                                    <option value="">-- select --</option>
                                    <option value="NEW" {{ $note->new_or_fu_or_na === "NEW" ? "selected" : "" }}>New</option>
                                    <option value="FU" {{ $note->new_or_fu_or_na === "FU" ? "selected" : "" }}>Follow-up</option>
                                    <option value="NA" {{ $note->new_or_fu_or_na === "NA" ? "selected" : "" }}>N/A</option>
                                </select>
                            </div>
                            <div class="mb-0">
                                <button class="btn btn-primary btn-sm" submit>Submit</button>
                                <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                            </div>
                        </form>
                    </div>
                @endif
            </div>

            <div class="pr-3">
                <div class="d-flex">
                    <span><span class="text-secondary">Method:</span> {{$note->method ? noteMethodDisplay($note->method) : '-'}}</span>
                </div>
                @if(!$note->is_signed_by_hcp || $pro->pro_type === 'ADMIN')
                    <div moe class="ml-auto d-block" relative id="note-edit-method">
                        <a href="" show start></a>
                        <form url="/api/note/updateMethod" hook="onNoteMethodUpdate">
                            <input type="hidden" name="uid" value="{{$note->uid}}">
                            <div class="mb-2">
                                <select name="method" class="form-control form-control-sm note-method-select" required>
                                    <option value="AUDIO" {{ $note->method === "AUDIO" ? "selected" : "" }}>Audio</option>
                                    <option value="VIDEO" {{ $note->method === "VIDEO" ? "selected" : "" }}>Video</option>
                                    <option value="IN_CLINIC" {{ $note->method === "IN_CLINIC" ? "selected" : "" }}>In-Clinic</option>
                                    <option value="HOUSE_CALL" {{ $note->method === "HOUSE_CALL" ? "selected" : "" }}>House Call</option>
                                </select>
                            </div>
                            <div class="form-group if-in-clinic">
                                <label for="" class="text-secondary text-sm mb-1">Location</label>
                                <select name="hcpCompanyLocationUid" class="form-control">
                                    <option value=""></option>
                                    @foreach($pro->companyLocations() as $location)
                                        <option value="{{$location->uid}}" {{$location->id === $note->hcp_company_location_id ? 'selected' : ''}}>{{$location->line1}} {{$location->city}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="mb-0">
                                <button class="btn btn-primary btn-sm" submit>Submit</button>
                                <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                            </div>
                        </form>
                    </div>
                @endif
            </div>

            @if($pro->pro_type === 'ADMIN')
                <div class="d-block position-relative on-click-menu mr-2">
                    <span class="text-sm text-primary c-pointer border px-2 p-1 rounded bg-white">
                        <i class="fa fa-ellipsis-h"></i>
                    </span>
                    <div menu left class="bg-white border">
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-title>a:first').trigger('click'); return false;">
                            Edit Title
                        </a>
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-date>a:first').trigger('click'); return false;">
                            Edit Date
                        </a>
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-hcp>a:first').trigger('click'); return false;">
                            Edit HCP
                        </a>
                        @if($note->hcpPro)
                            <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                               onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-remove-hcp>a:first').trigger('click'); return false;">
                                Remove HCP
                            </a>
                        @endif
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-na>a:first').trigger('click'); return false;">
                            Edit NA
                        </a>
                        @if($note->allyPro)
                            <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                               onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-remove-na>a:first').trigger('click'); return false;">
                                Remove NA
                            </a>
                        @endif
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-type>a:first').trigger('click'); return false;">
                            Edit Type
                        </a>
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-method>a:first').trigger('click'); return false;">
                            Edit Method
                        </a>
                        @if($note->visitTemplate && $note->visitTemplate->internal_name == 'omega_soap_visit')
                            <a native target="_blank" href="#" class="pl-2 pr-3 py-1 d-block text-nowrap text-sm"
                               onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-clone>a:first').trigger('click'); return false;">
                                Clone
                            </a>
                        @endif
                    </div>
                </div>
            @elseif(!$note->is_signed_by_hcp && ($note->hcp_pro_id === $pro->id || $note->ally_pro_id === $pro->id))
                <div class="d-block position-relative on-click-menu mr-2">
                    <span class="text-sm text-primary c-pointer border px-2 p-1 rounded bg-white">
                        <i class="fa fa-ellipsis-h"></i>
                    </span>
                    <div menu left class="bg-white border">
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-title>a:first').trigger('click'); return false;">
                            Edit Title
                        </a>
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-date>a:first').trigger('click'); return false;">
                            Edit Date
                        </a>
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-type>a:first').trigger('click'); return false;">
                            Edit Type
                        </a>
                        <a native target="_blank" href="#" class="pl-2 pr-3 pt-1 d-block text-nowrap text-sm"
                           onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-edit-method>a:first').trigger('click'); return false;">
                            Edit Method
                        </a>
                        @if($note->hcp_pro_id === $pro->id && $note->visitTemplate && $note->visitTemplate->internal_name == 'omega_soap_visit')
                            <a native target="_blank" href="#" class="pl-2 pr-3 py-1 d-block text-nowrap text-sm"
                               onclick="$(this).closest('.on-click-menu').find('[menu]').hide(); $('#note-clone>a:first').trigger('click'); return false;">
                                Clone
                            </a>
                        @endif
                    </div>
                </div>
            @endif

            <div class="px-2 border-left screen-only">
                {{-- NOTE --}}
                {{-- v1. print-note --}}
                {{-- v2. print-note-v2 --}}
                {{-- v3. print-note-v3 --}}
                <a href="{{route('print-note', ['patient' => $patient, 'note' => $note])}}" native target="_blank" class=""><i class="fa fa-print"></i></a>
                <a href="{{route('print-note-v3', ['patient' => $patient, 'note' => $note])}}" native target="_blank" class="ml-2"><i class="fa fa-print"></i><sup class="text-danger" style="font-weight:bold;font-size: 10px;">NEW</sup></a>
                @if($performer->pro->is_admin)
                    <a href="{{'/practice-management/notes-resolution-center-v2?uid='.$note->uid}}" target="_blank">NRC</a>
                @endif
            </div>

            @if($pro->pro_type === 'ADMIN' || $pro->is_enrolled_as_mcp)
            <div class="px-2 border-left screen-only">
                <a native target="_blank"
                   open-in-stag-popup
                   mc-initer="patient-calendar-{{$patient->id}}"
                   title="Calendar: {{$patient->displayName()}}"
                   popup-style="medium-large"
                   href="{{route('patients.view.calendar', ['patient' => $patient])}}?opUid={{$note->hcpPro ? $note->hcpPro->uid : ''}}">
                    <i class="fa fa-clock"></i>
                    Book Appt.
                </a>
            </div>
            @endif

            {{-- additional modules --}}
            @if(!$note->is_signed_by_hcp)
            <?php
            $availableModules = [
                [
                    "name" => 'Nutrition Rx',
                    "title" => '<img src=\'/img/nutrition-rx.png\'/> Nutrition Rx',
                    "href" => "/nutrition-center/{$note->client->uid}/{$note->uid}",
                    "initer" => "nutrition-center-{$note->id}"
                ],
                [
                    "name" => 'Exercise Rx',
                    "title" => '<img src=\'/img/exercise-rx.png\'/> Exercise Rx',
                    "href" => "/exercise-center/{$note->client->uid}/{$note->uid}",
                    "initer" => "exercise-center-{$note->id}"
                ],
                [
                    "name" => 'Behavior Rx',
                    "title" => '<img src=\'/img/behavior-rx.png\'/> Behavior Rx',
                    "href" => "/behavior-center/{$note->client->uid}/{$note->uid}",
                    "initer" => "behavior-center-{$note->id}"
                ],
                [], // for separator
                [
                    "name" => 'COVID-19 Intake',
                    "title" => 'COVID-19 Intake',
                    "href" => "/note-segment-view-by-name/{$note->uid}/covid_intake/edit",
                    "initer" => "edit-module-covid-intake-{$note->id}"
                ],
                [
                    "name" => 'COVID-19 Follow-up',
                    "title" => 'COVID-19 Follow-up',
                    "href" => "/note-segment-view-by-name/{$note->uid}/covid_follow-up/edit",
                    "initer" => "covid-follow-up-{$note->id}"
                ],
                [], // for separator
                [
                    "name" => 'Lifestyle General',
                    "title" => 'Lifestyle General',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/lifestyle_general/edit",
                    "initer" => "edit-univ_sub_lifestyle_general-container-{$note->id}"
                ],
                [
                    "name" => 'Lifestyle Nutrition',
                    "title" => 'Lifestyle Nutrition',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/lifestyle_nutrition/edit",
                    "initer" => "edit-univ_sub_nutrition_assessment-container-{$note->id}"
                ],
                [
                    "name" => 'Lifestyle Physical Activity',
                    "title" => 'Lifestyle Physical Activity',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/lifestyle_physical_activity/edit",
                    "initer" => "edit-univ_sub_physical_activity_assessment-container-{$note->id}"
                ],
                [
                    "name" => 'Lifestyle Sleep',
                    "title" => 'Lifestyle Sleep',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/lifestyle_sleep/edit",
                    "initer" => "edit-univ_sub_sleep_assessment-container-{$note->id}"
                ],
                [
                    "name" => 'Lifestyle Social',
                    "title" => 'Lifestyle Social',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/lifestyle_social/edit",
                    "initer" => "edit-univ_sub_social_relationships_assessment-container-{$note->id}"
                ],
                [
                    "name" => 'Lifestyle Stress',
                    "title" => 'Lifestyle Stress',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/lifestyle_stress/edit",
                    "initer" => "edit-univ_sub_stress_assessment-container-{$note->id}"
                ],
                [
                    "name" => 'Lifestyle Substances',
                    "title" => 'Lifestyle Substances',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/lifestyle_substances/edit",
                    "initer" => "edit-univ_sub_substance_use_assessment-container-{$note->id}"
                ],
                [
                    "name" => 'Weight Loss Intake',
                    "title" => 'Weight Loss Intake',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/weight_loss_intake/edit",
                    "initer" => "edit-weight_loss_intake-container-{$note->id}"
                ],
                [], //For separator
                [
                    "name" => 'Sleep Health Intake',
                    "title" => 'Sleep Health Intake',
                    "style" => 'stag-popup-md',
                    "href" => "/module-view/{$note->uid}/sleep_health_intake/edit",
                    "initer" => "edit-sleep_health_intake-container-{$note->id}"
                ],
            ];
            ?>
            <div moe relative class="px-2 border-left screen-only">
                <a href="#" start show>+ Form</a>
                <form url="#" right>
                    <p class="font-weight-bold text-secondary">Additional Forms</p>
                    @foreach($availableModules as $module)
                        @if(@$module['name'])
                            <a href="{{$module['href']}}"
                               open-in-stag-popup
                               popup-style="overflow-visible {{@$module['style']}}"
                               title="{!! $module['title'] !!}"
                               mc-initer="{{ @$module['initer']  }}"
                               class="d-block mb-1 text-nowrap">{!! $module['name'] !!}</a>
                        @else
                            <hr class="my-2">
                        @endif
                    @endforeach
                </form>
            </div>
            @endif


            @if($note->is_signed_by_hcp)
                @php
                    $suggestionMode = request()->get('suggestion_mode');
                @endphp
                @if($suggestionMode == 'on')
                    <a class="ml-3 native font-weight-normal refresh-segment c-pointer screen-only"
                        href="/patients/view/{{$note->client->uid}}/notes/view/{{$note->uid}}?suggestion_mode=off"
                        title="Update with latest patient data">
                        Suggestion Mode
                    </a>
                @else
                    <a class="ml-3 native font-weight-normal refresh-segment c-pointer screen-only"
                        href="/patients/view/{{$note->client->uid}}/notes/view/{{$note->uid}}?suggestion_mode=on"
                        title="Update with latest patient data">
                        Suggestion Mode
                    </a>
                @endif
                <a href="{{route('practice-management.notes-resolution-center-v2')}}?uid={{$note->uid}}" class="ml-3">NRC</a>
            @endif

            <div class="ml-auto d-flex align-items-start">
                <div class="">
                    <div class="d-flex">
                        <div class="d-flex">
                            @include('app.patient.note.partials.flag-note-by-supervisor')
                        </div>


                        @if($note->is_signed_by_hcp )
                            <div class="d-flex align-items-baseline">
                                <div class="text-secondary">
                                    <i class="fa fa-check"></i>
                                    Note Signed
                                </div>
                                @if($pro->pro_type === 'ADMIN' || ($note->hcpPro && $pro->id === $note->hcpPro->id && !$note->hasClaims()))
                                    <div class="ml-3">
                                        <div moe>
                                            <a class="" href="" show start>Undo Sign{{$pro->pro_type === 'ADMIN' ? ' As ' . ($note->hcpPro->is_hcp ? 'HCP' : 'Pro') : ''}}</a>
                                            <form url="/api/note/adminUndoSignAsHcp" right>
                                                <input type="hidden" name="uid" value="{{$note->uid}}">
                                                <p>Undo HCP signature?</p>
                                                <div class="mb-0">
                                                    <button class="btn btn-primary btn-sm" submit>Undo</button>
                                                    <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                @endif
                                @if($pro->pro_type === 'ADMIN' || ($note->hcpPro && $pro->id === $note->hcpPro->id))
                                    <div class="ml-3 screen-only">
                                        @include('app/patient/note/_create-bill-only')
                                    </div>
                                @endif
                            </div>
                        @endif
                        @if($note->hcpPro)
                            @if(!$note->is_signed_by_hcp )
                                @if($note->hcp_pro_id === $pro->id)
                                    @if(!$isVisitTemplateBased)
                                        <div moe relative
                                             class="{{ $note->hcp_pro_id !== $pro->id ? 'moe-disabled' : '' }} screen-only"
                                             title="{{ $note->hcp_pro_id !== $pro->id ? 'Only the note\'s HCP can sign' : '' }}">
                                            <a class="" href="" show start>Sign As HCP</a>
                                            <form url="/api/note/signAsHcp" right>
                                                <input type="hidden" name="uid" value="{{$note->uid}}">
                                                <p>Sign this note as HCP?</p>
                                                <div class="mb-0">
                                                    <button class="btn btn-success btn-sm" submit>Sign</button>
                                                    <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                                                </div>
                                            </form>
                                        </div>
                                    @else
                                        <a native target="_blank"
                                           open-in-stag-popup
                                           update-parent
                                           mc-initer="note-sign-confirmation-{{$note->id}}"
                                           popup-style="stag-popup-md overflow-visible"
                                           title="Confirm and Sign"
                                           class="screen-only"
                                           href="{{route('patients.view.notes.view.sign-confirmation', compact('patient', 'note'))}}">
                                            Sign Note As {{$note->hcpPro->is_hcp ? 'HCP' : 'Pro'}}
                                        </a>
                                    @endif
                                @endif
                            @endif
                        @endif
                    </div>
                </div>
                @if($note->allyPro && $pro->id === $note->allyPro->id)
                <div class="ml-3">
                    <div>
                        @if($note->is_signed_by_ally)
                            <span class="text-secondary">
                                <i class="fa fa-check"></i>
                                Note Signed By NA
                                @if(!$note->is_signed_by_hcp)
                                <span moe class="ml-2">
                                    <a class="" href="" show start>Undo sign?</a>
                                    <form url="/api/note/undoSignAsAlly" right>
                                        <input type="hidden" name="uid" value="{{$note->uid}}">
                                        <p>Undo sign?</p>
                                        <div class="mb-0">
                                            <button class="btn btn-primary btn-sm" submit>Submit</button>
                                            <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                                        </div>
                                    </form>
                                </span>
                                @endif
                            </span>
                        @else
                            <div moe
                                 class="{{ $note->ally_pro_id !== $pro->id ? 'moe-disabled' : '' }}"
                                 title="{{ $note->ally_pro_id !== $pro->id ? 'Only the note\'s Ally can sign' : '' }}">
                                <a class="" href="" show start>Sign As NA</a>
                                <form url="/api/note/signAsAlly" right>
                                    <input type="hidden" name="uid" value="{{$note->uid}}">
                                    <p>Sign this NA?</p>
                                    <div class="mb-0">
                                        <button class="btn btn-success btn-sm" submit>Sign</button>
                                        <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                                    </div>
                                </form>
                            </div>
                        @endif
                    </div>
                </div>
                @endif
                @if($note->is_cancelled || (!$note->is_cancelled && !$note->is_signed_by_hcp))
                <div class="ml-2 pl-2 border-left">
                    <div class="d-flex justify-content-end">
                        @if(!$note->is_cancelled)
                        <div moe relatve
                             class="{{ $hasBills ? 'moe-disabled' : '' }}"
                             title="{{ $hasBills ? 'Cannot cancel note since it has un-cancelled bills in it' : '' }}">
                            <a class="text-danger" href="" show start>Cancel</a>
                            <form url="/api/note/cancel" right>
                                @if($patient->has_cm_setup_been_performed && $patient->cm_setup_note_id === $note->id)
                                    A care-plan was created during this note. Please undo that before cancelling the note.
                                @else
                                    <input type="hidden" name="uid" value="{{$note->uid}}">
                                    <p class="small mb-2">Are you sure you want to cancel this note?</p>
                                    <div class="mb-2">
                                        <textarea name="memo" id="" cols="30" rows="5" placeholder="Memo" class="memo-textarea form-control form-control-sm"></textarea>
                                    </div>
                                    <div class="d-flex align-items-center">
                                        <button class="btn btn-sm btn-danger mr-2" submit>Yes</button>
                                        <button class="btn btn-sm btn-default mr-2 border" cancel>No</button>
                                    </div>
                                @endif
                            </form>
                        </div>
                        @else
                            <span class="text-secondary font-weight-bold">CANCELLED</span>
                        @endif
                    </div>
                </div>
                @endif

            </div>
        </div>

        @if($note->ally_pro_id === $pro->id && $note->is_signed_by_hcp)
            <div class="card-header px-3 py-2 border-bottom rounded-0">
                <i class="fa fa-check text-success mr-1"></i>
                This visit has been <b>successfully coordinated</b>.
                @if(!$note->is_signed_by_ally)
                    <span class="ml-1">
                        Please review and
                        <span moe relative class="d-inline-block">
                            <a class="font-weight-bold" href="" show start>sign</a>
                            <form url="/api/note/signAsAlly">
                                <input type="hidden" name="uid" value="{{$note->uid}}">
                                <p>Sign this NA?</p>
                                <div class="mb-0">
                                    <button class="btn btn-success btn-sm" submit>Sign</button>
                                    <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                                </div>
                            </form>
                        </span>
                        the note.
                    </span>
                @endif
                @if(!$note->naGenericBill)
                    <span class="">
                        To bill for your services,
                        <a native="" target="_top" class="font-weight-bold" data-non-segment-target="NA Bills" href="#">click here</a>.
                    </span>
                @endif
            </div>
        @endif

        <div class="card-body p-0">
            <div class="note-container note_template_{{$note->visitTemplate ? $note->visitTemplate->internal_name : ''}}">
                @if(!$hasRightSegments)
                    @include('app.patient.note.lhs-tree')
                @endif
                <div class="note-rhs-content">
                <div>
                <div class="border-bottom pb-3">
                    <div class="{{$hasRightSegments ? 'd-flex align-items-stretch' : ''}}">
                        <?php
                        $shortCutsObject = [];
                        foreach ($pro->allShortcuts() as $shortcut) {

                            // %replaceables%
                            $shortcut->text = str_replace("%AGE%", $patient->age_in_years, $shortcut->text);
                            $shortcut->text = str_replace("%GENDER%", $patient->sex, $shortcut->text);
                            $shortcut->text = str_replace("%NAME%", $patient->displayName(), $shortcut->text);

                            $shortCutsObject[] = [
                                "name" => $shortcut->shortcut,
                                "value" => $shortcut->text
                            ];
                        }
                        ?>
                        <script>window.userShortcuts = <?= json_encode($shortCutsObject); ?>;</script>
                        <script>
                            window.hpiShortcuts = [
                                {
                                    name: 'Explain the problem.',
                                    value: 'Explain the problem. ',
                                },
                                {
                                    name: 'What happened between today and our last visit?',
                                    value: 'What happened between today and our last visit? ',
                                },
                                {
                                    name: 'How did it go with the plan I gave you?',
                                    value: 'How did it go with the plan I gave you? ',
                                },
                                {
                                    name: 'What barriers have you felt following the plan?',
                                    value: 'What barriers have you felt following the plan? ',
                                },
                                {
                                    name: 'How long have you had this?',
                                    value: 'How long have you had this? ',
                                },
                                {
                                    name: 'When does it get worse?',
                                    value: 'When does it get worse? ',
                                },
                                {
                                    name: 'When does it get better?',
                                    value: 'When does it get better? ',
                                },
                                {
                                    name: 'What have you done for treatment?',
                                    value: 'What have you done for treatment? ',
                                },
                                {
                                    name: 'How does it affect your ADLs?',
                                    value: 'How does it affect your ADLs? ',
                                },
                                {
                                    name: 'How do you cope?',
                                    value: 'How do you cope? ',
                                },
                                {
                                    name: 'How does this affect you emotionally?',
                                    value: 'How does this affect you emotionally? ',
                                },
                            ];
                        </script>
                        <script>window.segmentInitializers = {};</script>
                        <?php
                        $shortcuts = "";
                        $latestSectionTS = 0;
                        ?>
                        <div class="{{ $note->is_signed_by_hcp ? 'note-signed-by-hcp' : '' }} {{$hasRightSegments ? 'w-30 border-right note-left-panel stag-scrollbar' : ''}}">
                            <div class="min-width-300px stag-scrollbar">
                                <?php $isOldClient = (date_diff(date_create(config('app.point_impl_date')), date_create($patient->created_at))->invert === 1); ?>
                                @if($isOldClient)
                                    <div class="p-2 bg-light border-bottom screen-only">
                                        <div class="d-flex align-items-baseline">
                                            <div class="font-weight-bold font-size-14 text-warning-dark">
                                                <i class="fa fa-clock text-secondary text-sm"></i>
                                                Data from old notes
                                            </div>
                                            <a href="#" class="ml-3" onclick="$(this).parent().next().toggleClass('d-none'); return false;">Toggle</a>
                                        </div>
                                        <div class="mt-3 ml-3 d-none">
                                            <?php $hasAllergiesInCanvas = $patient->hasDataInCanvas('allergies'); ?>
                                            @if($hasAllergiesInCanvas)
                                                <div class="uucol-4">
                                                    <div class="d-flex align-items-center pb-2">
                                                        <h6 class="my-0 font-weight-bold text-secondary">Allergies</h6>
                                                    </div>
                                                    <div class="bg-light border p-2 mb-3">
                                                        @include('app.patient.canvas-sections.allergies.summary')
                                                    </div>
                                                </div>
                                            @endif
                                            <?php $hasRxInCanvas = $patient->hasDataInCanvas('rx'); ?>
                                            @if($hasRxInCanvas)
                                                <div class="uucol-4">
                                                    <div class="d-flex align-items-center pb-2">
                                                        <h6 class="my-0 font-weight-bold text-secondary">Current Medications</h6>
                                                    </div>
                                                    <div class="bg-light border p-2 mb-3">
                                                        @include('app.patient.canvas-sections.rx.summary')
                                                    </div>
                                                </div>
                                            @endif
                                            <?php $hasDxInCanvas = $patient->hasDataInCanvas('dx'); ?>
                                            @if($hasDxInCanvas)
                                                <div class="uucol-4">
                                                    <div class="d-flex align-items-center pb-2">
                                                        <h6 class="my-0 font-weight-bold text-secondary">Current Problems / Focus Areas</h6>
                                                    </div>
                                                    <div class="bg-light border p-2 mb-3">
                                                        @include('app.patient.canvas-sections.dx.summary')
                                                    </div>
                                                </div>
                                            @endif
                                            <?php $hasCareTeamInCanvas = $patient->hasDataInCanvas('care-team'); ?>
                                            @if($hasCareTeamInCanvas)
                                                <div class="uucol-4">
                                                    <div class="d-flex align-items-center pb-2">
                                                        <h6 class="my-0 font-weight-bold text-secondary">Care Team</h6>
                                                    </div>
                                                    <div class="bg-light border p-2 mb-3">
                                                        @include('app.patient.canvas-sections.care-team.summary')
                                                    </div>
                                                </div>
                                            @endif
                                            <?php $hasPmhxInCanvas = $patient->hasDataInCanvas('pmhx'); ?>
                                            @if($hasPmhxInCanvas)
                                                <div class="uucol-4">
                                                    <div class="d-flex align-items-center pb-2">
                                                        <h6 class="my-0 font-weight-bold text-secondary">Medical History</h6>
                                                    </div>
                                                    <div class="bg-light border p-2 mb-3">
                                                        @include('app.patient.canvas-sections.pmhx.summary')
                                                    </div>
                                                </div>
                                            @endif
                                            <?php $hasPshxInCanvas = $patient->hasDataInCanvas('pshx'); ?>
                                            @if($hasPshxInCanvas)
                                                <div class="mt-2 border-top pt-2">
                                                    <div class="d-flex align-items-center pb-2">
                                                        <h6 class="my-0 font-weight-bold text-secondary">Surgical History</h6>
                                                    </div>
                                                    <div class="bg-light border p-2 mb-3">
                                                        @include('app.patient.canvas-sections.pshx.summary')
                                                    </div>
                                                </div>
                                            @endif
                                            <?php $hasFhxInCanvas = $patient->hasDataInCanvas('fhx'); ?>
                                            @if($hasFhxInCanvas)
                                                <div class="uucol-4">
                                                    <div class="d-flex align-items-center pb-2">
                                                        <h6 class="my-0 font-weight-bold text-secondary">Family History</h6>
                                                    </div>
                                                    <div class="bg-light border p-2 mb-3">
                                                        @include('app.patient.canvas-sections.fhx.summary')
                                                    </div>
                                                </div>
                                            @endif
                                            <?php $hasSochxInCanvas = $patient->hasDataInCanvas('sochx'); ?>
                                            @if($hasSochxInCanvas)
                                                <div class="uucol-4">
                                                    <div class="d-flex align-items-center pb-2">
                                                        <h6 class="my-0 font-weight-bold text-secondary">Social History</h6>
                                                    </div>
                                                    <div class="bg-light border p-2 mb-3">
                                                        @include('app.patient.canvas-sections.sochx.summary')
                                                    </div>
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                @endif

                                @if($isVisitTemplateBased && $doesVisitTemplateLayoutExist)
                                    @include($visitLayoutPath)
                                @elseif($isVisitTemplateBased && !$doesVisitTemplateUiConfigExist)
                                    @if($note->visitTemplate->is_slim)
                                        @include('app.patient.note.note-segment-list-slim')
                                    @else
                                        @include('app.patient.note.note-segment-list')
                                    @endif
                                @elseif($isVisitTemplateBased && $doesVisitTemplateUiConfigExist)
                                    @include('app.patient.note.custom-visit')
                                @else
                                    @include('app.patient.note.note-section-list')
                                @endif
                            </div>
                        </div>
                        @if($hasRightSegments)
                        <div class="w-70 border-left note-right-panel stag-scrollbar">
                            <div class="min-width-700px">
                                @include('app.patient.note.note-segment-list-rhs')
                            </div>
                        </div>
                        @endif
                    </div>
                </div>

                {{-- follow-up appt. --}}
                <div class="pt-3 px-3 screen-only border-bottom" data-non-segment-section="Follow-up Appointment">
                    @include('app/patient/note/follow-up-appointment')
                </div>

                <div class="note-content-divider"></div>

                <span class="d-none latest-section-ts">{{ $latestSectionTS }}</span>

                <div class="p-3 border-bottom" data-non-segment-section="ICDs">
                    <div class="">
                        <div class="d-flex justify-content-between mb-2">
                            <div class="d-flex">
                                <p class="font-weight-bold text-secondary m-0 mr-2">Claim ICDs</p>
                                @include('app.patient.partials.put-rm-reasons', ['recordType' => 'NOTE', 'record' => $note])
                            </div>
                            <div class="on-hover-show d-block on-hover-opaque position-relative mx-1">
                                <i class="fa fa-info-circle"></i>
                                <div class="on-hover-content p-0 border-0 max-width-unset bg-white">
                                    <table class="table table-sm m-0 table-bordered border-0">
                                        <thead>
                                        <tr class="bg-light">
                                            <th class="border-bottom-0">Created</th>
                                            <th class="min-width-140px border-bottom-0">Reason 1</th>
                                            <th class="min-width-140px border-bottom-0">Reason 2</th>
                                            <th class="min-width-140px border-bottom-0">Reason 3</th>
                                            <th class="min-width-140px border-bottom-0">Reason 4</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        @foreach($note->reasonsLog as $log)
                                            <tr>
                                                <td class="text-nowrap">{{friendly_date_time($log->created_at)}}</td>
                                                <td>
                                                    {{$log->note_reason_icd1}}
                                                    <div class="text-sm text-secondary">{{$log->note_reason_icd1description}}</div>
                                                </td>
                                                <td>
                                                    {{$log->note_reason_icd2}}
                                                    <div class="text-sm text-secondary">{{$log->note_reason_icd2description}}</div>
                                                </td>
                                                <td>
                                                    {{$log->note_reason_icd3}}
                                                    <div class="text-sm text-secondary">{{$log->note_reason_icd3description}}</div>
                                                </td>
                                                <td>
                                                    {{$log->note_reason_icd4}}
                                                    <div class="text-sm text-secondary">{{$log->note_reason_icd4description}}</div>
                                                </td>
                                            </tr>
                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div>
                            @include('app.patient.partials.rm-reasons-display', ['recordType' => 'NOTE', 'record' => $note])
                        </div>
                    </div>
                    @if(!empty($note->note_reason_memo))
                        <div style="padding-left: 60px;">
                            <small><b>Reason:</b> {{ $note->note_reason_memo }}</small>
                        </div>
                    @endif
                </div>

                <!-- handouts -->
                {{-- <div class="p-3 border-bottom screen-only" data-non-segment-section="Handouts">
                    <?php
                        $handouts = Handout::where('is_active', true)->get();
                        $clientHandouts = $patient->handouts($note);
                    ?>
                    @include('app.patient.handouts-list', compact('patient', 'clientHandouts', 'handouts', 'note'))
                </div> --}}

                @if($pro->pro_type === 'ADMIN' && $note->hcpPro)
                <div class="p-3 border-bottom mt-2 screen-only">
                    <div class="">
                        @include('app/patient/partials/company-pro-documents')
                    </div>
                </div>
                @endif

                <div class="p-3 border-bottom screen-only" data-non-segment-section="Prescriptions">
                    @include('app.patient.prescriptions.list', compact('patient', 'note'))
                </div>

                <div class="p-3 border-bottom screen-only" data-non-segment-section="Incoming Reports">
                    @include('app.patient.partials.incoming-reports')
                </div>

                <div class="p-3 border-bottom screen-only" data-non-segment-section="Supply Orders Summary">
                    <div class="">
                        <div class="d-flex align-items-center mb-2">
                            <p class="font-weight-bold text-secondary m-0 font-size-14">Supply Orders Summary</p>
                            <span class="mx-2 text-secondary screen-only">|</span>
                            <a native target="_blank"
                               class="screen-only"
                               open-in-stag-popup
                               update-parent
                               mc-initer="patient-supply-orders"
                               title="{{$patient->displayName()}} - Supply Orders"
                               popup-style="medium"
                               href="/patients/view/{{$patient->uid}}/supply-orders?popupmode=1&note-uid={{$note->uid}}&filter=active">
                                Manage Supply Orders
                            </a>
                        </div>
                        <div class="p-3 border">

                            <p class="font-weight-bold text-secondary mb-2 mr-2">Associated with this note</p>
                            <div>
                                @if($supplyOrdersOnNote && count($supplyOrdersOnNote))
                                    <table class="table table-sm table-bordered mb-0 bg-white">
                                        <thead>
                                        <tr class="bg-light">
                                            <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Title</div></th>
                                            <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Reason</div></th>
                                            <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Created At</div></th>
                                            <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Pro Signed?</div></th>
                                            <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Cancelled?</div></th>
                                            <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Shipment</div></th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        @foreach($supplyOrdersOnNote as $iSupplyOrder)
                                            <tr class="">
                                                <td class="px-2">
                                                    {{ $iSupplyOrder->product->title }}
                                                </td>
                                                <td class="px-2">{{ $iSupplyOrder->reason }}</td>
                                                <td class="px-2">{{ friendlier_date($iSupplyOrder->created_at) }} <i class="fas fa-info-circle text-primary" data-toggle="tooltip" data-placement="top" data-html="true" title="Created at: {{ friendlier_date_time($iSupplyOrder->created_at) }} By: {{ $iSupplyOrder->createdByPro ? $iSupplyOrder->createdByPro->displayName() : ''}}"></i> </td>
                                                <td class="px-2">
                                                    {{ $iSupplyOrder->is_signed_by_pro ? $iSupplyOrder->signedPro->displayName() : '-' }}
                                                    <i class="fas fa-info-circle text-primary" data-toggle="tooltip" data-placement="top" data-html="true" title="Signed at: {{ friendlier_date_time($iSupplyOrder->pro_signed_at) }}"></i>
                                                </td>
                                                <td class="px-2">{{ $iSupplyOrder->is_cancelled ? 'Yes' : 'No' }}</td>
                                                <td class="px-2">
                                                    @if($iSupplyOrder->shipment_id)
                                                        <i class="fa fa-building"></i>
                                                        {{ucwords(strtolower($iSupplyOrder->shipment->status ? $iSupplyOrder->shipment->status : 'CREATED'))}}
                                                    @elseif($iSupplyOrder->is_cleared_for_shipment)
                                                        <span class="text-info">
                                                        <i class="fa fa-user-nurse"></i>
                                                        Cleared for shipment
                                                    </span>
                                                    @else
                                                        <span class="text-warning-mellow">
                                                        <i class="fa fa-user-nurse"></i>
                                                        Not cleared for shipment
                                                    </span>
                                                    @endif
                                                </td>
                                            </tr>
                                        @endforeach
                                        </tbody>
                                    </table>
                                @else
                                    <div class="text-secondary">-</div>
                                @endif
                            </div>

                            <hr class="my-2">

                            <p class="font-weight-bold text-secondary mb-2 mr-2">Others as of {{friendlier_date(date('Y-m-d'))}}</p>
                            @if($otherOpenSupplyOrders && count($otherOpenSupplyOrders))
                                <table class="table table-sm table-bordered mb-0 bg-white">
                                    <thead>
                                    <tr class="bg-light">
                                        <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Title</div></th>
                                        <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Memo</div></th>
                                        <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Created At</div></th>
                                        <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Pro Signed?</div></th>
                                        <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Cancelled?</div></th>
                                        <th class="px-2 text-nowrap text-secondary border-bottom-0"><div class="text-ellipsis">Shipment</div></th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($otherOpenSupplyOrders as $iSupplyOrder)
                                        <tr class="">
                                            <td class="px-2">
                                                {{ $iSupplyOrder->product->title }}
                                            </td>
                                            <td class="px-2">{{ $iSupplyOrder->reason }}</td>
                                            <td class="px-2">{{ friendlier_date_time($iSupplyOrder->created_at) }}</td>
                                            <td class="px-2">{{ $iSupplyOrder->is_signed_by_pro ? $iSupplyOrder->signedPro->displayName() : '-' }}</td>
                                            <td class="px-2">{{ $iSupplyOrder->is_cancelled ? 'Yes' : 'No' }}</td>
                                            <td class="px-2">
                                                @if($iSupplyOrder->shipment_id)
                                                    <i class="fa fa-building"></i>
                                                    {{ ucwords(strtolower($iSupplyOrder->shipment->status ? $iSupplyOrder->shipment->status : 'CREATED'))}}
                                                @elseif($iSupplyOrder->is_cleared_for_shipment)
                                                    <span class="text-info">
                                                        <i class="fa fa-user-nurse"></i>
                                                        Cleared for shipment
                                                    </span>
                                                @else
                                                    <span class="text-warning-mellow">
                                                        <i class="fa fa-user-nurse"></i>
                                                        Not cleared for shipment
                                                    </span>
                                                @endif
                                            </td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            @else
                                <div class="text-secondary">-</div>
                            @endif

                        </div>
                    </div>
                </div>

                {{--@if($patient->currentCareMonth())
                <div class="row border-bottom mx-3 mt-2">
                    @include('app.patient.rm-setup-form', ['careMonth' => $patient->currentCareMonth()])
                </div>
                @endif--}}

                <div class="row border-bottom mx-0">
                    <div class="col-12 px-0">
                        <div class="p-3 screen-only h-100" data-non-segment-section="Remote Monitoring">
                            <div class="d-flex align-items-center mb-3">
                                <p class="font-weight-bold text-secondary m-0 font-size-14">Remote Monitoring</p>
                            </div>
                            @include('app.patient.note.rm-setup')
                        </div>
                    </div>
                </div>

                <div class="p-3 border-bottom screen-only" data-non-segment-section="Vitals Settings">
                    <div class="d-flex align-items-center mb-3">
                        <p class="font-weight-bold text-secondary m-0 font-size-14">Vitals Settings</p>
                    </div>
                    <div class="row" id="vitals-settings-{{$patient->uid}}">
                        <div class="col-4 border-right">
                            <div class="d-flex align-items-baseline">
                                <b>BMI/Weight Management</b>
                                <span class="mx-2 text-secondary">|</span>
                                @include('app.patient.vitals-settings.bmi-management-form')
                            </div>
                            <div class="pt-3">
                                @include('app.patient.vitals-settings.bmi-management-summary')
                            </div>
                        </div>
                        <div class="col-8">
                            <div class="d-flex align-items-baseline">
                                <b>BP Management</b>
                                <span class="mx-2 text-secondary">|</span>
                                @include('app.patient.vitals-settings.bp-management-form')
                            </div>
                            <div class="pt-3">
                                @include('app.patient.vitals-settings.bp-management-summary')
                            </div>
                        </div>
                    </div>
                    <script>
                        (function () {
                            function calculateUsualBmi() {
                                let h = $('#bmi-management-settings [name="currentHeightInInches"]').val(),
                                    wMin = $('#bmi-management-settings [name="usualWeightInPoundsMin"]').val(),
                                    wMax = $('#bmi-management-settings [name="usualWeightInPoundsMax"]').val();
                                let bmiMinElem = $('#bmi-management-settings [name="usualBmiMin"]').val(''),
                                    bmiMinCategoryElem = $('#bmi-management-settings [name="usualBmiMinCategory"]').val(''),
                                    bmiMaxElem = $('#bmi-management-settings [name="usualBmiMax"]').val(''),
                                    bmiMaxCategoryElem = $('#bmi-management-settings [name="usualBmiMaxCategory"]').val('');
                                calculateBmi(h, wMin, bmiMinElem, bmiMinCategoryElem);
                                calculateBmi(h, wMax, bmiMaxElem, bmiMaxCategoryElem);
                                return false;
                            }

                            function calculateIdealBmi() {
                                let h = $('#bmi-management-settings [name="currentHeightInInches"]').val(),
                                    w = $('#bmi-management-settings [name="idealWeightInPounds"]').val();
                                let bmiElem = $('#bmi-management-settings [name="idealBmi"]').val(''),
                                    bmiCategoryElem = $('#bmi-management-settings [name="idealBmiCategory"]').val('');
                                calculateBmi(h, w, bmiElem, bmiCategoryElem);
                                return false;
                            }

                            function calculateBmi(h, w, bmiElem, bmiCategoryElem) {
                                let bmi = 0,
                                    bmiCategory = '';
                                try {
                                    h = +h;
                                    w = +w;
                                    bmi = (w / (h * h)) * 703;
                                    bmiElem.val(bmi.toFixed(1));
                                    if (bmi < 18.5) {
                                        bmiCategory = '(Underweight)';
                                    }
                                    if (bmi >= 18.5 && bmi < 25) {
                                        bmiCategory = '';
                                    }
                                    if (bmi >= 25 && bmi < 30) {
                                        bmiCategory = '(Overweight)';
                                    }
                                    if (bmi >= 30) {
                                        bmiCategory = '(Obese)';
                                    }
                                    bmiCategoryElem.show();
                                    if (bmiCategory == '') {
                                      bmiCategoryElem.hide();
                                    }
                                    bmiCategoryElem.val(bmiCategory);
                                } catch (e) {
                                    return false;
                                }
                            }

                            function init() {
                                $(function () {
                                    $('[data-toggle="tooltip"]').tooltip({
                                        html: true
                                    })
                                });
                                $(document)
                                    .off('change input paste keyup',
                                        '#bmi-management-settings [name="currentHeightInInches"], #bmi-management-settings [name="usualWeightInPoundsMin"],  #bmi-management-settings [name="usualWeightInPoundsMax"]')
                                    .on('change input paste keyup',
                                        '#bmi-management-settings [name="currentHeightInInches"], #bmi-management-settings [name="usualWeightInPoundsMin"],  #bmi-management-settings [name="usualWeightInPoundsMax"]', function () {
                                            return calculateUsualBmi();
                                        });
                                $(document)
                                    .off('change input paste keyup',
                                        '#bmi-management-settings [name="currentHeightInInches"], #bmi-management-settings [name="idealWeightInPounds"]')
                                    .on('change input paste keyup',
                                        '#bmi-management-settings [name="currentHeightInInches"], #bmi-management-settings [name="idealWeightInPounds"]', function () {
                                            return calculateIdealBmi();
                                        });

                                $('#bmi-management-settings [name="currentHeightInInches"]').trigger('change');

                                let parentSegment = $('#bmi-management-settings');
                                parentSegment.find('[heightFeetInput], [heightInchesInput]').off('change input paste');
                                parentSegment.find('[heightFeetInput], [heightInchesInput]').on('change input paste', function () {
                                    let inches = 0;
                                    let ft = +(parentSegment.find('[heightFeetInput]').val()),
                                        inc = +(parentSegment.find('[heightInchesInput]').val());
                                    inches = Math.round(ft * 12 + inc);
                                    parentSegment.find('[name="currentHeightInInches"]').val(inches).trigger('change');
                                });
                            }

                            addMCInitializer('vitals-settings-{{$patient->uid}}', init, '#vitals-settings-{{$patient->uid}}')
                        }).call(window);
                    </script>
                </div>

                @if(!$note->is_non_medical || true)
                    @if($pro->pro_type === 'ADMIN')
                    <div class="p-3 border-bottom screen-only" data-non-segment-section="Bills & Claims Summary">
                        <div>
                            <h2 class="font-weight-bold text-secondary">Bills & Claims Summary</h2>
                            <div class="d-flex justify-content-center align-items-start">
                                <table class="w-25 flex-grow-1 table-bordered table-condensed table-sm table-striped">
                                    <tbody>
                                    <tr>
                                        <td class="text-secondary">Bill Total Exp.</td>
                                        <td>${{friendly_money($note->bill_total_expected)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">Is Billing Closed</td>
                                        <td>{{$note->is_bill_closed ? 'Yes' : 'No'}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">Bill Summary</td>
                                        <td>{{$note->bill_summary ? $note->bill_summary : '-'}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">Bill Total Paid</td>
                                        <td>${{friendly_money($note->bill_total_paid)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">Billing Closed At</td>
                                        <td>{{friendlier_date_time($note->bill_closed_at)}}</td>
                                    </tr>
                                    </tbody>
                                </table>
                                <table class="w-25 flex-grow-1 table-bordered table-condensed table-sm table-striped ml-2">
                                    <tbody>
                                    <tr>
                                        <td class="text-secondary">Claim Total Exp.</td>
                                        <td>${{friendly_money($note->claim_total_expected)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">Is Claiming Closed</td>
                                        <td>{{$note->is_claim_closed ? 'Yes' : 'No'}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">Claim Summary</td>
                                        <td>{{$note->claim_summary ? $note->claim_summary : '-'}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">Claim Total Paid</td>
                                        <td>${{friendly_money($note->claim_total_paid)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">Claiming Closed At</td>
                                        <td>{{$note->claim_closed_at ? friendlier_date_time($note->claim_closed_at) : '-'}}</td>
                                    </tr>
                                    </tbody>
                                </table>
                                <table class="w-25 flex-grow-1 table-bordered table-condensed table-sm table-striped ml-2">
                                    <tbody>
                                    <tr>
                                        <td class="text-secondary">HCP Bill Total Exp.</td>
                                        <td>${{friendly_money($note->hcp_bill_total_expected)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">NA Bill Total Exp.</td>
                                        <td>${{friendly_money($note->na_bill_total_expected)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">RMM Bill Total Exp.</td>
                                        <td>${{friendly_money($note->rmm_bill_total_expected)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">RME Bill Total Exp.</td>
                                        <td>${{friendly_money($note->rme_bill_total_expected)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">RMS Bill Total Exp.</td>
                                        <td>${{friendly_money($note->rms_bill_total_expected)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">RMG Bill Total Exp.</td>
                                        <td>${{friendly_money($note->rmg_bill_total_expected)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">CM Bill Total Exp.</td>
                                        <td>${{friendly_money($note->cm_bill_total_expected)}}</td>
                                    </tr>
                                    </tbody>
                                </table>
                                <table class="w-25 flex-grow-1 table-bordered table-condensed table-sm table-striped ml-2">
                                    <tbody>
                                    <tr>
                                        <td class="text-secondary">HCP Bill Total Paid</td>
                                        <td>${{friendly_money($note->hcp_bill_total_paid)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">NA Bill Total Paid</td>
                                        <td>${{friendly_money($note->na_bill_total_paid)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">RMM Bill Total Paid</td>
                                        <td>${{friendly_money($note->rmm_bill_total_paid)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">RME Bill Total Paid</td>
                                        <td>${{friendly_money($note->rme_bill_total_paid)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">RMS Bill Total Paid</td>
                                        <td>${{friendly_money($note->rms_bill_total_paid)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">RMG Bill Total Paid</td>
                                        <td>${{friendly_money($note->rmg_bill_total_paid)}}</td>
                                    </tr>
                                    <tr>
                                        <td class="text-secondary">CM Bill Total Paid</td>
                                        <td>${{friendly_money($note->cm_bill_total_paid)}}</td>
                                    </tr>

                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    @endif

                    @include('app.patient.note.partials.cpp-bills-claims-container')

                    @include('app.patient.note.partials._payments_received', ['note_uid' => $note->uid])

                @endif

                {{-- addendums --}}
                @if($note->is_signed_by_hcp)
                <div class="border-top p-3" data-non-segment-section="Addendums">
                    @if($note->addendums->count())
                        <div class="">
                            <div class="d-flex align-items-center mb-2">
                                <p class="font-weight-bold text-secondary m-0">Addendums</p>
                                @include('app/patient/note/_create-addendum')
                            </div>
                            <table class="table table-sm tabe-striped border-left border-right border-bottom m-0">
                                <thead class="bg-light">
                                <tr>
                                    <th class="border-bottom-0 pl-2 w-75">Addendum</th>
                                    <th class="border-bottom-0">Created</th>
                                    <th class="border-bottom-0 delete-column"></th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach ($note->addendums as $addendum)
                                    <tr>
                                        <td class="pl-2">{{ $addendum->memo }}</td>
                                        <td class="">{{ friendly_date_time($addendum->created_at, false)}}</td>
                                        <td>
                                            <div class="d-flex align-items-center">
                                                <div moe relative class="mr-2">
                                                    <a href="" show start><i class="fa fa-edit"></i></a>
                                                    <form url="/api/noteAddendum/updateMemo" right>
                                                        <input type="hidden" name="uid" value="{{$addendum->uid}}">
                                                        <div class="mb-2 d-block">
                                                            <label class="d-block text-sm text-secondary mb-1">Addendum</label>
                                                            <textarea class="form-control form-control-sm" name="memo" rows="5">{{$addendum->memo}}</textarea>
                                                        </div>
                                                        <div class="form-group mb-0">
                                                            <button class="btn btn-primary btn-sm mr-1" submit>Submit</button>
                                                            <button class="btn btn-default border btn-sm" cancel>Cancel</button>
                                                        </div>
                                                    </form>
                                                </div>
                                                <div moe relative class="mr-1">
                                                    <a href="" show start class="text-danger"><i class="fa fa-trash"></i></a>
                                                    <form url="/api/noteAddendum/remove" right>
                                                        <input type="hidden" name="uid" value="{{$addendum->uid}}">
                                                        <p>Remove this addendum?</p>
                                                        <div class="form-group mb-0">
                                                            <button class="btn btn-danger btn-sm mr-1" submit>Yes</button>
                                                            <button class="btn btn-default border btn-sm" cancel>No</button>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    @else
                        <div class="d-flex">
                            <p class="font-weight-bold mb-0 text-secondary">No addendums in this note</p>
                            @include('app/patient/note/_create-addendum')
                        </div>
                    @endif
                </div>
                @endif

                <div class="screen-only">
                    @include('app/patient/note/_cancel-signed-note')
                </div>

                </div>

                @if($isVisitTemplateBased && !$note->is_signed_by_hcp)
                <div class="position-sticky note-bottom-toolbar border-top border-info p-0 bg-aliceblue d-flex align-items-stretch screen-only">
                    <div class="nbt-container border-right border-info">
                        <div native target="_blank"
                             class="c-pointer d-inline-flex align-items-center px-2 py-1"
                             open-in-stag-popup
                             title="Medrisk Vigilence"
                             popup-style="overflow-visible mrv-content"
                             href="/mrv-summary/{{$note->uid}}">
                            <span>MRV</span>
                        </div>
                    </div>
                    <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                        <div native target="_blank"
                             class="c-pointer d-inline-flex align-items-center medications-center-trigger px-2 py-1"
                             open-in-stag-popup
                             mc-initer="medications-center-{{$note->id}}"
                             title="Medications Center"
                             popup-style="overflow-visible"
                             href="/medications-center/{{$patient->uid}}/{{$note->uid}}">
                            <i class="fa fa-bolt mr-1"></i>
                            <span>Rx</span>
                        </div>
                    </div>
                    <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                        <div native target="_blank"
                             class="c-pointer d-inline-flex align-items-center problems-center-trigger px-2 py-1"
                             open-in-stag-popup
                             mc-initer="problems-center-{{$note->id}}"
                             title="Problems Center"
                             popup-style="overflow-visible"
                             href="/problems-center/{{$patient->uid}}/{{$note->uid}}">
                            <i class="fa fa-bolt mr-1"></i>
                            <span>Dx</span>
                        </div>
                    </div>
                    <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                        <div native target="_blank"
                             class="c-pointer d-inline-flex align-items-center goals-center-trigger px-2 py-1"
                             open-in-stag-popup
                             mc-initer="goals-center-{{$note->id}}"
                             title="Goals Center"
                             popup-style="overflow-visible"
                             href="/goals-center/{{$patient->uid}}/{{$note->uid}}">
                            <i class="fa fa-bolt mr-1"></i>
                            <span>Goals</span>
                        </div>
                    </div>
                    <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                        <div native target="_blank"
                             class="c-pointer d-inline-flex align-items-center allergies-center-trigger px-2 py-1"
                             open-in-stag-popup
                             mc-initer="allergies-center-{{$note->id}}"
                             title="Allergies Center"
                             popup-style="overflow-visible"
                             href="/allergies-center/{{$patient->uid}}/{{$note->uid}}">
                            <i class="fa fa-bolt mr-1"></i>
                            <span>Allergies</span>
                        </div>
                    </div>
                    <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                        <div native target="_blank"
                             class="c-pointer d-inline-flex align-items-center careteam-center-trigger px-2 py-1"
                             open-in-stag-popup
                             mc-initer="careteam-center-{{$note->id}}"
                             title="Care Team Center"
                             popup-style="overflow-visible"
                             href="/careteam-center/{{$patient->uid}}/{{$note->uid}}">
                            <i class="fa fa-bolt mr-1"></i>
                            <span>Care Team</span>
                        </div>
                    </div>
                    <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                        <a native="" target="_top"
                           class="c-pointer d-inline-flex align-items-center handouts-trigger px-2 py-1 text-dark"
                           data-non-segment-target="Incoming Reports" href="#">Inc. Rpts.</a>
                    </div>
                    <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                        <a native="" target="_top"
                           class="c-pointer d-inline-flex align-items-center handouts-trigger px-2 py-1 text-dark"
                           data-non-segment-target="Handouts" href="#">Handouts</a>
                    </div>
                    <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                        <a native="" target="_top"
                           class="c-pointer d-inline-flex align-items-center handouts-trigger px-2 py-1 text-dark"
                           data-non-segment-target="Prescriptions" href="#">ERx</a>
                    </div>
                    @if($pro->pro_type === 'ADMIN')
                        <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                            <a native="" target="_top"
                               class="c-pointer d-inline-flex align-items-center handouts-trigger px-2 py-1 text-dark"
                               data-non-segment-target="HCP Bills" href="#">HCP Bills</a>
                        </div>
                        <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                            <a native="" target="_top"
                               class="c-pointer d-inline-flex align-items-center handouts-trigger px-2 py-1 text-dark"
                               data-non-segment-target="NA Bills" href="#">NA Bills</a>
                        </div>
                    @else
                        @if($note->hcpPro && $pro->id === $note->hcpPro->id)
                            <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                                <a native="" target="_top"
                                   class="c-pointer d-inline-flex align-items-center handouts-trigger px-2 py-1 text-dark"
                                   data-non-segment-target="HCP Bills" href="#">Bills</a>
                            </div>
                        @endif
                        @if($note->allyPro && $pro->id === $note->allyPro->id)
                            <div class="nbt-container border-right border-info d-inline-flex align-self-stretch">
                                <a native="" target="_top"
                                   class="c-pointer d-inline-flex align-items-center handouts-trigger px-2 py-1 text-dark"
                                   data-non-segment-target="NA Bills" href="#">Bills</a>
                            </div>
                        @endif
                    @endif
                </div>
                @endif

                </div>
                @if(1 || !$hasRightSegments)
                    @include('app.patient.note.rhs-sidebar')
                @endif
            </div>
        </div>
    </div>
    <div class="note-templates-underlay"></div>
    @include('app.patient.note.dashboard_script')
    @if(!$isVisitTemplateBased)
    <script>
        (function() {
            function init() {
                $('.trigger-clone')
                    .off('click.clone')
                    .on('click.clone', function() {
                        $.post('/api/note/clone', {
                            uid: $(this).attr('data-uid')
                        }, function(_data) {
                            if(_data) {
                                if(_data.success) {
                                    toastr.success('Note cloned successfully');
                                    fastLoad('/patients/view/{{$patient->uid}}/notes/view/' + _data.data);
                                }
                                else {
                                    toastr.error(_data.message);
                                }
                            }
                            else {
                                toastr.error('Unable to clone the note!');
                            }
                        }, 'json');
                    });
            }
            addMCInitializer('non-visit-template', init, '#note-single-header');
        })();
    </script>
    @endif
    @if($isVisitTemplateBased)
    <script>
        (function() {
            function init() {
                @if(1 || !$hasRightSegments)
                fixTreeTopAndHeight();
                $(window).on('resize', fixTreeTopAndHeight);
                $(window).on('scroll', fixTreeTopAndHeight);
                $('.note-tree-node>a[data-segment-uid]')
                    .off('click.scroll-to-segment')
                    .on('click.scroll-to-segment', function() {
                        let section = $('div.note-section[data-segment-uid="' + $(this).attr('data-segment-uid') + '"]').first();
                        if(section.length) {
                            section[0].scrollIntoView({
                                behavior: "smooth",
                                block: "center",
                                inline: "center"
                            });
                            section.addClass('spot-highlight');
                            setTimeout(() => {
                                section.removeClass('spot-highlight');
                            }, 1500);
                            $('.note-tree-node.active').removeClass('active');
                            $(this).closest('.note-tree-node').addClass('active');
                        }
                        return false;
                    });
                // clicking node parent - go to first child
                $('.note-tree-node.note-tree-heading>a:not([data-segment-uid])')
                    .off('click.scroll-to-first-child-segment')
                    .on('click.scroll-to-first-child-segment', function() {
                         $(this).parent().find('>.note-tree-children>.note-tree-node>a[data-segment-uid]').first().trigger('click');
                         return false;
                    });
                @endif
                $(document)
                    .off('click.scroll-to-non-segment', '[data-non-segment-target]')
                    .on('click.scroll-to-non-segment', '[data-non-segment-target]', function() {
                        closeStagPopup(true);
                        let section = $('div[data-non-segment-section="' + $(this).attr('data-non-segment-target') + '"]').first();
                        if(section.length) {
                            section[0].scrollIntoView({
                                behavior: "smooth",
                                block: "center",
                                inline: "center"
                            });
                            section.addClass('spot-highlight');
                            setTimeout(() => {
                                section.removeClass('spot-highlight');
                            }, 1500);
                            $('.note-tree-node.active').removeClass('active');
                            $(this).closest('.note-tree-node').addClass('active');
                        }
                        return false;
                    });

                // update disclaimers on fastReload()
                // NOTE: this is NOT the ideal place to put this
                @if(!$note->is_signed_by_hcp)
                refreshSegment('disclaimers');
                @endif
            }
            function fixTreeTopAndHeight() {
                let tree = $('#note-lhs-tree'), noteCardHeader = $('#note-card-header');
                if(!noteCardHeader.length) return;
                let resultTop = (noteCardHeader.offset().top + noteCardHeader.outerHeight(true)) - $(window).scrollTop();
                let topMin = $('#patient-top-most-header').length ? 91 : 55;
                if(resultTop <= topMin) {
                    @if(!$note->is_signed_by_hcp)
                    tree.addClass('fixed');
                    @else
                    tree.addClass('fixed-left');
                    @endif
                }
                else {
                    @if(!$note->is_signed_by_hcp)
                    tree.removeClass('fixed');
                    @else
                    tree.removeClass('fixed-left');
                    @endif
                    tree.css('height', 'calc(100vh - ' + resultTop + 'px)');
                    tree.css('max-height', 'calc(100vh - ' + resultTop + 'px)');
                }
            }
            addMCInitializer('note-tree', init, '#note-lhs-tree');
        })();
    </script>
    <script>
        (function() {
            function init() {
                fixRhsSidebarTopAndHeight();
                $(window).on('resize', fixRhsSidebarTopAndHeight);
                $(window).on('scroll', fixRhsSidebarTopAndHeight);
            }
            function fixRhsSidebarTopAndHeight() {
                let rhsSidebar = $('#note-rhs-sidebar'), noteCardHeader = $('#note-card-header');
                if(!noteCardHeader.length) return;
                let resultTop = (noteCardHeader.offset().top + noteCardHeader.outerHeight(true)) - $(window).scrollTop();
                let topMin = $('#patient-top-most-header').length ? 91 : 55;
                if(resultTop <= topMin) {
                    rhsSidebar.addClass('fixed');
                    rhsSidebar.closest('.note-container').addClass('rhs-sidebar-fixed');
                }
                else {
                    rhsSidebar.removeClass('fixed');
                    rhsSidebar.closest('.note-container').removeClass('rhs-sidebar-fixed');
                    rhsSidebar.css('height', 'calc(100vh - ' + resultTop + 'px)');
                    rhsSidebar.css('max-height', 'calc(100vh - ' + resultTop + 'px)');
                }
            }
            addMCInitializer('rhs-sidebar', init, '#note-rhs-sidebar');
        })();
    </script>
    <script>
            (function() {
                function init() {
                    @if($hasRightSegments)
                    initVSplitter('stag-note', $('.note-left-panel'), $('.note-right-panel'));
                    initStagScrollbar({{$note->is_signed_by_hcp ? 1 : 34}});
                    @endif
                    addMCHook('onNoteMethodUpdate', function() {
                        refreshSegment('disclaimers');
                        refreshSegment('omega_informed_consent');
                        fastReload();
                    });
                    $(document)
                        .off('click.scroll-to-non-segment', '[data-non-segment-target]')
                        .on('click.scroll-to-non-segment', '[data-non-segment-target]', function() {
                            closeStagPopup(true);
                            let section = $('div[data-non-segment-section="' + $(this).attr('data-non-segment-target') + '"]').first();
                            if(section.length) {
                                section[0].scrollIntoView({
                                    behavior: "smooth",
                                    block: "center",
                                    inline: "center"
                                });
                                section.addClass('spot-highlight');
                                setTimeout(() => {
                                    section.removeClass('spot-highlight');
                                }, 1500);
                                $('.note-tree-node.active').removeClass('active');
                                $(this).closest('.note-tree-node').addClass('active');
                            }
                            return false;
                        });
                }
                addMCInitializer('soap-visit', init, '#note-single-header');
            })();
        </script>
    @endif

@endsection

@if(!$isVisitTemplateBased)
@section('left-nav-content')
    @if(!$note->is_signed_by_hcp)
    <div class="left-nav-content" id="note-sections-app">
        <div class="note-widget-title px-2 py-1">Note Sections</div>
        <input type="search" class="d-block w-100 border-0 outline-0 px-2 py-1"
               v-model="q" placeholder="Filter">
        <div class="border-top py-1">
            <div v-for="section in sections"
                 v-show="section.title.toLowerCase().indexOf(q.toLowerCase()) !== -1">
                <div class="d-flex pr-1 align-items-center note-widget-item c-pointer"
                     :title="section.title + ' - Click to remove'"
                     v-if="section.used"
                     v-on:click.once="remove(section.section_uid)">
                    <span class="mx-2">
                        <a class="font-12 text-secondary" href="#">
                            <i class="fa fa-minus-circle"></i>
                        </a>
                    </span>
                    <span class="font-smaller text-ellipsis">
                        @{{section.title}}
                    </span>
                </div>
                <div class="d-flex pr-1 align-items-center note-widget-item c-pointer"
                     :title="section.title + ' - Click to add'"
                     v-if="!section.used"
                     v-on:click.once="add(section.uid, section.internal_name)">
                    <span class="mx-2">
                        <a class="font-12" hrefnote-sections-app="#">
                            <i class="fa fa-plus-circle"></i>
                        </a>
                    </span>
                    <span class="font-smaller text-ellipsis">
                        @{{section.title}}
                    </span>
                </div>
            </div>
        </div>
    </div>
    <script>
        (function() {
            function initSectionsWidget() {
                var allSections = <?= json_encode($allSections) ?>;
                new Vue({
                    el: '#note-sections-app',
                    delimiters: ['@{{', '}}'],
                    data: {
                        q: '',
                        sections: allSections
                    },
                    methods: {
                        add: function(_uid, _section) {
                            $.post('/api/section/create', {
                                noteUid: '{{$note->uid}}',
                                sectionTemplateUid: _uid,
                            }, function(_data) {
                                if(_data) {
                                    if(_data.success) {
                                        fastReload();
                                    }
                                    else {
                                        toastr.error(_data.message);
                                    }
                                }
                                else {
                                    toastr.error('Unable to add section!');
                                }
                            }, 'json');
                        },
                        remove: function(_uid) {
                            $.post('/api/section/deactivate', {
                                uid: _uid,
                                memo: 'Deactivated from note',
                            }, function(_data) {
                                if(_data) {
                                    if(_data.success) {
                                        fastReload();
                                    }
                                    else {
                                        toastr.error(_data.message);
                                    }
                                }
                                else {
                                    toastr.error('Unable to remove section!');
                                }
                            }, 'json');
                        }
                    }
                });

                $('div[embed]').each(function() {
                    $(this).load($(this).attr('embed'));
                });
            }
            addMCInitializer('note-sections-widget', initSectionsWidget, '#note-sections-app');
        })();
    </script>
    @endif
@endsection
@endif
