@extends("newDashboard.index")

@section("css")
<link rel="stylesheet" href="{{asset('metronic/css/data-table.css')}}">
@endsection

@section("main-content")
<div class="content-wrapper">
    <div class="page-header">
        <h3 class="page-title">
            <span class="page-title-icon bg-gradient-primary text-white me-2">
                <i class="mdi mdi-cards-variant menu-icon"></i>
            </span> {{__('messages.invoices system')}}
        </h3>
    </div>
    <div class="row">
        <div id="success_message"></div>
        <div class="buttons-container">
            <a class="btn btn-primary float-end" href="{{ route('bills.bills.create') }}">{{__('messages.Add Invoice')}}</a>
        </div>
    </div>
	<input type="hidden" name="hidden_page" id="hidden_page" value="1" />
          <input type="hidden" id="user-index" value="{{ route('bills.vouchers.get-data') }}" />
          <input type="hidden" id="print-row" value="{{ route('bills.print') }}" />
			<input type="hidden" id="index-bills" value="{{ route('bills.bills.index') }}" />          

    <!-- Start of new combined container -->
    <div class="table-responsive customscroll">
                <table class="table datatable text-center" id="datatable">
                    <div class="container pb-2">
                        <div class="row gap-1 custom-padding-filter-tmp">
                            <div class="col-12 col-md-4 col-xl-3">
                                <label class="col-form-label">{{ __('messages.date:') }}</label>
                                <div class="center-custom-width-filter-date">
                                    <input type="text" id="config-demo" placeholder="{{ __('messages.date from - to') }}"
                                        class="form-control" />
                                </div>
                            </div>

                            
                        </div>
                    </div>
                    <thead>
                        <tr>
                			<th>{{__('messages.ID')}}</th> 
                			<th>{{__('messages.Serial number')}}</th>	
                			<th>{{__('messages.Statement')}}</th>
                			<th>{{__('messages.username')}}</th>
                			<th>{{__('messages.Amount')}}</th>
                			 <th>{{__('messages.date')}}</th>
                			 <th></th>
                			
                			
            			</tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
  
         
    <!-- End of new combined container -->

@endsection

@section("scripts")
<script>
    var translations = {
    		'ID':"{{__('messages.ID')}}",
    		'amount':"{{__('messages.amount')}}",
       		'from_user':"{{__('messages.from user')}}",
       		'Unit_Price':"{{__('messages.Unit Price')}}",
       		'serial_number':"{{__('messages.Serial number')}}",
       		'total_amount':"{{__('messages.Amount')}}",
       		'Statement':"{{__('messages.Statement')}}",
       		'Subtotal':"{{__('messages.Subtotal')}}",
       		'Quantitys':"{{__('messages.Quantitys')}}",
       		'username':"{{__('messages.username')}}",
       		'title':"{{__('messages.invoices system')}}",
       		'date':"{{__('messages.date')}}",
       		'to-from-error':"{{__('messages.To Date must be after From Date.')}}",
       		'both-date-error':"{{__('messages.Both From Date and To Date are required, or neither should be provided.')}}", 
    };
</script>
<script type="module" src="{{asset('metronic/js/pages/bills.js')}}"></script> 

@endsection