@extends('layouts.sale')

@section('content')
<div class="content-wrapper">
    <div id="productDetails">
        <!-- Content Header (Page header) -->
        <section class="content-header m-3">
            <h1>Customer Water Consumption Report
              
                {{-- <a class="btn btn-small btn-default pull-right ml-2" href="#productImportModal" data-toggle="modal">
                    <i class="fa fa-upload"></i>&nbsp; {{ __('Import') }}
                </a>
               --}}

               <div class="form-group pr-2">
        <button type="button" class="btn btn-primary" onclick="printConsumptionReport()">
            <i class="fa fa-print"></i> Print Report
        </button>
    </div>
            </h1>
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box box-success">
                        <div class="box-header">
                            @include('partials.filters', ['filter_route' => url('/reports/customer_consumption'), 'filter_id' => 'consumption_report'])
                        </div>
                        <div class="box-body">
    <div id="list_meterreading_report">
                                        <table class="table table-bordered table-striped">
                                    <thead>
                                        <tr>
                                            <th class="border p-2">Customer</th>
                                            <th class="border p-2">Meter No.</th>
                                            <th class="border p-2">Previous Reading</th>
                                            <th class="border p-2">Current Reading</th>
                                            <th class="border p-2">Units Consumed</th>
                                            <th class="border p-2">Amount Due</th>
                                            <th class="border p-2">Payment Status</th>
                                            <th class="border p-2">Reading Date</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($readings as $reading)
                                        <tr>
                                            <td class="border p-2"><b>{{ $reading->meter->customer->name ?? 'N/A' }}</b></td>
                                            <td class="border p-2">{{ $reading->meter_number }}</td>
                                            <td class="border p-2">{{ $reading->previous_reading }}</td>
                                            <td class="border p-2">{{ $reading->new_reading }}</td>
                                            <td class="border p-2">{{ $reading->units }}</td>
                                            <td class="border p-2">Ksh <b>{{ number_format($reading->price, 2) }} </b></td>
                                            <td class="border p-2">
                                                <span class="px-2 py-1 rounded {{ $reading->status == 'paid' ? 'text-green' : 'text-red' }}"><b>
                                                    {{ ucfirst($reading->status) }}
                                                </b> </span>
                                            </td>
                                            <td class="border p-2">{{ $reading->created_at }}</td>
                                            <td class="border p-2">
                                                @if($reading->image_path)
                                                    <a href="{{ asset($reading->image_path) }}" target="_blank">
                                                     view
                                                    </a>
                                                @else
                                                    <span class="text-gray-500">No Image</span>
                                                @endif
                                            </td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>


                          @php
                            $index_route = url('/reports/customer_consumption');
                                    @endphp
                                 @include('partials.pagination', ['items'=>$readings, 'index_route'=>$index_route])
                            </div>


                          
 
 
                        </div>
                    </div>
                </div>
            </div>

     

        </section>
        <!-- /.content -->
    </div>
</div>




@endsection