@extends('layouts.index')

@section('content')
    <div class="content-wrapper">
        <div class="" id="customerDetails">
            <!-- Content Header (Page header) -->
            <section class="content-header m-3">
                <h1>Meter Readings
                    {{-- <a class="btn btn-small btn-default pull-right ml-2" href="{{ route('customers.export') }}"><i
                            class="fa fa-download"></i>&nbsp; {{ __('export') }}</a> --}}
                    {{-- <a class="btn btn-small btn-default pull-right ml-2" href="#customerImportModal" data-toggle="modal"><i class="fa fa-upload"></i>&nbsp; {{__('import')}}</a> --}}
                    @if(auth()->guard('admin')->user()->checkSpPermission('customers.meter_reading'))
                    <a class="btn btn-small btn-success pull-right" href="/Backoffice/meter/reading" >
                        <i class="fa fa-plus"></i>&nbsp; New Readings</a>
                    @endif
                </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('/Backoffice/Meter-readnig'),
                                    'filter_id' => 'customerFilter',
                                ])
                            </div>
                            <div class="box-body">
                                <div class="" id="index_meterreading">
                                    <table class="table table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th>ID</th>
                                                <th>Customer Name</th>
                                                <th>Meter Number</th>
                                                <th>Previous Reading</th>
                                                <th>New Reading</th>
                                                <th>Units</th>
                                                <th>Price</th>
                                                <th>Status</th>
                                                <th>Image Path</th>
                                                <th>Created At</th>
                                                <th>Updated At</th>
                                                <th class="text-center">Actions</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach ($meterReadings as $value)
                                                <tr>
                                                    <td>{{ $value->id }}</td>
                                                    <td>{{ $value->meter->customer->name }}</td>
                                                    <td>{{ $value->meter_number }}</td>
                                                    <td>{{ $value->previous_reading }}</td>
                                                    <td>{{ $value->new_reading }}</td>
                                                    <td>{{ $value->units }}</td>
                                                    <td>{{ $value->price }}</td>
                                                    <td>{{ $value->status }}</td>
                                                    <td>{{ $value->image_path }}</td>
                                                    <td>{{ $value->created_at }}</td>
                                                    <td>{{ $value->updated_at }}</td>
                                                    {{-- <td class="item_btn_group">
                                                        @php
                                                            $actions = [
                                                                [
                                                                    'data-replace' => '#editMeterReading',
                                                                    'url' => '#editMeterReadingModal',
                                                                    'ajax-url' => url('/Backoffice/meter-readings/' . $value->id . '/edit'),
                                                                    'name' => 'Edit Reading',
                                                                    'icon' => 'pencil',
                                                                ],
                                                                // ['url' => '/Backoffice/meter-readings/' . $value->id . '/delete', 'name' => 'delete']
                                                            ];
                                                        @endphp
                                                        @include('partials.actions', ['actions' => $actions])
                                                    </td> --}}
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                    @include('partials.pagination', [
                                        'items' => $meterReadings,
                                        'index_route' => route('customers.meterreading'),
                                    ])
                                </div>
                            </div>
                            <!-- /.box-body -->
                        </div>
                        <!-- /.box -->
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
                <div class="modal fade sub-modal" id="addCustomerModal">
                    <div class="modal-dialog modal-lg">
                        @include('customers.formleads', ['customer' => ''])
                    </div>
                </div>
                <div class="modal fade sub-modal" id="editCustomerModal">
                    <div class="modal-dialog modal-lg">
                        <div id="editCustomer"></div>
                    </div>
                </div>
                <div class="modal fade sub-modal" id="showCustomerModal">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content" id="showCustomer"></div>
                    </div>
                </div>
                @include('partials.import_modal', [
                    'name' => 'Customers',
                    'modalId' => 'customerImportModal',
                    'import_route' => 'customers.import',
                ])

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