@extends('admin.layout.layout')

@section('content')
    <div class="container-fluid">
        <div class="top_bar">
            <div class="row">
                <div class="col-lg-auto col-auto my-auto">
                    <div class="main_title">
                        <h3>Manage Incentive</h3>
                    </div>
                </div>

                <div class="col-lg-auto col-auto ms-auto my-auto">
                    @php
                        $currentMonth = $data['monthData']['name'];

                        $date = DateTime::createFromFormat('F', $currentMonth);

                        if ($date) {
                            $date->modify('-2 months');

                            $data['monthData']['name'] = $date->format('F');
                        }
                    @endphp

                    <div class="main_title">
                        <h3>Incentive {{ $data['monthData']['name'] }} {{ $data['fyYearData']['name'] }}</h3>
                    </div>
                </div>
                <div class="col-lg-auto col-auto">
                    <div class="select_bg d-flex align-items-center">
                        <div class="ms-2">
                            <select class="select2 js-example-basic-single select-label form-control w-100"
                                name="monthIdFilter" id="monthIdFilter">
                                <option value="" selected disabled>All Month</option>
                                @foreach ($data['allMonthsData'] as $key => $rowMonthData)
                                    <option value="{{ Crypt::encrypt($rowMonthData['id']) }}"
                                        {{ $rowMonthData['id'] == $data['monthData']['id'] ? 'selected' : '' }}>
                                        {{ $rowMonthData['name'] }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="ms-2">
                            <select class="select2 js-example-basic-single select-label form-control w-100"
                                name="yearIdFilter" id="yearIdFilter">
                                <option value="" selected disabled>All Year</option>
                                @foreach ($data['allFyYearsData'] as $key => $rowFyYearsData)
                                    <option value="{{ Crypt::encrypt($rowFyYearsData['id']) }}"
                                        {{ $rowFyYearsData['id'] == $data['fyYearData']['id'] ? 'selected' : '' }}>
                                        {{ $rowFyYearsData['name'] }}</option>
                                @endforeach
                            </select>
                        </div>
                        <a href="javascript:void(0);" id="searchData" class="btn btn-primary ms-2"><i
                                class="fa fa-search"></i></a>
                        <a href="javascript:void(0);" id="clearData" class="btn btn-danger ms-2"><i
                                class="fa fa-times"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <!--  Row 1 -->

        {{-- Status Manage --}}
        <div class="row">
            <div class="col-12">
                <div class="white_round">
                    <div class="time_line">
                        <div id="insentive_calculated" class="item up_coming">
                            <div class="icon_watch">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>Sales Admin Import</p>
                        </div>
                        <div id="account_update_pending" class="item up_coming">
                            <div class="icon_watch">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>Account Import</p>
                        </div>
                        <div id="admin_review_pending" class="item up_coming">
                            <div class="icon_watch">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>Sales Review</p>
                        </div>
                        <div id="account_review_pending" class="item up_coming">
                            <div class="icon_watch">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>Account Review</p>
                        </div>
                        <div id="cso_review_pending" class="item up_coming">
                            <div class="icon_watch">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>CSO Review</p>
                        </div>
                        <div id="hr_review_pending" class="item up_coming">
                            <div class="icon_watch">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>HR Review</p>
                        </div>
                        <div id="c_b_review_pending" class="item up_coming">
                            <div class="icon_watch ">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>C&B Review</p>
                        </div>
                        <div id="hr_final_review_pending" class="item up_coming">
                            <div class="icon_watch ">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>HR Final Review</p>
                        </div>
                        <div id="c_b_final_review_pending" class="item up_coming">
                            <div class="icon_watch ">
                                <i class="fa-solid fa-clock"></i>
                                <i class="fa-solid fa-rotate"></i>
                                <i class="fa-solid fa-circle-check"></i>
                            </div>
                            <p>C&B Final Review</p>
                        </div>
                    </div>
                </div>

            </div>
        </div>

        <div class="row">

            <div class="col-12">
                @if (auth()->user()->role == 'admin' ||
                        auth()->user()->role == 'account' ||
                        auth()->user()->role == 'adminAccount' ||
                        auth()->user()->role == 'super_admin')
                    <div class="tabs_file no_space_li">
                        {{-- <ul class="tabs"> --}}
                        {{-- <button class="active">Update data</button> --}}
                        {{-- <a href="./view-output.php" >View Output</a> --}}

                        {{-- <button
                                {{ isset($data['incentiveData']) && !empty($data['incentiveData']['current_status']) && $data['incentiveData']['current_status'] === 'insentive_calculated' ? '' : 'disabled' }}>View
                                Output</button> --}}
                        {{-- </ul> --}}
                        <ul class="tabs">
                            <li class="tab-link {{ isset($data['incentiveData']) && !empty($data['incentiveData']['current_status']) && $data['incentiveData']['current_status'] !== 'admin_final_insentive_calculated' ? 'current' : '' }}"
                                data-tab="tab-1"><button class="">Update data</button></li>
                            @if (isset($data['incentiveData']) &&
                                    !empty($data['incentiveData']['current_status']) &&
                                    ($data['incentiveData']['current_status'] === 'admin_review_pending' ||
                                        $data['incentiveData']['current_status'] === 'admin_final_insentive_calculated'))
                                <li class="tab-link {{ isset($data['incentiveData']) && !empty($data['incentiveData']['current_status']) && $data['incentiveData']['current_status'] === 'admin_final_insentive_calculated' ? 'current' : '' }}"
                                    data-tab="tab-2"><button
                                        {{ isset($data['incentiveData']) && !empty($data['incentiveData']['current_status']) && ($data['incentiveData']['current_status'] === 'insentive_calculated' || $data['incentiveData']['current_status'] === 'account_insentive_calculated' || $data['incentiveData']['current_status'] === 'admin_final_insentive_calculated') ? '' : 'disabled' }}>View
                                        Output</button></li>
                            @endif

                        </ul>
                    </div>
                @endif

                <div class="view_output">
                    <div class="white_round">
                        <div class="row">
                            <div class="col-lg-auto col-md-auto col-auto my-auto">
                                <div class="main_title">
                                    <h2>Manage Incentive</h2>
                                </div>
                            </div>

                            {{-- Process for output start --}}
                            {{-- @if (auth()->user()->role == 'admin' && auth()->user()->can('edit-incentive-data') && (isset($data['incentiveData']) && !empty($data['incentiveData']['current_status']) && ($data['incentiveData']['current_status'] === 'admin_import_pending' || $data['incentiveData']['current_status'] === 'admin_review_pending')) && $data['allAdminImportStatusDone']) --}}
                            @if (
                                (auth()->user()->role == 'admin' || auth()->user()->role == 'adminAccount') &&
                                    auth()->user()->can('edit-incentive-data') &&
                                    (isset($data['incentiveData']) &&
                                        !empty($data['incentiveData']['current_status']) &&
                                        $data['incentiveData']['current_status'] === 'admin_review_pending') &&
                                    $data['allAdminImportStatusDone']
                            )
                                <div class="col-lg-auto col-md-auto col-auto my-auto ms-auto">
                                    <a href="javascript:void(0);" type="button"
                                        onclick="process_for_view_output('{{ $data['incentiveData']['id'] }}')"
                                        class="btn btn-primary">Process For
                                        View Output</a>
                                </div>
                            @endif

                            {{-- @if (auth()->user()->role == 'account' && auth()->user()->can('edit-incentive-data') && (isset($data['incentiveData']) && !empty($data['incentiveData']['current_status']) && $data['incentiveData']['current_status'] === 'account_update_pending') && $data['allAccountImportStatusDone'])
                                <div class="col-lg-auto col-md-auto col-auto my-auto ms-auto">
                                    <a href="javascript:void(0);" type="button"
                                        onclick="process_for_view_output('{{ $data['incentiveData']['id'] }}')"
                                        class="btn btn-primary">Process For
                                        View Output</a>
                                </div>
                            @endif --}}

                            {{-- Process for output end --}}

                            @if (auth()->user()->role == 'admin' &&
                                    auth()->user()->can('edit-incentive-data') &&
                                    (isset($data['incentiveData']) &&
                                        !empty($data['incentiveData']['current_status']) &&
                                        ($data['incentiveData']['current_status'] === 'admin_import_pending' ||
                                            $data['incentiveData']['current_status'] === 'admin_final_insentive_calculated')) &&
                                    $data['allAdminImportStatusDone']
                            )
                                <div class="col-lg-auto col-md-auto col-auto my-auto ms-auto">
                                    <a href="javascript:void(0);" type="button" class="btn  btn-outline-primary"
                                        onclick="process_for_next_step('{{ $data['incentiveData']['id'] }}','{{ $data['incentiveData']['current_status'] }}')"><img
                                            src="{{ asset('assets/images/send-message.png') }}" class="me-2">
                                        @if ($data['incentiveData']['current_status'] === 'admin_final_insentive_calculated')
                                            Process
                                            For Account
                                            Review
                                        @else
                                            Process
                                            For Account
                                            Import
                                        @endif
                                    </a>
                                </div>
                            @endif

                            @if (auth()->user()->role == 'account' &&
                                    auth()->user()->can('edit-incentive-data') &&
                                    (isset($data['incentiveData']) &&
                                        !empty($data['incentiveData']['current_status']) &&
                                        $data['incentiveData']['current_status'] === 'account_update_pending') &&
                                    $data['allAccountImportStatusDone']
                            )
                                <div class="col-lg-auto col-md-auto col-auto my-auto ms-auto">
                                    <a href="javascript:void(0);" type="button" class="btn  btn-outline-primary"
                                        onclick="process_for_next_step('{{ $data['incentiveData']['id'] }}','{{ $data['incentiveData']['current_status'] }}')"><img
                                            src="{{ asset('assets/images/send-message.png') }}" class="me-2">
                                        Process
                                        For Admin
                                        Review</a>
                                </div>
                            @endif

                        </div>
                        <div id="tab-1" class="tab-content current">
                            <div class="row">
                                <div class="col-12">
                                    <div class="table_specing">
                                        <table id="importDataTable" class="table table-striped data-table-dr"
                                            style="width:100%">
                                            <thead>
                                                <tr>
                                                    <th>Sr No</th>
                                                    <th>File Name</th>
                                                    <th>Insert Count</th>
                                                    <th>Error Count</th>
                                                    <th>Total Count</th>
                                                    <th>Upload/Change File</th>
                                                    <th>Status</th>
                                                    <th>Date And Time</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div id="tab-2" class="tab-content">
                            <div class="row">
                                <div class="col-12">
                                    <div class="table_specing">
                                        <table id="dealwiseDataTable" class="table table-striped data-table-dr"
                                            style="width:100%">
                                            <thead>
                                                <tr>
                                                    <th>Sr No</th>
                                                    <th>Project</th>
                                                    <th>Application Date</th>
                                                    <th>CRN No</th>
                                                    <th>Net Value</th>
                                                    <th>Actual Net Value</th>
                                                    <th>Amount Received</th>
                                                    <th>Registration Date</th>
                                                    <th>Incentive Amount</th>
                                                    <th>Person Involved</th>
                                                    <th>Status</th>
                                                    <th>Action</th>
                                                    <th>Date And Time</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>

    </div>

    <!-- Modal Upload -->
    <div class="modal fade" id="ImportModal" tabindex="-1" aria-labelledby="ImportModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <h2 class="modal-title fs-5" id="ImportModalLabel">Upload Import file</h2>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    {!! Form::open([
                        'url' => '#',
                        'name' => 'importForm',
                        'id' => 'importForm',
                        'enctype' => 'multipart/form-data',
                    ]) !!}
                    <input type="hidden" name="importFormType" id="importFormType">
                    <input type="hidden" name="import_type" id="import_type">
                    <input type="hidden" id="importId" name="importId">
                    <div class="">
                        <div class="mb-3 file_icon">
                            {{-- <span> <img src="{{ asset('assets/images/file.png') }}" class="me-2"> files-2.xls</span> --}}
                            <div class="progress" role="progressbar" aria-label="Animated striped example"
                                aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
                                <div class="progress-bar progress-bar-striped progress-bar-animated" style="width: 0%">
                                </div>
                            </div>
                            <p>Uploaded file</p>
                        </div>
                        <div class="pdf_detiles">
                            <div class="view__pdf_de">
                                <input type="file" id="importFile" name="importFile" accept=".csv, text/csv">

                                <div class="add_pdf_icon">
                                    <img src="{{ asset('assets/images/upload.png') }}">
                                </div>
                                <h5>Drop Files Here Or Browse Files</h5>
                                <label id="importFile-error" class="error" for="importFile"></label>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer justify-content-center">
                    <!-- <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> -->
                    <button type="submit" id="submit" class="btn btn-primary">Upload</button>
                </div>
                {!! Form::close() !!}
            </div>
        </div>
    </div>

    <!-- Employeewise Incentive Modal -->
    <div class="modal fade" id="employeewise_incentive" tabindex="-1" aria-labelledby="exampleModalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h2 class="modal-title fs-5" id="exampleModalLabel">Employee Wise Incentive</h2>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-12">
                            <ul class="pr_detiles">
                                <li>Project Name : <b id="project_name">NA</b></li>
                                <li>CRN No : <b id="crn_no">0</b></li>
                                {{-- <li>Actual CV Value : <b id="actual_cv_value">0</b></li> --}}
                                <li>Incentive Amount : <b id="deal_incentive_amount">-</b></li>
                                <li>CSO Pot Used : <b id="cso_pot_used">-</b></li>
                                <li>ANV : <b id="anv_value">-</b></li>
                            </ul>
                            <div class="table_specing">
                                <table id="modalEmployeewiseDataTable" class="table table-striped data-table-dr"
                                    style="width:100%">
                                    <thead>
                                        <tr>
                                            <th>Sr No</th>
                                            <th>Employee Code</th>
                                            <th>Employee Name</th>
                                            <th>Employee Level</th>
                                            <th>Designation</th>
                                            <th>Dealwise Designation</th>
                                            <th>Incentive Amount</th>
                                            <th>Action</th>
                                            <th>Date And Time</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {{-- <tr>
                                            <td>01</td>
                                            <td>13589</td>
                                            <td>Manish Rathod</td>
                                            <td>B2</td>
                                            <td>Sourcing Manager</td>
                                            <td>
                                                <div class="input_edit">
                                                    <input class="form-control" type="text" value="12500" disabled>
                                                </div>
                                            </td>

                                            <td>
                                                <div class="three_bt">
                                                    <!-- <button type="button" class="btn btn-info-round disabled_remove"><img src="../assets/images/edit-white.png"></button> -->
                                                    <button type="button" class="btn btn-yellow-round"><img
                                                            src="{{ asset('assets/images/hold-white.png') }}"></button>
                                                    <button type="button" class="btn btn-red-round"><img
                                                            src="{{ asset('assets/images/close-white.png') }}"></button>
                                                </div>
                                            <td>
                                                <p class="mb-0">
                                                    <span class="d-flex justify-content-center align-items-center"><i
                                                            class="fa fa-calendar-alt me-2"></i>27/03/2021<br></span>
                                                    <span
                                                        class="d-flex justify-content-center align-items-center time_span"><i
                                                            class="fa fa-clock me-2"></i>07:00AM</span>
                                                </p>
                                            </td>
                                        </tr> --}}

                                    <tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer justify-content-center">
                    <!-- <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> -->
                    {{-- <button type="button" class="btn btn-primary">Save</button> --}}
                </div>
            </div>
        </div>
    </div>

    <!-- Dealwise Incentive Modal -->
    <div class="modal fade" id="propertywise_incentive" tabindex="-1" aria-labelledby="exampleModalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h2 class="modal-title fs-5" id="exampleModalLabel">Deal Wise Incentive</h2>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-12">
                            <ul class="pr_detiles">
                                <li>Employee Name : <b id="project_name">NA</b></li>
                                <li>Employee Code : <b id="crn_no">0</b></li>
                                <li>Salary : <b id="actual_cv_value">0</b></li>
                            </ul>
                            <div class="table_specing">
                                <table id="modalDealwiseDataTable" class="table table-striped data-table-dr"
                                    style="width:100%">
                                    <thead>
                                        <tr>
                                            <th>Sr No</th>
                                            <th>Project Name</th>
                                            <th>Application Date</th>
                                            <th>CRN No</th>
                                            <th>Actual Net Value</th>
                                            <th>Incentive Amount</th>
                                            <th>Action</th>
                                            <th>Date And Time</th>
                                        </tr>
                                    </thead>
                                    <tbody>

                                    <tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer justify-content-center">
                    <!-- <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> -->
                    {{-- <button type="button" class="btn btn-primary">Save</button> --}}
                </div>
            </div>
        </div>
    </div>

    <!-- Modal Change -->
    <div class="modal fade" id="change" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <h2 class="modal-title fs-5" id="exampleModalLabel">Change SAP Dump file</h2>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="">
                        <div class="mb-3 file_icon">
                            <span> <img src="{{ asset('assets/images/file.png') }}" class="me-2"> files-2.xls</span>
                            <div class="progress" role="progressbar" aria-label="Animated striped example"
                                aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
                                <div class="progress-bar progress-bar-striped progress-bar-animated" style="width: 75%">
                                </div>
                            </div>
                            <p>Uploaded file</p>
                        </div>
                        <div class="pdf_detiles">
                            <!-- <label class="form_label">Upload Thumbnail</label> -->
                            <div class="view__pdf_de">
                                <input type="file">
                                <div class="add_pdf_icon">
                                    <img src="{{ asset('assets/images/upload.png') }}">
                                </div>
                                <h5>Drop Files Here Or Browse Files</h5>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer justify-content-center">
                    <!-- <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> -->
                    <button type="button" class="btn btn-primary">Change</button>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('customJs')
    <script>
        $('ul.tabs li').click(function() {
            var tab_id = $(this).attr('data-tab');
            $('ul.tabs li').removeClass('current');
            $('.tab-content').removeClass('current');
            $(this).addClass('current');
            $("#" + tab_id).addClass('current');
        });
    </script>

    <script>
        $(document).ready(function() {
            $("#insentive_calculated,#account_update_pending,#admin_review_pending, #account_review_pending, #cso_review_pending, #hr_review_pending, #c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                .removeClass('up_coming blue_rotate complted_check');

            @php
                $currentIncentiveStatus = isset($data['incentiveData']) && !empty($data['incentiveData']['current_status']) ? $data['incentiveData']['current_status'] : 'default';

                $incentive_data_is_inprocess = isset($data['incentiveData']) && !empty($data['incentiveData']['is_inprocess']) ? $data['incentiveData']['is_inprocess'] : 'N';
            @endphp
            switch ("{{ $currentIncentiveStatus }}") {
                case 'admin_import_pending':
                case 'insentive_calculated':
                    $("#account_update_pending,#admin_review_pending, #account_review_pending, #cso_review_pending, #hr_review_pending, #c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('up_coming');
                    $("#insentive_calculated").addClass('blue_rotate');
                    break;
                case 'account_update_pending':
                case 'account_insentive_calculated':
                    $("#insentive_calculated").addClass('complted_check');
                    $("#account_update_pending").addClass('blue_rotate');
                    $("#admin_review_pending, #account_review_pending, #cso_review_pending, #hr_review_pending, #c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('up_coming');
                    break;
                case 'admin_review_pending':
                case 'admin_final_insentive_calculated':
                    $("#insentive_calculated,#account_update_pending").addClass('complted_check');
                    $("#admin_review_pending").addClass('blue_rotate');
                    $("#account_review_pending, #cso_review_pending, #hr_review_pending, #c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('up_coming');
                    break;
                case 'account_review_pending':
                    $("#insentive_calculated,#account_update_pending,#admin_review_pending").addClass(
                        'complted_check');
                    $("#account_review_pending").addClass('blue_rotate');
                    $("#cso_review_pending, #hr_review_pending, #c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('up_coming');
                    break;
                case 'cso_review_pending':
                    $("#insentive_calculated,#account_update_pending,#admin_review_pending,#account_review_pending")
                        .addClass(
                            'complted_check');
                    $("#cso_review_pending").addClass('blue_rotate');
                    $("#hr_review_pending, #c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('up_coming');
                    break;
                case 'hr_review_pending':
                    $("#insentive_calculated,#account_update_pending,#admin_review_pending,#account_review_pending,#cso_review_pending")
                        .addClass(
                            'complted_check');
                    $("#hr_review_pending").addClass('blue_rotate');
                    $("#c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('up_coming');
                    break;
                case 'c_b_review_pending':
                    $("#insentive_calculated,#account_update_pending,#admin_review_pending,#account_review_pending,#cso_review_pending,#hr_review_pending")
                        .addClass(
                            'complted_check');
                    $("#c_b_review_pending").addClass('blue_rotate');
                    $("#hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('up_coming');
                    break;
                case 'hr_final_review_pending':
                    $("#insentive_calculated,#account_update_pending,#admin_review_pending,#account_review_pending,#cso_review_pending,#hr_review_pending,#c_b_review_pending")
                        .addClass(
                            'complted_check');
                    $("#hr_final_review_pending").addClass('blue_rotate');
                    $("#c_b_final_review_pending")
                        .addClass('up_coming');
                    break;
                case 'c_b_final_review_pending':
                    $("#insentive_calculated,#account_update_pending,#admin_review_pending,#account_review_pending,#cso_review_pending,#hr_review_pending,#c_b_review_pending,#hr_final_review_pending")
                        .addClass(
                            'complted_check');
                    $("#c_b_final_review_pending").addClass('blue_rotate');
                    break;
                case 'approved':
                    $("#insentive_calculated,#account_update_pending,#admin_review_pending, #account_review_pending, #cso_review_pending, #hr_review_pending, #c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('complted_check');
                    break;
                default:
                    $("#insentive_calculated,#account_update_pending,#admin_review_pending, #account_review_pending, #cso_review_pending, #hr_review_pending, #c_b_review_pending, #hr_final_review_pending, #c_b_final_review_pending")
                        .addClass('up_coming');
                    break;
            }

            if ("{{ $incentive_data_is_inprocess }}" == 'Y') {
                // Append the overlay to the body
                $('body').append(`
                    <div id="overlay" style="    position: fixed;bottom: 0; right: 0;width: calc(100% - 230px); height: calc(100% - 240px);    background: rgba(0, 0, 0, 0.5);    z-index: 9998;    cursor: pointer;    user-select: none;"></div>
                `);

                // Add the message overlay
                $('body').append(`
                    <div id="messageOverlay" style="position: fixed; bottom: 0; right: 0;  width: calc(100% - 230px);  height: calc(100% - 240px);display: flex;  align-items: center; justify-content: center; z-index: 9999;    cursor: pointer;    user-select: none;">
                        <div style="color:#fff;font-size:20px;padding:10px;background:rgba(0,0,0,0.7);border-radius:5px;text-align:center;">
                            Data is in process, please wait...
                        </div>
                    </div>
                `);

                $('body').addClass('overlay_rs_body');

                // Disable events for all elements except the specific div and its children
                $('#overlay, #messageOverlay').on(
                    'click keydown scroll contextmenu mousedown mouseup touchstart touchend',
                    function(e) {
                        if (!$(e.target).closest('.col-lg-auto.col-auto').length) {
                            e.preventDefault();
                            e.stopImmediatePropagation();
                            return false;
                        }
                    });

                // Abort all ongoing AJAX requests
                // $.ajaxSetup({
                //     beforeSend: function(xhr) {
                //         xhr.abort();
                //     }
                // });
            }
            // When page loads
            var tab_id = $('ul.tabs li.current').attr('data-tab');
            $('.tab-content').removeClass('current');
            $(tab_id).addClass('current');
            $("#" + tab_id).addClass('current');

            var i = 1;
            var table = $('#importDataTable').DataTable({
                scrollX: true,
                destroy: true,
                processing: true,
                serverSide: true,
                responsive: false,
                autoWidth: true,
                ajax: {
                    url: "{{ route('admin.importpaginate') }}",
                    data: function(d) {
                        d._token = "{{ csrf_token() }}",
                            d.month_id = $("#monthIdFilter option:selected").val(),
                            d.year_id = $("#yearIdFilter option:selected").val()
                    },
                },
                "drawCallback": function(settings) {

                },
                columns: [{
                        data: 'DT_RowIndex',
                        name: 'DT_RowIndex',
                        orderable: false,
                        searchable: false
                    },
                    {
                        data: 'file_name',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'insert_count',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'error_count',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'total_count',
                        searchable: true,
                        orderable: false
                    },

                    // {
                    //     data: 'update_count',
                    //     searchable: true,
                    //     orderable: false
                    // },

                    {
                        data: 'file_upload',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'status',
                        searchable: true,
                        orderable: false
                    },
                    {
                        data: 'dateTime',
                        searchable: true,
                        orderable: false
                    }

                ],
                columnDefs: [{
                    "aTargets": [1, 2, 3, 4, 5, 6], // Column to target
                    "mRender": function(data, type, full) {
                        if (data != null) {
                            return data;
                        } else {
                            return '-';
                        }
                    }
                }, ],

            });
            var outputTable = $("#dealwiseDataTable").DataTable({
                scrollX: true,
                destroy: true,
                processing: true,
                serverSide: true,
                // responsive: false,
                // autoWidth: true,
                ajax: {
                    url: "{{ route('admin.incentive.dealwise.analytic') }}",
                    data: function(d) {
                        (d._token = "{{ csrf_token() }}"),
                        (d.month_id = $("#monthIdFilter").val()),
                        (d.year_id = $("#yearIdFilter").val());
                    },
                },
                drawCallback: function(settings) {},
                columns: [{
                        data: "DT_RowIndex",
                        name: "DT_RowIndex",
                        orderable: false,
                        searchable: false,
                    },
                    {
                        data: "project_name",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "app_date",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "crn_no",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "net_value",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "avn_value",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "amount_received",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "registration_date",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "TotalIncentiveAmount",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "employeeCount",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "status",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "action",
                        searchable: true,
                        orderable: false,
                    },
                    {
                        data: "created_at",
                        searchable: true,
                        orderable: false,
                    },
                ],
                columnDefs: [{
                    aTargets: [1, 2, 4, 5, 6, 7], // Column to target
                    mRender: function(data, type, full) {
                        if (data != null) {
                            return data;
                        } else {
                            return "-";
                        }
                    },
                }, ],
            });

            $('#importForm').validate({
                ignore: ".ignore",
                rules: {
                    importId: {
                        required: true
                    },
                    importFile: {
                        required: true
                    }
                },
                messages: {},
                errorPlacement: function(error, element) {
                    var placement = $(element).data('error');
                    if (placement) {
                        $(placement).append(error)
                    } else {
                        error.insertAfter(element);
                    }
                },
                submitHandler: function(form) {
                    // return false;
                    $("#submit").html('<span> Processing...</span>');
                    $("#submit").attr('disabled', true);
                    $('.progress .progress-bar').css('width', '0%').attr(
                        'aria-valuenow', 0);

                    var formData = new FormData($("#importForm")[0]);
                    $.ajax({
                        url: "{{ route('admin.save.importfile') }}",
                        type: 'POST',
                        data: formData,
                        processData: false,
                        contentType: false,
                        dataType: "json",
                        xhr: function() {
                            var xhr = new window.XMLHttpRequest();
                            xhr.upload.addEventListener("progress", function(evt) {
                                if (evt.lengthComputable) {
                                    var percentComplete = evt.loaded / evt.total;
                                    var percentage = Math.round(percentComplete *
                                        100);
                                    $('.progress .progress-bar').css('width',
                                        percentage + '%').attr('aria-valuenow',
                                        percentage);
                                }
                            }, false);
                            return xhr;
                        },
                        success: function(response, textStatus, xhr) {
                            $("#submit").html('Upload');
                            $("#submit").attr('disabled', false);
                            if (response.status == 1) {
                                $.notify(response.message, "success");
                                setTimeout(function() {
                                    $("#ImportModal").modal('hide');
                                }, 1000);
                                // $("#ImportModal").modal('hide');
                                $("#importForm")[0].reset();
                                $("#importForm").validate().resetForm();

                                if (response.data.allAdminImportStatusDone || response.data
                                    .allAccountImportStatusDone || response.data.isReload) {
                                    window.location.reload();
                                }

                                $("#importDataTable")
                                    .DataTable()
                                    .ajax.reload(null, false);
                            } else {
                                $('.progress .progress-bar').css('width', '0%').attr(
                                    'aria-valuenow', 0);
                                $.notify(response.message, "error");
                            }
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            $('.progress .progress-bar').css('width', '0%').attr(
                                'aria-valuenow', 0);
                            $("#submit").html('Upload');
                            $("#submit").attr('disabled', false);
                            $.notify(jqXHR.responseJSON.message, "error");
                        }
                    }); //ajax
                }
            });

            $("#searchData").click(function() {
                var monthId = $("#monthIdFilter option:selected").val();
                var yearId = $("#yearIdFilter option:selected").val();
                var newUrl = "{{ url('admin/manage-incentive') }}/" + (monthId ? monthId : '') + "/" + (
                    yearId ? yearId : '');
                window.location.href = newUrl;
            });

            $("#clearData").click(function() {
                var newUrl = "{{ url('admin/manage-incentive') }}";
                window.location.href = newUrl;
            });
        });
    </script>

    <script>
        function get_import_data(type, importId) {
            $('.progress .progress-bar').css('width', '0%').attr(
                'aria-valuenow', 0);
            $("#importForm")[0].reset();
            $("#importForm").validate().resetForm();
            $("#importId").val(importId);
            $("#ImportModal").modal('show');
        }

        function process_for_view_output(incentive_data_id) {
            $.ajax({
                url: "{{ route('admin.process.view.output') }}",
                type: 'POST',
                data: {
                    'incentive_data_id': incentive_data_id,
                    '_token': "{{ csrf_token() }}"
                },
                dataType: "json",
                success: function(response, textStatus, xhr) {
                    if (response.status == 1) {
                        $.notify(response.message, "success");
                        window.location.reload();
                    } else
                        $.notify(response.message, "error");
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    $.notify(jqXHR.responseJSON.message, "error");
                }
            }); //ajax
        }

        function modal_employeeWise_data(property_id) {
            $.ajax({
                url: "{{ route('get.property.data') }}",
                type: 'GET',
                cache: false,
                data: {
                    '_token': '{{ csrf_token() }}',
                    'property_id': property_id
                    // 'dtTo': dtTo,
                },
                dataType: "json",
                success: function(response) {
                    if (response.status == 1) {
                        $('#project_name').html(response.data.project_data.project_name);
                        $('#crn_no').html(response.data.property_data.crn_no);
                        $('#actual_cv_value').html('-');
                        $('#deal_incentive_amount').html(response.data.property_incentive_amount);
                        $('#cso_pot_used').html(response.data.cso_pot_used);
                        $('#anv_value').html(response.data.avn_value);

                        $("#modalEmployeewiseDataTable").DataTable({
                            scrollX: true,
                            destroy: true,
                            processing: true,
                            serverSide: true,
                            // responsive: false,
                            // autoWidth: true,
                            ajax: {
                                url: "{{ route('admin.property.incentive.employeeData.analytic') }}",
                                data: function(d) {
                                    (d._token = "{{ csrf_token() }}"),
                                    (d.property_id = response.data.property_data.id);
                                },
                            },
                            drawCallback: function(settings) {},
                            columns: [{
                                    data: "DT_RowIndex",
                                    name: "DT_RowIndex",
                                    orderable: false,
                                    searchable: false,
                                },
                                {
                                    data: "emp_code",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "user_name",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "level",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "designation",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "employee_dealwise_designation_team",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "insentive_amount",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "action",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "created_at",
                                    searchable: true,
                                    orderable: false,
                                },
                            ],
                            columnDefs: [{
                                aTargets: [1, 2, 4, 5, 6, 7, 8], // Column to target
                                mRender: function(data, type, full) {
                                    if (data != null) {
                                        return data;
                                    } else {
                                        return "-";
                                    }
                                },
                            }, ],
                        });
                        $("#employeewise_incentive").modal('show');
                    } else {
                        $.notify(response.message, "error");
                    }
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    $.notify(jqXHR.responseJSON.message, "error");
                }
            });
        }


        function modal_dealWise_data(employee_incentive_id, incentive_id) {
            $.ajax({
                url: "{{ route('get.employee.data') }}",
                type: 'GET',
                cache: false,
                data: {
                    '_token': '{{ csrf_token() }}',
                    'employee_incentive_id': employee_incentive_id
                    // 'incentive_id': incentive_id
                },
                dataType: "json",
                success: function(response) {
                    if (response.status == 1) {
                        $('#employee_name').html(response.data.employee_incentive.user.user_name);
                        $('#employee_code').html(response.data.employee_incentive.user.emp_code);
                        $('#employee_incentive').html(response.data.employee_incentive.insentive_amount);
                        $("#modalDealwiseDataTable").DataTable({
                            scrollX: true,
                            destroy: true,
                            processing: true,
                            serverSide: true,
                            // responsive: false,
                            // autoWidth: true,
                            ajax: {
                                url: "{{ route('admin.employee.incentive.propertyData.analytic') }}",
                                data: function(d) {
                                    (d._token = "{{ csrf_token() }}"),
                                    (d.employee_id = response.data.employee_incentive.employee_id),
                                    (d.incentive_id = incentive_id);
                                },
                            },
                            drawCallback: function(settings) {},
                            columns: [{
                                    data: "DT_RowIndex",
                                    name: "DT_RowIndex",
                                    orderable: false,
                                    searchable: false,
                                },
                                {
                                    data: "project_name",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "registration_date",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "crn_no",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "avn_value",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "amount_received",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "action",
                                    searchable: true,
                                    orderable: false,
                                },
                                {
                                    data: "created_at",
                                    searchable: true,
                                    orderable: false,
                                },
                            ],
                            columnDefs: [{
                                aTargets: [1, 2, 4, 5, 6, 7], // Column to target
                                mRender: function(data, type, full) {
                                    if (data != null) {
                                        return data;
                                    } else {
                                        return "-";
                                    }
                                },
                            }, ],
                        });
                        $("#propertywise_incentive").modal('show');
                    } else {
                        $.notify(response.message, "error");
                    }
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    $.notify(jqXHR.responseJSON.message, "error");
                }
            });
        }

        function process_for_next_step(incentive_data_id, incentive_data_status) {
            $.ajax({
                url: "{{ route('admin.process.next.step') }}",
                type: 'POST',
                data: {
                    'incentive_data_id': incentive_data_id,
                    'incentive_data_status': incentive_data_status,
                    '_token': "{{ csrf_token() }}"
                },
                dataType: "json",
                success: function(response, textStatus, xhr) {
                    if (response.status == 1) {
                        $.notify(response.message, "success");
                        window.location.reload();
                    } else
                        $.notify(response.message, "error");
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    $.notify(jqXHR.responseJSON.message, "error");
                }
            }); //ajax
        }

        function downloadImportData(id, importType, status) {
            window.open(
                "{{ route('admin.download.import.data') }}?id=" +
                id +
                "&importType=" +
                importType +
                "&status=" +
                status,
                "_blank"
            );
        }

        function dealStatusManage(property_id, status) {
            $.ajax({
                url: "{{ route('admin.deal.status.manage') }}",
                type: 'POST',
                data: {
                    'property_id': property_id,
                    'status': status,
                    '_token': "{{ csrf_token() }}"
                },
                dataType: "json",
                success: function(response, textStatus, xhr) {
                    if (response.status == 1) {
                        $.notify(response.message, "success");
                        // window.location.reload();
                        $("#dealwiseDataTable").DataTable().ajax.reload(null,
                            false);
                    } else
                        $.notify(response.message, "error");
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    $.notify(jqXHR.responseJSON.message, "error");
                }
            }); //ajax
        }

        function employeeStatusManage(user_id, incentive_id, status) {
            $.ajax({
                url: "{{ route('admin.employee.status.manage') }}",
                type: 'POST',
                data: {
                    'user_id': user_id,
                    'incentive_id': incentive_id,
                    'status': status,
                    '_token': "{{ csrf_token() }}"
                },
                dataType: "json",
                success: function(response, textStatus, xhr) {
                    if (response.status == 1) {
                        $.notify(response.message, "success");
                        // window.location.reload();
                        $("#employeewiseDataTable").DataTable().ajax.reload(null,
                            false);
                    } else
                        $.notify(response.message, "error");
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    $.notify(jqXHR.responseJSON.message, "error");
                }
            }); //ajax
        }
    </script>
@endsection