topnotch_website/resources/views/orders/show.blade.php

@extends('layouts.app')

@section('header')
    <div class="container-fluid bg-light pt-3">

        <!-- Customer company name row -->
        <div class="row justify-content-center pb-2">
            <div class="col-3"></div>
            <div class="col">
                {{--                <h2>Overview</h2>--}}
            </div>
        </div>

        <!-- Tabs row -->
        <div class="row justify-content-center mb-3">
            <div class="col-2 border-bottom"></div>
            <div class="col-8 p-0">

                <ul class="nav nav-fill nav-tabs" id="home-tabs" role="tablist">
                    <li class="nav-item" role="presentation">
                        <a class="nav-link link-dark {{$tab == 'details' ? 'active' : ''}}" id="details-tab"
                                href="{{route('orders.index', ['tab' => 'details'])}}" type="button" role="tab"
                                aria-controls="details" aria-selected="{{$tab == 'details' ? 'true' : 'false'}}">
                            <x-bi-list-ul/>
                            Order Details
                        </a>
                    </li>
                    <li class="nav-item" role="presentation">
                        <a class="nav-link link-dark {{$tab == 'packing-slips' ? 'active' : ''}}" id="packing-slips-tab"
                                href="{{route('orders.index', ['tab' => 'packing-slips'])}}" type="button" role="tab"
                                aria-controls="packing-slips"
                                aria-selected="{{$tab == 'packing-slips' ? 'true' : 'false'}}">
                            <x-bi-calendar-range/>
                            Packing Slips
                        </a>
                    </li>
                    <li class="nav-item" role="presentation">
                        <a class="nav-link link-dark {{$tab == 'timeline' ? 'active' : ''}}" id="timeline-tab"
                                href="{{route('orders.index', ['tab' => 'timeline'])}}" type="button" role="tab"
                                aria-controls="timeline" aria-selected="{{$tab == 'timeline' ? 'true' : 'false'}}">
                            <x-bi-calendar-range/>
                            Timeline
                        </a>
                    </li>
                    <li class="nav-item" role="presentation">
                        <a class="nav-link link-dark {{$tab == 'quote' ? 'active' : ''}}" id="quote-tab"
                                href="{{route('orders.index', ['tab' => 'quote'])}}" type="button" role="tab"
                                aria-controls="quote" aria-selected="{{$tab == 'quote' ? 'true' : 'false'}}">
                            <x-bi-calendar-range/>
                            Quote
                        </a>
                    </li>
                    <li class="nav-item" role="presentation">
                        <a class="nav-link link-dark {{$tab == 'invoice' ? 'active' : ''}}" id="invoice-tab"
                                href="{{route('orders.index', ['tab' => 'invoice'])}}" type="button" role="tab"
                                aria-controls="invoice" aria-selected="{{$tab == 'invoice' ? 'true' : 'false'}}">
                            <x-bi-calendar-range/>
                            Invoice
                        </a>
                    </li>

                </ul>
            </div>
            <div class="col border-bottom"></div>
        </div>
    </div>
@endsection

@section('content')
    <div class="container-fluid" style="max-width: 1800px">
        <div class="row justify-content-center my-3 pt-3 ">

            <div class="col-11 col-xl-4 border-end">

                <div class="row mb-3">
                    <div class="col">
                        <a href="{{route('orders.pdf', $order)}}" target="_blank" class="btn btn-primary">
                            <x-bi-printer-fill/>
                            Print Order
                        </a>
                    </div>
                    <div class="col"></div>
                    <div class="col"></div>
                </div>

                <div class="row ">
                    <label for="company_name" class="col-5 py-0 col-form-label text-md-end">Customer</label>
                    <div class="col-md-6">
                        <a class="fw-bold text-body text-decoration-none"
                                href="{{route('customers.show', [$order->customer, 'details'])}}">{{$order->customer->company_name}}</a>
                    </div>
                </div>

                <div class="row">
                    <label for="contact_name" class="col-5 py-0 col-form-label text-md-end">Contact</label>
                    <div class="col-md-6">
                        @if(isset($order->contact))
                            <input type="text" name="contact_name" id="" class="py-0 form-control-plaintext" readonly
                                    value="{{$order->contact->full_name}}">
                        @else
                            <input type="text" name="contact_name" id=""
                                    class="py-0 form-control-plaintext text-secondary"
                                    readonly value="No contact set">
                        @endif
                    </div>
                </div>

                <hr class="border-secondary-subtle px-0">

                <div class="row">
                    <label for="order_type" class="col-5 py-0 col-form-label text-md-end">Order Type</label>
                    <div class="col-md-6">
                        <input type="text" name="order_type" id="" class="py-0 form-control-plaintext" readonly
                                value="{{$order->order_type}}">
                    </div>
                </div>

                <div class="row">
                    <label for="order_status" class="col-5 py-0 col-form-label text-md-end">Order Status</label>
                    <div class="col-md-6">
                        <input type="text" name="order_status" id="" class="py-0 form-control-plaintext" readonly
                                value="{{$order->status}}">
                    </div>
                </div>

                <hr class="border-secondary-subtle px-0">

                <div class="row ">
                    <label for="internal_po" class="col-5 py-0 col-form-label text-md-end">Internal PO</label>
                    <div class="col-md-6">
                        <code class="fw-bold">{{$order->internal_po}}</code>
                    </div>
                </div>

                <div class="row py-0 ">
                    <label for="customer_po" class="col-5 py-0 col-form-label text-md-end">Customer PO</label>
                    <div class="col-md-6">
                        <code class="text-primary">{{$order->customer_po}}</code>
                    </div>
                </div>

                <hr class="border-secondary-subtle px-0">

                <div class="row mb-2">
                    <label class="col-5 py-0 col-form-label text-md-end">Attributes</label>
                    <div class="col">
                        @if($order->new_art)
                            <div class="form-check">
                                <x-bi-check/>
                                <label class="form-check-label" for="new_art">New art</label>
                            </div>
                        @endif
                        @if($order->rush)
                            <div class="form-check ">
                                <x-bi-check/>
                                <label class="form-check-label" for="new_art">Rush</label>
                            </div>
                        @endif
                        @if($order->digitizing)
                            <div class="form-check ">
                                <x-bi-check/>
                                <label class="form-check-label" for="digitizing">Digitizing</label>
                            </div>
                        @endif

                        @if($order->customer_supplied_file)
                            <div class="form-check ">
                                <x-bi-check/>
                                <label class="form-check-label" for="customer_supplied_file">
                                    Customer Supplied File
                                </label>
                            </div>
                        @endif

                        @if($order->repeat)
                            <div class="form-check ">
                                <x-bi-check/>
                                <label class="form-check-label" for="repeat">Repeat</label>
                            </div>
                        @endif

                        @if($order->event)
                            <div class="form-check ">
                                <x-bi-check/>
                                <label class="form-check-label" for="event">Event</label>
                            </div>
                        @endif
                        @if($order->purchased_garments)
                            <div class="form-check ">
                                <x-bi-check/>
                                <label class="form-check-label" for="purchased_garments">Purchased Garments</label>
                            </div>
                        @endif
                    </div>
                </div>

                <hr class="border-secondary-subtle px-0">

                <div class="row py-0 ">
                    <label for="order_date" class="col-5 py-0 col-form-label text-md-end">Order Date</label>
                    <div class="col-md-6">
                        <input type="text" name="order_date" id="" class="py-0 form-control-plaintext"
                                readonly value="{{$order->order_date}}">
                    </div>
                </div>


                <div class="row py-0 ">
                    <label for="due_date" class="col-5 py-0 col-form-label text-md-end">Due Date</label>
                    <div class="col-md-6">
                        <input type="text" name="due_date" id="" class="py-0 form-control-plaintext"
                                readonly value="{{$order->due_date}}">
                    </div>
                </div>


                <hr class="border-secondary-subtle px-0">

                <div class="row mb-3">
                    <label for="notes" class="col-5 py-0 col-form-label text-md-end">Notes</label>

                    <div class="col-6">
                        {{$order->notes}}
                    </div>
                </div>

            </div>

            <div class="col-xl-7">
                <table class="table table-striped table-hover table-sm mb-1 ms-0">
                    <thead>
                    <tr>
                        <th scope="col">#</th>
                        <th scope="col">SKU</th>
                        <th scope="col">Product Name</th>
                        <th scope="col">Color</th>
                        <th scope="col">XS</th>
                        <th scope="col">S</th>
                        <th scope="col">M</th>
                        <th scope="col">L</th>
                        <th scope="col">XL</th>
                        <th scope="col">2XL</th>
                        <th scope="col">3XL</th>
                        <th scope="col">OSFA</th>
                        <th scope="col">Total</th>
                        <th scope="col"></th>
                    </tr>
                    </thead>
                    <tbody>

                    @foreach($order->orderProducts as $key => $product)
                        <input type="hidden" name="productInputCount[]" value="1">

                        <th scope="row" class="align-middle">{{$loop->index+1}}</th>
                        <td class="col-1">
                            <!-- SKU -->
                            {{$product->sku}}
                        </td>
                        <td class="col-3">
                            <!-- product_name -->
                            {{$product->product_name}}
                        </td>
                        <td class="col-1">
                            <!-- product_color -->
                            {{$product->color}}
                        </td>
                        <td class="" style="width: 55px">
                            <!-- size_xs -->
                            {{$product->productSizes()->get()->where('size', 'xs')->first()->amount ?? ''}}
                        </td>
                        <td class="" style="width: 55px">
                            <!-- size_s -->
                            {{$product->productSizes()->get()->where('size', 's')->first()->amount ?? ''}}
                        </td>
                        <td class="" style="width: 55px">
                            <!-- size_m -->
                            {{$product->productSizes()->get()->where('size', 'm')->first()->amount ?? ''}}
                        </td>
                        <td class="" style="width: 55px">
                            <!-- size_l -->
                            {{$product->productSizes()->get()->where('size', 'l')->first()->amount ?? ''}}

                        </td>
                        <td class="" style="width: 55px">
                            <!-- size_xl -->
                            {{$product->productSizes()->get()->where('size', 'xl')->first()->amount ?? ''}}
                        </td>
                        <td class="" style="width: 55px">
                            <!-- size_2xl -->
                            {{$product->productSizes()->get()->where('size', '2xl')->first()->amount ?? ''}}
                        </td>
                        <td class="" style="width: 55px">
                            <!-- size_3xl -->
                            {{$product->productSizes()->get()->where('size', '3xl')->first()->amount ?? ''}}
                        </td>
                        <td style="width: 55px">
                            <!-- size_osfa -->
                            {{$product->productSizes()->get()->where('size', 'osfa')->first()->amount ?? ''}}
                        </td>
                        <td class="col" style="width: 55px">
                            {{$product->totalQuantity()}}

                        </td>
                        <td class="col" style="width: 40px">
                        </td>
                        </tr>
                    @endforeach

                    </tbody>
                </table>

                <div class="d-flex gap-2">
                    <label for="total-quantity" class="text-nowrap col-form-label">Total Quantity:</label>

                    <input type="number" name="total-quantity" id="" class="form-control-plaintext" readonly
                            value="{{$order->totalProductQuantity()}}">
                </div>

                <!-- Product Services -->
                <div class="ms-2">

                    <!-- Title -->
                    <div class="row px-2 border-bottom mt-4">
                        <div class="row fw-bold">
                            <div class="col-1 px-0" style="width: 40px;">#</div>
                            <div class="col-1 px-1">Service</div>
                            <div class="col-2 px-1">Placement</div>
                            <div class="col-3 px-1">Logo Name</div>

                            <div class="col-5">
                                <div class="row">
                                    <div class="col px-1">Setup</div>
                                    <div class="col px-1">Width</div>
                                    <div class="col px-1">Height</div>
                                    <div class="col px-1">Unit</div>
                                    <div class="col px-1">Price</div>
                                    <div class="col px-1">Total</div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- Row -->

                    @foreach($order->productServices as $key => $service)
                        <div class="row">

                            <div class="@if($loop->index % 2 != 1) bg-body-tertiary @endif border-bottom py-2">
                                <div class="row mb-1">
                                    <div class="row mb-2">
                                        <div class="col-1 px-1 fw-bold" style="width: 40px;">{{$loop->index+1}}</div>
                                        <div class="col-1 px-2 fw-bold text-uppercase">
                                            <!-- Service type -->
                                            {{$service->service_type}}
                                        </div>
                                        <div class="col-2 px-1 text-uppercase">
                                            {{$service->placement}}
                                        </div>
                                        <div class="col-3 px-1 text-uppercase">
                                            {{$service->serviceFile->name }}
                                        </div>
                                        <div class="col-5">
                                            <div class="row">
                                                <div class="col px-1">
                                                    {{$service->serviceFile->setup_number}}
                                                </div>
                                                <div class="col px-1">
                                                    {{$service->serviceFile->width}}
                                                </div>
                                                <div class="col px-1">
                                                    {{$service->serviceFile->height}}
                                                </div>
                                                <div class="col px-1">
                                                    {{$service->amount}}
                                                </div>
                                                <div class="col px-1">
                                                    {{$service->amount_price != 0 ? $service->amount_price : ''}}
                                                </div>
                                                <div class="col px-1">
                                                    {{$service->amount_price != 0 ? '$' . number_format($service->amount_price*$service->amount, 2) : ''}}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row mx-0 px-0">
                                        <div class="col-1" style="width: 40px;"></div>
                                        <div class="col-1 px-1 ps-2">
                                            <code class="fs-6">
                                                {{$service->serviceFile->code}}
                                            </code>
                                        </div>

                                        <div class="col-9 px-1">
                                            {{$service->notes}}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>

                <div class="d-flex flex-row gap-2 ">
                    <label for="total-price" class="col-form-label text-nowrap">Total Price:</label>
                    <input type="text" name="total-price" id="" class="col-1 form-control-plaintext" readonly
                            value="{{'$'.$order->totalServicePrice()}}">
                </div>

            </div>
        </div>
    </div>
@endsection