@extends('layouts.app')
@section('title')
    PRODUCTION PLANNING CREATE
@endsection
@section('button')
    <a type="button" class="btn btn-info" href="{{ route('daily-production-planning') }}">
        <i class="bi bi-arrow-left"></i> Back
    </a>
@endsection
@section('content')
    <style>
        #mainTable input {
            width: 100px;
        }

        .custom-table-class {
            width: -webkit-fill-available !important;
        }

        .custom-select {
            width: auto !important;
        }

        .planned_date {
            width: 150px;
        }
    </style>
    <div class="alert border-danger alert-dismissible fade show text-danger d-none" role="alert" id="error_div">
    </div>
    <div class="alert border-success alert-dismissible fade show text-success d-none" role="alert" id="success_div">
    </div>
    <div class="card">
        <div class="card-body">
            <div class="row">
                <div class="col-lg-12">
                    <div class="col-lg-3 col-sm-4 col-12">
                        <h5 class="display-none">Daily Production Planning Detail</h5>
                    </div>
                </div>
            </div>
            <br>
            <form method="post" action="{{ route('daily-production-planning.generate') }}" enctype="multipart/form-data"
                id="myForm">
                @csrf
                <div class="row mb-5">
                    <div class="col-lg-6 col-sm-6 col-12 mt-3">
                        <div class="row align-items-center">
                            <label for="ref_no" class="form-label col-4">Ref No.</label>
                            <div class="col-6">
                                <input type="text" readonly name="ref_no" id="ref_no"
                                    value="@if (isset($fetch_orders)) {{ $ref_no }} @else {{ $ref_no }} @endif"
                                    class="form-control rounded-4" value="">
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-6 col-sm-6 col-12 mt-3">
                        <div class="row align-items-center">
                            <label for="planning_date" class="form-label col-4">Date</label>
                            <div class="col-6">
                                <input type="text"
                                    value="@if (isset($fetch_orders)) {{ $planning_date }}@else{{ date('d/m/Y') }} @endif"
                                    name="planning_date" id="planning_date" class="form-control rounded-4">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-sm-6 col-12 mt-3">
                        <div class="row align-items-center">
                            <label for="rev_no" class="form-label col-4">Order No.</label>
                            <div class="col-6">
                                <select class="form-select" onchange="order_change()" name="order_id" id="order_id">
                                    @php
                                        $selectedOrder = null;

                                        if (old('order_id')) {
                                            $selectedOrder = App\Models\Order::find(old('order_id'));
                                        } elseif (isset($fetch_orders)) {
                                            $selectedOrder = $fetch_orders;
                                        }
                                    @endphp

                                    @if ($selectedOrder)
                                        <option value="{{ $selectedOrder->id }}" selected>
                                            {{ $selectedOrder->order_no }}
                                        </option>
                                    @else
                                        <option value="" selected disabled>Select Order No</option>
                                    @endif
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-sm-6 col-12 mt-3">
                        <div class="row align-items-center">
                            <label for="created_by" class="form-label col-4">Created By</label>
                            <div class="col-6">
                                <input type="text" readonly id="created_by" class="form-control rounded-4"
                                    value="{{ Auth::user()->user_name }}">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-sm-6 col-12 mt-3">
                        <div class="row align-items-center">
                            <label for="customer" class="form-label col-4">Customer</label>
                            <div class="col-6">
                                <input type="text" readonly id="customer_name" name="customer_name"
                                    class="form-control  rounded-4"
                                    value="@if (isset($fetch_orders)) {{ $fetch_orders->customers->name }} @else {{ old('customer_name') }} @endif">
                                <input type="hidden" id="customer_id" class="form-control"
                                    value="@if (isset($fetch_orders)) {{ $fetch_orders->customers->id }} @endif">
                                <input type="hidden" id="dpp_id" class="form-control">
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-6 col-sm-6 col-12 mt-3">
                        <div class="row align-items-center">
                            <label for="product_id" class="form-label col-4">Order Month</label>
                            <div class="col-6">
                                <input type="month" readonly id="order_month" name="order_month"
                                    class="form-control rounded-4"
                                    value="{{ old('order_month', isset($fetch_orders) ? \Carbon\Carbon::parse($fetch_orders->order_month)->format('Y-m') : '') }}">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-sm-6 col-12 mt-3">
                        <div class="row align-items-center">
                            <label for="status" class="form-label col-4">Status</label>
                            <div class="col-6">
                                <select name="status" id="status" class="form-select" style="width: 100% !important;">
                                    <option value="In Progress"
                                        @if (isset($fetch_orders)) @if ($status == 'In Progress') selected @endif
                                    @else @if (old('status') == 'In Progress') selected @endif @endif
                                        >In Progress</option>
                                    <option value="Completed"
                                        @if (isset($fetch_orders)) @if ($status == 'Completed') selected @endif
                                    @else @if (old('status') == 'Completed') selected @endif @endif
                                        >Completed</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-sm-6 col-12 mt-3">
                        <div class="row align-items-center">
                            <label for="created_date" class="form-label col-4">Delivery Date</label>
                            <div class="col-6">
                                <input type="text" name="created_date" id="created_date"
                                    class="form-control rounded-4"
                                    value="@if (isset($fetch_orders)) {{ $created_date }}@else{{ date('d/m/Y') }} @endif">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-sm-4 col-12">
                        <div class="mb-3">
                            <label style="visibility: hidden" for="product_id" class="form-label">Select Order
                                Month</label>
                            <br>
                            <button class="btn btn-primary display-none" type="submit">Generate</button>
                        </div>
                    </div>
                </div>
            </form>
            @if (isset($fetch_orders))
                <div class="row display-none">
                    <div class="col-md-12">
                        <h5>Product Detail</h5>
                        <div class="table-responsive mb-5">
                            <table class="table table-bordered m-0" id="p_table">
                                <thead>
                                    <tr>
                                        <th>Sr No.</th>
                                        <th>Proceed</th>
                                        <th>Part No.</th>
                                        <th>Part Name</th>
                                        <th>Type of Product</th>
                                        <th>Model</th>
                                        <th>Variance</th>
                                        <th>Unit</th>
                                        <th>DI QTY</th>
                                        <th>Current Inventory QTY</th>
                                        <th>Estimated Total Required</th>
                                        <th>Quantity to Produce</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php
                                        $estimated_planning_qty = 0;
                                    @endphp
                                    @foreach ($fetch_orders->order_detail as $order_detail)
                                        @foreach ($delievry_intructions[0]->delivery_instruction_details as $delivery_instruction_detail)
                                            @if ($delivery_instruction_detail->product_id == $order_detail->product_id)
                                                @php
                                                    // Decode the calendar data
                                                    $calendar_data = json_decode(
                                                        $delivery_instruction_detail->calendar,
                                                    );

                                                    $di_qty = 0;
                                                    $next_six_days_qty = 0;

                                                    // Find today's DI quantity
foreach ($calendar_data as $calendar) {
    if ($calendar->day == $planning_day && $calendar->value != '') {
        $di_qty = $calendar->value;
        break; // Stop once today's value is found
                                                        }
                                                    }

                                                    // Calculate sum of the next 3 non-empty days
                                                    $count = 0; // Track the number of days added
                                                    foreach ($calendar_data as $calendar) {
                                                        if ($count >= 6) {
                                                            break; // Stop after 6 days
                                                        }
                                                        if (isset($calendar->value) && $calendar->value != '') {
                                                            $calendar_day = $calendar->day;
                                                            $planning_day_date = date('d', strtotime($planning_date));

                                                            // Include only future days
                                                            if ($calendar_day > $planning_day_date) {
                                                                $next_six_days_qty += $calendar->value;
                                                                $count++; // Increment for each valid day
                                                            }
                                                        }
                                                    }

                                                    // Calculate total required quantity
                                                    $total_required_qty = $di_qty + $next_six_days_qty;
                                                @endphp

                                                <tr>
                                                    <td>
                                                        {{ $loop->iteration }}
                                                        <input type="hidden" value="{{ $order_detail->product_id }}"
                                                            class="main_product_id">
                                                    </td>
                                                    <td><input type="checkbox" class="form-check-input proceed-next"
                                                            checked />
                                                    </td>
                                                    <td>{{ $order_detail->products->part_no ?? '' }}</td>
                                                    <td>{{ $order_detail->products->part_name ?? '' }}</td>
                                                    <td>{{ $order_detail->products->type_of_products->type ?? '' }}</td>
                                                    <td>{{ $order_detail->products->model ?? '' }}</td>
                                                    <td>{{ $order_detail->products->variance ?? '' }}</td>
                                                    <td>{{ $order_detail->products->units->name ?? '' }}</td>
                                                    <td>
                                                        {{ $di_qty }}
                                                        <input type="hidden" value="{{ $di_qty }}"
                                                            class="di_qty">
                                                    </td>
                                                    <td>
                                                        @if ($inventory->isNotEmpty())
                                                            @foreach ($inventory as $inventory_product)
                                                                @if ($inventory_product->product_id == $order_detail->product_id)
                                                                    {{ $inventory_product->qty }}
                                                                    <input type="hidden"
                                                                        value="{{ $inventory_product->qty }}"
                                                                        class="inventory_product_qty">
                                                                    @php
                                                                        $inventory_qty = $inventory_product->qty;
                                                                        $estimated_planning_qty =
                                                                            $total_required_qty - $inventory_qty;
                                                                    @endphp
                                                                @endif
                                                            @endforeach
                                                        @else
                                                            0
                                                            <input type="hidden" value="0"
                                                                class="inventory_product_qty">
                                                        @endif
                                                    </td>
                                                    <td>
                                                        {{ number_format($total_required_qty, 2) }}
                                                        <input type="hidden"
                                                            value="{{ number_format($total_required_qty, 2) }}"
                                                            class="total_required_qty">
                                                    </td>
                                                    <td>
                                                        <input type="number" name="est_plan_qty"
                                                            value="{{ $estimated_planning_qty > 0 ? $estimated_planning_qty : number_format($total_required_qty, 2, '.', '') }}"
                                                            class="form-control est_plan_qty">
                                                    </td>
                                                </tr>
                                            @endif
                                        @endforeach
                                    @endforeach

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="row display-none">
                    <div class="col-lg-12 col-sm-12 col-12">
                        <div class="mb-3 text-end">
                            <button class="btn btn-primary" type="button" onclick="next()" id="next">Next</button>
                        </div>
                    </div>
                    <div id="loading-message" style="margin-bottom: 10px; display: none; font-weight: bold;">
                        Loading data, please wait...
                    </div>
                    <div class="col-lg-12 col-sm-12 col-12 d-none" id="child_partdiv">
                        <h5>Circuit/Kanban</h5>
                        <div class="table-responsive mb-5">
                            <table class="table table-bordered m-0" id="sp_table">
                                <thead>
                                    <tr>
                                        <th>Sr No.</th>
                                        <th>Proceed</th>
                                        <th>Part No.</th>
                                        <th>Part Name</th>
                                        <th>Model</th>
                                        <th>Variance</th>
                                        <th>Type of Product</th>
                                        <th>Unit</th>
                                        <th>Unit QTY</th>
                                        <th>Total Required QTY</th>
                                        <th>Current Inventory QTY</th>
                                        <th>Quantity to Produce</th>
                                    </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                        <div class="col-lg-12 col-sm-12 col-12">
                            <div class="mb-3 text-end">
                                <button class="btn btn-primary" type="button"
                                    onclick="save_wo_planning(true)">Save</button>
                                <button class="btn btn-primary" type="button" onclick="scheduling()">Next >
                                    Scheduling</button>
                            </div>
                        </div>
                    </div>
                </div>
                <div id="loading-message2" style="margin-bottom: 10px; display: none; font-weight: bold;">
                    Loading data, please wait...
                </div>
                <div class="row d-none display-show">
                    <div class="col-lg-12 col-sm-12 col-12">
                        <div class="table-responsive mb-5">
                            <table class="table table-bordered m-0" id="scheduling_table">
                                <thead>
                                    <tr>
                                        <th>Sr No.</th>
                                        <th><input type="checkbox" class="form-check-input" id="planCheckAll" /></th>
                                        <th>PO No.</th>
                                        <th>Part No.</th>
                                        <th>Part Name</th>
                                        <th>Model</th>
                                        <th>Variance</th>
                                        <th>Type of Product</th>
                                        <th>Process</th>
                                        <th>Process No.</th>
                                        <th>CT (s)</th>
                                        <th>Planned Date</th>
                                        <th>Operator</th>
                                        <th>Machine</th>
                                        <th>Total Planned QTY</th>
                                    </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12 col-12">
                        <div class="mb-3 text-end">
                            <button class="btn btn-primary savePlanningBtn" type="button" onclick="save_planning()">Planning</button>
                        </div>
                    </div>
                </div>
            @endif
        </div>
    </div>
    <link rel="stylesheet" href="{{ asset('assets/css/bootstrap-datepicker.min.css') }}">
    <script src="{{ asset('assets/js/bootstrap-datepicker.min.js') }}"></script>
    <script>
        var p_table;
        var sp_table;
        var scheduling_table;
        $(document).ready(function() {
            $('#planning_date').datepicker({
                format: 'dd/mm/yyyy',
                autoclose: true,
                todayHighlight: true,
                orientation: 'bottom'
            });
            $('#created_date').datepicker({
                format: 'dd/mm/yyyy',
                autoclose: true,
                todayHighlight: true,
                orientation: 'bottom'
            });

            $("#order_id").trigger('change');
            p_table = $('#p_table').DataTable();
            sp_table = $('#sp_table').DataTable();
            scheduling_table = $('#scheduling_table').DataTable({
                columnDefs: [{
                    targets: 1,
                    orderable: false
                }]
            });
            $('#sp_table').addClass('custom-table-class');
            $('#scheduling_table').addClass('custom-table-class');

            function initSelect2WithAjaxOrder(selector, placeholder, route) {
                $(selector).select2({
                    placeholder: placeholder,
                    ajax: {
                        url: route,
                        dataType: 'json',
                        delay: 250,
                        data: function(params) {
                            return {
                                q: params.term,
                                page: params.page || 1
                            };
                        },
                        processResults: function(data, params) {
                            params.page = params.page || 1;

                            return {
                                results: $.map(data.items, function(item) {
                                    return {
                                        text: item.order_no,
                                        id: item.id,
                                    };
                                }),
                                pagination: {
                                    more: (params.page * 10) < data.total_count
                                }
                            };
                        },
                        cache: true
                    }
                });
            }

            initSelect2WithAjaxOrder('#order_id', 'Select Order', '{{ route('order.search.outgoing') }}');

            scheduling_table.on('draw', function() {
                let machineDropdown = $('#scheduling_table').find('.machine');
                initSelect2WithAjax(machineDropdown, 'Select Machine', '{{ route('machine.search') }}', $(
                    "#scheduling_table"));

                let userDropdown = $('#scheduling_table').find('.op_name');
                initSelect2WithAjax(userDropdown, 'Select Users', '{{ route('users.search') }}', $(
                    "#scheduling_table"));
            });
        });

        function initSelect2WithAjax(selector, placeholder, route, parent = $('body')) {
            $(selector).select2({
                placeholder: placeholder,
                dropdownParent: parent,
                ajax: {
                    url: route,
                    dataType: 'json',
                    delay: 250,
                    data: function(params) {
                        return {
                            q: params.term,
                            page: params.page || 1
                        };
                    },
                    processResults: function(data, params) {
                        params.page = params.page || 1;

                        return {
                            results: $.map(data.items, function(item) {
                                return {
                                    text: item.order_no || item.name || item.user_name,
                                    id: item.id,
                                };
                            }),
                            pagination: {
                                more: (params.page * 10) < data.total_count
                            }
                        };
                    },
                    cache: true
                }
            });
        }

        function order_change() {
            var orderId = $("#order_id").val();
            if (orderId) {
                $.ajax({
                    url: "{{ route('order.search.outgoing.detail') }}",
                    type: 'GET',
                    data: {
                        id: orderId
                    },
                    success: function(order) {
                        $('#customer_name').val(order.customers.name);
                        $('#customer_id').val(order.customers.id);
                        let date2 = new Date(order.order_month);
                        let formattedDate2 = date2.getFullYear() + '-' + ('0' + (date2.getMonth() + 1)).slice(-
                            2);
                        $('#order_month').val(formattedDate2);
                    }
                });
            } else {
                $('#customer').val('');
                $('#order_month').val('');
            }
        };

        @if (isset($fetch_orders))
            function next() {
                let productIds = [];
                p_table.rows().every(function(rowIdx, tableLoop, rowLoop) {
                    var row = this.node();

                    var productId = $(row).find('.main_product_id').val();
                    var est_plan_qty = $(row).find('.est_plan_qty').val();
                    var proceed_next = $(row).find('.proceed-next').is(':checked');

                    if (productId && proceed_next) {
                        productIds.push({
                            id: productId,
                            qty: est_plan_qty,
                        });
                    }

                    $(row).find('.proceed-next').prop('disabled', true);
                    $(row).find('.est_plan_qty').prop('readonly', true);
                });

                $('#child_partdiv').removeClass('d-none');
                $('#next').addClass('d-none');
                $('#loading-message').html('Loading... <span id="loading-progress">0%</span>').show();

                $.ajax({
                    url: `{{ route('daily-production-planning.get_subparts') }}`,
                    method: 'POST',
                    data: {
                        data: productIds,
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        sp_table.clear();
                        const item = Object.values(response);
                        const total = item.length;
                        let rowIndex = 1;
                        let chunkSize = 50;
                        let start = 0;

                        function renderChunk() {
                            const chunk = item.slice(start, start + chunkSize);
                            const rows = [];

                            chunk.forEach((item) => {
                                if (item.qty > 0) {
                                    let est_planning_qty = item.qty - item.inventory_qty;
                                    rows.push([
                                        rowIndex,
                                        `<input type="checkbox" class="form-check-input proceed-scheduling" checked/>`,
                                        `<input type="hidden" value="${item.id}" class="child_part_id">` +
                                        item.part_no,
                                        item.part_name,
                                        item.model,
                                        item.variance,
                                        item.type,
                                        item.unit,
                                        item.own_qty +
                                        `<input type="hidden" value="${item.own_qty}" class="subpart_qty">`,
                                        parseFloat(item.qty).toFixed(2) +
                                        `<input type="hidden" value="${parseFloat(item.qty).toFixed(2)}" class="total_required_qty">`,
                                        item.inventory_qty +
                                        `<input type="hidden" value="${item.inventory_qty}" class="inventory_qty">`,
                                        `<input type="number" value="${parseFloat(est_planning_qty).toFixed(2)}"  class="est_plan_qty form-control">`
                                    ]);
                                    rowIndex++;
                                }
                            });

                            sp_table.rows.add(rows).draw(false);
                            start += chunkSize;

                            // Update percentage
                            let percent = Math.min(100, Math.floor((start / total) * 100));
                            $('#loading-progress').text(`${percent}%`);

                            if (start < total) {
                                setTimeout(renderChunk, 5); // Next chunk
                            } else {
                                $('#loading-message').html('Completed ✅').fadeOut(1000);
                            }
                        }

                        renderChunk();
                    }
                });
            }

            function scheduling() {
                $('#loading-message2').html('Loading... <span id="loading-progress2">0%</span>').show();
                save_wo_planning(false);
                $('.display-none').addClass('d-none');
                $('.display-show').removeClass('d-none');
            }

            function save_wo_planning(flag) {
                let formData = {
                    order_id: $('#order_id').val(),
                    ref_no: $('#ref_no').val(),
                    customer_id: $('#customer_id').val(),
                    planning_date: $('#planning_date').val(),
                    created_date: $('#created_date').val(),
                    created_by: $('#created_by').val(),
                    status: $('#status').val()
                };

                $('#p_table').DataTable().page.len(-1).draw(false);
                $('#sp_table').DataTable().page.len(-1).draw(false);

                let products = [];
                let childParts = [];
                $('#p_table tbody tr').each(function() {
                    let product_id = $(this).find('.main_product_id').val();
                    let di_qty = $(this).find('.di_qty').val();
                    let inventory_qty = $(this).find('.inventory_product_qty').val();
                    let total_required_qty = $(this).find('.total_required_qty').val();
                    let est_plan_qty = $(this).find('.est_plan_qty').val();
                    let next_procees = $(this).find('.proceed-next').is(':checked');
                    if (product_id && di_qty && total_required_qty && est_plan_qty &&
                        next_procees) {
                        products.push({
                            product_id: product_id,
                            di_qty: di_qty,
                            inventory_qty: inventory_qty,
                            total_required_qty: total_required_qty,
                            est_plan_qty: est_plan_qty
                        });
                    }
                });
                $('#sp_table tbody tr').each(function() {
                    let product_id = $(this).find('.child_part_id').val();
                    let parent_part_id = $(this).find('.parent_part_id').val();
                    let subpart_qty = $(this).find('.subpart_qty').val();
                    let total_required_qty = $(this).find('.total_required_qty').val();
                    let inventory_qty = $(this).find('.inventory_qty').val();
                    let est_plan_qty = $(this).find('.est_plan_qty').val();
                    let scheduling_procees = $(this).find('.proceed-scheduling').is(':checked');
                    if (product_id && subpart_qty && total_required_qty && est_plan_qty) {
                        childParts.push({
                            product_id: product_id,
                            parent_part_id: parent_part_id,
                            subpart_qty: subpart_qty,
                            inventory_qty: inventory_qty,
                            total_required_qty: total_required_qty,
                            est_plan_qty: est_plan_qty,
                            scheduling_procees: scheduling_procees ? true : false
                        });
                    }
                });

                // Add products array to formData
                formData.product_table = products;
                formData.childpart_table = childParts;
                formData.is_scheduling = flag == true ? '0' : '1';
                // Validation

                let errors = [];
                if (!formData.order_id) {
                    errors.push('Order No Required');
                }
                if (!formData.ref_no) {
                    errors.push('Reference No Required');
                }
                if (!formData.customer_id) {
                    errors.push('Customer Required');
                }
                if (!formData.planning_date) {
                    errors.push('Planning Date Required');
                }
                if (!formData.created_date) {
                    errors.push('Created Date Required');
                }
                if (!formData.status) {
                    errors.push('Status Required');
                }

                // Show errors if any
                if (errors.length > 0) {
                    $('#error_div').html(errors.join('<br>')).removeClass('d-none');
                    return;
                }

                // AJAX request to save data
                $.ajax({
                    url: `{{ route('daily-production-planning.store') }}`, // Change to your actual URL
                    method: 'POST',
                    data: formData,
                    headers: {
                        'X-CSRF-TOKEN': '{{ csrf_token() }}' // Include CSRF token for security
                    },
                    success: function(response) {
                        if (flag) {
                            window.location.href = `{{ route('daily-production-planning') }}`;
                        } else {
                            $('#dpp_id').val(response);
                            $('#success_div').html('Data Saved Successfully').removeClass('d-none');
                            schedulingProductIds = [];
                            p_table.rows().every(function(rowIdx, tableLoop, rowLoop) {
                                var row = this.node();

                                var productId = $(row).find('.main_product_id').val();
                                var est_plan_qty = $(row).find('.est_plan_qty').val();
                                var proceed_next = $(row).find('.proceed-next').is(':checked');

                                if (productId && proceed_next) {
                                    schedulingProductIds.push({
                                        id: productId,
                                        qty: est_plan_qty,
                                    });
                                }

                                $(row).find('.proceed-next').prop('disabled', true);
                                $(row).find('.est_plan_qty').prop('readonly', true);
                            });
                            sp_table.rows().every(function(rowIdx, tableLoop, rowLoop) {
                                var row = this.node();

                                var productId = $(row).find('.child_part_id').val();
                                var est_plan_qty = $(row).find('.est_plan_qty').val();
                                var proceed_scheduling = $(row).find('.proceed-scheduling').is(
                                    ':checked');

                                if (productId && proceed_scheduling) {
                                    schedulingProductIds.push({
                                        id: productId,
                                        qty: est_plan_qty,
                                    });
                                }

                                $(row).find('.proceed-scheduling').prop('disabled', true);
                                $(row).find('.est_plan_qty').prop('readonly', true);
                            });

                            $.ajax({
                                url: `{{ route('daily-production-planning.get_bom_process') }}`,
                                method: 'POST',
                                data: {
                                    id: $('#dpp_id').val(),
                                    data: schedulingProductIds,
                                    is_scheduling: 0,
                                    _token: '{{ csrf_token() }}'
                                },
                                success: function(response) {
                                    scheduling_table.clear();
                                    const item1 = Object.values(response);
                                    const total1 = item1.length;
                                    let rowIndex1 = 1;
                                    let chunkSize1 = 50;
                                    let start1 = 0;

                                    function renderChunk1() {
                                        const chunk1 = item1.slice(start1, start1 + chunkSize1);
                                        const rows1 = [];

                                        chunk1.forEach((item1) => {
                                            if (item1.planned_qty > 0) {
                                                const rawPartNames = String(item1
                                                    .raw_part_names || '').split(',');
                                                const childPartNames = String(item1
                                                    .child_part_names || '').split(',');
                                                let opHtml = '';
                                                if (Array.isArray(item1.op_name)) {
                                                    item1.op_name.forEach(op => {
                                                        opHtml +=
                                                            `<option value="${op.id}" selected>${op.name}</option>`;
                                                    });
                                                }
                                                const today = new Date().toISOString()
                                                    .split('T')[0];

                                                const plannedDate = item1.planned_date ??
                                                    today;
                                                rows1.push([
                                                    rowIndex1 +
                                                    `<input type="hidden" value="${item1.id}" class="id">`,
                                                    `<input ${(item1.is_plan == 1) ? 'checked disabled' : ''} type="checkbox" class="form-check-input plan_check" id="plan_check"/>`,
                                                    item1.pro_order_no,
                                                    item1.products?.part_no ?? '',
                                                    item1.products?.part_name ?? '',
                                                    item1.products?.model ?? '',
                                                    item1.products?.variance ?? '',
                                                    item1.products?.type_of_products
                                                    ?.type ?? '',
                                                    item1.process?.name ?? '',
                                                    item1.process_no,
                                                    item1.cavity,
                                                    `<input type="date" ${(item1.is_plan == 1) ? 'disabled' : ''} class="form-control planned_date" value='${plannedDate}'>`,
                                                    `<select ${(item1.is_plan == 1) ? 'disabled' : ''} class="form-select custom-select op_name w-100" multiple>
                                                        ${opHtml}
                                                    </select>`,
                                                    `<select ${(item1.is_plan == 1) ? 'disabled' : ''} class="form-select machine custom-select" required>
                                                    ${(item1.machine != null) ?
                                                        `<option value="${item1.machine}" selected style="color: black;">
                                                                ${item1.machines?.name ?? ''}
                                                             </option>` : ''
                                                    }
                                                    </select>`,
                                                    `<input type="number" value="${item1.planned_qty}" class="planned_qty form-control" ${(item1.is_plan == 1) ? 'disabled' : ''}>`
                                                ]);
                                                rowIndex1++;
                                            }
                                        });

                                        scheduling_table.rows.add(rows1).draw();
                                        start1 += chunkSize1;

                                        // Update percentage
                                        let percent1 = Math.min(100, Math.floor((start1 / total1) *
                                            100));
                                        $(
                                            '#loading-progress2').text(`${percent1}%`);

                                        if (start1 < total1) {
                                            setTimeout(renderChunk1, 5); // Next chunk
                                        } else {
                                            $('#loading-message2').html('Completed ✅').fadeOut(
                                                1000);
                                        }
                                    }

                                    renderChunk1();
                                }
                            });
                        }
                    },
                    error: function(xhr) {
                        $('#error_div2').html('An error occurred while saving data').removeClass('d-none');
                    }
                });
            }

            $('#planCheckAll').on('change', function() {
                const isChecked = $(this).is(':checked');

                scheduling_table.rows().every(function() {
                    const $row = $(this.node());
                    const $checkbox = $row.find('.plan_check');

                    if (!$checkbox.prop('disabled')) {
                        $checkbox.prop('checked', isChecked);
                    }
                });
            });

            function save_planning() {
                $('.savePlanningBtn').prop('disabled', true);
                let formData = {};
                let scheduling = [];
                scheduling_table.rows().every(function() {
                    const $row2 = $(this.node());
                    const $checkbox2 = $row2.find('.plan_check');
                    if (!$checkbox2.prop('disabled')) {
                        if ($checkbox2.is(':checked')) {
                            scheduling.push({
                                id: $row2.find('.id').val(),
                                planned_date: $row2.find('.planned_date').val(),
                                op_name: $row2.find('.op_name').val(),
                                machine: $row2.find('.machine').val(),
                                planned_qty: $row2.find('.planned_qty').val()
                            });
                        }
                    }
                });

                formData.scheduling = scheduling;

                $.ajax({
                    url: '{{ route('daily-production-planning.planning.store') }}',
                    method: 'POST',
                    data: formData,
                    headers: {
                        'X-CSRF-TOKEN': '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        if (response == 'success') {
                            window.location.href = `{{ route('daily-production-planning') }}`;
                        }
                    },
                    error: function(xhr) {
                        let errorMessage = 'An error occurred while saving data';

                        if (xhr.status === 422) {
                            const errors = xhr.responseJSON.errors;
                            errorMessage =
                                '<button type="button" class="btn-close" aria-label="Close" onclick="hideErrorDiv()"></button><ul>';
                            for (let field in errors) {
                                if (errors.hasOwnProperty(field)) {
                                    errors[field].forEach(error => {
                                        const fieldName = error.split('.')[2];
                                        errorMessage += `<li>${fieldName} field is required.</li>`;
                                    });
                                }
                            }
                            errorMessage += '</ul>';
                        }

                        $('#error_div2').html(errorMessage).removeClass('d-none');
                    }
                });
            }
        @endif
    </script>
@endsection