@extends('Admin.master_page')

@section('title') <h5 class="m-0 font-weight-bold text-primary" style="float: left;">Incident Add</h5> 

<a href="{{ route('Incident.index') }}" style="float: right;"><i class="fas fa-chevron-circle-left"></i></a>
@endsection

@section('content')

<div class="intro-y box">  
        
        <form action="{{ route('Incident.store') }}" method="POST">
            @csrf

        <label for="Name" >Name:</label>
        <div class="input-group" style="margin-top: 10px;">
           <input type="text" name="name" class="form-control" placeholder="Enter Name">
            @error('name')
            <span class="alert-danger">{{ $message }}</span>
            @enderror
        </div>
        <br>
        
        <label for="Name" >Impact:</label>
        <div class="input-group" style="margin-top: 10px;">
           <select name="impact" class="form-control">
              <option value="">Select Imact</option>
              <option value="None">None</option>
              <option value="Minor">Minor</option>
              <option value="Mayor">Mayor</option>
              <option value="Critical">Critical</option>
           </select>
            @error('impact')
            <span class="alert-danger">{{ $message }}</span>
            @enderror
        </div>
        <br>
        
        <label for="Name" >Server Name:</label>
        <div class="input-group" style="margin-top: 10px;">
           <input type="text" name="server_name" class="form-control" placeholder="Enter Name">
            @error('server_name')
            <span class="alert-danger">{{ $message }}</span>
            @enderror
        </div>
        <br>



        <label for="Name" >Components:</label>
        <div  style="margin-top: 15px;">

         @foreach($status as $st)
         <input type="checkbox" name="components[]" value="{{ $st->id }}" id="components-{{ $st->id }}"> &nbsp;&nbsp; <label for="components-{{ $st->id }}">{{ $st->name }}</label>

         <select class="form-control" id="status-{{ $st->id }}" name="status[]" style="display:none;">
               <option value="">Please Select one</option>
               <option value="{{ $st->id }}-1">Operational</option>
               <option value="{{ $st->id }}-2">Under maintenance</option>
               <option value="{{ $st->id }}-3">Degraded performance</option>
               <option value="{{ $st->id }}-4">Partial outage</option>
               <option value="{{ $st->id }}-5">Major outage</option>
         </select>

         <br>
         @endforeach
			@error('components')
			<span class="alert-danger">{{ $message }}</span>
			@enderror
		</div>
        <br>

        <label for="Name" >Status:</label>
        <div class="input-group" style="margin-top: 10px;">
           <select name="m_status" class="form-control">
              <option value="">Select Status</option>
              <option value="Investigating">Investigating</option>
              <option value="Identified">Identified</option>
              <option value="Monitoring">Monitoring</option>
              <option value="Resolved">Resolved</option>
           </select>
            @error('m_status')
            <span class="alert-danger">{{ $message }}</span>
            @enderror
        </div>
        <br>

        
        <label for="Name" >Message:</label>
        <div class="input-group" style="margin-top: 10px;">
           <textarea name="message" id="editor" class="form-control" placeholder="Message...."></textarea>
            @error('message')
            <span class="alert-danger">{{ $message }}</span>
            @enderror
        </div>

        <br>
        
        <label for="Name" >Show Status:</label>
        <div class="input-group" style="margin-top: 10px;">
           <select class="form-control" name="show_status">
               <option value="" hidden>Select Any</option>
               <option value="0">Public</option>
               <option value="1">Private</option>
           </select>
            @error('status')
            <span class="alert-danger">{{ $message }}</span>
            @enderror
        </div>

        <br>

        <button type="submit" class="btn btn-primary">Submit</button>
        </form>
    </div>



@endsection

@section('script')

<script>
    
 $(document).ready(function(){

   @foreach($status as $s)
   $('#status-{{ $s->id }}').hide();
   $('#status-{{ $s->id }}').attr('disabled',true);


   $('#components-{{ $s->id }}').click(function(){
      var id = $(this).val();
      if($(this).is(':checked')){ 
      $('#status-'+id).show();
       $('#status-'+id).attr('disabled',false);
      }else{
      
      $('#status-'+id).hide();
       $('#status-'+id).attr('disabled',true);
      }
      
   })

   @endforeach



 });   
    
</script>

@endsection
