@extends('layouts.admin.app')
@section('content')
 <script src="{{asset('admin/js/just-validate.min.js')}}"></script>
 <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content " style="border:none;background:transparent!important">
      <div class="modal-body">
      <img src="{{asset('admin/gif/Hourglass.gif')}}" alt="processing..." />
      </div>
    </div>
  </div>
</div>
      <div class="pd-30">
        <h4 class="tx-gray-800 mg-b-5 title">Add Manual Report</h4>
        <p class="mg-b-0"></p>
      </div><!-- d-flex -->
      <div class="br-pagebody mg-t-5 pd-x-30">
        <div class="br-section-wrapper row row-sm">
          <div class="col-sm-12 col-xl-12">
            <form id="myform" class="form" method="post" action="/gpclrmainportal/report-manual" enctype="multipart/form-data">
              @csrf @method('POST')
              <div class="row">
              <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>UUID<span class="text-danger">*</span></label>
                    <select id="uuid" class="form-control m-select2 m-select2-general" name="uuid" data-validate-field="uuid">
                    <option value="">Select UUID</option>
                    @foreach($companies as $key => $n)
                    <option value="{{$n->uuid}}" @if(old('uuid') == $n->uuid) 'Selected' @endif>{{$n->uuid}}<b>[{{$n->company_name}}]</b></option>
                    @endforeach
                  </select>
                  </div>
                  @error('uuid')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>Region<span class="text-danger">*</span></label>
                    <select id="region_id" name="region_id" class="form-control" data-validate-field="region_id">
                      <option value="">Select</option>
                      @foreach($regions as $key => $n)
                        <option value="{{$n->id}}">{{$n->name}}</option>
                      @endforeach
                    </select>
                  </div>
                  @error('region_id')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                      <label>Cas No<span class="text-danger">*</span></label>
                      <select id="cas_no" name="cas_no" class="form-control" data-validate-field="cas_no">
                        <option value="">Select</option>
                      </select>
                      <!-- <input type="text" name="cas_no" placeholder="Cas No" class="form-control" data-validate-field="cas_no" value="{{old('name')}}"> -->
                  </div>
                  @error('cas_no')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                 <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>Cas Name</label>
                     <input id="casname" type="text" name="cas_name" placeholder="Cas Name" class="form-control"  value="{{old('name')}}">
                  </div>
                  @error('cas_name')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>Company Name<span class="text-danger">*</span></label>
                     <input id="company_name" type="text" name="company_name" placeholder="Company Name" class="form-control" data-validate-field="company_name" value="{{old('company_name')}}">
                  </div>
                  @error('company_name')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>EC No<span class="text-danger">*</span></label>
                     <input id="ec" type="text" name="ec_no" placeholder="EC No" class="form-control" data-validate-field="ec_no" value="{{old('name')}}">
                  </div>
                  @error('ec_no')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>SIP</label>
                    <input id="file" type="file" name="sip_pdf" class="form-control file" onchange="return fileValidation('file')">
                  </div>
                  @error('sip_pdf')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>JSF</label>
                     <input id="file1" type="file" name="jsf_pdf" class="form-control file" onchange="return fileValidation('file1')">
                  </div>
                  @error('jsf_pdf')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>Scope <span class="text-danger">*</span></label>
                    <select class="form-control m-select2 m-select2-general" name="scope" data-validate-field="scope">
                      <option value="">Select Scope For JSF</option>
                      <option value="Transported Isolated Intermediate 1-1000 t/a">Transported Isolated Intermediate 1-1000 t/a</option>
                      <option value="Transported Isolated Intermediate >1000 t/a">Transported Isolated Intermediate >1000 t/a</option>
                      <option value="1-10 t/a">1-10 t/a</option>
                      <option value="10-100 t/a">10-100 t/a</option>
                      <option value="100-1000 t/a">100-1000 t/a</option>
                    </select>
                  </div>
                 
                </div>
                 
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>SIEF</label>
                     <input id="file2" type="file" name="sief_pdf" class="form-control file" onchange="return fileValidation('file2')">
                  </div>
                  @error('sief_pdf')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
                <div class="col-lg-6 col-md-6 col-sm-12">
                  <div  class="form-group">
                    <label>INVOICE</label>
                     <input id="file3" type="file" name="invoice_pdf" class="form-control file" onchange="return fileValidation('file3')">
                  </div>
                  @error('invoice_pdf')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
              </div>
              <div class="col-lg-12 col-md-6 col-sm-12 pt-3 p-0">
                  <div  class="form-group">
                  <input  type="hidden" name="pdf_flag" checked  value="true" >
                    <!-- <label>Checked this checkbox if you want to display uploaded pdf files instead of sip, jsf,invoice, forms entry?</label>  -->
                  </div>
                  @error('invoice_pdf')
                    <div class="text-danger">
                      {{ $message }}
                    </div>
                  @enderror
                </div>
              </div>
              <button type="submit" class="btn btn-style1 text-white mr-2">Submit</button>
              <a class="btn btn-style2 text-white" href="/gpclrmainportal/report-manual">Back</a>
            </form>
          </div>
      </div>
          </div>
     
@endsection
@section('scripts')
<script src="{{asset('admin/js/just-validate.min.js')}}"></script>
<script>
  $('#uuid').on('change', function () {
    var uuid = $(this).val();
    if (uuid) {
        $.ajax({
            url: '/gpclrmainportal/manual-related-details/' + uuid,
            type: "GET",
            dataType: "json",
            success: function (data) {
              // console.log(data);
                $('select[name="cas_no"]').empty();
                $('select[name="cas_no"]').append('<option value="">Select Cas No</option>');
                $.each(data.cas, function (key, value) {
                  // console.log(value);
                    $('select[name="cas_no"]').append('<option value=" ' + value.cas_no + '">' + value.cas_no + '</option>');
                })
                $('select[name="region_id"]').empty();
                $('select[name="region_id"]').append('<option value="">Select Region</option>');
                $.each(data.regions, function (key, value) {
                  // console.log(value);
                    $('select[name="region_id"]').append('<option value=" ' + value.region_id + '">' + value.region.name + '</option>');
                })
                $('#company_name').val(data.company.company_name)
               
                
            },
            error:function(data) {
              // console.log(data);
            }

        })
    } else {
        $('select[name="cas_no"]').empty();
    }
  });
  $('select[name="region_id"]').on('change', function () {
   
    var region_id = $(this).val();
    var uuid = $('#uuid').val();
    // alert(region_id);
    if (region_id) {
        $.ajax({
            url: '/gpclrmainportal/manual-region-related-details/' + region_id + '/' + uuid,
            type: "GET",
            dataType: "json",
            success: function (data) {
              // console.clear();
              // console.log(data);
                $('select[name="cas_no"]').empty();
                $('select[name="cas_no"]').append('<option value="">Select Cas No</option>');
                $.each(data, function (key, value) {
                  // console.log(value);
                    $('select[name="cas_no"]').append('<option value=" ' + value.cas_no + '">' + value.cas_no + '</option>');
                })
                 
            },
            error:function(data) {
              // console.log(data);
            }

        })
    } else {
        $('select[name="cas_no"]').empty();
    }
  });
  $('#cas_no').on('change', function () {
    var cas_no = $(this).val();
    // alert(cas_no);
    if (cas_no) {
        $.ajax({
            url: '/gpclrmainportal/manual-related-casdetails/' + cas_no.trim(),
            type: "GET",
            dataType: "json",
            success: function (data) {
              // console.clear();
              // console.log(data);
                $('#ec').val(data.ec_no)
                $('#casname').val(data.cas_name)
                
            },
            error:function(data) {
              // console.log(data);
            }

        })
    } else {
        $('#ec').empty();
    }
  });
  new window.JustValidate('.form', {
      rules: {
        region_id:{required: true}, 
        ec_no:{required: true}, 
        cas_no:{required: true},
        uuid:{required: true},
        company_name:{required: true},
        tonnage:{required: true},
        scope:{required: true},
      },
      messages: {
        scope: {
            remote: 'Field is required',
        },
        tonnage: {
            remote: 'Field is required',
        },
        region_id: {
            remote: 'Field is required',
        },
        ec_no: {
            remote: 'Field is required',
            
        },cas_no: {
            remote: 'Field is required',
            
        },uuid: {
            remote: 'Field is required',
        },
        company_name: {
            remote: 'Field is required',
        },
      },
      submitHandler: function(form) { $("#exampleModal").modal({backdrop: 'static', keyboard: false}); $('#myform').submit();},
   });
  
</script>
@endsection