@extends('layouts.adminLayout.dashboardLayout')
@section('styles')
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11.7.4/dist/sweetalert2.min.css">
    <style>
        .error {
            color: red;
        }

        .labelName::after {
            content: " *";
            color: red;
            /* You can change the color if needed */
        }
    </style>
@endsection
@section('content')
        <main role="main" class="flex-shrink-0">
        <div class="container custom-container">
            <div class="login-5 mt-50 mb-50">
                <div class="container-fluid">
                    <div class="row no-gutters">
                        <div class="col-sm-12">
                            <div class="container-fluid">
                                @if (isset($countData) && !empty($countData))
                                    {{ Breadcrumbs::render('EditCountPayment', $countData) }}
                                @else
                                    {{ Breadcrumbs::render('AddCountPayment') }}
                                @endif

                                <div class="card">
                                    <div class="card-header d-flex align-items-center justify-content-between py-3 px-3">
                                        <h4 class="mb-0 fw-bold fs-4"></h4>
                                        <a href="{{ route('list-count') }}" class="btn btn-danger text-white fs-5"> <i
                                                class="fa fa-angle-double-left" aria-hidden="true"> Back</i></a>
                                    </div>

                                    <div class="card-body">
                                        <div class="custom-form">
                                            {!! Form::open([
                                                'route' => ['update-count'],
                                                'method' => 'POST',
                                                'enctype' => 'multipart/form-data',
                                                'id' => 'countForm',
                                                'autocomplete' => 'off',
                                            ]) !!}

                                            <div class="row">
                                                {!! Form::hidden('ID', old('ID', $countData->ID ?? ''), []) !!}

                                                <div class="col-md-6">
                                                    <div class="form-group mb-3">
                                                        {!! Form::label('Exam Name', 'Exam Name', ['class' => 'text-left form-label fw-bold labelName']) !!}
                                                        {!! Form::select('Exam Type', $examsList, old('Exam Type', $countData->{'Exam Type'} ?? ''), [
                                                            'class' => 'form-control form-select form-select-lg',
                                                            'placeholder' => 'Select Exam Type',
                                                            'disabled' => !empty($countData->{'Exam Type'}) ? true : false,
                                                        ]) !!}
                                                        @error('Exam_Type')
                                                            <div class="text-danger mb-4">{{ $message }}</div>
                                                        @enderror
                                                    </div>

                                                </div>
                                                <div class="col-md-6">
                                                    <div class="form-group mb-3">
                                                        {!! Form::label('CenterNo', 'Center No', ['class' => 'text-left form-label fw-bold labelName']) !!}

                                                        {!! Form::text('CenterNo', old('CenterNo', $countData->CenterNo ?? ''), [
                                                            'class' => 'form-control form-control-lg',
                                                            'placeholder' => 'Enter Center No',
                                                            // 'required' => 'required',
                                                            'readonly' => !empty($countData->CenterNo) ? true : false,
                                                        ]) !!}
                                                        @error('CenterNo')
                                                            <div class="text-danger mb-4">{{ $message }}</div>
                                                        @enderror
                                                    </div>

                                                </div>

                                                @if (isset($countData) && !empty($countData))
                                                    <div id="daySections">
                                                        @php $j = 0 ; @endphp
                                                        @for ($i = 1; $i <= 12; $i++)
                                                            @if ($countData->{'D' . $i . 'Max'} >= 0 && $countData->{'D' . $i . 'Max'} != null )
                                                                @php $j++; @endphp
                                                                <div class="row day-section">
                                                                    <div class="col-md-6">
                                                                        <div class="form-group mb-3">
                                                                            {!! Form::label('D' . $i . 'Max', 'Day ' . $i . ' Max Count', [
                                                                                'class' => 'text-left form-label fw-bold labelName',
                                                                            ]) !!}
                                                                            {!! Form::text(
                                                                                'D' . $i . 'Max',
                                                                                old(
                                                                                    'D' . $i . 'Max',
                                                                                    isset($countData->{'D' . $i . 'Max'})
                                                                                        ? number_format($countData->{'D' . $i . 'Max'}, 0, '', '')
                                                                                        : '',
                                                                                ),
                                                                                [
                                                                                    'class' => 'form-control form-control-lg dmax',
                                                                                    'placeholder' => 'Enter Day 1 Max Count',
                                                                                    'onkeypress' => 'return blockSpecialChar(event, "numeric")',
                                                                                ],
                                                                            ) !!}
                                                                            @error('D' . $i . 'Max')
                                                                                <div class="text-danger mb-4">
                                                                                    {{ $message }}</div>
                                                                            @enderror
                                                                        </div>
                                                                    </div>
                                                                    @if ($i == 1)
                                                                        <div class="col-md-1 mt-40">
                                                                            <span class="text-success fs-3 cursor-pointer addMoreDays"><i class="fa fa-plus" aria-hidden="true"></i></span>
                                                                        </div>
                                                                    @else
                                                                        <div class="col-md-1 mt-40">
                                                                            <span class="text-danger fs-3 cursor-pointer removeSection"><i class="fa fa-trash" aria-hidden="true"></i></span>
                                                                        </div>
                                                                    @endif
                                                                </div>
                                                            @endif
                                                        @endfor
                                                    </div>
                                                @else
                                                    <div id="daySections">
                                                        <div class="row day-section">
                                                            <div class="col-md-6">
                                                                <div class="form-group mb-3">
                                                                    {!! Form::label('D1Max', 'Day 1 Max Count', ['class' => 'text-left form-label fw-bold labelName']) !!}
                                                                    {!! Form::text(
                                                                        'D1Max',
                                                                        old(
                                                                            'D1Max',
                                                                            isset($countData->D1Max) && !empty($countData->D1Max) ? number_format($countData->D1Max, 0, '', '') : '',
                                                                        ),
                                                                        [
                                                                            'class' => 'form-control form-control-lg dmax',
                                                                            'placeholder' => 'Enter Day 1 Max Count',
                                                                            'onkeypress' => 'return blockSpecialChar(event, "numeric")',
                                                                        ],
                                                                    ) !!}
                                                                    @error('D1Max')
                                                                        <div class="text-danger mb-4">{{ $message }}</div>
                                                                    @enderror
                                                                </div>
                                                            </div>
                                                            <div class="col-md-1 mt-40">
                                                                <span class="btn btn-success addMoreDays"><i class="fa fa-plus" aria-hidden="true"></i></span>
                                                            </div>
                                                        </div>
                                                    </div>
                                                @endif

                                                <!-- Final Summary Fields (Not Duplicated) -->
                                                <div class="col-md-6">
                                                    <div class="form-group mb-3">
                                                        <label for="maxCount"
                                                            class="text-left form-label fw-bold labelName">Max
                                                            Count</label>
                                                        <input type="text" id="maxCount" name="Max Count Exam"
                                                            value="{{ old('Max Count Exam', $countData->{'Max Count Exam'} ?? '') }}"
                                                            class="form-control form-control-lg" readonly>
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <div class="form-group mb-3">
                                                        <label for="totalMaxCount"
                                                            class="text-left form-label fw-bold labelName">Total Max
                                                            Count</label>
                                                        <input type="text" id="totalMaxCount"
                                                            name="Total Candidate Count in Exam"
                                                            value="{{ old('Total Candidate Count in Exam', $countData->{'Total Candidate Count in Exam'} ?? '') }}"
                                                            class="form-control form-control-lg" readonly>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="form-group text-end">
                                                {!! Form::submit('Submit', ['class' => 'btn btn-success text-white mt-2']) !!}
                                            </div>
                                        </div>
                                        {!! Form::close() !!}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
@endsection
@section('script')
    <script type="text/javascript">
        $(document).ready(function() {
            // Validate the form
            $('#advanceForm').validate({
                rules: {

                    'Observer_Name': {
                        required: true,
                        minlength: 3, // Example: Minimum length of 3 characters
                        maxlength: 50,
                    },
                    'Exam_Type': {
                        required: true,
                    },
                    'NTA_Observer_ID': {
                        required: true,
                        minlength: 6, // Example: Minimum length of 3 characters
                        maxlength: 15, // Example: Minimum length of 3 characters
                    },
                    'Advance_Amount': {
                        required: true,
                        number: true, // Ensures that the field only accepts numbers
                        min: 1, // Example: Minimum value should be 1
                    }
                },
                messages: {
                    'Observer_Name': {
                        required: 'Please enter the Observer Name',
                        minlength: 'Observer Name must be at least 3 characters long',
                        maxlength: 'Observer Name must be last 50 characters long',
                    },
                    'Advance_Amount': {
                        required: 'Please enter the Advance Amount',
                        number: 'Please enter a valid number for Advance Amount',
                        min: 'Advance Amount must be at least 1',
                    },
                    'Exam_Type': {
                        required: 'Please enter the Exam Type',
                    },
                    'NTA_Observer_ID': {
                        required: 'Please enter the NTA Observer ID',
                        minlength: 'NTA Observer ID must be at least 5 characters long',
                        maxlength: 'NTA Observer ID must be last 9 characters long',
                    }
                },

            });
        });
    </script>
    <script>
        $(document).ready(function() {
            let maxFields = 12; // Maximum sections
            let wrapper = $("#daySections"); // Container for dynamic fields
            let addBtn = $(".addMoreDays"); // Add button
            let count = '1'; // Counter for fields

            function updateSummary() {
                let values = $(".dmax").map(function() {
                    return $(this).val() ? parseInt($(this).val()) : 0;
                }).get();

                let maxCount = Math.max(...values);
                let totalCount = values.reduce((a, b) => a + b, 0);

                $("#maxCount").val(maxCount);
                $("#totalMaxCount").val(totalCount);
            }

            $(document).on("input", ".dmax", function() {
                updateSummary();
            });

            $(document).on("click", ".addMoreDays", function() {
                if (count < maxFields) {
                    count++;
                    let newSection = `
                    <div class="row day-section">
                        <div class="col-md-6">
                            <div class="form-group mb-3">
                                <label for="D${count}Max" class="text-left form-label fw-bold labelName">Day ${count} Max Count</label>
                                <input type="text" name="D${count}Max" id="D${count}Max" class="form-control form-control-lg dmax" placeholder="Enter Day ${count} Max Count" onkeypress="return blockSpecialChar(event, 'numeric')">
                            </div>
                        </div>
                        <div class="col-md-1 mt-40">
                           <span class="text-danger fs-3 cursor-pointer removeSection"><i class="fa fa-trash" aria-hidden="true"></i></span>
                        </div>
                    </div>`;
                    wrapper.append(newSection);

                    if (count === maxFields) {
                        $(".addMoreDays").hide(); // Hide add button when max reached
                    }
                }
            });

            $(document).on("click", ".removeSection", function() {
                $(this).closest(".day-section").remove();
                count--;

                if (count < maxFields) {
                    $(".addMoreDays").show(); // Show add button if below max
                }

                updateSummary();
            });
        });
    </script>
@endsection