@extends('fronted.layout.main')
@section('adcontent')
    @php
        use Illuminate\Support\Facades\DB;
        use Carbon\Carbon;
        $currentMonth = Carbon::now()->format('m');
        $currentYear = Carbon::now()->format('Y');
        $currentMonthDate = Carbon::now();

    @endphp
    <style>
        #ElecticityUpdateModal .form-control,
        #ElecticityInsertModal .form-control,
        #ElecticityUpdateModal .form-label,
        #ElecticityInsertModal .form-label {
            font-size: 0.8rem;
        }

        #ElecticityUpdateModal .form-control:focus,
        #ElecticityInsertModal .form-control:focus {
            box-shadow: none;
        }

        .year-item {
            position: relative;
        }

        .month-list {
            display: none;
            position: absolute;
            left: -100%;
            top: 10%;
            min-width: 100%;
        }

        .year-item:hover .month-list {
            display: block;
        }

        .custom-spinner-size {
            width: 1rem;
            height: 1rem;
        }
    </style>
    <div class="container-fluid">
        <div class="m-0">
            <div class="d-flex justify-content-between align-items-center">
                <div class="left-btn">
                    <button type="button" class="btn btn-warning mb-1" data-bs-toggle="modal"
                        data-bs-target="#ElecticityModal">
                        Add Electricity
                    </button>
                    <button type="button" class="btn btn-danger mb-1" id="ElectricityBillReportDownload">
                        <span id="downloadReportSpiner" class="d-none">
                            <span class="spinner-border custom-spinner-size me-1" role="status" aria-hidden="true"></span>
                            downloading...
                        </span>
                        <span id="spinerText">
                            <i class="fa-solid fa-download me-1"></i>Report
                        </span>
                    </button>
                    <button id="deleteElectricityRecords" class="btn btn-danger mb-1"
                        data-deletemonth="{{ $selectedMonth }}">Delete</button>
                    <button id="meterChangeModalBtn" class="btn btn-outline-warning mb-1" type="button">Change
                        Meter</button>
                    @if (!$isBillGenratedOrNotForThisData && $isAutoBillGenratePermissionActive)
                        <button id="autoElectricityBillGenrateButton" data-date="{{ $selectedMonth }}"
                            class="btn btn-outline-warning mb-1" type="button">Auto Electricity Bill Genrate</button>
                    @endif
                </div>
                @if ($allBillDates->count() > 0)
                    <div class="attendaceFilterBox">
                        <div class="d-flex justify-content-end align-items-center">
                            <form id="StudentelecticityForm" action="{{ route('electicity.view') }}" method="GET">
                                <div class="d-flex justify-content-between g-5 gap-3 align-items-center">
                                    <label class="form-label text-nowrap" for="selected_month">Select Month:</label>
                                    <div class="dropdown">
                                        <button class="btn btn-secondary dropdown-toggle mb-1" type="button"
                                            id="yearDropdown" data-bs-toggle="dropdown" aria-expanded="false">
                                            {{ \Carbon\Carbon::parse($selectedMonth)->format('d-M-Y') }}
                                        </button>
                                        <ul class="dropdown-menu" aria-labelledby="yearDropdown">
                                            @foreach ($nestedListData as $year => $months)
                                                <li class="year-item" data-year="{{ $year }}">
                                                    <a class="dropdown-item" href="#"><i
                                                            class="fa-solid fa-caret-left me-3"></i>{{ $year }}</a>
                                                    <ul class="dropdown-menu month-list"
                                                        aria-labelledby="year{{ $year }}">
                                                        @foreach ($months as $month)
                                                            <li>
                                                                <button class="dropdown-item" type="submit"
                                                                    name="selected_month"
                                                                    value="{{ \Carbon\Carbon::parse($month)->format('Y-m-d') }}">
                                                                    {{ $month }}
                                                                </button>
                                                            </li>
                                                        @endforeach
                                                    </ul>
                                                </li>
                                            @endforeach
                                        </ul>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                @endif
            </div>
        </div>

        <div class="m-0">
            <div class="table-responsive dataTable">
                <table class="table align-middle text-center roomSeatTable text-capitalize">
                    <thead>
                        <tr>
                            <th>S No</th>
                            <th>Room No</th>
                            <th>
                                <span class="text-white">
                                    {{ $PrenseBillDate }}
                                </span>
                                <br>
                                Present Reading
                            </th>
                            <th>
                                <span class="text-white">
                                    {{ $PreviousBillDate }}
                                </span>
                                <br>
                                Previous Reading
                            </th>
                            <th>Total Unit</th>
                            <th>Waved Off Units</th>
                            <th>Candidate Name</th>
                            <th>Candidate/Unit</th>
                            <th>Amount</th>
                            <th>Status</th>
                            <th>Total Amount</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        @php
                            $count = 1;
                            $totalUnits = 0;
                            $totalCandidatesAmount = 0;
                            $discountedUnits = 0;
                            $totalCurrentAmount = 0;
                        @endphp

                        @forelse($electricityRecords as $record)
                            @php
                                $totalUnits += $record->units;
                                $discountedUnits += $record->discountUnits;
                            @endphp
                            <tr>
                                <td
                                    rowspan="{{ $record->studentElectricityRecords ? (count($record->studentElectricityRecords) == 0 ? '' : count($record->studentElectricityRecords)) : '' }}">
                                    {{ $count++ }}</td>
                                <td
                                    rowspan="{{ $record->studentElectricityRecords ? (count($record->studentElectricityRecords) == 0 ? '' : count($record->studentElectricityRecords)) : '' }}">
                                    {{ $record->roomno }}</td>
                                <td
                                    rowspan="{{ $record->studentElectricityRecords ? (count($record->studentElectricityRecords) == 0 ? '' : count($record->studentElectricityRecords)) : '' }}">
                                    {{ $record->present_reading }}
                                    @if (!empty($record->meterChangeRecords))
                                        <button type="button" class="btn" data-bs-container="body"
                                            data-bs-toggle="popover" data-bs-placement="top" data-bs-html="true"
                                            data-bs-content="Old Reading: {{ $record->meterChangeRecords->total_old_reading }}<br> 
                        Present Reading: {{ $record->present_reading - $record->meterChangeRecords->total_old_reading }}<br> 
                        Total Reading: {{ $record->present_reading }}">
                                            <i class="fa-solid fa-arrow-rotate-right" style="color: #FFD43B;"></i>
                                        </button>
                                    @endif
                                </td>
                                <td
                                    rowspan="{{ $record->studentElectricityRecords ? (count($record->studentElectricityRecords) == 0 ? '' : count($record->studentElectricityRecords)) : '' }}">
                                    {{ $record->previous_reading }}</td>
                                <td
                                    rowspan="{{ $record->studentElectricityRecords ? (count($record->studentElectricityRecords) == 0 ? '' : count($record->studentElectricityRecords)) : '' }}">
                                    {{ $record->units }}</td>
                                <td
                                    rowspan="{{ $record->studentElectricityRecords ? (count($record->studentElectricityRecords) == 0 ? '' : count($record->studentElectricityRecords)) : '' }}">
                                    {{ $record->discountUnits }}</td>

                                @forelse($record->studentElectricityRecords as $index => $studentRecord)
                                    @php
                                        $totalCandidatesAmount += floatval(
                                            App\Models\StudentElecticityRecords::calculateTotalAmountForStudent(
                                                $studentRecord->userId,
                                            ),
                                        );
                                        $totalCurrentAmount += $studentRecord->Amount;
                                    @endphp

                                    @if ($index == 0)
                                        <td>{{ strtolower($studentRecord->student->candidatename) }}</td>
                                        <td>{{ $studentRecord->prUnitCharge }}</td>
                                        <td><i class="fa-solid fa-indian-rupee-sign me-1"></i>{{ $studentRecord->Amount }}
                                        </td>
                                        <td
                                            style="color:{{ $studentRecord->status < 2 ? '#ffc107' : 'green' }};font-weight:600;">
                                            {{ $studentRecord->status < 2 ? 'UnPaid' : 'Paid' }}</td>
                                        <td><i
                                                class="fa-solid fa-indian-rupee-sign me-1"></i>{{ $totalAmount = App\Models\StudentElecticityRecords::calculateTotalAmountForStudent($studentRecord->userId) - $studentRecord->total_pad_bill_amount }}
                                        </td>
                                        <td
                                            rowspan="{{ $record->studentElectricityRecords ? (count($record->studentElectricityRecords) == 0 ? '' : count($record->studentElectricityRecords)) : '' }}">
                                            <button class="btn" onclick="ElecticityBillEdite('{{ $record->id }}')"
                                                data-bs-toggle="tooltip" data-placement="top" title="Edit Record">
                                                <i class="fa-solid fa-pen-to-square"></i>
                                            </button>
                                        </td>
                                    @else
                            <tr>
                                <td>{{ strtolower($studentRecord->student->candidatename) }}</td>
                                <td>{{ $studentRecord->prUnitCharge }}</td>
                                <td><i class="fa-solid fa-indian-rupee-sign me-1"></i>{{ $studentRecord->Amount }}</td>
                                <td style="color:{{ $studentRecord->status < 2 ? '#ffc107' : 'green' }};font-weight:600;">
                                    {{ $studentRecord->status < 2 ? 'UnPaid' : 'Paid' }}</td>
                                <td><i
                                        class="fa-solid fa-indian-rupee-sign me-1"></i>{{ $totalAmount = App\Models\StudentElecticityRecords::calculateTotalAmountForStudent($studentRecord->userId) - $studentRecord->total_pad_bill_amount }}
                                </td>
                            </tr>
                        @endif
                    @empty
                        <td colspan="5"></td>
                        <td>
                            <button class="btn" onclick="ElecticityBillEdite('{{ $record->id }}')"
                                data-bs-toggle="tooltip" data-placement="top" title="Edit Record">
                                <i class="fa-solid fa-pen-to-square"></i>
                            </button>
                        </td>
                        @endforelse
                    @empty
                        <td colspan="12">No Record Found</td>
                        </tr>
                        @endforelse
                        <tr>
                            <th>Total</th>
                            <th></th>
                            <th></th>
                            <th></th>
                            <th> {{ $totalUnits }}</th>
                            <th>{{ $discountedUnits }}</th>
                            <th></th>
                            <th></th>
                            <th><i class="fa-solid fa-indian-rupee-sign me-1"></i>{{ $totalCurrentAmount }}</th>
                            <th></th>
                            <th><i class="fa-solid fa-indian-rupee-sign me-1"></i>{{ $totalCandidatesAmount }}</th>
                            <th></th>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

    </div>

    <!-- Modal -->
    <div class="modal fade" id="ElecticityModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
        aria-labelledby="ElecticityModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable ml-5">
            <div class="modal-content" style="left:10%">
                <div class="modal-header">
                    <h5 class="modal-title" id="ElecticityModalLabel">Electricity </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <form id="electricitySubmitForm" action="{{ route('electicity.store') }}" method="post">
                        @csrf
                        <div class="container-fluid">
                            <div class="container">
                                @if ($allBillDates->count() == 0)
                                    <p class="text-danger" style="font-size: 0.8rem;">Note: Please Insert base reading as
                                        present reading</p>
                                @endif
                                <div class="table-responsive dataTable">
                                    <div class="d-flex justify-content-between align-items-center mb-1 gap-1">
                                        <div class="form-group">
                                            <label class="form-label" for="billDate">Bill Date</label>
                                            <input class="form-control" type="date" name="billdate" id="billDate"
                                                required>
                                        </div>
                                        <div class="form-group">
                                            <label class="form-label" for="readingRate">Reading/Rate</label>
                                            <input class="form-control" type="number" name="readingRate"
                                                id="ReadingRate" required>
                                        </div>
                                        <div class="form-group">
                                            <label class="form-label" for="discount Units">Wave Off Units</label>
                                            <input type="number" class="form-control" value="0"
                                                name="discountUnits" id="discountUnits" required>
                                        </div>
                                    </div>
                                    <table class="table roomSeatTable align-middle text-nowrap">
                                        <thead>
                                            <tr>
                                                <th>S No</th>
                                                <th>Room No</th>
                                                @if ($allBillDates->count() == 0)
                                                    <th>Base Reading</th>
                                                @endif
                                                <th>present Reading</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @php $sno = 1 @endphp
                                            @foreach ($roomSeats as $rooms)
                                                <tr>
                                                    <td>{{ $sno++ }}</td>
                                                    <td>{{ $rooms->roomno }}</td>
                                                    @if ($allBillDates->count() == 0)
                                                        <td>
                                                            <input type="number" class="form-control"
                                                                name="roomSeatsData[{{ $rooms->roomno }}][previous_red]"
                                                                placeholder="Base Reading" required>
                                                        </td>
                                                    @endif
                                                    <td>
                                                        <input type="number" class="form-control"
                                                            name="roomSeatsData[{{ $rooms->roomno }}][present_red]"
                                                            placeholder="Present Reading" required>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-warning" type="submit" id="ElectricityFormBtn">Submit</button>
                </div>
                </form>
            </div>
        </div>
    </div>
    <div class="modal fade" id="ElecticityUpdateModal" data-bs-backdrop="static" data-bs-keyboard="false"
        tabindex="-1" aria-labelledby="ElecticityUpdateModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable ml-5">
            <div class="modal-content" style="left:10%">
                <div class="modal-header">
                    <h5 class="modal-title" id="ElecticityUpdateModalLabel">Electricity Bill Update</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form action="#" method="post" id="ElecticityUpdateForm">
                    @csrf
                    @method('PUT')
                    <div class="modal-body">
                        <div class="container-fluid">
                            <div class="container">
                                <input type="text" hidden name="billId" value="" id="billId">
                                <div class="form-group">
                                    <label class="form-label" for="billDateUpdate">Bill Date</label>
                                    <input class="form-control" type="date" name="billdate" id="billDateUpdate"
                                        readonly required>
                                </div>
                                <div class="form-group">
                                    <label class="form-label" for="readingRateUpdate">Reading Value</label>
                                    <input class="form-control" type="number" name="readingRate" id="ReadingRateUpdate"
                                        required>
                                </div>
                                <div class="form-group">
                                    <label class="form-label" for="discount Units">Wave Off Units</label>
                                    <input type="number" class="form-control" value="0" name="discountUnits"
                                        id="EditdiscountUnits" required>
                                </div>
                                <div class="form-group">
                                    <label for="previousRedUpdate" class="form-label">Previous Reading</label>
                                    <input class="form-control" type="number" name="previousRed" id="previousRedUpdate"
                                        readonly required>
                                </div>
                                <div class="form-group">
                                    <label for="PresentRedUpdate" class="form-label">Present Reading</label>
                                    <input class="form-control" type="number" name="PresentRed" id="PresentRedUpdate"
                                        required>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-warning btn-sm" id="updateElecticityRecord" type="submit">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="modal fade" id="ElecticityInsertModal" data-bs-backdrop="static" data-bs-keyboard="false"
        tabindex="-1" aria-labelledby="ElecticityInsertModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable ml-5">
            <div class="modal-content" style="left:10%">
                <div class="modal-header">
                    <h5 class="modal-title" id="ElecticityInsertModalLabel">Electricity Bill Insert</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form action="{{ route('electicity.store.one') }}" method="post" id="">
                    @csrf
                    <div class="modal-body">
                        <div class="container-fluid">
                            <div class="container">
                                <input type="text" hidden name="roomno" id="ElecticityBillRoomNo">
                                <div class="form-group">
                                    <label class="form-label" for="billDateInsert">Bill Date</label>
                                    <input class="form-control" type="date" name="billdate" id="billDateInsert"
                                        required>
                                </div>
                                <div class="form-group">
                                    <label class="form-label" for="readingRateInsert">Reading Value</label>
                                    <input class="form-control" type="number" name="readingRate" id="ReadingRateInsert"
                                        required>
                                </div>
                                <div class="form-group">
                                    <label for="previousRedInsert" class="form-label">Previous Reading</label>
                                    <input class="form-control" type="number" name="previousRed" id="previousRedInsert"
                                        required>
                                </div>
                                <div class="form-group">
                                    <label for="PresentRedInsert" class="form-label">Present Reading</label>
                                    <input class="form-control" type="number" name="PresentRed" id="PresentRedInsert"
                                        required>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-warning btn-sm" id="InsertElecticityRecord" type="submit">Insert</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- change meter modal -->

    <div class="modal fade" id="changeMeterModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
        aria-labelledby="changeMeterModalLabel">
        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable ml-5">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="ElecticityInsertModalLabel">Change Meter</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form action="{{ route('electricity.change.meter') }}" method="post" id="meterChangeForm">
                    @csrf
                    <div class="modal-body">
                        <div class="container-fluid">
                            <div class="container">
                                <div class="input-group mb-2">
                                    <label class="input-group-text" for="meterChangeBillDate">Date</label>
                                    <input class="form-control" type="date" name="date" id="meterChangeBillDate"
                                        required>
                                </div>
                                <div class="input-group mb-2">
                                    <label for="changeMeterRoomNo" class="input-group-text">Select Room</label>
                                    <select class="form-select" name="roomno" id="changeMeterRoomNo" required>
                                        <option value="" selected>Select</option>
                                        @foreach ($roomNumbers as $room)
                                            <option value="{{ $room }}">{{ $room }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="input-group mb-2">
                                    <label class="input-group-text" for="preMeterReading">Old Meter Reading</label>
                                    <input class="form-control" type="number" value="0" min="0"
                                        name="old_meter_reading" id="preMeterReading" required>
                                </div>
                                <div class="input-group mb-2">
                                    <label for="newMeterReading" class="input-group-text">New Meter Reading</label>
                                    <input class="form-control" type="number" value="0" min="0"
                                        name="new_meter_reading" id="newMeterReading" required>
                                </div>
                                <div class="input-group mb-2">
                                    <label for="totalMeterReading" class="input-group-text">Total Old Reading</label>
                                    <input class="form-control" type="number" value="0" min="0"
                                        name="total_old_reading" id="totalMeterReading" required>
                                </div>
                                <div class="input-group mb-2">
                                    <label for="meterChangeHistery" class="input-group-text">Meter Change History</label>
                                    <select name="changeHistory" id="meterChangeHistery"
                                        class="form-select meterChangeHisInput">
                                        <option value="">meter change data </option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-warning btn-sm" id="meterChangeBtn" type="Sumbit">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script>
        function autoBillgenrate(billDate) {
            setTimeout(function() {
                Swal.fire({
                    icon: "question",
                    title: "Auto Bill Generation",
                    html: "<p>Electricity Records create successfully</p><br><p>Do you want to automatically create bills?</p>",
                    showCancelButton: true,
                    confirmButtonText: "Yes",
                    cancelButtonText: "No"
                }).then((result) => {
                    if (result.isConfirmed) {
                        // User clicked Yes, initiate Ajax request
                        $.ajax({
                            url: "{{ route('auto.bill.genrate.for.electricity') }}",
                            type: 'POST',
                            data: {
                                '_token': '{{ csrf_token() }}',
                                billDate: billDate
                            },
                            success: function(response) {
                                // Handle success response if needed
                                Swal.fire({
                                    icon: "success",
                                    text: "Automatic bill creation initiated successfully",
                                    timer: 3000,
                                    showConfirmButton: false,
                                    timerProgressBar: true
                                });
                                setTimeout(function() {
                                    location.reload();
                                }, 3000);
                            },
                            error: function(xhr, status, error) {
                                console.log(xhr.responseJSON.message);
                                Swal.fire({
                                    icon: "error",
                                    text: xhr.responseJSON.message ??
                                        "Failed to initiate automatic bill creation",
                                    timer: 3000,
                                    showConfirmButton: false,
                                    timerProgressBar: true
                                });
                                setTimeout(function() {
                                    // location.reload();
                                }, 3000);
                            }
                        });
                    } else {
                        // User clicked No or outside dialog
                        Swal.fire({
                            icon: "info",
                            text: "You chose not to create bills automatically",
                            timer: 3000,
                            showConfirmButton: false,
                            timerProgressBar: true
                        });
                        setTimeout(function() {
                            location.reload();
                        }, 3000);
                    }
                });
            }, 3000);
        }
        $(document).ready(function() {
            $("#autoElectricityBillGenrateButton").on('click', function() {
                const date = $(this).data('date');
                autoBillgenrate(date);
            });

            // Hide all year options initially
            $(".year-option").hide();

            // Handle click events on the select element
            $("#selected_month").on("click", function() {
                // Show/hide the options for the selected year
                var selectedYear = $(this).find(":selected").parent().data("year");
                $(".year-option").hide();
                $(".year-option[data-year='" + selectedYear + "']").show();
            });
            $("#electricitySubmitForm").on('submit', function() {
                activeModel();
                $("#ElectricityFormBtn").attr('disabled', true);

            })
        });
        $(document).ready(function() {

            $("#meterChangeBtn").on('click', function() {
                let form = $("#meterChangeForm");
                form.find('input,select').each(function() {
                    if ($(this).val() === "" && !$(this).hasClass('meterChangeHisInput')) {
                        $(this).addClass('is-invalid');
                    } else {
                        $(this).removeClass('is-invalid');
                    }
                });
            });

            $("#meterChangeForm").submit(function(event) {
                $(this).find('input,select').each(function() {
                    if ($(this).val() === "") {
                        event.preventDefault();
                    }
                });
            });

            $("#preMeterReading").on('change', function() {
                let changeValue = $(this).val();
                let totalMeterReading = $("#totalMeterReading");
                let preMeterReading = parseFloat($("#newMeterReading").val());
                let totalMeterReadingValue = parseFloat(totalMeterReading.val());
                totalMeterReadingValue = parseFloat(changeValue) + preMeterReading;
                totalMeterReading.val(totalMeterReadingValue);
            });

            $("#newMeterReading").on('change', function() {
                let changeValue = $(this).val();
                let totalMeterReading = $("#totalMeterReading");
                let preMeterReading = parseFloat($("#preMeterReading").val());
                let totalMeterReadingValue = parseFloat(totalMeterReading.val());
                totalMeterReadingValue = parseFloat(changeValue) + preMeterReading;
                totalMeterReading.val(totalMeterReadingValue);
            });

            $("#changeMeterRoomNo").on('change', function() {
                const roomno = $(this).val();
                let preMeterReading = $("#preMeterReading");
                let newMeterReading = $("#newMeterReading");
                let totalMeterReading = $("#totalMeterReading");
                let meterChangeHistery = $("#meterChangeHistery");

                $.ajax({
                    type: "get",
                    url: "{{ route('meter.records.for.room') }}",
                    data: {
                        'roomNo': roomno
                    },
                    success: function(response) {
                        const data = response.data;
                        const meterHistory = data.meterHistory;
                        const meterOldReading = data.oldMeterTotal;
                        totalMeterReading.val(meterOldReading);
                        meterChangeHistery.empty();
                        $.each(meterHistory, function(indexInArray, valueOfElement) {
                            let options = $(`<option value="${valueOfElement}">`).text(
                                valueOfElement)
                            meterChangeHistery.append(options);
                        });
                    }
                });
            });

            $("#selected_month").on("change", function() {
                var selectedValue = $(this).val();
                if (selectedValue === 'custom') {
                    $("#noticeFilterBox").removeClass('d-none');
                } else {
                    $("#noticeFilterBox").addClass('d-none');
                }
            });
            $("#deleteElectricityRecords").on("click", function() {
                var deleteSelectedMonth = $(this).data('deletemonth');
                Swal.fire({
                    title: 'Are you sure?',
                    text: `Do you want delete electricity records for the month ${deleteSelectedMonth}`,
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Yes, delete it!'
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: '{{ route('electicity.delete') }}',
                            type: 'DELETE',
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                            },
                            data: {
                                month: deleteSelectedMonth,
                            },
                            success: function(data) {
                                Swal.fire({
                                    icon: 'success',
                                    text: 'Deleted!',
                                    timer: 2000,
                                    timerProgressBar: true,
                                });
                                setTimeout(function() {
                                    location.reload();
                                }, 1000);
                            },
                            error: function(error) {
                                Swal.fire({
                                    icon: 'error',
                                    text: 'Your file has not been deleted.',
                                    timer: 2000,
                                    timerProgressBar: true
                                });

                            }
                        });

                    }
                })
            });
            $("#ElectricityBillReportDownload").on("click", function() {
                let spiner = $("#downloadReportSpiner");
                let spinerText = $("#spinerText");
                spinerText.addClass('d-none');
                spiner.removeClass('d-none');
                $.ajax({
                    type: "get",
                    url: "{{ route('download.electricity.bill.monthly') }}",
                    data: {
                        'selected_month': "{{ $selectedMonth }}",
                    },
                    success: function(response) {
                        if (response.status) {
                            var link = document.createElement('a');
                            link.href = response.downloadLink;
                            link.download = response.fileName;
                            document.body.appendChild(link);
                            link.click();
                            document.body.removeChild(link);
                            spiner.addClass('d-none');
                            spinerText.removeClass('d-none');
                        } else {
                            spiner.addClass('d-none');
                            spinerText.removeClass('d-none');
                            Swal.fire({
                                icon: "error",
                                text: 'somthing went wronge',
                                timer: 3000,
                                timerProgressBar: true
                            });
                        }
                    },
                    error: function(error) {
                        spiner.addClass('d-none');
                        spinerText.removeClass('d-none');
                        Swal.fire({
                            icon: "error",
                            text: 'somthing went wronge',
                            timer: 3000,
                            timerProgressBar: true
                        });
                    }
                });
            });

            $("#meterChangeModalBtn").on('click', function() {
                $("#changeMeterModal").modal('show');
            });
            $("#changeMeterModal").on('hide.bs.modal', function() {
                $(this).find('form input[type="number"]').val(0);
                // Clear other input fields (excluding number type inputs)
                $(this).find('form input:not([type="number"])').val('');
                $(this).find('form select').val('');

            });
        });

        function ElecticityBillEdite(billId) {
            $.ajax({
                url: '{{ route('fetch.record', [':id', ':billId']) }}'.replace(':id', billId).replace(':billId',
                    billId),
                type: 'GET',
                success: function(data) {
                    $("#ElecticityUpdateModal").on("show.bs.modal", function() {
                        var discountUnits = 0;
                        // if (data.discountUnits != 0) {
                        //     discountUnits = (data.units) - (data.discountUnits);
                        // }
                        $("#billId").val(billId);
                        $("#billDateUpdate").val(data.BillDate);
                        $("#ReadingRateUpdate").val(data.readingRate);
                        $("#previousRedUpdate").val(data.previous_reading);
                        $("#PresentRedUpdate").val(data.present_reading);
                        $("#EditdiscountUnits").val(discountUnits);
                    }).modal("show");
                },
                error: function(error) {
                    // Handle errors
                    console.log(error);
                }
            });

        }
        $('#ElecticityUpdateForm').submit(function(e) {
            e.preventDefault();
            var id = $("#billId").val();
            var actionUrl = '{{ route('update.record', [':id']) }}'.replace(":id", id);
            $(this).attr('action', actionUrl);
            this.submit();
        });

        function ElecticityBillInsert(roomno) {
            var roomno = roomno;
            $("#ElecticityInsertModal").on("show.bs.modal", function() {
                $("#ElecticityBillRoomNo").val(roomno);
            }).modal("show");
        }
    </script>
    @if (session()->has('Electricity'))
        @if ($isAutoBillGenratePermissionActive)
            <script>
                $(document).ready(function() {
                    var billDate = "{{ session('Electricity')['billDate'] }}";
                    autoBillgenrate(billDate);
                });
            </script>
        @else
            <script>
                $(document).ready(function() {
                    setTimeout(function() {
                        Swal.fire({
                            icon: "success",
                            text: "{{ session('Electricity')['message'] }}",
                            timer: 3000,
                            showConfirmButton: false,
                            timerProgressBar: true
                        });
                    }, 3000);
                });
            </script>
        @endif
    @endif
@endsection