@extends('layouts.admin-simple')

@section('title', 'Material Request - ' . $igRequest->request_number)

@section('breadcrumb')
    <li class="breadcrumb-item">Warehouse</li>
    <li class="breadcrumb-item">Indirect Goods</li>
    <li class="breadcrumb-item"><a href="{{ route('warehouse.indirect-goods.requests.index') }}">Material Requests</a></li>
    <li class="breadcrumb-item active">{{ $igRequest->request_number }}</li>
@endsection

@section('page-title')
    <div class="d-flex justify-content-between align-items-center w-100">
        <div class="page-title-left">
            <h3 class="mb-1">Material Request Details</h3>
            <p class="text-muted mb-0" style="font-size: 13px;">{{ $igRequest->request_number }}</p>
        </div>
        <div class="page-actions-right d-flex align-items-center">
            @if(in_array($igRequest->status, ['issued', 'partially_issued']))
                <a href="{{ route('warehouse.indirect-goods.requests.print', $igRequest->id) }}" target="_blank" class="btn btn-sm btn-outline-primary mr-2">
                    <i class="material-icons mr-1" style="font-size: 16px;">print</i>
                    Print
                </a>
            @endif

            @if($igRequest->status === 'pending_approval')
                <form method="POST" action="{{ route('warehouse.indirect-goods.requests.approve', $igRequest->id) }}" style="display: inline;" onsubmit="return confirm('Approve request {{ $igRequest->request_number }}?')">
                    @csrf
                    <button type="submit" class="btn btn-sm btn-success mr-2">
                        <i class="material-icons mr-1" style="font-size: 16px;">check</i>
                        Approve
                    </button>
                </form>
                <button type="button" class="btn btn-sm btn-danger mr-2" data-toggle="modal" data-target="#rejectModal">
                    <i class="material-icons mr-1" style="font-size: 16px;">close</i>
                    Reject
                </button>
            @endif

            @if($igRequest->status === 'approved')
                <form method="POST" action="{{ route('warehouse.indirect-goods.requests.issue', $igRequest->id) }}" style="display: inline;" onsubmit="return confirm('Issue materials for request {{ $igRequest->request_number }}? This will deduct from warehouse inventory.')">
                    @csrf
                    <button type="submit" class="btn btn-sm btn-info mr-2">
                        <i class="material-icons mr-1" style="font-size: 16px;">local_shipping</i>
                        Issue Materials
                    </button>
                </form>
            @endif

            <a href="{{ route('warehouse.indirect-goods.requests.index') }}" class="btn btn-sm btn-secondary">
                <i class="material-icons mr-1" style="font-size: 16px;">arrow_back</i>
                Back to List
            </a>
        </div>
    </div>
@endsection

@section('content')
    <!-- Status Alert -->
    @if($igRequest->status === 'pending_approval')
        <div class="alert alert-warning">
            <i class="material-icons align-middle mr-2">pending</i>
            <strong>Pending Approval:</strong> This request is waiting for manager approval before materials can be issued.
        </div>
    @elseif($igRequest->status === 'approved')
        <div class="alert alert-info">
            <i class="material-icons align-middle mr-2">check_circle</i>
            <strong>Approved:</strong> This request has been approved. Materials are ready to be issued.
        </div>
    @elseif($igRequest->status === 'issued')
        <div class="alert alert-success">
            <i class="material-icons align-middle mr-2">local_shipping</i>
            <strong>Issued:</strong> All requested materials have been issued and inventory has been updated.
        </div>
    @elseif($igRequest->status === 'partially_issued')
        <div class="alert alert-primary">
            <i class="material-icons align-middle mr-2">warning</i>
            <strong>Partially Issued:</strong> Some items could not be fully issued due to insufficient stock.
        </div>
    @elseif($igRequest->status === 'rejected')
        <div class="alert alert-danger">
            <i class="material-icons align-middle mr-2">cancel</i>
            <strong>Rejected:</strong> This request has been rejected.
            @if($igRequest->rejection_reason)
                <br><strong>Reason:</strong> {{ $igRequest->rejection_reason }}
            @endif
        </div>
    @elseif($igRequest->status === 'cancelled')
        <div class="alert alert-dark">
            <i class="material-icons align-middle mr-2">block</i>
            <strong>Cancelled:</strong> This request has been cancelled.
        </div>
    @endif

    <div class="row">
        <!-- Request Details -->
        <div class="col-lg-8">
            <div class="card shadow mb-4">
                <div class="card-header">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="material-icons align-middle mr-1">info</i>
                        Request Information
                    </h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <p><strong>Request Number:</strong><br>
                                <span class="text-primary font-weight-bold">{{ $igRequest->request_number }}</span>
                            </p>
                            <p><strong>Request Date:</strong><br>
                                {{ $igRequest->request_date ? $igRequest->request_date->format('M d, Y') : '-' }}
                            </p>
                            <p><strong>Status:</strong><br>
                                @switch($igRequest->status)
                                    @case('draft')
                                        <span class="badge badge-secondary badge-lg">Draft</span>
                                        @break
                                    @case('pending_approval')
                                        <span class="badge badge-warning badge-lg">Pending Approval</span>
                                        @break
                                    @case('approved')
                                        <span class="badge badge-info badge-lg">Approved</span>
                                        @break
                                    @case('rejected')
                                        <span class="badge badge-danger badge-lg">Rejected</span>
                                        @break
                                    @case('issued')
                                        <span class="badge badge-success badge-lg">Issued</span>
                                        @break
                                    @case('partially_issued')
                                        <span class="badge badge-primary badge-lg">Partially Issued</span>
                                        @break
                                    @case('cancelled')
                                        <span class="badge badge-dark badge-lg">Cancelled</span>
                                        @break
                                @endswitch
                            </p>
                            <p><strong>Requires Approval:</strong><br>
                                @if($igRequest->requires_approval)
                                    <span class="badge badge-warning">Yes</span>
                                @else
                                    <span class="badge badge-success">No (Auto-approved)</span>
                                @endif
                            </p>
                        </div>
                        <div class="col-md-6">
                            <p><strong>Project:</strong><br>
                                @if($igRequest->project)
                                    {{ $igRequest->project->project_number }} - {{ $igRequest->project->project_name }}
                                @else
                                    <span class="text-muted">N/A</span>
                                @endif
                            </p>
                            <p><strong>Division:</strong><br>
                                @if($igRequest->division)
                                    {{ $igRequest->division->division_name }}
                                @else
                                    <span class="text-muted">N/A</span>
                                @endif
                            </p>
                            <p><strong>Requested By:</strong><br>
                                @if($igRequest->requester)
                                    {{ $igRequest->requester->name }}
                                @else
                                    <span class="text-muted">N/A</span>
                                @endif
                            </p>
                            <p><strong>Receiver:</strong><br>
                                {{ $igRequest->receiver_name ?: '-' }}
                            </p>
                        </div>
                    </div>

                    @if($igRequest->notes)
                        <hr>
                        <p><strong>Notes:</strong><br>{{ $igRequest->notes }}</p>
                    @endif

                    @if($igRequest->request_file)
                        <hr>
                        <p><strong>Request File:</strong><br>
                            @php
                                $requestFileUrl = \Illuminate\Support\Str::startsWith($igRequest->request_file, 'uploads/')
                                    ? asset($igRequest->request_file)
                                    : asset('storage/' . $igRequest->request_file);
                            @endphp
                            <a href="{{ $requestFileUrl }}" target="_blank" class="btn btn-sm btn-outline-primary">
                                <i class="material-icons mr-1" style="font-size: 16px;">attachment</i>
                                View / Download File
                            </a>
                        </p>
                    @endif
                </div>
            </div>

            <!-- Items Table -->
            <div class="card shadow">
                <div class="card-header">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="material-icons align-middle mr-1">shopping_cart</i>
                        Requested Items ({{ $igRequest->items->count() }})
                    </h6>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-bordered table-hover">
                            <thead class="thead-light">
                                <tr>
                                    <th width="5%">#</th>
                                    <th width="12%">Code</th>
                                    <th width="23%">Description</th>
                                    <th width="10%">Qty Requested</th>
                                    <th width="10%">Qty Released</th>
                                    <th width="10%">Qty Balance</th>
                                    <th width="10%">Unit Price</th>
                                    <th width="10%">Total</th>
                                    <th width="10%">Notes</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($igRequest->items as $index => $item)
                                    <tr>
                                        <td class="text-center">{{ $index + 1 }}</td>
                                        <td>
                                            @if($item->indirectGood)
                                                <strong class="text-primary">{{ $item->indirectGood->ig_code }}</strong>
                                            @else
                                                <span class="text-muted">N/A</span>
                                            @endif
                                        </td>
                                        <td>
                                            @if($item->indirectGood)
                                                {{ $item->indirectGood->ig_description }}
                                                @if($item->indirectGood->unit_of_measure)
                                                    <br><span class="badge badge-secondary">{{ $item->indirectGood->unit_of_measure }}</span>
                                                @endif
                                            @else
                                                <span class="text-muted">Unknown</span>
                                            @endif
                                        </td>
                                        <td class="text-right">{{ number_format($item->quantity_requested, 2) }}</td>
                                        <td class="text-right">
                                            @if($item->quantity_released > 0)
                                                <span class="text-success font-weight-bold">{{ number_format($item->quantity_released, 2) }}</span>
                                            @else
                                                <span class="text-muted">-</span>
                                            @endif
                                        </td>
                                        <td class="text-right">
                                            @if($item->quantity_balance > 0)
                                                <span class="text-warning font-weight-bold">{{ number_format($item->quantity_balance, 2) }}</span>
                                            @else
                                                <span class="text-success">0.00</span>
                                            @endif
                                        </td>
                                        <td class="text-right">
                                            @if($item->unit_price > 0)
                                                AED {{ number_format($item->unit_price, 2) }}
                                            @else
                                                <span class="text-muted">-</span>
                                            @endif
                                        </td>
                                        <td class="text-right">
                                            @if($item->total_price > 0)
                                                <strong>AED {{ number_format($item->total_price, 2) }}</strong>
                                            @else
                                                <span class="text-muted">-</span>
                                            @endif
                                        </td>
                                        <td>{{ $item->notes ?: '-' }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="9" class="text-center text-muted py-4">
                                            <i class="material-icons mb-2" style="font-size: 48px; opacity: 0.3;">shopping_cart</i>
                                            <div>No items in this request</div>
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                            @if($igRequest->items->count() > 0 && $igRequest->items->sum('total_price') > 0)
                                <tfoot>
                                    <tr class="table-active">
                                        <th colspan="7" class="text-right">Total Amount:</th>
                                        <th class="text-right">AED {{ number_format($igRequest->items->sum('total_price'), 2) }}</th>
                                        <th></th>
                                    </tr>
                                </tfoot>
                            @endif
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <!-- Sidebar -->
        <div class="col-lg-4">
            <!-- Quick Actions -->
            <div class="card shadow mb-4">
                <div class="card-header">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="material-icons align-middle mr-1">flash_on</i>
                        Quick Actions
                    </h6>
                </div>
                <div class="card-body">
                    @if($igRequest->status === 'pending_approval')
                        <form method="POST" action="{{ route('warehouse.indirect-goods.requests.approve', $igRequest->id) }}" onsubmit="return confirm('Approve this request?')">
                            @csrf
                            <button type="submit" class="btn btn-success btn-block mb-2">
                                <i class="material-icons mr-1">check</i>
                                Approve Request
                            </button>
                        </form>
                        <button type="button" class="btn btn-danger btn-block mb-2" data-toggle="modal" data-target="#rejectModal">
                            <i class="material-icons mr-1">close</i>
                            Reject Request
                        </button>
                    @endif

                    @if($igRequest->status === 'approved')
                        <form method="POST" action="{{ route('warehouse.indirect-goods.requests.issue', $igRequest->id) }}" onsubmit="return confirm('Issue materials? This will update inventory.')">
                            @csrf
                            <button type="submit" class="btn btn-info btn-block mb-2">
                                <i class="material-icons mr-1">local_shipping</i>
                                Issue Materials
                            </button>
                        </form>
                    @endif

                    <a href="{{ route('warehouse.indirect-goods.requests.print', $igRequest->id) }}" target="_blank" class="btn btn-outline-primary btn-block mb-2">
                        <i class="material-icons mr-1">print</i>
                        Print Request
                    </a>

                    <a href="{{ route('warehouse.indirect-goods.requests.index') }}" class="btn btn-outline-secondary btn-block">
                        <i class="material-icons mr-1">list</i>
                        All Requests
                    </a>
                </div>
            </div>

            <!-- Timeline -->
            <div class="card shadow">
                <div class="card-header">
                    <h6 class="m-0 font-weight-bold text-primary">
                        <i class="material-icons align-middle mr-1">timeline</i>
                        Request Timeline
                    </h6>
                </div>
                <div class="card-body">
                    <div class="timeline">
                        <!-- Created -->
                        <div class="timeline-item">
                            <div class="timeline-marker bg-primary"></div>
                            <div class="timeline-content">
                                <h6 class="timeline-title">Request Created</h6>
                                <p class="timeline-text">
                                    {{ $igRequest->created_at->format('M d, Y \a\t h:i A') }}
                                    @if($igRequest->requester)
                                        <br><small class="text-muted">by {{ $igRequest->requester->name }}</small>
                                    @endif
                                </p>
                            </div>
                        </div>

                        <!-- Approved -->
                        @if($igRequest->approved_at)
                        <div class="timeline-item">
                            <div class="timeline-marker {{ $igRequest->status === 'rejected' ? 'bg-danger' : 'bg-success' }}"></div>
                            <div class="timeline-content">
                                <h6 class="timeline-title">
                                    {{ $igRequest->status === 'rejected' ? 'Request Rejected' : 'Request Approved' }}
                                </h6>
                                <p class="timeline-text">
                                    {{ $igRequest->approved_at->format('M d, Y \a\t h:i A') }}
                                    @if($igRequest->approvedBy)
                                        <br><small class="text-muted">by {{ $igRequest->approvedBy->name }}</small>
                                    @endif
                                </p>
                            </div>
                        </div>
                        @endif

                        <!-- Issued -->
                        @if($igRequest->issued_at)
                        <div class="timeline-item">
                            <div class="timeline-marker bg-info"></div>
                            <div class="timeline-content">
                                <h6 class="timeline-title">Materials Issued</h6>
                                <p class="timeline-text">
                                    {{ $igRequest->issued_at->format('M d, Y \a\t h:i A') }}
                                    @if($igRequest->issuedBy)
                                        <br><small class="text-muted">by {{ $igRequest->issuedBy->name }}</small>
                                    @endif
                                    @if($igRequest->status === 'partially_issued')
                                        <br><span class="badge badge-warning">Partial Issue</span>
                                    @endif
                                </p>
                            </div>
                        </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Reject Modal -->
    @if($igRequest->status === 'pending_approval')
    <div class="modal fade" id="rejectModal" tabindex="-1" role="dialog" aria-labelledby="rejectModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header bg-danger text-white">
                    <h5 class="modal-title" id="rejectModalLabel">
                        <i class="material-icons align-middle mr-1">cancel</i>
                        Reject Request
                    </h5>
                    <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form method="POST" action="{{ route('warehouse.indirect-goods.requests.reject', $igRequest->id) }}">
                    @csrf
                    <div class="modal-body">
                        <p>You are rejecting request <strong>{{ $igRequest->request_number }}</strong>.</p>
                        <div class="form-group">
                            <label for="rejection_reason" class="font-weight-bold">Rejection Reason <span class="text-danger">*</span></label>
                            <textarea name="rejection_reason" id="rejection_reason" class="form-control" rows="4" required placeholder="Please provide a reason for rejection..."></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                        <button type="submit" class="btn btn-danger">
                            <i class="material-icons mr-1" style="font-size: 16px;">close</i>
                            Reject Request
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    @endif
@endsection

@push('styles')
<style>
    .timeline {
        position: relative;
        padding-left: 30px;
    }
    .timeline:before {
        content: '';
        position: absolute;
        left: 8px;
        top: 0;
        bottom: 0;
        width: 2px;
        background: #e3e6f0;
    }
    .timeline-item {
        position: relative;
        margin-bottom: 20px;
    }
    .timeline-marker {
        position: absolute;
        left: -22px;
        top: 5px;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: 2px solid #fff;
    }
    .timeline-title {
        font-size: 14px;
        font-weight: 600;
        color: #5a5c69;
        margin-bottom: 5px;
    }
    .timeline-text {
        font-size: 13px;
        color: #858796;
        margin-bottom: 0;
    }
    .badge-lg {
        font-size: 0.9em;
        padding: 6px 12px;
    }
</style>
@endpush