@extends('dashboard.layouts.app')
@push('headScripts')
    <link rel="stylesheet" href="{{ asset('assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css') }}">
    <link rel="stylesheet" href="{{ asset('assets/plugins/flatpickr/flatpickr.min.css') }}">
    <style>
        #criticalCounterTable thead tr th{
            background:#ed7d31 ;
            color:white;
            border-color:#ed7d31 ;
        }
        #criticalCounterTable tbody tr td{
            border: solid #ed7d31 1.0pt;
        }
        #criticalCounterTable tbody tr:nth-of-type(odd){
            background: #fae5d5;
        }
    </style>
@endpush
@section('content')
    <div class="container-xxl flex-grow-1 container-p-y">
        <h4 class="fw-bold py-3 mb-4"><span class="text-muted fw-light">{{ __('Monitorings') }} /</span> <a href="{{ route('monitorings.index') }}" class="text-muted fw-light">{{ __('Monitorings') }} /</a> {{ (isset($monitoring))?__('Edit :type',['type'=>$monitoring->name]):__('Create') }}</h4>
        <div class="row">
            <div class="col-md-12">
                <div class="card mb-4">
                    <h5 class="card-header">{{ (isset($monitoring))?__('Edit :type',['type'=>$monitoring->name]):__('Create') }}</h5>
                    <form method="POST" action="{{ isset($monitoring)?route('monitorings.update',['monitoring'=>$monitoring]):route('monitorings.store') }}" enctype="multipart/form-data">
                        @if(isset($monitoring))
                            @method('PUT')
                        @endif
                        @csrf
                        <div class="card-body">
                            <div class="row">
                                <div class="form-group col-lg-12 mb-3">
                                    <label class="form-label">{{ __('Extinction') }}</label>
                                    <input type="text" class="form-control @error('extinction') is-invalid @enderror border-left-0" name="extinction" id="extinction" value="{{ isset($monitoring)?$monitoring->extinction:old('extinction') }}" placeholder="{{ __('Enter :value',['value'=>__('Monitoring Extinction')]) }}">
                                    @error('extinction')
                                    <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-4 mb-3">
                                    <label class="form-label">{{ __('Agent') }}</label>
                                    <select id="agent_id" class="select2 @error('agent_id') is-invalid @enderror" data-placeholder="{{ __('Select :type',['type'=>__('Agent')]) }}" name="agent_id">
                                        <option value="">{{ __('Select :type',['type'=>__('Agent')]) }}</option>
                                        @foreach($usersSelectorArray as $user)
                                            <option data-hiring-date="{{ $user->hiring_date }}" @if((isset($monitoring)&&$monitoring->agent_id==$user->id)||old('agent_id')==$user->id) selected="selected" @endif value="{{ $user->id }}">{{ $user->name }}</option>
                                        @endforeach
                                    </select>
                                    @error('agent_id')
                                    <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-4 mb-3">
                                    <label class="form-label">{{ __('Team Leader') }}</label>
                                    <select class="select2 @error('team_leader_id') is-invalid @enderror" data-placeholder="{{ __('Select :type',['type'=>__('Team Leader')]) }}" name="team_leader_id">
                                        <option value="">{{ __('Select :type',['type'=>__('Team Leader')]) }}</option>
                                        @foreach($usersSelectorArray as $user)
                                            <option @if((isset($monitoring)&&$monitoring->team_leader_id==$user->id)||old('team_leader_id')==$user->id) selected="selected" @endif value="{{ $user->id }}">{{ $user->name }}</option>
                                        @endforeach
                                    </select>
                                    @error('team_leader_id')
                                    <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-4 mb-3">
                                    <label class="form-label">{{ __('Supervisor') }}</label>
                                    <select class="select2 @error('supervisor_id') is-invalid @enderror" data-placeholder="{{ __('Select :type',['type'=>__('Supervisor')]) }}" name="supervisor_id">
                                        <option value="">{{ __('Select :type',['type'=>__('Supervisor')]) }}</option>
                                        @foreach($usersSelectorArray as $user)
                                            <option @if((isset($monitoring)&&$monitoring->supervisor_id==$user->id)||old('supervisor_id')==$user->id) selected="selected" @endif value="{{ $user->id }}">{{ $user->name }}</option>
                                        @endforeach
                                    </select>
                                    @error('supervisor_id')
                                    <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-12 mb-3">
                                    <label class="form-label">{{ __('Agent Hiring Date') }}</label>
                                    <input type="text" disabled class="form-control @error('hiring_date') is-invalid @enderror border-left-0" name="hiring_date" id="hiring_date" value="{{ isset($monitoring)&&$monitoring->agent?$monitoring->agent->hiring_date:old('hiring_date') }}" placeholder="{{ __('Enter :value',['value'=>__('Agent Hiring Date')]) }}">
                                    @error('hiring_date')
                                    <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-12 mb-3">
                                    <label class="form-label">{{ __('Project') }}</label>
                                    <select class="select2 @error('project_id') is-invalid @enderror" data-placeholder="{{ __('Select :type',['type'=>__('Project')]) }}" name="project_id">
                                        <option value="">{{ __('Select :type',['type'=>__('Project')]) }}</option>
                                        @foreach(\App\Models\Project::where('status','published')->pluck('name','id')->toArray() as $id=>$name)
                                            <option @if((isset($monitoring)&&$monitoring->project_id==$id)||old('project_id')==$id) selected="selected" @endif value="{{ $id }}">{{ $name }}</option>
                                        @endforeach
                                    </select>
                                    @error('project_id')
                                    <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-12 mb-3">
                                    <label class="form-label">{{ __('Customer Number') }}</label>
                                    <input type="text" class="form-control @error('customer_number') is-invalid @enderror border-left-0" name="customer_number" id="customer_number" value="{{ isset($monitoring)?$monitoring->customer_number:old('customer_number') }}" placeholder="{{ __('Enter :value',['value'=>__('Monitoring Customer Number')]) }}">
                                    @error('customer_number')
                                    <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-12 mb-3">
                                    <label class="form-label">{{ __('Call At') }}</label>
                                    <input type="text" data-enable-time="true" data-time_24hr="true" class="js-flatpickr form-control @error('call_at') is-invalid @enderror border-left-0" name="call_at" id="call_at" value="{{ isset($monitoring)?$monitoring->call_at:old('call_at') }}" placeholder="{{ __('Enter :value',['value'=>__('Call At')]) }}">
                                    @error('call_at')
                                    <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-12 mb-3">
                                    <label class="form-label">{{ __('Monitored At') }}</label>
                                    <input type="text" data-enable-time="true" data-time_24hr="true" class="js-flatpickr form-control @error('monitored_at') is-invalid @enderror border-left-0" name="monitored_at" id="monitored_at" value="{{ isset($monitoring)?$monitoring->monitored_at:old('monitored_at') }}" placeholder="{{ __('Enter :value',['value'=>__('Monitored At')]) }}">
                                    @error('monitored_at')
                                    <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                    @enderror
                                </div>
                                <div class="form-group col-lg-12 mb-3">
                                    <label class="form-label">{{ __('Monitored Type') }}</label>
                                    <select class="select2 @error('monitored_type_id') is-invalid @enderror" data-placeholder="{{ __('Select :type',['type'=>__('Monitored Type')]) }}" name="monitored_type_id">
                                        <option value="">{{ __('Select :type',['type'=>__('Monitored Type')]) }}</option>
                                        @foreach(\App\Models\MonitoringType::where('status','published')->pluck('name','id')->toArray() as $id=>$name)
                                            <option @if((isset($monitoring)&&$monitoring->monitored_type_id==$id)||old('monitored_type_id')==$id) selected="selected" @endif value="{{ $id }}">{{ $name }}</option>
                                        @endforeach
                                    </select>
                                    @error('monitored_type_id')
                                    <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                                <div class="table-responsive col-12 mb-3" id="criticalCounterTable">
                                    <table class="table">
                                        <thead>
                                        <tr>
                                            <th>{{ __('End User Critical') }}</th>
                                            <th>#</th>
                                            <th>{{ __('Business Critical') }}</th>
                                            <th>#</th>
                                            <th>{{ __('Non Critical') }}</th>
                                            <th>#</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        @for ($i = 0; $i < $tableRows; $i++)
                                            <tr>
                                                <td>{{ isset($tableEndUserCritical[$i])?$tableEndUserCritical[$i]['name']:'' }}</td>
                                                <td>@if(isset($tableEndUserCritical[$i]))<input type="number" min="0" name="question[{{ $tableEndUserCritical[$i]['id'] }}]" class="form-control EndUserCritical" value="{{ getMonitoringCounterValue($tableEndUserCritical[$i]['id'],isset($monitoring)?$monitoring:null) }}"/>@endif</td>
                                                <td>{{ isset($tableBusinessCritical[$i])?$tableBusinessCritical[$i]['name']:'' }}</td>
                                                <td>@if(isset($tableBusinessCritical[$i]))<input type="number" min="0" name="question[{{ $tableBusinessCritical[$i]['id'] }}]" class="form-control BusinessCritical" value="{{ getMonitoringCounterValue($tableBusinessCritical[$i]['id'],isset($monitoring)?$monitoring:null) }}"/>@endif</td>
                                                <td>{{ isset($tableNoneCritical[$i])?$tableNoneCritical[$i]['name']:'' }}</td>
                                                <td>@if(isset($tableNoneCritical[$i]))<input type="number" min="0" name="question[{{ $tableNoneCritical[$i]['id'] }}]" class="form-control NoneCritical" value="{{ getMonitoringCounterValue($tableNoneCritical[$i]['id'],isset($monitoring)?$monitoring:null) }}"/>@endif</td>
                                            </tr>
                                        @endfor
                                        </tbody>

                                    </table>

                                </div>
                                <div class="table-responsive col-12 mb-3" id="criticalCounterTable">
                                    <table class="table">
                                        <thead>
                                        <tr>
                                            <th>#{{ __('End User Critical') }}</th>
                                            <th>#{{ __('Business Critical') }}</th>
                                            <th>#{{ __('Non Critical') }}</th>
                                            <th>#{{ __('Call Status') }}</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr>
                                            <td><input type="hidden" name="end_user_critical" value="{{ isset($monitoring)?$monitoring->end_user_critical:old('end_user_critical') }}"/><span id="sumCounterEndUserCritical">{{ isset($monitoring)?$monitoring->end_user_critical:old('end_user_critical') }}</span></td>
                                            <td><input type="hidden" name="business_critical" value="{{ isset($monitoring)?$monitoring->business_critical:old('business_critical') }}"/><span id="sumCounterBusinessCritical">{{ isset($monitoring)?$monitoring->business_critical:old('business_critical') }}</span></td>
                                            <td><input type="hidden" name="non_critical" value="{{ isset($monitoring)?$monitoring->non_critical:old('non_critical') }}"/><span id="sumCounterNoneCritical">{{ isset($monitoring)?$monitoring->non_critical:old('non_critical') }}</span></td>
                                            <td><input type="hidden" name="call_status" value="{{ isset($monitoring)?$monitoring->call_status:old('call_status') }}"/><span id="callStatus"><span class="badge @if((isset($monitoring)&&$monitoring->call_status=='failed')||old('call_status')=='failed'){{ 'bg-danger' }}@elseif((isset($monitoring)&&$monitoring->call_status=='pass')||old('call_status')=='pass'){{ 'bg-success' }}@endif">{{ isset($monitoring)?$monitoring->call_status:old('call_status') }}</span></span></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="form-group col-lg-12 mb-3">
                                    <label class="form-label">{{ __('Comment') }}</label>
                                    <textarea name="comment" id="comment" class="form-control">{{ isset($monitoring)?$monitoring->comment:old('comment') }}</textarea>
                                    @error('comment')
                                    <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="text-center mt-3">
                            <button type="submit" class="btn btn-danger px-5">{{ __('Save') }}</button>
                        </div>
                    </form>

                </div>
            </div>
        </div>
    </div>
@endsection

@push('footerScripts')
    <script src="{{ asset('assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js') }}"></script>
    <script src="{{ asset('assets/plugins/flatpickr/flatpickr.min.js') }}"></script>
    <script>
        $(".js-flatpickr").flatpickr({
            enableTime: true,
            dateFormat: "Y-m-d H:i",
            time_24hr: true
        });
        function updateCallStatus(){
            let sumEndUserCritical=parseInt($("#sumCounterEndUserCritical").text())
            let sumBusinessCritical=parseInt($("#sumCounterBusinessCritical").text())
            let sumNonCritical=parseInt($("#sumCounterNoneCritical").text())
            if(sumNonCritical>3||(sumEndUserCritical+sumBusinessCritical)>0){
                $("#callStatus").html('<span class="badge bg-danger">Failed</span>').parent().find('input').val('failed')
            }else{
                $("#callStatus").html('<span class="badge bg-success">Pass</span>').parent().find('input').val('pass')
            }
        }
        $("#hiring_date").val($("#agent_id option:selected").attr('data-hiring-date'));
        $(document).on('change','#agent_id',function(){
            $("#hiring_date").val($("#agent_id option:selected").attr('data-hiring-date'));
        })
        $(document).on('keyup change','.EndUserCritical',function(){
            let totalCounter=0
            $(".EndUserCritical").each(function(){
                totalCounter+=parseInt($(this).val()==''?0:$(this).val());
            })
            $("#sumCounterEndUserCritical").text(totalCounter).parent().find('input').val(totalCounter)
            updateCallStatus()
        });
        $(document).on('keyup change','.BusinessCritical',function(){
            let totalCounter=0
            $(".BusinessCritical").each(function(){
                totalCounter+=parseInt($(this).val()==''?0:$(this).val());
            })
            $("#sumCounterBusinessCritical").text(totalCounter).parent().find('input').val(totalCounter)
            updateCallStatus()
        });
        $(document).on('keyup change','.NoneCritical',function(){
            let totalCounter=0
            $(".NoneCritical").each(function(){
                totalCounter+=parseInt($(this).val()==''?0:$(this).val());
            })
            $("#sumCounterNoneCritical").text(totalCounter).parent().find('input').val(totalCounter)
            updateCallStatus()
        });
    </script>
@endpush