@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>
@endsection

@if(session()->get('from_import') != null)
    <input type="hidden" id="from_import" value="{{session()->get('from_import')}}">
    <input type="hidden" id="monitoring_id" value="{{$current_monitoring->id}}">
@endif

<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 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 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 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">
                        @if(isset($current_monitoring))
                        <input type="text" class="form-control" disabled value="{{date('Y', strtotime($current_monitoring->date))}}">  
                        @else
                        <input required type="text" id="year" class="form-control">  
                        <input type="hidden" name="date" id="year_hidden">
                        @endif  
                    </div>
                </div>
            </div>

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

@if(isset($current_monitoring))

<div class="card card-primary col-lg-12 p-1 m-0 mb-3">
    <div class="card-header" style="padding: 6px">
        <a id="add_form_row" class="btn btn-primary btn-sm float-right">
            <i class="fa fa-plus"></i> {{__(' Add')}} 
        </a>
        <a id="import_btn" class="btn btn-primary btn-sm to_remove mr-2" data-toggle="modal" data-target="#import_modal"><i class="fa fa-plus mr-1"></i> {{__(' Import')}} </a>
        <a id="template_btn" href="{{ route('admin.hve_monitoring.download_template') }}" class="btn btn-primary btn-sm to_remove"><i class="fas fa-file-download mr-1"></i> {{__(' Download Template')}} </a>
    </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%;"><span style="color:red">*</span> 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 required type="date" name="records[{{$record->id}}][date]" class="form-control date row_date" value="{{$record->date}}">
                    </td>
                    <td style="padding: 10px;">
                        <select 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 type="text" name="records[{{$record->id}}][start_mAmp]" class="form-control start_mAmp" value="{{$record->start_mAmp}}">
                    </td>
                    <td style="padding: 10px;">
                        <input type="text" name="records[{{$record->id}}][start_watts]" class="form-control start_watts" value="{{$record->start_watts}}">
                    </td>
                    <td style="padding: 10px;">
                        <input type="text" name="records[{{$record->id}}][start_volts]" class="form-control start_volts" value="{{$record->start_volts}}">
                    </td>

                    <td style="padding: 10px;">
                        <input type="text" name="records[{{$record->id}}][end_mAmp]" class="form-control end_mAmp" value="{{$record->end_mAmp}}">
                    </td>
                    <td style="padding: 10px;">
                        <input type="text" name="records[{{$record->id}}][end_watts]" class="form-control end_watts" value="{{$record->end_watts}}">
                    </td>
                    <td style="padding: 10px;">
                        <input type="text" name="records[{{$record->id}}][end_volts]" class="form-control end_volts" value="{{$record->end_volts}}">
                    </td>

                    <td style="padding: 10px;">
                        <textarea 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

            <tr id="form_row" class="d-none form_row">
                <td style="padding: 10px;">
                    <input required type="date" name="[date]" class="form-control date row_date">
                </td>
                <td style="padding: 10px;">
                    <select name="[user_id]" class="form-control user">
                        <option value="">&nbsp;</option>
                    @foreach($branch_users as $b)
                        <option value="{{$b->user->id}}">{{$b->user->name}}  {{$b->user->last_name}}</option>
                    @endforeach
                    </select>
                </td>

                <td style="padding: 10px;">
                    <input type="text" name="[start_mAmp]" class="form-control start_mAmp">
                </td>
                <td style="padding: 10px;">
                    <input type="text" name="[start_watts]" class="form-control start_watts">
                </td>
                <td style="padding: 10px;">
                    <input type="text" name="[start_volts]" class="form-control start_volts">
                </td>

                <td style="padding: 10px;">
                    <input type="text" name="[end_mAmp]" class="form-control end_mAmp">
                </td>
                <td style="padding: 10px;">
                    <input type="text" name="[end_watts]" class="form-control end_watts">
                </td>
                <td style="padding: 10px;">
                    <input type="text" name="[end_volts]" class="form-control end_volts">
                </td>

                <td style="padding: 10px;">
                    <textarea name="[remarks]" class="form-control remarks" rows="1"></textarea>
                </td>

                <td>
                </td>

                <td style="text-align: center; vertical-align: middle; padding: 10px 5px;">
                    <button type="button" class="btn btn-danger btn-sm delete_form_row">
                        <i class="fa fa-trash"></i>
                    </button>
                </td>
            </tr>
        </tbody>
    </table> 
</div>

@endif

<div class="card card-primary col-lg-12 p-1 m-0 mb-3 @if(!isset($current_monitoring)) d-none @endif">
    <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-4">
                            <div class="form-group">
                                <label for="current_sd1">{{ __('+1SD')}}</label>
                                <div class="input-group mb-3">
                                    <input type="text" readonly class="form-control" id="current_sd1" name="stats[current_sd1]">   
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <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-4">
                            <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-4">
                            <div class="form-group">
                                <label for="current_m_sd1">{{ __('-1SD')}}</label>
                                <div class="input-group mb-3">
                                    <input type="text" readonly class="form-control" id="current_m_sd1" name="stats[current_m_sd1]">   
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <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-4">
                            <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-4">
                            <div class="form-group">
                                <label for="watts_sd1">{{ __('+1SD')}}</label>
                                <div class="input-group mb-3">
                                    <input type="text" readonly class="form-control" id="watts_sd1" name="stats[watts_sd1]">   
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <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-4">
                            <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-4">
                            <div class="form-group">
                                <label for="watts_m_sd1">{{ __('-1SD')}}</label>
                                <div class="input-group mb-3">
                                    <input type="text" readonly class="form-control" id="watts_m_sd1" name="stats[watts_m_sd1]">   
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <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-4">
                            <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-4">
                            <div class="form-group">
                                <label for="voltage_sd1">{{ __('+1SD')}}</label>
                                <div class="input-group mb-3">
                                    <input type="text" readonly class="form-control" id="voltage_sd1" name="stats[voltage_sd1]">   
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <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-4">
                            <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-4">
                            <div class="form-group">
                                <label for="voltage_m_sd1">{{ __('-1SD')}}</label>
                                <div class="input-group mb-3">
                                    <input type="text" readonly class="form-control" id="voltage_m_sd1" name="stats[voltage_m_sd1]">   
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <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-4">
                            <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>

@if(isset($current_monitoring))

<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>

@endif

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