@extends('layouts.app')

@section('css')
<style>
    .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next,.ui-datepicker-calendar,.ui-datepicker-month {
        display: none;
    }
    .over_2sd, .below_m_2sd {
        background-color: rgb(246, 246, 195)!important
    }
    .over_3sd, .below_m_3sd {
        background-color: lightcoral!important
    }
</style>

@section('title')
     HVE Monitoring Parameters
@endsection

@section('breadcrumb')
<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1 class="m-0 text-dark">
                    <i class="nav-icon ml-3 fas fa-copy"></i>
                    {{__('HVE Monitoring Parameters')}}
                </h1>
            </div><!-- /.col -->
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{route('admin.index')}}">{{__('Home')}}</a></li>
                    <li class="breadcrumb-item">
                        <a href="{{route('admin.hve_monitoring.index')}}">{{ __('HVE Monitoring Parameters') }}</a>
                    </li>
                    <li class="breadcrumb-item active">{{ __('HVE Monitoring Parameters') }}</li>
                </ol>
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div><!-- /.container-fluid -->
</div>
@endsection

@section('content')

    <div class="card card-primary">
        <div class="card-header">
            <h3 class="card-title">{{ __('HVE Monitoring Parameters') }}</h3>
        </div>
        <!-- /.card-header -->
        <!-- /.card-body -->
    </div>
    
    <div class="card card-primary col-lg-12 p-1 m-0 mb-3">
        <div class="card-body m-0 p-0">
            <div class="row m-2">
                
                <div class="col-sm-6">
                    <div class="form-group">
                        <label for="equipment_id"><span style="color:red">*</span> {{ __('Equipment')}}</label>
                        <div class="input-group mb-3">
                            <select disabled required id="equipment_id" name="equipment_id" class="form-control select2" @if(isset($current_monitoring)) disabled @endif>
                                <option value=""></option>
                                @foreach($equipment as $e)
                                <option value="{{$e->id}}" @if(isset($current_monitoring) && $current_monitoring->equipment_id == $e->id) selected @endif>{{$e->name}}</option>
                                @endforeach
                            </select>          
                        </div>
                    </div>
                </div>
    
            </div>
    
            <div class="row m-1">
    
                <div class="col-sm-3">
                    <div class="form-group">
                        <label for="location">{{ __('Location')}}</label>
                        <div class="input-group mb-3">
                               <input disabeld type="text" disabled name="location" id="location" class="form-control" @if(isset($current_monitoring)) value="{{$current_monitoring->equipment->location->location}}" @endif>   
                        </div>
                    </div>
                </div>
    
                <div class="col-sm-3">
                    <div class="form-group">
                        <label for="property_no">{{ __('Equipment / Property Number')}}</label>
                        <div class="input-group mb-3">
                              <input disabled type="text" disabled name="property_no" id="property_no" class="form-control" @if(isset($current_monitoring)) value="{{$current_monitoring->equipment->property_no}}" @endif>    
                        </div>
                    </div>
                </div>
    
            </div>
    
            <div class="row m-1">
                
                <div class="col-sm-6">
                    <div class="form-group">
                        <label for="year"><span style="color:red">*</span> {{ __('Year')}}</label>
                        <div class="input-group mb-3">
                            <input type="text" class="form-control" disabled value="{{date('Y', strtotime($current_monitoring->date))}}">  
                        </div>
                    </div>
                </div>
    
            </div>
    
            <div class="row m-2">
                <div class="col-sm-12">
                    <div class="card-header" style="padding: 6px">
                    </div>
    
                    <table class="table">
                        <thead>
                            <tr>
                                <th rowspan="2" style="text-align: center; vertical-align: middle; border-right: 2px #dee2e6 solid; font-size: 16px; width: 14%;">Date</th>
                                <th rowspan="2" style="text-align: center; vertical-align: middle; border-right: 2px #dee2e6 solid; font-size: 16px; width: 18%;">User</th>
                                <th colspan="3" style="text-align: center; border-right: 2px #dee2e6 solid;">Start</th>
                                <th colspan="3" style="text-align: center;">End</th>
                                <th rowspan="2" style="text-align: center; vertical-align: middle; border-left: 2px #dee2e6 solid; font-size: 16px; width:20%; border-right: 2px #dee2e6 solid;">Remarks</th>
                                <th rowspan="2" style="text-align: center; vertical-align: middle; border-left: 2px #dee2e6 solid; font-size: 16px; border-right: 2px #dee2e6 solid;">HVE</th>
                                <th rowspan="2"></th>
                            </tr>
                            <tr>
                                <th style="text-align: center; width: 8%;">mAmp</th>
                                <th style="text-align: center; width: 8%;">watts</th>
                                <th style="text-align: center; width: 8%; border-right: 2px #dee2e6 solid;">volts</th>
        
                                <th style="text-align: center; width: 8%;">mAmp</th>
                                <th style="text-align: center; width: 8%;">watts</th>
                                <th style="text-align: center; width: 8%;">volts</th>
                            </tr>
                        </thead>
                        <tbody id="table_body">
    
                            @if(isset($current_monitoring))
                            @foreach($current_monitoring->records as $record)
                                <tr class="form_row">
                                    <input type="hidden" name="records[{{$record->id}}][id]" value="{{$record->id}}">
                                    <td style="padding: 10px;">
                                        <input readonly type="date" name="records[{{$record->id}}][date]" class="form-control date row_date" value="{{$record->date}}">
                                    </td>
                                    <td style="padding: 10px;">
                                        <select disabled name="records[{{$record->id}}][user_id]" class="form-control user">
                                            <option value="">&nbsp;</option>
                                        @foreach($branch_users as $b)
                                            <option value="{{$b->user->id}}" @if($record->user_id == $b->user->id) selected @endif>{{$b->user->name}}  {{$b->user->last_name}}</option>
                                        @endforeach
                                        </select>
                                    </td>
            
                                    <td style="padding: 10px;">
                                        <input readonly type="text" name="records[{{$record->id}}][start_mAmp]" class="form-control start_mAmp" value="{{$record->start_mAmp}}">
                                    </td>
                                    <td style="padding: 10px;">
                                        <input readonly type="text" name="records[{{$record->id}}][start_watts]" class="form-control start_watts" value="{{$record->start_watts}}">
                                    </td>
                                    <td style="padding: 10px;">
                                        <input readonly type="text" name="records[{{$record->id}}][start_volts]" class="form-control start_volts" value="{{$record->start_volts}}">
                                    </td>
            
                                    <td style="padding: 10px;">
                                        <input readonly type="text" name="records[{{$record->id}}][end_mAmp]" class="form-control end_mAmp" value="{{$record->end_mAmp}}">
                                    </td>
                                    <td style="padding: 10px;">
                                        <input readonly type="text" name="records[{{$record->id}}][end_watts]" class="form-control end_watts" value="{{$record->end_watts}}">
                                    </td>
                                    <td style="padding: 10px;">
                                        <input readonly type="text" name="records[{{$record->id}}][end_volts]" class="form-control end_volts" value="{{$record->end_volts}}">
                                    </td>
            
                                    <td style="padding: 10px;">
                                        <textarea disabled name="records[{{$record->id}}][remarks]" class="form-control remarks" rows="1">{{$record->remarks}}</textarea>
                                    </td>
    
                                    <td>
                                        @if($record->hve_id != null)
                                        <a class="dropdown-item" href="{{route('admin.hve_proforma.show', $record->hve_id)}}">
                                            <i class="fa fa-eye" aria-hidden="true"></i>
                                        </a>
                                        @endif
                                    </td>
        
                                    <td style="text-align: center; vertical-align: middle; padding: 10px 5px;">
                                    </td>
                                </tr>
                            @endforeach
                            @endif
     
                        </tbody>
                    </table>
                </div>
            </div>
        </div>  
    </div>

    <div class="card card-primary col-lg-12 p-1 m-0 mb-3">
        <div class="card-header">
            <h6 class="m-0 p-0">
                {{ __('Statistics') }}
            </h6>
        </div>
        <div class="card-body m-0 p-0">
            <div class="row m-0 p-0">
                <div class="card card-primary col-lg-4 m-0 p-1">
                    <div class="card-header">
                        <h6 class="m-0 p-0">
                            {{-------------HERE------------}}
                            {{ __('Current') }}
                        </h6>
                    </div>
                    <div class="card-body">
                        <div class="row m-1">
                
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="current_mean">{{ __('Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_mean" name="stats[current_mean]">
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="current_start_mean">{{ __('Start Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_start_mean" name="stats[current_start_mean]">
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="current_end_mean">{{ __('End Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_end_mean" name="stats[current_end_mean]">
                                    </div>
                                </div>
                            </div>
                
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="current_sd">{{ __('SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_sd" name="stats[current_sd]">  
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="current_start_sd">{{ __('Start SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_start_sd" name="stats[current_start_sd]">  
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="current_end_sd">{{ __('End SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_end_sd" name="stats[current_end_sd]">  
                                    </div>
                                </div>
                            </div>
                
                        </div>
                
                        <div class="row m-1">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="current_sd2">{{ __('+2SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_sd2" name="stats[current_sd2]">   
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="current_sd3">{{ __('+3SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_sd3" name="stats[current_sd3]">   
                                    </div>
                                </div>
                            </div>
                        </div>
                
                        <div class="row m-1">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="current_m_sd2">{{ __('-2SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_m_sd2" name="stats[current_m_sd2]">   
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="current_m_sd3">{{ __('-3SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="current_m_sd3" name="stats[current_m_sd3]">   
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card card-primary col-lg-4 m-0 p-1">
                    <div class="card-header">
                        <h6 class="m-0 p-0">
                            {{------------HERE------------}}
                            {{ __('Watts') }}
                        </h6>
                    </div>
                    <div class="card-body">
                        <div class="row m-1">
                
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="watts_mean">{{ __('Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_mean" name="stats[watts_mean]">
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="watts_start_mean">{{ __('Start Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_start_mean" name="stats[watts_start_mean]">
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="watts_end_mean">{{ __('End Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_end_mean" name="stats[watts_end_mean]">
                                    </div>
                                </div>
                            </div>
                
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="watts_sd">{{ __('SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_sd" name="stats[watts_sd]">  
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="watts_start_sd">{{ __('Start SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_start_sd" name="stats[watts_start_sd]">  
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="watts_end_sd">{{ __('End SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_end_sd" name="stats[watts_end_sd]">  
                                    </div>
                                </div>
                            </div>
                
                        </div>
                
                        <div class="row m-1">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="watts_sd2">{{ __('+2SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_sd2" name="stats[watts_sd2]">   
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="watts_sd3">{{ __('+3SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_sd3" name="stats[watts_sd3]">   
                                    </div>
                                </div>
                            </div>
                        </div>
                
                        <div class="row m-1">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="watts_m_sd2">{{ __('-2SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_m_sd2" name="stats[watts_m_sd2]">   
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="watts_m_sd3">{{ __('-3SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="watts_m_sd3" name="stats[watts_m_sd3]">   
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card card-primary col-lg-4 m-0 p-1">
                    <div class="card-header">
                        <h6 class="m-0 p-0">
                            {{------------HERE------------}}
                            {{ __('Voltage') }}
                        </h6>
                    </div>
                    <div class="card-body">
                        <div class="row m-1">
                
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="voltage_mean">{{ __('Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_mean" name="stats[voltage_mean]">
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="voltage_start_mean">{{ __('Start Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_start_mean" name="stats[voltage_start_mean]">
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="voltage_end_mean">{{ __('End Mean')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_end_mean" name="stats[voltage_end_mean]">
                                    </div>
                                </div>
                            </div>
                
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="voltage_sd">{{ __('SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_sd" name="stats[voltage_sd]">  
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="voltage_start_sd">{{ __('Start SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_start_sd" name="stats[voltage_start_sd]">  
                                    </div>
                                </div>
                            </div>
    
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label for="voltage_end_sd">{{ __('End SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_end_sd" name="stats[voltage_end_sd]">  
                                    </div>
                                </div>
                            </div>
                
                        </div>
                
                        <div class="row m-1">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="voltage_sd2">{{ __('+2SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_sd2" name="stats[voltage_sd2]">   
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="voltage_sd3">{{ __('+3SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_sd3" name="stats[voltage_sd3]">   
                                    </div>
                                </div>
                            </div>
                        </div>
                
                        <div class="row m-1">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="voltage_m_sd2">{{ __('-2SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_m_sd2" name="stats[voltage_m_sd2]">   
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="voltage_m_sd3">{{ __('-3SD')}}</label>
                                    <div class="input-group mb-3">
                                        <input type="text" readonly class="form-control" id="voltage_m_sd3" name="stats[voltage_m_sd3]">   
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> 
    </div>
    
    <div class="card card-primary col-lg-12 p-1 m-0 mb-3">
        <div class="card-header">
            <h6 class="m-0 p-0">
                {{ __('Charts') }}
            </h6>
        </div>
        <div class="card-body m-1 p-1">
            <div class="row m-0 p-0">
                <div class="card card-primary col-lg-12 m-0 p-1">
                    <div class="card-header">
                        <h6 class="m-0 p-0 d-inline">
                            {{ __('Current') }}
                        </h6>
                    </div>
                    <div class="card-body p-0 m-0" id="current_chart_container">
                        <canvas id="current_chart" width="80" height="20"></canvas>
                    </div>
                </div>
            </div>
            <div class="row m-0 p-0">
                <div class="card card-primary col-lg-12 m-0 p-1">
                    <div class="card-header">
                        <h6 class="m-0 p-0 d-inline">
                            {{ __('Watts') }}
                        </h6>
                    </div>
                    <div class="card-body p-0 m-0" id="watts_chart_container">
                        <canvas id="watts_chart" width="80" height="20"></canvas>
                    </div>
                </div>
            </div>
            <div class="row m-0 p-0">
                <div class="card card-primary col-lg-12 m-0 p-1">
                    <div class="card-header">
                        <h6 class="m-0 p-0 d-inline">
                            {{ __('Voltage') }}
                        </h6>
                    </div>
                    <div class="card-body p-0 m-0" id="voltage_chart_container">
                        <canvas id="voltage_chart" width="80" height="20"></canvas>
                    </div>
                </div>
            </div>
        </div> 
    </div>
    
@endsection

@section('scripts')
    <script src="{{url('js/admin/hve_monitoring.js')}}"></script>
@endsection