@php
    $previous_advance = $trip->previous_advance->sum('amount');
    $trip_advance = $trip->trip_advances!=null ? $trip->trip_advances->sum('amount'):0;
    $trip_deposits =$trip->trip_deposits !=null ?$trip->trip_deposits->sum('amount'): 0;
    $actual_fregiths = $trip->trip_details !=null ?$trip->trip_details->sum('actual_freight'):0;
    $trip_oils = $trip->trip_oils !=null ?  $trip->trip_oils->sum('total_amount'):0;
    $expense = $trip->trip_expenses !=null?$trip->trip_expenses->sum('total_amount'):0;
    $trip_total_expenses = $expense +$trip_oils;
@endphp
<div class="modal-body row" id="trip_detail_modal_body">
    @if (auth()->user()->hasPermissionTo('create trip details'))
        <div class="col-md-12">

            <div class="panel panel-card margin-b-30">
                <div class="panel-body">

                    <div class="row mb-3">
                        <div class="col-md-3">
                            <button id="btn1" type="button" class="btn btn-primary"> ٹوپے کرایہ</button>
                        </div>
                        <div class="col-md-3">
                            <button id="btn2" type="button" class="btn btn-secondary">پیڈ کرایہ</button>
                        </div>
                    </div>

                    <form id="add_trip_details_form_abc">
                        @csrf
                        <div class="row  toggle-row">
                            <div class="col-md-3">
                                <label for="act_freight">تاریخ:<span class="text-danger">*</span></label>
                                <input type="date" name="date" value="{{ old('date', date('Y-m-d')) }}" class="form-control change_focus" data-id="">
                                <span class="text-danger error" id="date_error"></span>
                            </div>

                            <div class="col-md-3">
                                <label for="bility_number"> بلٹی نمبر:<span
                                        class="text-danger">*</span></label>
                                <input type="number" step="any" min="0" value="0"
                                       id="bility_number"
                                       name="bility_number"
                                       class="form-control change_focus" data-id="bility_number">
                                <span class="text-danger error" id="bility_number_error"></span>
                            </div>

                            <div class="col-md-3">
                                <label for="vourcher_number"> ووچر نمبر:<span
                                        class="text-danger">*</span></label>
                                <input type="number" step="any" min="0" value="0" id="vourcher_number"
                                       name="vourcher_number"
                                       class="form-control change_focus" data-id="vourcher_number">
                                <span class="text-danger error" id="vourcher_number_error"></span>
                            </div>

                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="from_city_id">لوڈنگ پوائنٹ (شہر)<span class="text-danger">*</span></label>
                                    <select id="from_city_id" name="from_city" onchange="get_city_histroy()"
                                            class="form-control change_focus" data-id="to_city_id" autofocus>
                                        <option disabled selected value="">SELECT</option>
                                        @forelse ($cities as $city)
                                            <option value="{{ $city->id }}">{{ $city->name }}</option>
                                        @empty
                                        @endforelse
                                    </select>
                                    <span class="text-danger error" id="from_city_error"></span>

                                </div>
                            </div>

                        </div>
                        <div class="row  toggle-row mt-2">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="to_city_id">ان لوڈنگ پوائنٹ (شہر)<span class="text-danger">*</span></label>
                                    <select id="to_city_id" name="to_city" onchange="get_city_histroy()"
                                            class="form-control change_focus" data-id="broker_id">
                                        <option value="">SELECT</option>
                                        @forelse ($cities as $city)
                                            <option value="{{ $city->id }}">{{ $city->name }}</option>
                                        @empty
                                        @endforelse
                                    </select>
                                    <span class="text-danger error" id="to_city_error"></span>

                                </div>

                            </div>

                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="broker_id">پارٹی نام<span class="text-danger">*</span></label>
                                    <select id="broker_id" name="broker" class="form-control change_focus"
                                            data-id="item_name">
                                        <option value="">SELECT</option>
                                        @forelse ($brokers as $broker)
                                            <option value="{{ $broker->id }}">{{ $broker->name }}</option>
                                        @empty
                                        @endforelse
                                    </select>
                                    <span class="text-danger error" id="broker_error"></span>

                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group autocomplete">
                                    <label for="item_name">مال کا نام<span class="text-danger">*</span></label>
                                    <input type="text" id="item_name" name="item_name" class="form-control change_focus"
                                           data-id="weight_type">
                                    <span class="text-danger error" id="item_name_error"></span>

                                </div>
                            </div>

                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="item_weight">مال کا وزن<span class="text-danger">*</span></label>
                                    <input type="number" min="0" step="any" id="item_weight" name="item_weight"
                                           class="form-control change_focus" onchange="itemRate()">
                                    <span class="text-danger error" id="item_weight_error"></span>
                                </div>
                            </div>




                        </div>
                        <div class="row mt-2">

                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="unit_rate">فی ٹن کرایہ<span class="text-danger">*</span></label>
                                    <input type="number" min="0" step="any" id="unit_rate" name="unit_rate"
                                           class="form-control change_focus" onchange="itemRate()">
                                    <span class="text-danger error" id="unit_rate_error"></span>
                                </div>
                            </div>

                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="b_freight">بلٹی کرایہ<span class="text-danger">*</span></label>
                                    <input type="number" min="0" step="any" id="b_freight" name="b_freight"
                                           class="form-control change_focus" onchange="itemRate()" >
                                    <span class="text-danger error" id="b_freight_error"></span>
                                </div>
                            </div>

                            <div class="col-md-3 toggle-row">


                                <label for="advance_amount"> ایڈوانس رقم:<span
                                        class="text-danger">*</span></label>
                                <input type="number" step="any" min="0" value="0" id="advance_amount"
                                       name="advance_amount"
                                       class="form-control change_focus" data-id="advance_amount" oninput="ReachAmount()">
                                <span class="text-danger error" id="advance_amount_error"></span>
                            </div>
                            <div class="col-md-3 toggle-row">
                                <label for="remainder_amount"> پہنچ بقایا رقم:<span
                                        class="text-danger">*</span></label>
                                <input type="number" step="any" min="0" value="0" id="remainder_amount"
                                       name="remainder_amount"
                                       class="form-control change_focus" data-id="">
                                <span class="text-danger error" id="remainder_amount_error"></span>
                            </div>


                        </div>
                        <div class="row mt-2">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="broker_point">بروکری اڈہ<span
                                            class="text-danger">*</span></label>
                                    <input type="number" step="any" onkeyup="calAmount()" min="0" value="0"
                                           id="broker_point"
                                           name="broker_point"
                                           class="form-control change_focus" data-id="broker_point">
                                    <span class="text-danger error" id="broker_point_error"></span>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="commission_party"> منشیانہ پارٹی<span class="text-danger">*</span></label>
                                    <input type="number" step="any" onkeyup="calAmount()" min="0" id="commission_party" name="commission_party"
                                           class="form-control change_focus" data-id="commission_party">
                                    <span class="text-danger error" id="commission_party_error"></span>
                                </div>
                            </div>

                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="bility_commission">بلٹی کمیشن<span
                                            class="text-danger">*</span></label>
                                    <input type="number" step="any" min="0" value="0"
                                           id="bility_commission"
                                           name="bility_commission"
                                           class="form-control change_focus" data-id="bility_commission" onkeyup="calAmount()">
                                    <span class="text-danger error" id="bility_commission_error"></span>
                                </div>
                            </div>

                            <div class="col-md-3">
                                <label for="act_freight">شارٹ وزن:<span
                                        class="text-danger">*</span></label>
                                <input type="number" step="any" onkeyup="calAmount()" min="0" value="0"
                                       id="fine"
                                       name="fine"
                                       class="form-control change_focus" data-id="fine">
                                <span class="text-danger error" id="fine_error"></span>
                            </div>



                        </div>
                        <div class="row mt-2">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="act_freight">دیہاڑی:<span
                                            class="text-danger">*</span></label>
                                    <input type="number" onkeyup="calAmount()" step="any" min="0" value="0"
                                           id="dehari"
                                           name="dehari"
                                           class="form-control change_focus" data-id="dehari">
                                    <span class="text-danger error" id="dehari_error"></span>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <label for="labor">  مزدوری:<span
                                        class="text-danger">*</span></label>
                                <input type="number" onkeyup="calAmount()" step="any" min="0" value="0" id="labor"
                                       name="labor"
                                       class="form-control change_focus" data-id="">
                                <span class="text-danger error" id="labor_error"></span>
                            </div>


                            <div class="col-md-3">
                                <label for="excise_expenditure">ایکسائز خرچہ:<span
                                        class="text-danger">*</span></label>
                                <input type="number"  step="any" onkeyup="calAmount()" min="0" value="0" id="excise_expenditure"
                                       name="excise_expenditure"
                                       class="form-control change_focus" data-id="">
                                <span class="text-danger error" id="excise_expenditure_error"></span>
                            </div>

                            <div class="col-md-3">
                                <label for="final_amount">ٹوٹل رقم:<span class="text-danger">*</span></label>
                                <input
                                    type="number"
                                    readonly
                                    step="any"
                                    min="0"
                                    value="0"
                                    id="final_amount"
                                    name="final_amount"
                                    class="form-control change_focus"
                                    data-id="final_amount">
                                <span class="text-danger error" id="final_amount_error"></span>
                            </div>


                        </div>
                        <div class="row mt-2">
                            <div class="col-md-3">
                                @csrf
                                <input type="hidden" name="status" id="status" value="pending">
                                <input type="hidden" name="trip_id" id="details_trip_id" value="{{ $trip->id }}">
                                <button type="submit" class="btn btn-success" name="tripDetailsSubmit"
                                        id="trip_detail_sumbit_btn">
                                    مخفوظ
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="col-md-12" id="">
            <div class="panel panel-card">
                <div class="panel-body" id="history_div">

                </div>
            </div>
        </div>
    @endif

    <div class="col-md-12">
        <div class="panel panel-card">
            <div class="panel-body">
                <div class="row">
                    <div class="col-md-3">
                        <a href="{{ route('trip_detail_report', $trip->id) }}" target="_blank" class="btn btn-link">Report</a>
                    </div>
                    <div class="col-md-4"><h3 class="text-center">Details of Trip # {{ $trip->id }}</h3></div>
                </div>
                <table class="table table-bordered" id="trip_detail_table">
                    <thead>
                    <tr class="bg-gold text-white">
                        <th>سے</th>
                        <th>کو</th>
                        <th>نام</th>
                        <th>مال کا نام</th>
                        <th>شے کا وزن</th>
                        <th>یونٹ ریٹ</th>
                        <th>کرایہ</th>
                        <th>کمیشن</th>
                        <th>اصل کرایہ</th>
                        <th>ڈیہاڑی</th>
                        <th>جرمانہ</th>
                        <th>ٹوٹل رقم</th>
                        <th>ایکشن</th>
                    </tr>
                    </thead>
                    <tbody id="trip_detail_modal_table">
                    @forelse($details as $detail)
                        <tr class="">
                            <td>{{$detail->from_city->name}}</td>
                            <td>{{ $detail->to_city->name }}</td>
                            <td>{{$detail->broker->name}}</td>
                            <td>{{ $detail->item_name }}</td>
                            <td>{{$detail->item_weight}}  {{ $detail->weight_type }}</td>
                            <td>{{ number_format($detail->unit_rate,0) }}</td>
                            <td>{{number_format($detail->bill_freight,0)}}</td>
                            <td>{{number_format($detail->commission,0)}}</td>
                            <td>{{number_format($detail->final_total_amount,0) }}</td>
                            <td>{{ $detail->dehari }}</td>
                            <td>{{ $detail->fine }}</td>
                            <td>{{ $detail->final_total_amount }}</td>
                            <td>
                                @if (auth()->user()->hasPermissionTo('edit trip details'))
                                    <button type="button" class="btn-link edit_trip_detail" data-id="{{$detail->id}}">
                                        <span> اپڈیٹ</span>
                                    </button>
                                @endif
                                @if (auth()->user()->hasPermissionTo('delete trip details'))
                                    <button type="button" class="btn-link delete_trip_detail"
                                            data-id="{{ $detail->id }}">
                                        <span class="text-danger">ڈیلیٹ</span></button>
                                @endif
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="13">No Record Available</td>
                        </tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>


<script>
     var allRowsVisible = false;

      $(document).ready(function () {
        $("#add_trip_details_form_abc").hide();
    // Show only the first two rows by default
    $(".toggle-row").each(function (index) {
        // resetForm();
        if (index >= 2) {
            $(this).hide();
        }
    });

    // Button 1: Show first two rows
    $("#btn1").on("click", function (e) {
        allRowsVisible = false;

        e.preventDefault();
        $("#add_trip_details_form_abc").show();
        resetForm();
        // alert('Showing first two rows');
        $(".toggle-row").each(function (index) {
            if (index < 2) {
                $(this).show();
            } else {
                $(this).hide();
            }
        });
    });

    // Button 2: Show all rows
    $("#btn2").on("click", function (e) {
        e.preventDefault();
        $("#add_trip_details_form_abc").show();
        resetForm();
        // alert('Showing all rows');
        $(".toggle-row").show();
        allRowsVisible = true;

    });
    function resetForm() {
    // Reset input and select values, but exclude hidden fields
    $("#add_trip_details_form_abc").find("input, select").each(function () {
        // Check if the input is hidden, if so, don't reset it
        if (!$(this).is(":hidden")) {
            $(this).val(''); // Clear the values
            if ($(this).prop('type') === 'radio' || $(this).prop('type') === 'checkbox') {
                $(this).prop('checked', false); // Reset radio and checkbox inputs
            }
        }
    });
}

});
</script>

