@extends('layouts.app')

@section('center')
<style>
	.wb{
		border-left:1px solid white !important;
	}
	.bb{
		border-left:1px solid lightgray !important;
	}
	.rbg{
		border-right:1px solid lightgray !important;
	}
</style>
				<link rel="stylesheet" href="{{asset('assets')}}/vendor/datepicker/css/classic.css" />
				<link rel="stylesheet" href="{{asset('assets')}}/vendor/datepicker/css/classic.date.css" />
				<link rel="stylesheet" href="{{asset('assets')}}/vendor/bs-select/bs-select.css" />
<div class="row gutters">
			<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
				<form action="{{route('kwhLog')}}">
				<div class="row gutters">
				<div class="col-xl-2 col-lg-2 col-md-2 col-sm-2">

							<div class="form-group">
								<label class="label">Device ID</label>
								<select class="form-control selectpicker" data-live-search="true" class="form-control " name="DeviceId">
									<option value=''>Select Device ID</option>
									@foreach($tr_data as $k => $row)
									<option value="{{$row->global_device_id}}" @isset($_GET["DeviceId"])
																	@if($_GET["DeviceId"]==$row->global_device_id) {{'selected'}} @endif
																	@endisset>{{$row->global_device_id}}</option>
									@endforeach

								</select>
							</div>

						</div>

						<div class="col-xl-3 col-lg-3 col-md-3 col-sm-3">

							<div class="form-group">
								<label class="label">From Date</label>
								<input type="datetime-local" class="form-control" name="from" placeholder="From"
																		@isset($_GET["from"])
																			 value="{{$_GET['from']}}"
																		@endisset >
							</div>

						</div>

						<div class="col-xl-3 col-lg-3 col-md-3 col-sm-3">

							<div class="form-group">
								<label class="label">To Date</label>
								<input type="datetime-local" class="form-control" name="to" placeholder="To"
								@isset($_GET["to"])
																			 value="{{$_GET['to']}}"
																		@endisset
								>
							</div>

						</div>

			<div class="col-xl-2 col-lg col-md-2 col-sm-2 col-12 ">
			<div class="form-group">
					<label class="label">&nbsp;</label>
					<button type="submit" class="form-control btn btn-primary generate">Generate</button>
				</div>

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

				<div class="col-xl-12 col-lg-12 col-md-12 col-sm-2 col-12">
						<div class="table-container">
								<div class="table-responsive" style="max-height: 800px; overflow-y: auto;">
								<table class="table table-bordered table-striped m-0" style="font-size:10px !important;">
									<thead style="position: sticky; top: 0;  z-index: 1;">
										<tr>
										<th  class=" wb">Time</th>
											<th class="wb">Global ID</th>

											<!-- <th colspan="3" class="text-center wb">Voltages (V)</th> -->
											<!-- <th colspan="3" class="text-center wb">Currents (I)</th> -->
											<!-- <th colspan="3" class="text-center wb">Power Factor (PF)</th> -->
											<th class="wb">Timing</th>
											<th colspan="3" class="text-center wb">kw</th>
											<th colspan="6" class="text-center wb">Energy (kWh)</th>
											<th colspan="6" class="text-center wb">Energy (rkWh)</th>
										</tr>
										<tr>
											<th></th>
											<th></th>
											<!-- <th class="wb">V1</th> -->
											<!-- <th >V2</th> -->
											<!-- <th>V3</th> -->
											<!-- <th class="wb">I1</th> -->
											<!-- <th>I2</th> -->
											<!-- <th>I3</th> -->
											<!-- <th class="wb">PF1</th> -->
											<!-- <th>PF2</th> -->
											<!-- <th>PF3</th> -->
											<th></th>
											<th class="wb">kw1</th>
											<th >kw2</th>
											<th >kw3</th>
											<th class="wb">kwho1</th>
											<th>kwho2</th>
											<th>kwho3</th>
											<th >kwhp1</th>
											<th>kwhp2</th>
											<th>kwhp3</th>


											<th class="wb">rkwho1</th>
											<th>rkwho2</th>
											<th>rkwho3</th>
											<th >rkwhp1</th>
											<th>rkwhp2</th>
											<th>rkwhp3</th>


										</tr>
									</thead>
									<tbody>
										@foreach($data as $k => $row)
										@if($row->dmdt_phase==1)
											<tr   >
												<td>{{appDate($row->dtime)}}</td>
												<td class="bb" style="color:blue;">{{ $row->trid }}</td>
												<!-- <td class="bb" colspan="3">{{ $row->v1 }}</td> -->

												<!-- <td class="bb" colspan="3">{{ $row->i1 }}</td> -->

												<!-- <td class="bb" colspan="3">{{ $row->pf1 }}</td> -->
												<th>@if($row->pkflg==1) Peak @else Offpeak @endif  </th>
												<td class="bb" colspan="3">{{ $row->kw1 }}</td>
												<td class="bb" colspan="3">{{ $row->kwho1 }}</td>

												<td class="bb" colspan="3">{{ $row->kwhp1 }}</td>

												<td class="bb" colspan="3">{{ $row->rkwho1 }}</td>
												<td class="bb rbg " colspan="3">{{ $row->rkwhp1 }}</td>


											</tr>
										@else
										<tr>
												<td>{{appDate($row->dtime)}}</td>
												<td class="bb" style="color:blue;">{{ $row->trid }}</td>
												<!-- <td class="bb">{{ $row->v1 }}</td> -->
												<!-- <td>{{ $row->v2 }}</td> -->
												<!-- <td>{{ $row->v3 }}</td> -->
												<!-- <td class="bb">{{ $row->i1 }}</td> -->
												<!-- <td>{{ $row->i2 }}</td> -->
												<!-- <td>{{ $row->i3 }}</td> -->
												<!-- <td class="bb">{{ $row->pf1 }}</td> -->
												<!-- <td>{{ $row->pf2 }}</td> -->
												<!-- <td>{{ $row->pf3 }}</td> -->
												<td>@if($row->pkflg==1) Peak @else Offpeak @endif</td>
												<td class="bb">{{ $row->kw1 }}</td>
												<td>{{ $row->kw2 }}</td>
												<td>{{ $row->kw3 }}</td>

												<td class="bb">{{ $row->kwho1 }}</td>
												<td>{{ $row->kwho2 }}</td>
												<td>{{ $row->kwho3 }}</td>
												<td class="bb">{{ $row->kwhp1 }}</td>
												<td>{{ $row->kwhp2 }}</td>
												<td>{{ $row->kwhp3 }}</td>

												<td class="bb">{{ $row->rkwho1 }}</td>
												<td>{{ $row->rkwho2 }}</td>
												<td>{{ $row->rkwho3 }}</td>
												<td class="bb">{{ $row->rkwhp1 }}</td>
												<td>{{ $row->rkwhp2 }}</td>
												<td class="rbg ">{{ $row->rkwhp3 }}</td>


											</tr>
										@endif
										@endforeach
									</tbody>
								</table>

								</div>
								<div class="d-flex  mt-3">
									{{ $data->appends(request()->query())->links('pagination::bootstrap-4') }} <!-- You can change the pagination view style -->
								</div>
						</div>

				</div>
			</div>

			@push('scripts')
			<script src="{{asset('assets')}}/vendor/datepicker/js/picker.js"></script>
			<script src="{{asset('assets')}}/vendor/datepicker/js/picker.date.js"></script>
			<script src="{{asset('assets')}}/vendor/datepicker/js/custom-picker.js"></script>
			<script src="{{asset('assets')}}/vendor/bs-select/bs-select.min.js"></script>
			<script src="{{asset('assets')}}/js/main.js"></script>
			@endpush
@endsection