{{-- <link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css"> --}}
<style></style>
<div class="card sina-card">
    <div class="card-header" id="headingThree">
        <h4 class="mb-0">{{__('obs.laundry')}}</h4>
    </div>
    <div class="card-body">
        <div class="row">
            <div class="col-12">
                <div class="form-group">
                    <strong class="me-2">{{__('obs.vat')}} {{__('obs.type')}} : </strong>
                    <div class="form-check cl-form-check me-2">
                        <label class="form-check-label cl-form-check-label" for="fd_laundry_vat_type1">{{__('obs.including')}}</label>
                        <input class="form-check-input cl-form-check-input" id="fd_laundry_vat_type1" name="laundry_tax_type" type="radio" value="1" 
                        @isset($row_id) @if ($booking_info->laundry_tax_type == 1) checked @endif  @endisset 
                        @empty($row_id) checked @endempty />
                    </div>
                    <div class="form-check cl-form-check me-2">
                        <label class="form-check-label cl-form-check-label" for="fd_laundry_vat_type2">{{__('obs.excluding')}}</label>
                        <input class="form-check-input cl-form-check-input" id="fd_laundry_vat_type2" name="laundry_tax_type" type="radio" value="2" 
                        @isset($row_id) @if ($booking_info->laundry_tax_type == 2) checked @endif @endisset />
                    </div>
                </div>
            </div>
            <input type="hidden" name="is_laundry_bill_change" id="is_laundry_bill_change" value="0"> {{-- Do not remove --}}
            <input type="hidden" name="laundry_invoice_obj" id="laundry_invoice_obj" value="">
            <div class="col-12" id="load_laundry_products_btn">
                <button type="button" onclick="loadLaundryProducts()" class="btn btn-sm btn-success">{{ __('obs.load_laundry_products') }}</button>
            </div>
            <div class="col-12">
                <div id="laundry_products" style="max-height: 380px; overflow-y: scroll">

                </div>
            </div>
        </div>
    </div>
</div>
{{-- <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-multidatespicker/1.6.6/jquery-ui.multidatespicker.min.js"></script> --}}
<script>
    let booking_id_for_laundry = @json(isset($booking_id_for_laundry) ? $booking_id_for_laundry : 0);
    let laundry_products = [];
    let laundry_master_invoice = {
        transactions: [],
        total_tax: 0,
        total_amount: 0
    };
    let laundry_invoice = null;
    let laundry_master_transaction = {
        row: null,
        id: null,
        product_id: null,
        menu_id: null,
        dates: '',
        start_date: '',
        end_date: '',
        days: 0,
        quantity: 0,
        price: 0,
        total: 0,
        tax_percentage: 0,
        tax_amount: 0,
        tax_info: null,
        total_w_tax: 0,
    }
    let lndry_vat_type=$("input[type=radio][name=laundry_tax_type]:checked").val();
    $('input[type=radio][name=laundry_tax_type]').change(function() {
        lndry_vat_type=$("input[type=radio][name=laundry_tax_type]:checked").val();
        updateAllRowsLaundry();
    });
    function loadLaundryProducts(){
        $('#laundry_products').html(`<div class="text-center"><i class="fas fa-spinner fa-spin"></i> {{__('obs.loading')}}...</div>`);
        ajaxCustom(function(res){
            laundry_invoice = Object.assign({}, laundry_master_invoice);
            laundry_products = res.products;
            $('#laundry_products').html(res.html);
            $('#load_laundry_products_btn').hide();
            $('#is_laundry_bill_change').val(1);
            callFlatPicker();
            callMultiDateSelectCalendarLaundry();
            setObjectWhenEditLaundry();
        }, "get", "{{ route('frontdesk.laundry.product.load_for_order') }}", {from: 'booking', booking_id: booking_id_for_laundry});
    }
    // function callFlatPicker(){
    //     flatpickr(".date-picker", {
    //         enableTime: false,
    //         dateFormat: "d-m-Y"
    //     });
    // }
    function callMultiDateSelectCalendarLaundry(){
        $('.multiDatePickerLaundry').multiDatesPicker({
            dateFormat: "dd-mm-yy",
            onSelect: function() {
                dateChangeLaundry('DATES',$(this).attr('data-row'));
            }
        });
    }
    function dateChangeLaundry(type,row){
        let start_date = $(`#lndry_start_date_${row}`).val();
        let end_date = $(`#lndry_end_date_${row}`).val();
        let days = 0;
        if(['START','END'].includes(type)){
            let datesBetween = getDatesBetween(start_date, end_date);
            days = datesBetween.length;
            $(`#lndry_dates_${row}`).val(datesBetween.join(', '));
            $(`#lndry_dates_${row}`).multiDatesPicker('destroy');
            callMultiDateSelectCalendarLaundry();
        } else {
            let dates = $(`#lndry_dates_${row}`).val();
            if(dates == '') days = 0;
            else days = dates.split(',').length;
        }
        $(`#lndry_days_${row}`).val(days);
        calculateRowTotalLaundry(row);
    }
    // function parseDate(dateString) {
    //     const [day, month, year] = dateString.split('-');
    //     return new Date(`${year}-${month}-${day}`);
    // }
    // function formatDate(date) {
    //     const day = String(date.getDate()).padStart(2, '0');
    //     const month = String(date.getMonth() + 1).padStart(2, '0');
    //     const year = date.getFullYear();
    //     return `${day}-${month}-${year}`;
    // }
    // function getDatesBetween(startDate, endDate) {
    //     const dates = [];
    //     let currentDate = parseDate(startDate);
    //     const finalDate = parseDate(endDate);
    //     while (currentDate <= finalDate) {
    //         dates.push(formatDate(new Date(currentDate)));
    //         currentDate.setDate(currentDate.getDate() + 1);
    //     }
    //     return dates;
    // }
    function calculateRowTotalLaundry(row){
        let transaction = laundry_invoice.transactions.find(x => x.row == row);
        if(!transaction){
            transaction = Object.assign({}, laundry_master_transaction);
            transaction.row = parseInt(row);
            laundry_invoice.transactions.push(transaction);
            transaction = laundry_invoice.transactions.find(x => x.row == row);
            transaction.product_id = $(`#laundry_product_info_${ row }`).attr('data-product-id');
            transaction.menu_id = $(`#laundry_product_info_${ row }`).attr('data-menu-id');
            let product_info = laundry_products.find(x => x.id == transaction.product_id);
            let tax_info = [];
            if(product_info){
                product_info.vat_infos.forEach(x => {
                    tax_info.push({
                        id: x.id,
                        percentage: x.percentage
                    });
                });
            }
            transaction.tax_percentage = product_info.tax_percentage;
            transaction.tax_info = tax_info;

        }
        transaction.id = $(`#laundry_row_${ row }`).attr('data-pre-id');
        transaction.dates = $(`#lndry_dates_${ row }`).val();
        transaction.start_date = $(`#lndry_start_date_${ row }`).val();
        transaction.end_date = $(`#lndry_end_date_${ row }`).val();
        transaction.days = $(`#lndry_days_${ row }`).val();
        transaction.quantity = $(`#lndry_qty_${ row }`).val();
        transaction.price = $(`#lndry_price_${ row }`).val();
        let sub_total = parseFloat(transaction.quantity) * parseFloat(transaction.price) * parseFloat(transaction.days);
        let tax_calculation = calIncludingTax(parseFloat(sub_total),parseFloat(transaction.tax_percentage), lndry_vat_type);
        transaction.tax_amount = tax_calculation.tax_amt;
        transaction.total_w_tax = tax_calculation.vat_without_total;
        transaction.total = parseFloat(transaction.total_w_tax) + parseFloat(transaction.tax_amount);
        $(`#lndry_tax_amount_${ row }`).text(parseFloat(transaction.tax_amount).toFixed(2));
        $(`#lndry_total_${ row }`).val(parseFloat(transaction.total).toFixed(2));
        calculateLaundryGrandTotal();
    }
    function addNewLaundryProduct(cur_row){
        let max_laundry_row = $('#max_laundry_row').val();
        let row_plus = parseInt(max_laundry_row) + 1;
        let product_name = $(`#laundry_product_info_${ cur_row }`).text();
        let product_id = $(`#laundry_product_info_${ cur_row }`).attr('data-product-id');
        let menu_id = $(`#laundry_product_info_${ cur_row }`).attr('data-menu-id');
        let product_info = laundry_products.find(x => x.id == product_id);
        // <button type="button" class="btn btn-info btn-sm" onclick="addNewlaundryProduct(${ row_plus })"><i class="fas fa-plus-circle"></i></button>
        let new_row_html = `<tr id="laundry_row_${ row_plus }" data-row="${ row_plus }" data-pre-id="0">
            <td></td>
            <td id="laundry_product_info_${ row_plus }" data-menu-id="${ menu_id }" data-product-id=${ product_id }>${ product_name }</td>
            <td><input type="text" id="lndry_start_date_${ row_plus }" onchange="dateChangeLaundry('START',${ row_plus })" data-menu-id="${ menu_id }" data-product-id=${ product_id } class="form-control date-picker" value="{{ date('d-m-Y') }}"></td>
            <td><input type="text" id="lndry_end_date_${ row_plus }" onchange="dateChangeLaundry('END',${ row_plus })" data-menu-id="${ menu_id }" data-product-id=${ product_id } class="form-control date-picker" value="{{ date('d-m-Y') }}"></td>
            <td>
                <input type="text" id="lndry_dates_${ row_plus }" readonly data-row=${ row_plus } data-menu-id="${ menu_id }" data-product-id=${ product_id } class="form-control multiDatePickerLaundry">
            </td>
            <td>
                <input type="number" id="lndry_days_${ row_plus }" readonly value="0" class="form-control text-end">
            </td>
            <td><input type="number" onkeyup="calculateRowTotalLaundry(${ row_plus })" id="lndry_price_${ row_plus }" class="form-control text-end" value="0"></td>
            <td><input type="number" onkeyup="calculateRowTotalLaundry(${ row_plus })" id="lndry_qty_${ row_plus }" class="form-control text-end" value="0"></td>
            <td class="text-end"><span class="text-end" id="lndry_tax_percentage_${ row_plus }">${ product_info.tax_percentage }</span></td>
            <td class="text-end"><span id="lndry_tax_amount_${ row_plus }">0</span></td>
            <td>
                <input type="number" id="lndry_total_${ row_plus }" readonly value="0" class="form-control text-end">
            </td>
        </tr>`;
        $(`#laundry_row_${cur_row}`).after(`${new_row_html}`);
        $(`#max_laundry_row`).val(row_plus);
        callFlatPicker();
        callMultiDateSelectCalendarLaundry();
    }
    function calculateLaundryGrandTotal(){
        laundry_invoice.total_amount = laundry_invoice.transactions.reduce((a, b) => a + b.total, 0);
        let total_facility_bill = $('#facility_bill').val();
        let total_resv_amount = $(".gross_bill").val();
        let total_restaurant_amount = restaurant_invoice ? restaurant_invoice.total_amount : 0;
        var grand_total = (parseFloat(total_facility_bill) + parseFloat(total_resv_amount) + parseFloat(total_restaurant_amount) + parseFloat(laundry_invoice.total_amount));
        $(`#laundry_grand_total`).val(parseFloat(laundry_invoice.total_amount).toFixed(2));
        $('#grand_total').val(parseFloat(grand_total).toFixed(2));
        $('#laundry_invoice_obj').val(JSON.stringify(laundry_invoice));
    }
    function setObjectWhenEditLaundry(){
        if(booking_id_for_laundry > 0){
            $('#laundry_products tr').each(function(){
                let pre_id = $(this).attr('data-pre-id');
                if(pre_id > 0){
                    let row = $(this).attr('data-row');
                    calculateRowTotalLaundry(row);
                }
            });
        }
    }
    function updateAllRowsLaundry(){
        laundry_invoice.transactions.forEach((transaction, index) => {
            calculateRowTotalLaundry(transaction.row);
        })
    }
</script>