@extends('layouts.master')

@section('mainContent')
    <div class="page-wrapper">
        <div class="page-header-link">
            <a href="javascript:;" class="show-menuheader">
                Policy Menus
                <i class="fas fa-align-left ms-auto"></i>
            </a>
        </div>
        <div class="page-menu">
            <div class="page-menu-header">
                <h2>Audit Menu</h2>
                <a href="javascript:;" class="close-header-menu"> <i class="fas fa-close"></i></a>
            </div>
            @include('layouts.tenants.audit-header-menu')
        </div>
        <div class="content">
            <div class="row">
                <div class="col-12">
                    <div class="page-header">
                        <h3>Dashboard</h3>
                        <ul>
                            <li class="text-primary">Audit & Assurance</li>
                            <li><a href="javascript:;">Dashboard</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        {{--
            <div class="row">
                <div class="col-lg-6 col-12">
                    <div class="card">
                        <div class="card-body pb-0">
                            <div class="row">
                                <div class="col-md-6">
                                    <h3 class="head-client">NC Aging Insights</h3>
                                </div>
                                <div class="col-md-6">
                                    <select id="ncAgingRange" class="form-select">
                                        <option value="30">30 Days</option>
                                        <option value="60">60 Days</option>
                                        <option value="90">90 Days</option>
                                    </select>
                                </div>

                                <div class="col-12">
                                    <div class="dash-card dash-gray">
                                        <h5 class="counter" id="ncAgingCount">{{ $totalNcCount }}</h5>
                                        <h6>No of NC Aging</h6>
                                        <div class="dash-img">
                                            <img src="{{ url('assets/img/icons/chart.svg') }}" alt="img">
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-12">
                    <div class="card">
                        <div class="card-body pb-0">

                            <div class="row">
                                <div class="col-md-6">
                                    <h3 class="head-client">Audits Insights</h3>
                                </div>
                                <div class="col-md-6">
                                    <select id="auditRangeDropdown" class="form-select">
                                        <option value="30" selected>30 Days</option>
                                        <option value="60">60 Days</option>
                                        <option value="90">90 Days</option>
                                    </select>
                                </div>
                                <div class="col-12">
                                    <div class="dash-card dash-gray">
                                        <h5 class="counter" id="upcomingAuditCount">{{ $upcomingAuditCount }}</h5>
                                        <h6>No of Upcoming Audits</h6>
                                        <div class="dash-img">
                                            <img src="{{ url('assets/img/icons/chart.svg') }}" alt="img">
                                        </div>
                                    </div>
                                </div>

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

            </div>
            <div class="row">
                <div class="col-lg-6 col-12">
                    <div class="card">
                        <div class="card-body pb-0">

                            <div class="row">
                                <div class="col-md-6">
                                    <h3 class="head-client">Audit Plan Insights</h3>
                                </div>
                                <div class="col-md-6">
                                    <div class="daterange-picker d-flex align-items-center justify-content-righ">
                                        <div class="form-sort me-2">
                                            <i class="ti ti-calendar"></i>
                                            <input type="text" class="form-control  date-range bookingrange-audit"
                                                style="width: 220px">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-12">
                                    <div class="dash-card dash-gray">
                                        <h5 class="counter" id="totalAuditCount">{{ $totalAuditCount }}</h5>
                                        <h6>Total Audit Planned</h6>
                                        <div class="dash-img">
                                            <img src="{{ url('assets/img/icons/chart.svg') }}" alt="img">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12">
                                        <div id="chart-audit"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-12">
                    <div class="card">
                        <div class="card-body pb-0">
                            <div class="row">
                                <div class="col-md-6">
                                    <h3 class="head-client">NC Insights</h3>
                                </div>
                                <div class="col-md-6">
                                    <div class="daterange-picker d-flex align-items-center justify-content-righ">
                                        <div class="form-sort me-2">
                                            <i class="ti ti-calendar"></i>
                                            <input type="text" class="form-control  date-range bookingrange-nc"
                                                style="width: 220px">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-12">
                                    <div class="dash-card dash-gray">
                                        <h5 class="counter" id="totalControlCount">{{ $totalNctypesCount }}</h5>
                                        <h6>Total NC</h6>
                                        <div class="dash-img">
                                            <img src="{{ url('assets/img/icons/chart.svg') }}" alt="img">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12">
                                        <div id="chart-nc-audit"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        --}}
        <div class="row">
                <div class="col-lg-6 col-12">
                    <div class="card">
                        <div class="card-body pb-0">
                            <div class="head-client">
                                <div class="row">
                                    <div class="col-md-12">
                                            <h3>Audit Insights</h3>
                                    </div>
                                </div>
                            </div>
                            <div class="nested-card">
                                <div class="dash-card">
                                    <div class="flex-count-blk d-flex align-items-end">
                                        <div class="count-start flex-fill">
                                            <h6>Audits</h6>
                                            <h5>{{ $totalAuditCount }}</h5>
                                        </div>
                                        <ul class="insight-list flex-fill d-flex gap-2">
                                            <li>
                                                <i class="fa fa-circle draft-status me-1"></i> Completed
                                                <span
                                                    class="ms-2 weight-bold">{{ $auditTypesCounts['completed']??0 }}</span>
                                            </li>
                                            <li>
                                                <i class="fa fa-circle retired-status me-1"></i> Open
                                                <span
                                                    class="ms-2 weight-bold">{{ $auditTypesCounts['open']??0 }}</span>
                                            </li>
                                            <li>
                                                <i class="fa fa-circle danger-status me-1"></i> In Progress
                                                <span
                                                    class="ms-2 weight-bold">{{ $auditTypesCounts['in_progress']??0 }}</span>
                                            </li>
                                            <li>
                                                <i class="fa fa-circle danger-status me-1"></i> Closed
                                                <span
                                                    class="ms-2 weight-bold">{{ $auditTypesCounts['closed']??0 }}</span>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="dash-img">
                                        <i class="fe fe-bar-chart-2"></i>
                                    </div>
                                </div>
                                <div id="chart-audit"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-12 d-flex">
                    <div class="card">
                        <div class="card-body pb-0">
                            <div class="head-client">
                                <div class="row">
                                    <div class="col-md-12">
                                            <h3>NC Insights</h3>
                                    </div>
                                </div>
                            </div>
                            <div class="nested-card">
                                <div class="dash-card">
                                    <div class="flex-count-blk d-flex align-items-end">
                                        <div class="count-start flex-fill">
                                            <h6>NC</h6>
                                            <h5>{{ $totalNcCount }}</h5>
                                        </div>
                                        <ul class="insight-list flex-fill d-flex gap-2">
                                            <li>
                                                <i class="fa fa-circle draft-status me-1"></i> Major
                                                <span
                                                    class="ms-2 weight-bold">{{ $ncTypesCounts['Major']??0 }}</span>
                                            </li>
                                            <li>
                                                <i class="fa fa-circle retired-status me-1"></i>Minor
                                                <span
                                                    class="ms-2 weight-bold">{{ $ncTypesCounts['Minor']??0 }}</span>
                                            </li>
                                            <li>
                                                <i class="fa fa-circle danger-status me-1"></i> Suggestion 
                                                <span
                                                    class="ms-2 weight-bold">{{ $ncTypesCounts['Suggestion']??0 }}</span>
                                            </li>
                                            <li>
                                                <i class="fa fa-circle danger-status me-1"></i> OFI 
                                                <span
                                                    class="ms-2 weight-bold">{{ $ncTypesCounts['OFI']??0 }}</span>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="dash-img">
                                        <i class="fe fe-bar-chart-2"></i>
                                    </div>
                                </div>
                                <div id="chart-nc"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-6 col-12">
                    <div class="card">
                        <div class="card-body pb-0">
                            <div class="head-client">
                                <div class="row">
                                    <div class="col-md-12">
                                            <h3>NC Ageing Insights</h3>
                                    </div>
                                </div>
                            </div>
                            <div class="nested-card">
                                <div class="dash-card">
                                    <div class="flex-count-blk d-flex align-items-end">
                                        <div class="count-start flex-fill">
                                            <h6>NC Ageing</h6>
                                            <h5>{{ isset($ncStatusCount)?array_sum($ncStatusCount):0 }}</h5>
                                        </div>
                                        <ul class="insight-list flex-fill d-flex gap-2">
                                          
                                            <li>
                                                <i class="fa fa-circle retired-status me-1"></i> Open 
                                                <span
                                                    class="ms-2 weight-bold">{{ $ncStatusCount['Open']??0 }}</span>
                                            </li>
                                            <li>
                                                <i class="fa fa-circle danger-status me-1"></i> In Progress
                                                <span
                                                    class="ms-2 weight-bold">{{ $ncStatusCount['In Progress']??0 }}</span>
                                            </li>
                                            <li>
                                                <i class="fa fa-circle danger-status me-1"></i> Closed
                                                <span
                                                    class="ms-2 weight-bold">{{ $ncStatusCount['Closed']??0 }}</span>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="dash-img">
                                        <i class="fe fe-bar-chart-2"></i>
                                    </div>
                                </div>
                                <div id="chart-nc-aging"></div>
                            </div>
                        </div>
                    </div>
                </div>
        </div>

            <div class="row">
                <div class="col-12 d-flex widget-path widget-service">
                    <div class="card">
                        <div class="tab-set">
                            <nav>
                                <div class="nav nav-tabs" id="nav-tab" role="tablist">
                                    <button class="nav-link active" id="cmmi-master-tab" data-bs-toggle="tab"
                                        data-bs-target="#cmmi-master" type="button" role="tab"
                                        aria-controls="cmmi-master" aria-selected="true">CMMI</button>

                                    <button class="nav-link " id="security-master-tab" data-bs-toggle="tab"
                                        data-bs-target="#security-master" aria-controls="security-master"
                                        aria-selected="false">Security</button>

                                </div>
                            </nav>
                            <div class="tab-content" id="nav-tabContent">
                                <div class="tab-pane fade show active" id="cmmi-master" role="tabpanel"
                                    aria-labelledby="cmmi-master-tab">
                                    <div class="master-wrapper">
                                        <div class="row">
                                            <div class="col-md-8">
                                                <h3 class="head-client">Compliance % Practice Area Insights</h3>
                                            </div>
                                            <div class="col-md-4">
                                                <select name="control" id="audit_compliance" class="select">
                                                    <option value="">Select</option>
                                                    @if (!@empty($auditData))
                                                        @foreach ($auditData as $key => $row)
                                                            <option value="{{ $key }}">
                                                                {{ $row }}</option>
                                                        @endforeach
                                                    @endif
                                                </select>
                                            </div>
                                            <div class="col-12">
                                                <div id="chartpracticearea"></div>
                                            </div>
                                        </div>
                                        <div class="row mt-5 mb-3">
                                            <div class="col-lg-6">
                                                <h3 class="head-client">Compliance % for Capability Insights</h3>
                                                <div id="chartcapability"></div>
                                            </div>
                                            <div class="col-lg-6">
                                                <h3 class="head-client">Compliance % for Category Insights</h3>
                                                <div id="chartcategory"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="tab-pane fade" id="security-master" role="tabpanel"
                                    aria-labelledby="security-master-tab">
                                    <div class="col-lg-12 col-12">
                                        <div class="card">
                                            <div class="card-body pb-0">.
                                                <div class="col-md-12">
                                                       <h3>Security Control Status Insights</h3>
                                                </div>
                                                <div class="row">
                                                    <div class="col-md-8">
                                                        <div class="dash-card dash-gray"> 
                                                            <h6>No of Control Status</h6> 
                                                            <h5 class="counter" id="totalStatusCount">
                                                            {{ $totalStatusCount }}</h5>
                                                        </div>
                                                    </div> 
                                                    
                                                    <div class="col-md-4">
                                                        <select name="control" id="control_dash" class="select">
                                                            <option value="">Select</option>
                                                            @if ($controls->isNotEmpty())
                                                                @foreach ($controls as $row) 
                                                                 @if(!empty($row->standards->standard_name))
                                                                    
                                                                    <option value="{{ $row->id }}">
                                                                        {{ $row->audit_name.'-'.$row->standards->standard_name  }}</option>
                                                                     @endif
                                                                 @endforeach
                                                            @endif
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div> 
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div id="chart-audit-control"></div>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
{{-- 
@section('customScript')
    <script>
        var completedCount = @json($completedCount);
        var closedCount = @json($closedCount);
    </script>
@endsection
--}}