@extends('layouts.app')

@section('title', __('messages.sales'))
@section('page_title', __('messages.sales'))
@section('breadcrumb')<li class="breadcrumb-item active">{{ __('messages.sales') }}</li>@endsection

@section('content')
<div class="card">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h3 class="card-title m-0">{{ __('messages.sales') }}</h3>
        @can('sales.create')
        <a href="{{ route('sales.pos') }}" class="btn btn-primary"><i class="fas fa-cash-register"></i> فاتورة جديدة (POS)</a>
        @endcan
    </div>
    <div class="card-body">
        <table id="sales-table" class="table table-bordered table-striped table-hover w-100">
            <thead><tr>
                <th>#</th><th>الرقم</th><th>الصيدلية</th><th>العميل</th>
                <th>الكاشير</th><th>التاريخ</th><th>الإجمالى</th>
                <th>الحالة</th><th>ETA</th><th>{{ __('messages.actions') }}</th>
            </tr></thead>
        </table>
    </div>
</div>
@endsection

@push('scripts')
<script>
$('#sales-table').DataTable(dtArabicConfig({
    ajax: '{{ route('sales.data') }}',
    columns: [
        { data: 'id' }, { data: 'reference' },
        { data: 'pharmacy_name', name: 'pharmacy.name' },
        { data: 'customer_name', name: 'customer.name' },
        { data: 'cashier_name',  name: 'user.name' },
        { data: 'sale_date' },
        { data: 'total' },
        { data: 'status_label', name: 'status', orderable: true, searchable: false },
        { data: 'eta_label',    name: 'eta_status', orderable: true, searchable: false },
        { data: 'actions',      orderable: false, searchable: false },
    ],
}));
</script>
@endpush