@extends("flowdash::layouts.{$layout}", [
'title' => 'Dashboard view Orders',
'breadcrumb' => [[
'title' => 'Dashboard view Orders'
]]
])

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-lg">
            <div class="card">
                <div class="card-header card-header-large bg-white d-flex align-items-center">
                    <h4 class="card-header__title flex m-0">Orders List</h4>
                </div>
                <div>
                    <div>
                        <div id="orders" class="table-responsive border-bottom">
                            <div class="search-form search-form--light m-3">
                                <input type="text" class="form-control search" placeholder="Search">
                                <button class="btn" type="button"><i class="material-icons">search</i></button>
                            </div>
                            <table class="table">
                                <thead class="thead">
                                    <tr>
                                        <th class="sort" data-sort="id">System ID</th>
                                        <th class="sort" data-sort="invoice">Order ID</th>
                                        <th class="sort" data-sort="name">Product Name</th>
                                        <th>Status</th>
                                        <th class="sort" data-sort="submit">Submit at</th>
                                        <th>Actions</th>
                                    </tr>
                                </thead>
                                <tbody class="list">
                                    @foreach($orders as $order)
                                    <tr>
                                        <td class="id">{{ $order->id }}</td>
                                        <td class="invoice">{{ $order->invoice_id }}</td>
                                        <td class="name">{{ $order->name }}</td>
                                        <td>{{ $order->status }}</td>
                                        <td class="submit">{{ $order->submit_at  }} - @php
                                            if(strtotime($order->submit_at) < strtotime('-30 days')){ echo '<span class="badge badge-danger ml-auto">Delayed</span>' ; } @endphp </td>
                                        <td>
                                            <x-showbuttom :order=" $order " />
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/list.js/1.5.0/list.min.js"></script>
<script>
    var options = {
        valueNames: ['id', 'invoice', 'name', 'submit']
    };
    var inqueue = new List('orders', options);
</script>
@endsection