@extends('admin.layouts.layouts')

@section('title', 'View Pick Up')

@section('content')
    <div class="page-header">
        <h3 class="page-title">
            Pick Up View
        </h3>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Dashboard</a></li>
                <li class="breadcrumb-item"><a href="{{ route('pick-up.index') }}">Pick Up</a></li>
                <li class="breadcrumb-item active" aria-current="page">View</li>
            </ol>
        </nav>
    </div>
    <div class="container py-4">
        <div class="card shadow-sm rounded border-0">
            <div class="card-body bg-white">
                <div class="row">
                    <div class="col-md-6">
                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Pick Up Code:</strong></div>
                            <div class="col-md-7">{{ $showDetails->pick_up_code ?? '' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Farmer Name:</strong></div>
                            <div class="col-md-7">{{ $showDetails->farmer->farmer_name ?? '-' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Farm Name:</strong></div>
                            <div class="col-md-7">{{ $showDetails->farm->farm_name ?? '-' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Product Name:</strong></div>
                            <div class="col-md-7">{{ $showDetails->product->name ?? '-' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Location:</strong></div>
                            <div class="col-md-7">{{ ($showDetails->farm->address ?? '') . ', ' . ($showDetails->farm->address_2 ?? '') . ', ' . ($showDetails->farm->pincode ?? '') }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>No Of Bags:</strong></div>
                            <div class="col-md-7">{{ $showDetails->no_of_bags ?? '-' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Weight:</strong></div>
                            <div class="col-md-7 pickup-weight">{{ $showDetails->weight ?? '' }}</div>
                        </div>

                         <div class="row mb-2">
                            <div class="col-md-5"><strong>Actual Bags:</strong></div>
                            <div class="col-md-7 pickup-bags">{{ $showDetails->actual_bags ?? '' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Actual Weight:</strong></div>
                            <div class="col-md-7 pickup-weight">{{ $showDetails->actual_weight ?? '' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Attachment:</strong></div>
                            <div class="col-md-7 pickup-attachment">
                                @if (isset($showDetails->attachment) && file_exists(public_path('storage/' . $showDetails->attachment)))
                                <a class="gallery-img" id="showAttachment" src="{{ asset('storage/' . $showDetails->attachment) }}" style="cursor: pointer;">
                                    <i class="fas fa-eye"></i>
                                </a>
                                @else
                                    <span class="text-muted">Not uploaded</span>
                                @endif
                            </div>
                        </div>
                    </div>

                    <div class="col-md-6">
                        <div class="row mb-2">
                            <div class="col-md-5"><b>Status:</b></div>
                            <div class="col-md-7">
                                @php
                                    switch ($showDetails->status) {
                                        case "0":
                                        $buttonClass = "danger";
                                        $buttonText = "Pending";
                                        break;
                                    case "1":
                                        $buttonClass = "warning";
                                        $buttonText = "Alloted";
                                        break;
                                    case "2":
                                        $buttonClass = "info";
                                        $buttonText = "Load";
                                        break;
                                    case "3":
                                        $buttonClass = "success";
                                        $buttonText = "Unload";
                                        break;
                                    default:
                                        $buttonClass = "secondary"; // A neutral default for unknown statuses
                                        $buttonText = "Unknown Status";
                                        break;
                                    }
                                @endphp
                                <div class="btn-group">
                                    <button type="button" class="btn btn-{{ $buttonClass }}">{{ $buttonText }}</button>
                                    <button type="button" class="btn btn-{{ $buttonClass }} dropdown-toggle dropdown-toggle-split" id="dropdownMenuSplitButton5" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                        <span class="sr-only">Toggle Dropdown</span>
                                    </button>
                                    <div class="dropdown-menu" aria-labelledby="dropdownMenuSplitButton5">
                                        <h5 class="dropdown-header">Select Status</h5>
                                        <a class="dropdown-item set-status" href="#" data-id="{{ $showDetails->id }}" data-show="show" data-status="0">Pending</a>
                                        <a class="dropdown-item set-status" href="#" data-id="{{ $showDetails->id }}" data-show="show" data-status="1">Alloted</a>
                                        <a class="dropdown-item set-status" href="#" data-id="{{ $showDetails->id }}" data-show="show" data-status="2">Load</a>
                                        <a class="dropdown-item set-status unloadStatus" href="#" data-id="{{ $showDetails->id }}" data-bags="{{ $showDetails->actual_bags }}" data-weight="{{ $showDetails->actual_weight }}" data-attachment="{{ $showDetails->attachment }}" data-show="show" data-status="3">Unload</a>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Transporter:</strong></div>
                            <div class="col-md-7">{{ $showDetails->transporter->transporter_name ?? '' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Cold Storage:</strong></div>
                            <div class="col-md-7">{{ $showDetails->coldStorage->storage_name ?? '' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Created At:</strong></div>
                            <div class="col-md-7">{{ $showDetails->created_at->format('d-m-Y h:i A') ?? '' }}</div>
                        </div>

                        <div class="row mb-2">
                            <div class="col-md-5"><strong>Created By:</strong></div>
                            <div class="col-md-7">{{ $showDetails->creator->name ?? '' }}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container py-4">
        <div class="card shadow-sm rounded border-0">
            <div class="card-header bg-light d-flex justify-content-between align-items-center">
                <h5 class="mb-0 fw-bold">Pick Up History</h5>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-12">
                        <div class="table-responsive">
                            <table id="pick-up-history-table" class="table w-100">
                                <thead>
                                    <tr>
                                        <th>No</th>
                                        <th>Status</th>
                                        <th>Status Date</th>
                                        <th>Updated Date</th>
                                        <th>Updated By</th>
                                        {{-- <th>Actions</th> --}}
                                    </tr>
                                </thead>
                                <tbody></tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Unified Modal for Assign --}}
    <div class="modal fade" id="weightUpdateModal" tabindex="-1" role="dialog" aria-labelledby="weightUpdateModalLabel" aria-hidden="true"
        data-backdrop="static" data-keyboard="false">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="weightUpdateModalLabel">Unload Pick Up</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form method="POST" id="weightUpdateForm" action="javascript:void(0)" encrtype="multipart/form-data">
                    @csrf
                    <input type="hidden" name="id" id="pickUpID" value="{{ $showDetails->id }}">
                    <div class="modal-body">
                        <div class="form-group">
                            <label for="actual_bags" class="form-label">Actual Bags <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" name="actual_bags"
                                id="actualBagsInput" placeholder="Enter Actual Bags"
                                value="{{ $editDetails->actual_bags ?? '' }}" data-parsley-required
                                data-parsley-required-message="Please enter actual bags"
                                data-parsley-trigger='keyup' data-parsley-errors-container='#actual_bags_error'>
                            <div class="invalid-feedback" id="actual_bags_error"></div>
                        </div>
                        <div class="form-group">
                            <label for="name" class="form-label">Actual Weight <span class="text-danger">*</span></label>
                            <input type="text" class="form-control weight" name="actual_weight"
                                id="actualWeightInput" placeholder="Enter Actual Weight"
                                value="{{ $editDetails->actual_weight ?? '' }}" data-parsley-required
                                data-parsley-required-message="Please enter actual weight"
                                data-parsley-trigger='keyup' data-parsley-errors-container='#actual_weight_error'>
                            <div class="invalid-feedback" id="actual_weight_error"></div>
                        </div>

                        <div class="form-group">
                            <label for="attachment" class="form-label">Attachment</label>
                            <div class="input-group">
                                <input type="file" name="attachment" id="attachmentInput" class="form-control"
                                    data-parsley-trigger="keyup"
                                    data-parsley-filetype="png,jpg,jpeg"
                                    data-parsley-filetype-message="Only .png, .jpg and .jpeg files are allowed." data-parsley-errors-container='#attachment_error'>

                                <div class="input-group-append image-preview-wrapper @if(!empty($editDetails->attachment)) d-none @endif">
                                    <img id="previewImage" src="{{ asset('assets/images/noimage/no-image.jpeg') }}"
                                        alt="Preview" width="65" height="65" class="crudEdit img-thumbnail me-3">
                                </div>
                            </div>
                            <span class="text-danger" id="attachment_error">{{ $errors->first('attachment') }}</span>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary" id="weightUpdateBtn">Save</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div id="imageModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="imageModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-md" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="imageModalLabel">Image Preview</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body text-center">
                    <img src="" id="modalImage" class="img-fluid" alt="Image Preview">
                </div>
            </div>
        </div>
    </div>
@endsection

@section('page-js')
    <script type="text/javascript">
        var pickUpId = "{{ $showDetails->id }}";
        var pickUpHistoryAjaxList = "{{ route('pick-up.pick-up-history-ajax') }}";
        var pickUpStatus = "{{ route('pick-up-status') }}";
        var pickUpWeightUpdate = "{{ route('pick-up-weight-update') }}";
    </script>
    <script src="{{ asset('assets/js/admin/pick-up.js') }}"></script>
@endsection