@if(($work_order->work_status != 'Completed' && $work_order->work_status != 'Closed' && $work_order->work_status != 'Hold') && in_array(user_id(),$work_order->technician_id?:[]) )
    <div class="pull-right" style="margin-bottom: 1em">
        {{-- <a class="btn btn-info btn-sm" href="{!! trans_url('admin/work_order/material/preview') !!}/{!! $work_order->getRouteKey() !!}" target="_blank"><i
                class="fa fa-eye" aria-hidden="true"></i>&nbsp;&nbsp;Preview</a> --}}
    @php
        $hasPending = Material::materialRequests($work_order->id)
    @endphp
    @if(user('admin.web')->hasPermission('work_order.material_request.approve'))
        <a class="btn btn-primary btn-sm" id="bulk-approve-btn" href='#' @if(!$hasPending || !user('admin.web')->hasPermission('work_order.material_request.approve')) disabled style="pointer-events:none;cursor:not-allowed;" @endif><i class="fa fa-check"></i> Approve All </a>
    @endif
    </div>
@endif
<table id="activity-activity-list-hvghv" class="table table-striped  data-table">
    <thead class="list_head">
        <tr>
            <th>Ref</th>
            <th>Workorder No.</th>
            <th>Date</th>
            <th>Store</th>
            <th>Material description</th>
            <th>Qty</th>
            <th>Status</th>
            @if(user('admin.web')->hasPermission('work_order.material_request.approve'))
            <th>Approve</th>
            @endif
            @if ($work_order->work_status != 'Completed' && user('admin.web')->technician)
                <th>Delete</th>
            @endif
        </tr>
    </thead>
    <tbody>
        @forelse($details as $key => $val)
            <tr id="{!! @$val->id !!}" data-row-id="{{ $val->id }}" class="{!! user('admin.web')->technician && @$val->status != 'Completed' && @$val->status == 'Requested'
                ? 'workrequest-edit'
                : '' !!}">
                <td>{!! @$val->refno !!}</td>
                <td>{!! @$val->work_order_id !!}</td>
                <td>{!! format_date(@$val->date != '0000-00-00' ? $val->date : $val->created_at) !!}</td>
                <td>{!! @$val->store->name !!}</td>
                <td>{!! @$val->material_description !!}</td>
                <td>{!! @$val->issued_quantity == 0 ? @$val->quantity : @$val->issued_quantity!!}</td>
                <td class="status-column">{!! @$val->status !!}</td>
                @if(user('admin.web')->hasPermission('work_order.material_request.approve'))
                <td><a class="btn btn-success btn-sm approve-btn" data-id="{{ @$val->id }}" data-workorder="{{ @$val->work_order_id }}"  @if(@$val->status == 'Approved' || @$val->status == 'Issued' || !user('admin.web')->hasPermission('work_order.material_request.approve')) disabled style="pointer-events:none;cursor:not-allowed;" @endif><i class="fa fa-check"></i></a></td>
                @endif
                @if ($work_order->work_status != 'Completed' && user('admin.web')->technician)

                    <td>
                        @if (!@$val->created_at->addDays(1)->lt(Carbon\Carbon::now()) && @$val->status == 'Pending')
                            <button type="button" class="btn btn-danger btn-sm del-btn" data-action="DELETE"
                                data-href='{{ trans_url('admin/work_order/adminmaterialrequestsdetails_del') }}/{{ @$work_order->getRouteKey() }}/{{ @$val->id }}'>
                                <i class="fa fa-times-circle"></i>
                            </button>
                        @else
                            <button type="button" disabled class=" disabled btn btn-danger btn-sm "
                                data-action="DELETE">
                                <i class="fa fa-times-circle"></i>
                            </button>
                        @endif
                    </td>
                @endif



            </tr>
        @empty
            <tr>
                <td colspan="9">No Requests</td>
            </tr>
        @endif

    </tbody>
</table>
<div class="modal fade" id="popup-workrequest-edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabels"
    aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">

        </div>
    </div>
</div>



<script>
    $(document).ready(function() {
        $(".workrequest-edit").click(function() {
            var id = $(this).attr("id");
            $("#popup-workrequest-edit .modal-content").load(
                "{{ trans_url('admin') }}/work_order/adminmaterialrequestsdetails_edit/{{ $work_order->getRouteKey() }}/" +
                id);
            $("#popup-workrequest-edit").modal("show");
        });
        $(".del-btn").click(function(e, data) {
            if (!data) {
                $(this).trigger('click', true)

                if (e.stopPropagation) e.stopPropagation();
                $("#popup-workrequest-edit").modal("hide");
                $('body').removeClass('modal-open');
                $('.modal-backdrop').remove();
            }

        })
        $('#bulk-approve-btn').click(function() {
            swal({
                title: 'Are you sure?',
                text: "Do you want to approve all requests?",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: 'Yes, approve',
                cancelButtonText: 'Cancel',
                closeOnConfirm: true
            },function(isConfirm) {
                if (isConfirm) {
                    // alert();
                    $.ajax({
                        url: "{{ trans_url('admin') }}/work_order/approveall_requests/{{ $work_order->getRouteKey() }}",
                        type: 'GET',
                        success: function(data) {
                            console.log(data);
                            // $("#btnns").load(
                            //     '{{ trans_url('/admin/work_order/adminmaterialrequestsdetails/table') }}' +
                            //     '/' + '{{ $work_order->getRouteKey() }}');
                            if (data.updated_ids && data.updated_ids.length > 0) {
                                data.updated_ids.forEach(function(id) {
                                    // Update the 'Status' column of the row
                                    let row = $('tr[data-row-id="' + id + '"]');
                                    row.find('td.status-column').text('Approved');
                                });
                            }
                            $('#btn_adds').removeAttr("disabled");
                            $('#bulk-approve-btn').attr('disabled',true).css({'pointer-events': 'none','cursor': 'not-allowed',   'opacity': '0.6'});
                            $('.approve-btn').attr('disabled',true).css({'pointer-events': 'none','cursor': 'not-allowed',   'opacity': '0.6'});
                        },
                        error: function(jqXHR, textStatus, errorThrown) {
                            console.log("error");
                        }
                    });
                }
            });
        });

        $('.approve-btn').on('click',function(e)
        {
            e.preventDefault();

            if ($(this).hasClass('disabled-link')) return;

            let button = $(this);
            let id = button.data('id');
            let work_order_id = button.data('workorder');
            $.ajax({
                url: "{{ trans_url('admin') }}/work_order/approve_individual_request/" + id + "/" + work_order_id,
                type: 'GET',
                data: {
                    _token: $('meta[name="csrf-token"]').attr('content'),
                },
                success: function (response) {
                    if (response.updated_id) {
                        let row = $('tr[data-row-id="' + response.updated_id + '"]');
                        row.find('td.status-column').text('Approved');
                        row.find('.approve-btn').attr('disabled', true).css({'pointer-events': 'none','cursor': 'not-allowed','opacity': '0.6'});
                    }
                    if(!response.has_pending)
                    {
                        $('#bulk-approve-btn').attr('disabled',true).css({'pointer-events': 'none','cursor': 'not-allowed','opacity': '0.6'});
                    }
                },
                error: function (xhr) {
                    
                }
            });
        });

    })
</script>