@extends('monitoring/layout.treatment_layout') 
@section('title','BettrAi | Treatment Plan Configuration') 
@section('content')
<style type="text/css">
    #divLoadingInPopup1.tabloadershow1 {
        display: none;
        position: fixed;
        z-index: 100;
        background-image: url("{{ url('assets/images/loading-icon.gif') }}");
        opacity: 0.90;
        left: 0px;
        bottom: 0px;
        right: 0px;
        top: 50px;
        background-repeat: no-repeat;
        background-position: center center;
        background-color: white;
    }
    .loop_graph_tile{
        max-height: 500px;
        overflow-y: auto;
        scrollbar-color: rgba(var(--black-rgb),.2) rgba(var(--white-rgb),.1);
        scrollbar-width: thin !important;
    }
    .graph_table {
        width: 100%;
        border-collapse: collapse;
        margin-top: 20px;
    }
    .graph_th, .graph_td {
        border: 1px solid #dddddd;
        text-align: left;
        padding: 8px;
    }
    .graph_th {
        background-color: #f2f2f2;
    }
    .nav_side_link{
        padding: 0.75rem 0.1rem !important;
    }
    .navi-text{
        font-size: 0.8rem !important;
    }
    .navi-icon{
        flex: 0 0 1rem !important;
    }
    .risk_status_label{
        position: absolute !important;
        top: 32% !important;
        left: 19% !important;
    }
    .table_data_details{
        display: revert !important;
    }
</style>
<div class="card card-custom gutter-b mt-10">
    <div class="card-header py-6">
        <div class="col-lg-4 float-right mt-2">
            <div class="col-lg-12">
                <h3 class="font-size-h3 text-primary">Risk Prediction</h3>
            </div>
        </div>
        <div class="col-lg-8 float-right" style="text-align: right;" align="right">
            <div class="col-lg-7 ml-0 pl-0 float-left mt-2">
                <div class="radio-inline font-weight-bold text-dark">
                    <label class="radio" style="font-size: 12px;">
                        <input type="radio" checked="checked" class="view_type" value="0" name="all_sections" onclick="show_hide_sections('graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                    <span></span></label>
                    <label class="radio" style="font-size: 12px;">
                        <input type="radio" class="view_type" value="1" name="all_sections" onclick="show_hide_sections('table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                    </label>											
                </div>
            </div>
            <div class="col-lg-5 float-right">
                <div class="col-lg-12">
                    <div class="input-group">
                        <select name="rem_period_type" id="rem_period_type" class="filter_select form-control font-weight-bolder filter_ddls" onchange="view_all_reminders('296',this.value,'bear Gonzalez')">
                            <!-- <option selected="selected" value="c">Today</option>
                            <option value="w"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">This Week</font></font></option> -->
                            <option value="m">Current Month</option>
                            <!-- <option value="p"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">Previous Month</font></font></option> -->
                        </select>
                    </div>
                </div>
                <!-- <div class="col-lg-4 float-right mt-n6">
                    <div class="input-group">
                        <div class="col-lg-2 col-sm-2 col-sm-2 mr-10">
                            <a href="javascript:void(0)" title="" data-toggle="tooltip" onclick="send_sms_popup()" data-original-title="Send Text">
                            <i class="flaticon-graph icon-xl"></i></a>
                        </div>
                        <div class="col-lg-2 col-sm-2 col-sm-2">
                            <a href="javascript:void(0)" title="" data-toggle="tooltip" onclick="send_sms_popup()" data-original-title="Send Text">
                            <i class="fa fa-share-alt icon-xl"></i></a>
                        </div>
                    </div>
                </div> -->
            </div>
        </div>
    </div>
    <!--end::Body-->
</div>
<div class="d-flex flex-row mt-10 mb-20">
    <!-- <div class="flex-row-auto offcanvas-mobile w-200px w-xxl-275px" id="kt_inbox_aside">
        <div class="card card-custom card-stretch">
            <div class="card-body px-5">
                <ul class="navi">
                    <li class="navi-item">
                        <a class="navi-link nav_side_link">
                        <span class="navi-icon">
                        <i class="flaticon2-next icon-sm"></i>
                        </span>
                        <span class="navi-text">Account Clinical Monitoring</span>
                        </a>
                    </li>
                    <li class="navi-item">
                        <a class="navi-link nav_side_link" href="#">
                        <span class="navi-icon">
                        <i class="flaticon2-next icon-sm"></i>
                        </span>
                        <span class="navi-text">Clinical Nurse Monitoring</span>
                        </a>
                    </li>
                    <li class="navi-item">
                        <a class="navi-link nav_side_link" href="#">
                        <span class="navi-icon">
                        <i class="flaticon2-next icon-sm"></i>
                        </span>
                        <span class="navi-text">Risk Distribution Histogram</span>
                        </a>
                    </li>
                </ul>
                <div class="separator separator-dashed mt-5 mb-8"></div>
                <a href="#" class="btn btn-outline-primary">Add Comparison <i class="icon-1x text-dark-50 flaticon2-plus"></i></a>
            </div>
        </div>
    </div> -->
    <!--end::Aside-->
    <!--begin::List-->
    <div class="flex-row-fluid ml-lg-8 d-block" id="kt_inbox_list">
        <!--begin::Card-->
        <div class="card card-custom card-stretch">
            <!--begin::Header-->
            <!--end::Header-->
            <!--begin::Body-->
            <div class="card-body table-responsive px-0" style="overflow: hidden;">
                <div class="row">
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-header" style="background: #6591c8;">
                                <div class="card-title">
                                    <h3 class="card-label" style="color: #fff;">Readmissions</h3>
                                </div>
                            </div>
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="card-title">
                                    <span class="card-label font-weight-bolder text-dark">Risk of not showing for a scheduled appt in the next 6 months</span>
                                </div>
                                <!--begin::Chart-->
                                <!-- <div class="symbol symbol-circle symbol-lg-60">
                                    <img src="{{ url('assets/images/default.jpg') }}" alt="image" style="width: 70px;">
                                </div> -->
                                <span class="label label-inline label-light-danger font-weight-bold">HIGH RISK</span>
                                <div class="table-responsive">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr>
                                                <!-- <th scope="col">Patient ID</th>
                                                <th scope="col">Gender</th>
                                                <th scope="col">Age</th> -->
                                                <th scope="col">Risk Score Percentile</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <!-- <th scope="row">311058969</th>
                                                <td>Female</td>
                                                <td>43</td> -->
                                                <td>98</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <table class="table table-bordered mb-1 table-responsive table_data_details">
                                        <thead>
                                            <tr>
                                                <th scope="col">Impact on risk</th>
                                                <th scope="col">Contributing Factor</th>
                                                <th scope="col">Value</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+25%</span></th>
                                                <td># of Missed/Rescheduled Appts(12M)</td>
                                                <td>4</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+17%</span></th>
                                                <td>Reported Barriers to Care</td>
                                                <td>4</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+13%</span></th>
                                                <td># of Unique Prescribers(12M)</td>
                                                <td>4</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+8%</span></th>
                                                <td>low Medication Adherence</td>
                                                <td>4</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <!--end::Chart-->
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="card-title">
                                            <span class="card-label font-weight-bolder text-dark">Assessments for Risk Details</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" checked="checked" class="view_type" value="0" name="contributing_type" onclick="show_hide_indisections('contributing','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" class="view_type" value="1" name="contributing_type" onclick="show_hide_indisections('contributing','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                </div>
                                <div id="contributing_graph" class="graph_section">
                                </div>
                                <div id="contributing_table" class="table_section" style="display:none;">
                                    <table class="graph_table table_data_details">
                                        <thead>
                                            <tr>
                                                <th class="graph_th">Contributing Factor</th>
                                                <th class="graph_th">Risk Level</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Admissions For CHF(1M)</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Decrease in Medication Adherence</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">No. of changes in Medication Regimen at Discharge</td>
                                                <td class="graph_td">Low</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Level of Caregiver Support</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-header" style="background: #6591c8;">
                                <div class="card-title">
                                    <h3 class="card-label" style="color: #fff;">Drug Safety</h3>
                                </div>
                            </div>
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="card-title">
                                    <span class="card-label font-weight-bolder text-dark">Risk of Serious Fall-related injury in next 12 months</span>
                                </div>
                                <!--begin::Chart-->
                                <!-- <div class="symbol symbol-circle symbol-lg-60">
                                    <img src="{{ url('assets/images/default.jpg') }}" alt="image" style="width: 70px;">
                                </div> -->
                                <span class="label label-inline label-light-danger font-weight-bold">HIGH RISK</span>
                                <div class="table-responsive">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr>
                                                <!-- <th scope="col">Patient ID</th>
                                                <th scope="col">Gender</th>
                                                <th scope="col">Age</th> -->
                                                <th scope="col">Risk Score Percentile</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <!-- <th scope="row">311058969</th>
                                                <td>Female</td>
                                                <td>43</td> -->
                                                <td>98</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <table class="table table-bordered mb-1 table-responsive table_data_details">
                                        <thead>
                                            <tr>
                                                <th scope="col">Impact on risk</th>
                                                <th scope="col">Contributing Factor</th>
                                                <th scope="col">Value</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+24%</span></th>
                                                <td>Change in Antichoilinergic Cognitive Burden Scale</td>
                                                <td>1 to 5</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+21%</span></th>
                                                <td>Increase in # of Unique Prescribers</td>
                                                <td>5 to 7</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+19%</span></th>
                                                <td>Finalty Percentile</td>
                                                <td>0.70</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+14%</span></th>
                                                <td>Level of Reported Medication Side Effects</td>
                                                <td>High</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <!--end::Chart-->
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="card-title">
                                            <span class="card-label font-weight-bolder text-dark">Patient Drug Safety Risk Assessment</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" checked="checked" class="view_type" value="0" name="drug_type" onclick="show_hide_indisections('drugsafety','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" class="view_type" value="1" name="drug_type" onclick="show_hide_indisections('drugsafety','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                </div>
                                <div id="drugsafety_graph" class="graph_section">
                                </div>
                                <div id="drugsafety_table" class="table_section" style="display:none;">
                                    <table class="table table-bordered mb-1 table-responsive table_data_details">
                                        <thead>
                                            <tr>
                                                <th class="graph_th">Factor</th>
                                                <th class="graph_th">Risk Level</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Change in Antichrolinergic Cognitive Burden Scale</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Increase in # of Unique Prescribers</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Frailty Percentile</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Level of Reported Medication Side Effects</td>
                                                <td class="graph_td">Low</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6 loop_graph_tile">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-header" style="background: #6591c8;">
                                <div class="card-title">
                                    <h3 class="card-label" style="color: #fff;">Medication Adherence</h3>
                                </div>
                            </div>
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="card-title">
                                    <span class="card-label font-weight-bolder text-dark">Risk of not showing for a scheduled appt in the next 6 months</span>
                                </div>
                                <!--begin::Chart-->
                                <!-- <div class="symbol symbol-circle symbol-lg-60">
                                    <img src="{{ url('assets/images/default.jpg') }}" alt="image" style="width: 70px;">
                                </div> -->
                                <span class="label label-inline label-light-danger font-weight-bold">HIGH RISK</span>
                                <div class="table-responsive">
                                    <table class="table table-bordered mb-6 table-responsive table_data_details">
                                        <thead>
                                            <tr>
                                                <!-- <th scope="col">Patient ID</th>
                                                <th scope="col">Gender</th>
                                                <th scope="col">Age</th> -->
                                                <th scope="col">Risk Score Percentile</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <!-- <th scope="row">311058969</th>
                                                <td>Female</td>
                                                <td>43</td> -->
                                                <td>98</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <table class="table table-bordered mb-1 table-responsive table_data_details">
                                        <thead>
                                            <tr>
                                                <th scope="col">Impact on risk</th>
                                                <th scope="col">Contributing Factor</th>
                                                <th scope="col">Value</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+25%</span></th>
                                                <td># of Missed/Rescheduled Appts(12M)</td>
                                                <td>4</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+17%</span></th>
                                                <td>Reported Barriers to Care</td>
                                                <td>4</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+13%</span></th>
                                                <td># of Unique Prescribers(12M)</td>
                                                <td>4</td>
                                            </tr>
                                            <tr>
                                                <th scope="row"><span class="label label-inline label-light-danger font-weight-bold">+8%</span></th>
                                                <td>low Medication Adherence</td>
                                                <td>4</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <!--end::Chart-->
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                    <div class="col-lg-6">
                        <!--begin::Card-->
                        <div class="card card-custom gutter-b">
                            <div class="card-body pr-2 pl-2 pb-10 pt-8">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="card-title">
                                            <span class="card-label font-weight-bolder text-dark">Patient Medication Adherence</span>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="radio-inline font-weight-bold text-dark">
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" checked="checked" class="view_type" value="0" name="medadherence_type" onclick="show_hide_indisections('medadherence','graph')"><i class="far fa-chart-bar mr-2 text-dark"></i>Graph View 
                                            <span></span></label>
                                            <label class="radio" style="font-size: 12px;">
                                                <input type="radio" class="view_type" value="1" name="medadherence_type" onclick="show_hide_indisections('medadherence','table')"><i class="fas fa-table mr-2 text-dark"></i>Table View<span></span>
                                            </label>											
                                        </div>
                                    </div>
                                </div>
                                <div id="medadherence_graph" class="graph_section">
                                </div>
                                <div id="medadherence_table" class="table_section" style="display:none;">
                                    <table class="table table-bordered mb-1 table-responsive table_data_details">
                                        <thead>
                                            <tr>
                                                <th class="graph_th">Factor</th>
                                                <th class="graph_th">Risk Level</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="graph_td">Change in Antichrolinergic Cognitive Burden Scale</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Increase in # of Unique Prescribers</td>
                                                <td class="graph_td">Medium</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Frailty Percentile</td>
                                                <td class="graph_td">High</td>
                                            </tr>
                                            <tr>
                                                <td class="graph_td">Level of Reported Medication Side Effects</td>
                                                <td class="graph_td">Low</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <!--end::Card-->
                    </div>
                </div>
            </div>
            <!--end::Body-->
        </div>
        <!--end::Card-->
    </div>
</div>
<script>var _tooltip = jQuery.fn.tooltip;</script>
<script>jQuery.fn.tooltip = _tooltip;</script>
<script type="text/javascript">
// Highcharts.chart('contributing_graph', {

//     title: {
//         text: '',
//         align: 'left'
//     },

//     subtitle: {
//         text: '',
//         align: 'left'
//     },

//     yAxis: {
//         title: {
//             text: ''
//         }
//     },

//     // xAxis: {
//     //     accessibility: {
//     //         rangeDescription: ''
//     //     }
//     // },
//     xAxis: {
//         categories: ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],
//         // crosshair: true,
//         // accessibility: {
//         //     description: 'Countries'
//         // }
//     },
//     legend: {
//         layout: 'vertical',
//         align: 'right',
//         verticalAlign: 'middle'
//     },

//     // plotOptions: {
//     //     series: {
//     //         label: {
//     //             connectorAllowed: false
//     //         },
//     //         pointStart: 2010
//     //     }
//     // },

//     series: [{
//         name: 'Admissions For CHF(1M)',
//         data: [24, 19, 16, 18, 19, 20,17, 16, 15, 20, 18,22]
//     }, {
//         name: 'Decrease in Medication Adherence',
//         data: [16, 17, 18, 14, 13, 14,15, 16, 12, 14, 17,15]
//     }, {
//         name: 'No. of changes in Medication Regimen at Discharge',
//         data: [12, 15, 17, 13, 14, 16,17, 16, 15, 14, 18, 16]
//     }, {
//         name: 'Level of Caregiver Support',
//         data: [4, 6, 5, 7, 6, 10,9, 8, 5, 7, 6, 8]
//     }],

//     responsive: {
//         rules: [{
//             condition: {
//                 maxWidth: 500
//             },
//             chartOptions: {
//                 legend: {
//                     layout: 'horizontal',
//                     align: 'center',
//                     verticalAlign: 'bottom'
//                 }
//             }
//         }]
//     }

// });
Highcharts.chart('contributing_graph', {
    chart: {
        type: 'spline'
    },
    title: {
        text: ''
    },
    subtitle: {
        text: ''
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        accessibility: {
            description: 'Months of the year'
        }
    },
    yAxis: {
        title: {
            text: ''
        }
    },
    tooltip: {
        crosshairs: true,
        shared: true
    },
    credits: {
        enabled: false
    },
    plotOptions: {
        spline: {
            marker: {
                radius: 2,
                lineColor: '#666666',
                lineWidth: 1
            }
        }
    },
    series: [{
        name: 'Admissions For CHF(1M)',
        marker: {
            symbol: 'circle'
        },
        color:'#00fed8',
        data: [24, 19, 16, 18, 19, 20,17, 16, 15, 20, 18,22]

    }, {
        name: 'Decrease in Medication Adherence',
        marker: {
            symbol: 'circle'
        },
        color:'#fe009e',
        data: [16, 17, 18, 14, 13, 14,15, 16, 12, 14, 17,15]
    }, {
        name: 'No. of changes in Medication Regimen at Discharge',
        marker: {
            symbol: 'circle'
        },
        color:'#0013fe',
        data: [12, 15, 17, 13, 14, 16,17, 16, 15, 14, 18, 16]
    }, {
        name: 'Level of Caregiver Support',
        marker: {
            symbol: 'circle'
        },
        color:'#fe7b00',
        data: [4, 6, 5, 7, 6, 10,9, 8, 5, 7, 6, 8]
    }]
});



// Rising Risk and Cost Bloomers
Highcharts.chart('drugsafety_graph', {
    chart: {
        type: 'column'
    },
    title: {
        align: 'left',
        text: ''
    },
    subtitle: {
        align: 'left',
        text: ''
    },
    accessibility: {
        announceNewData: {
            enabled: true
        }
    },
    xAxis: {
        type: 'category'
    },
    yAxis: {
        title: {
            text: 'Risk Level'
        }

    },
    legend: {
        enabled: false
    },
	credits: {
        enabled: false
    },
    plotOptions: {
        series: {
            borderWidth: 0,
            dataLabels: {
                enabled: true,
                format: '{point.y:.1f}'
            }
        }
    },

    tooltip: {
        headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
        pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}</b> of total<br/>'
    },

    series: [
        {
            name: 'Risk of cost Rising atleast 50% in ext 12 months',
            colorByPoint: true,
            data: [
                {
                    name: 'Change in Antichrolinergic Cognitive Burden Scale',
					color :'#ec1278',
                    y: 36,
                },
                {
                    name: 'Increase in # of Unique Prescribers',
					color :'#47d2c7',
                    y: 44,
                },
                {
                    name: 'Frailty Percentile',
					color :'#fe7700',
                    y: 54,
                },
                {
                    name: 'Level of Reported Medication Side Effects',
					color :'#2bc4f5',
                    y: 46,
                }
            ]
        }
    ]
});


// Rising Risk and Cost Bloomers
Highcharts.chart('medadherence_graph', {
    chart: {
        type: 'column'
    },
    title: {
        align: 'left',
        text: ''
    },
    subtitle: {
        align: 'left',
        text: ''
    },
    accessibility: {
        announceNewData: {
            enabled: true
        }
    },
    xAxis: {
        type: 'category'
    },
    yAxis: {
        title: {
            text: 'Risk Level'
        }

    },
    legend: {
        enabled: false
    },
    credits: {
        enabled: false
    },
    plotOptions: {
        series: {
            borderWidth: 0,
            dataLabels: {
                enabled: true,
                format: '{point.y:.1f}'
            }
        }
    },

    tooltip: {
        headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
        pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}</b> of total<br/>'
    },

    series: [
        {
            name: 'Risk of Potential avoidable Hospitalization',
            colorByPoint: true,
            data: [
                {
                    name: 'Medicare Disability',
                    color :'#ec1278',
                    y: 36,
                },
                {
                    name: '# of HCCs',
                    color :'#47d2c7',
                    y: 44,
                },
                {
                    name: 'Days since last PCP Visit',
                    color :'#f5e02b',
                    y: 54,
                },
                {
                    name: 'Pct Mammography Screening',
                    color :'#2bc4f5',
                    y: 46,
                }
            ]
        }
    ]
});

function show_hide_sections(section_type){
    if(section_type=='graph'){
        $('.graph_section').show();
        $('.table_section').hide();
    } else {
        $('.graph_section').hide();
        $('.table_section').show();
    }
}

function show_hide_indisections(section_name, section_type){
    if(section_type=='graph'){
        $('#'+section_name+'_graph').show();
        $('#'+section_name+'_table').hide();
    } else {
        $('#'+section_name+'_graph').hide();
        $('#'+section_name+'_table').show();
    }
}
</script>
@endsection