@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 mb-3">
    <form action="{{ route('currentLog') }}" method="GET">
        <div class="form-row align-items-end d-flex flex-wrap" style="gap: 10px;">

            {{-- hidden field --}}
            @if(request('generate'))
                <input type="hidden" name="generate" value="1">
            @endif

            <!-- Device ID -->
            <div class="form-group mb-0" style="min-width: 200px;">
					<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>
                

            <!-- From -->
            <div class="form-group mb-0" style="min-width: 200px;">
                <label class="label">From</label>
                <input type="text" class="form-control datepicker" name="from" value="{{ request('from') }}">
            </div>

            <!-- To -->
            <div class="form-group mb-0" style="min-width: 200px;">
                <label class="label">To</label>
                <input type="text" class="form-control datepicker" name="to" value="{{ request('to') }}">
            </div>

            <!-- Log Type -->
            <div class="form-group mb-0" style="min-width: 200px;">
                <label class="label">Log Type</label>
                <select id="logTypeDropdown" class="form-control">
                    <!-- <option value="">Select Log Type</option> -->
                    <option value="{{ route('currentLog') }}" {{ request()->routeIs('currentLog') ? 'selected' : '' }}>Current Logs</option>
                    {{-- <option value="{{ route('calculatedkwh') }}" {{ request()->routeIs('calculatedkwh') ? 'selected' : '' }}>Apparent Power </option> --}}
                    <!-- <option value="{{ route('kwhLog') }}" {{ request()->routeIs('kwhLog') ? 'selected' : '' }}>KWH Logs</option> -->
                    <!-- <option value="{{ route('kvaLog') }}" {{ request()->routeIs('kvaLog') ? 'selected' : '' }}>KVA Logs</option> -->
                    <!-- <option value="{{ route('mdiLog') }}" {{ request()->routeIs('mdiLog') ? 'selected' : '' }}>MDI Logs</option> -->
                </select>
            </div>

            <!-- Generate -->
            <div class="form-group mb-0">
                <label class="label d-block">&nbsp;</label>
                {{-- <button type="submit" class="btn btn-primary generate">Generate</button> --}}
                <button type="submit" name="generate" value="1" class="btn btn-primary generate">Generate</button>
            </div>

            <!-- ✅ Download Button (RIGHT SIDE) -->
            <div class="form-group mb-0 ml-auto">
                <label class="label d-block">&nbsp;</label>
                <button type="button" onclick="exportTableToExcel('logs')" class="btn btn-success">
                    <i class="fas fa-file-excel"></i> Download Excel
                </button>
            </div>

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

        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-2 col-12">
            <div class="table-responsive">
                <div class="table-container">
                    <div class="table-responsive" style="max-height: 800px; overflow-y: auto;">
                        <table class="table m-0 table-hover" style="font-size: 10px !important;">
                            <thead style="position: sticky; top: 0;  z-index: 1;">
                            <tr>
                                <th rowspan="2">Device Time</th>
                                <th rowspan="2">Server Time</th>
                                <th rowspan="2">GlobalID</th>
                                <th rowspan="2">Timing</th>
                                <!-- <th rowspan="2">isRv</th> -->
                                <th colspan="3" class="wb text-center">Voltages</th>
                                <th colspan="3" class="wb text-center">Currents</th>
                                <th colspan="3" class="wb text-center">Power Factors</th>
                                <th class="wb text-center">NC</th>
                                <th colspan="3" class="wb text-center">Load Direction</th>
                                <!-- <th colspan="6" class="wb text-center">Energy (kWh)</th> -->
                                <!-- <th colspan="6" class="wb text-center">Energy (rkWh)</th> -->
                            </tr>
                            <tr>
                                <!-- Voltages -->
                                <th class="wb">v1</th>
                                <th>v2</th>
                                <th>v3</th>
                                <!-- Currents -->
                                <th class="wb">i1</th>
                                <th>i2</th>
                                <th>i3</th>
                                <!-- Power Factors -->
                                <th class="wb">pf1</th>
                                <th>pf2</th>
                                <th>pf3</th>

                                <th class="wb"></th>
                                <th class="wb">i1</th>
                                <th>i2</th>
                                <th>i3</th>

                                <!-- Energy (kWh) -->
                                <!-- <th class="wb">kwho1</th>
                                <th>kwho2</th>
                                <th>kwho3</th>
                                <th>kwhp1</th>
                                <th>kwhp2</th>
                                <th>kwhp3</th> -->
                                <!-- Reactive Energy (rkWh) -->
                                <!-- <th class="wb">rkwho1</th>
                                <th>rkwho2</th>
                                <th>rkwho3</th>
                                <th>rkwhp1</th>
                                <th>rkwhp2</th>
                                <th>rkwhp3</th> -->
                            </tr>
                            </thead>
                            <tbody class="recent-record-row">
                            @if($data && (!$data->isEmpty()))
                                @foreach($data as $row)

                                    <tr>
                                        <td>{{appDate($row->dtime)}}</td>
                                        <td>{{ \Carbon\Carbon::parse($row->stime)->format('Y-m-d h:i:s') }}</td>
                                        <td class="bb "
                                            @if($row->dmdt_phase==1) style="color:blue;" @endif > {{$row->global_device_id}}</td>
                                        <td class="bb">@if($row->isPk==1)
                                                Peak
                                            @else
                                                Offpeak
                                            @endif </td>
                                        <!-- <td>{{$row->isRv}}</td> -->
                                        <!-- Voltages -->
                                        <td class="bb">{{$row->v1}}</td>
                                        <td>{{$row->v2}}</td>
                                        <td>{{$row->v3}}</td>
                                        <!-- Currents -->
                                        <td class="bb">{{$row->i1}}</td>
                                        <td>{{$row->i2}}</td>
                                        <td>{{$row->i3}}</td>
                                        <!-- Power Factors -->
                                      {{-- if($row->category=='SDBB')
                                            <td class="bb">-</td>
                                            <td>-</td>
                                            <td>-</td>
                                        else
                                        --}}
                                            <td class="bb">{{$row->pf1}}</td>
                                            <td>{{$row->pf2}}</td>
                                            <td>{{$row->pf3}}</td>
                                       <!-- endif -->

                                        <td class="bb">{{$row->nc}}</td>

                                        <td class="bb">@if($row->d1==1)
                                                F
                                            @else
                                                R
                                            @endif</td>
                                        <td>@if($row->d2==1)
                                                F
                                            @else
                                                R
                                            @endif</td>
                                        <td class="rbg ">@if($row->d3==1)
                                                F
                                            @else
                                                R
                                            @endif</td>


                                    </tr>

                                @endforeach
                            @else
                                <tr>
                                    <td colspan="25" class="text-danger">Record Not Found</td>
                                </tr>
                            @endif
                            </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>
    </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>
    
<script>

// function exportTableToExcel() {
//     const table = document.querySelector('.table');
//     if (!table) {
//         alert('Table not found!');
//         return;
//     }

//     const ws = XLSX.utils.table_to_sheet(table);
//     const wb = XLSX.utils.book_new();
//     XLSX.utils.book_append_sheet(wb, ws, 'Logs');
//     XLSX.writeFile(wb, 'logs.xlsx');
// }
</script>




			@endpush
@endsection