@extends('layouts.admin')

@section('styles')
    <style>
        tr.border_bottom td {
            border-bottom: 1pt dotted gray;
            border-top: 1pt dotted gray;
        }

        tr.border_bottom th {
            border-bottom: 1pt dotted gray;
            border-top: 1pt dotted gray;
        }

        .footer_border_botoom {
            display: flex;
            justify-content:
                space-between;
            flex-direction: column;
            height: 100%
        }

        @media print {
            .footer-position {
                position: fixed; /* <-- Key line */
                bottom: 0px;
                left: 0px;
                width: 100%;
                background: gray;
            }
        }

        .dispaly_noone {
            display: none;
        }
    </style>
@endsection

@section('title', 'Print Order')

@section('breadcrumb-item')
    <li class="breadcrumb-item">Assign Orders</li>
    <li class="breadcrumb-item active">Print Assign Order</li>
@endsection

@section('content')
    <div class="card">
        <div class="card-header bg-theme row">
            <div class="col-md-6">
                <p class="h5 mb-0"><i class="fa fa-list pr-1"></i>Print Assign Orders</p>
            </div>
            <div class="col-md-6">
                <button class="btn btn-sm btn-primary float-right ml-2 print-stock" type="button">
                    <i class="fa fa-print"></i>
                </button>
            </div>
        </div>
    </div>
    <div class="print-card">
        <div class="footer_border_botoom" id="div_con_change">
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th colspan="5" class="text-center">
                            <h4>Employee Name: {{ $employee->name }}</h4>
                            <p>Print Date: {{ now()->format('Y-m-d') }}</p>
                        </th>
                    </tr>
                    <tr class="tr-border-top-0">
                        <th>Sr#</th>
                        <th>Order ID</th>
                        <th>Amount</th>
                        <th>Shop</th>
                        <th>Placed On</th>
                        <th>Status</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($employee->assignedOrders as $order)
                    <tr>
                        <td>{{$loop->iteration}}</td>
                        <td>{{$order->id ?? ''}}</td>
                        <td>
                            @php
                                $totalAmount = $order->amount ?? 0;
                                if ($order->status == 2) {
                                echo $order->amount;
                                } else {
                                if ($order->payments->isNotEmpty()) {
                                $latestPayment = $order->payments->last();
                                if ($latestPayment->order_id == $order->id) {
                                $totalAmount = $latestPayment->balance;
                                }
                                }
                                echo $totalAmount;
                                }
                            @endphp
                        </td>
                        <td>{{$order->shop->name ?? ''}}</td>
                        <td>{{$order->created_at->format('d-M-Y') ?? ''}}</td>
                        <td>{{$order->status_string ?? ''}}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
@endsection
@section('scripts')
    <script>
        $(document).on('click', '.print-stock', function() {
            let printContents = document.querySelector('.print-card').innerHTML;
            let originalContents = document.body.innerHTML;
            document.body.innerHTML = printContents;
            window.print();
            document.body.innerHTML = originalContents;
            window.location.reload();
        });
    </script>


@endsection