@extends('Frontend.partials.layout')

{{-- morris css --}}
@section('styles')
<link rel="stylesheet" href="{{ asset('/vendor/libs/bootstrap-select/bootstrap-select.css') }}">
<link rel="stylesheet" href="{{ asset('/vendor/libs/select2/select2.css') }}">
<link rel="stylesheet" href="{{ asset('/vendor/libs/morris/morris.css') }}">
<style>
    svg text {
        font-size: 24px !important;
        font-weight: 600 !important
    }
</style>
@endsection

@php

$user = $data['userDetails'];
$admin = getUserByid(getAuthID());
$menus = __getMenus();

@endphp

@section('content')
{{-- Main content section --}}
<section class="home">
    <div class="row">
        {{--section left --}}
        <div class="col-lg-8 col-sm-12">
            @if(!empty($submenu))
            <div class="cui-example">
                {{-- dashboard content --}}
                <div class="row">
                    <div class="col-md-12">
                        {{-- get menu list --}}
                        @if (empty($allMenus))
                        <script>
                            $(document).ready(function() {
                                toastr.options = {
                                    positionClass: 'toast-top-center'
                                };

                                toastr.error(`{{__('action.your_access_contact_your_therapist ')}}`, 'Limitation Error!')

                                var $notifyContainer = $('#toast-container').closest('.toast-top-center');
                                if ($notifyContainer) {
                                    // align center
                                    var windowHeight = $(window).height() - 90;
                                    $notifyContainer.css("margin-top", windowHeight / 5);
                                }
                            })
                        </script>
                        @endif

                        <div class="card mb-3 dashboard-card">
                            {{-- header section --}}
                            <div class="card-header p-name">
                                @if ($admin->user_type == '0')
                                    <h3 class="card-title">{{ ucfirst($product['product_name']) }}</h4>
                                @else
                                    <h3 class="card-title">{{ ucfirst($product['proName']) }}</h4>
                                @endif
                                @if($data['randomAnalysis'] == 1)
                                <div class="card-tools pull-right">
                                    <a href="{{ route('dashboard.changerandomstatus') }}" class="btn border border-warning text-center text-warning random_blinking">{{__('action.rancheckedmsg')}}</a>
                                </div>
                                @endif
                            </div>
                            {{-- content section  --}}
                            <div class="card-body">
                            {{-- page preloader --}}
                                <div class="preloader">
                                    <img src="{!! asset('images/Fill-4.png') !!}" alt="">
                                </div>
                                <div class="row">
                                    {{-- left --}}
                                    <div class="col-md-4 col-sm-12 col-12">
                                        <div class="dashboard-progress-content text-center">
                                            <div id="morrisjs-donut-pro{{ $product['proid'] }}" class="morrisjs-Donut" style="height: 250px;"></div>
                                            <p class="p-name">{{ ucfirst($product['proName']) }}</p>
                                        </div>
                                    </div>

                                    <script>
                                        $(function() {
                                            if("{{$data['randomAnalysis'] }}" == 1){
                                                var morrisDonut = new Morris.Donut({
                                                    element: 'morrisjs-donut-pro{{ $product["proid"] }}',
                                                    data: [{
                                                            label: '',
                                                            value: "{{ $product['anaGreen']+$product['anaOrange']+$product['anaRed'] }}"
                                                        }
                                                    ],
                                                    colors: ['gray'],
                                                    resize: true,
                                                    labelColor: '#888',

                                                    formatter: function(value) {
                                                        return value
                                                    }
                                                });
                                            }else{
                                                var morrisDonut = new Morris.Donut({
                                                    element: 'morrisjs-donut-pro{{ $product["proid"] }}',
                                                    data: [{
                                                            label: '',
                                                            value: "{{ $product['anaGreen'] }}"
                                                        },
                                                        {
                                                            label: '',
                                                            value: "{{ $product['anaOrange'] }}"
                                                        },
                                                        {
                                                            label: '',
                                                            value: "{{ $product['anaRed'] }}"
                                                        }
                                                    ],
                                                    colors: ['#2FAB66', '#F8B133', '#E84E1B'],
                                                    resize: true,
                                                    labelColor: '#888',

                                                    formatter: function(value) {
                                                        return value
                                                    }
                                                })
                                                morrisDonut.select(2);
                                            }

                                        });
                                    </script>

                                    {{-- right --}}
                                    <div class="col-md-8 col-sm-12 col-12">
                                        <div class="row sub-list">
                                            @if(!empty($submenu))
                                            @foreach ($submenu as $key=> $sub)
                                            <div class="col-md-6 col-sm-6 col-12">
                                                <div class="card color-border-one text-center mb-3">
                                                    <h6 class="card-header f-16">
                                                        <a class="dashboardSubmenu" href="{{ route('dashboard.product', [$product['proid'], $sub['submenuId']]) }}"> {{ $sub['submenuName']}} </a>
                                                    </h6>
                                                    <div class="progress-circle-mini">
                                                        <div id="morrisjs-donut{{ $sub['submenuId'] }}" class="morris-progressbar-mini" style="height: 150px !important;"></div>
                                                    </div>

                                                </div>
                                            </div>
                                            <script>
                                                $(function() {
                                                    if("{{$data['randomAnalysis']}}" == 1){
                                                        var morrisDonut = new Morris.Donut({
                                                            element: 'morrisjs-donut{{ $sub["submenuId"] }}',
                                                            data: [{
                                                                    label: '',
                                                                    value: "{{ $sub['anaGreen']+$sub['anaOrange']+$sub['anaRed'] }}",

                                                                }
                                                            ],
                                                            colors: ['gray'],
                                                            resize: true,
                                                            labelColor: '#888',


                                                            formatter: function(value) {
                                                                return value
                                                            }
                                                        });
                                                    }
                                                    else{
                                                        var morrisDonut = new Morris.Donut({
                                                            element: 'morrisjs-donut{{ $sub["submenuId"] }}',
                                                            data: [{
                                                                    label: '',
                                                                    value: "{{ $sub['anaGreen'] }}",

                                                                },
                                                                {
                                                                    label: '',
                                                                    value: "{{ $sub['anaOrange'] }}"
                                                                },
                                                                {
                                                                    label: '',
                                                                    value: "{{ $sub['anaRed'] }}"
                                                                }
                                                            ],
                                                            colors: ['#2FAB66', '#F8B133', '#E84E1B'],
                                                            resize: true,
                                                            labelColor: '#888',
                                                            pointStrokeWidths: [5],

                                                            formatter: function(value) {
                                                                return value
                                                            }
                                                        });

                                                    }
                                                    morrisDonut.select(2);
                                                });
                                            </script>
                                            @endforeach
                                            @endif
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            @endif
        </div>
        {{-- include layout dashboard Right Section --}}
        @include('Frontend.partials.includes.layout-dashright')
    </div>
</section>

@endsection

@section('scripts')


<!-- Dependencies -->
<script src="{{ asset('/vendor/libs/bootstrap-select/bootstrap-select.js') }}"></script>
<script src="{{ asset('/vendor/libs/select2/select2.js') }}"></script>
<script src="{{ asset('/vendor/libs/chartjs/chartjs.js') }}"></script>
<script src="{{ asset('/vendor/libs/swiper/swiper.js') }}"></script>
<script src="{{ asset('/js/ui_carousel.js') }}"></script>

<!-- Dependencies -->
<script src="{{ asset('/vendor/libs/eve/eve.js') }}"></script>
<script src="{{ asset('/vendor/libs/raphael/raphael.js') }}"></script>
<script src="{{ asset('/vendor/libs/morris/morris.js') }}"></script>


@endsection