@extends('layouts.admin.app')
@section('content')
<link rel="stylesheet" href="//code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script>
<script src="https://cdn.ckeditor.com/4.13.1/standard/ckeditor.js"></script> 
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<style type="text/css">
   .form-control {
   background: none;
   border: 1px solid #d2d6da;
   border-radius: 0.375rem;
   border-top-left-radius: 0.375rem !important;
   border-bottom-left-radius: 0.375rem !important;
   padding: 0.625rem 0.75rem !important;
   line-height: 1.3 !important;
   }
   .form-control:focus {
   color: #495057;
   background-color: transparent;
   border-color: #d2d6da;
   outline: 0;
   box-shadow: none;
   }
   .form-fill {
   margin-top: 10px;
   }
   input.option1 {
   margin-left: 20px;
   }
   span.certificate-option {
   margin-left: 6px;
   }
   .ps-relative {
   position: relative;
   }
   a.extra-fields-customer {
   position: absolute;
   right: 0;
   top: 36px;
   }
   .learning {
   width: 92%;
   }
   .remove{
   	position: relative;
   	margin-top: 11px;
   }
   a.remove-field.btn-remove-customer {
    position: absolute;
    right: 0;
    top: 10px;
    /* margin-top: 5px; */
}
   .customer_records_dynamic {
   margin-top: 12px;
   }
   i.fa.fa-times-circle {
   position: relative;
   top: -11px;
   }
   .customer_records_dynamic1 {
   margin-top: 12px;
   }
   .customer_records_dynamic2 {
   margin-top: 12px;
   }
   a.extra-fields-customer1 {
   position: absolute;
   right: 0;
   top: 39px;
   }

   a.extra-fields-customer2 {
   position: absolute;
   right: 0;
   top: 40px;
   }
   span.select2-selection.select2-selection{
   min-height: 42px;
   overflow: auto;
   position: relative;
   border: 1px solid #d2d6da;

   }
   .select2-container--default .select2-selection--multiple .select2-selection__choice {
   background-color: #1772b4;
   color: #fff;
   border: 1px solid #1772b4;
   }
   button.select2-selection__choice__remove {
   color: #fff!important;
   }
   .select2-selection__choice__remove:hover{
   color: #333!important;
   }
</style>
<div class="container-fluid py-4">
   <div class="row">
      <div class="col-12">
         <div class="card my-4">
            <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
               <div class="bg-gradient-primary shadow-primary border-radius-lg pt-4 pb-3">
                  <h6 class="text-white text-capitalize ps-3">Seo Meta</h6>
               </div>
            </div>
            <div class="card-body px-0 pb-2 mx-3 mb-5">
               <form action="{{route('admin.seo-meta.store')}}" method="post" enctype="multipart/form-data">
                  @csrf
                  <div class="row" style="margin-bottom:40px">
                     <h4> Add Seo Meta</h4>
                     @if(Session::has('success'))
                        <div class="alert alert-success text-white">
                              {{ Session::get('success') }}
                        </div>
                     @endif
                     @if(Session::has('error'))
                     <div class="alert alert-danger text-white">
                        {{ Session::get('error') }}
                     </div>
                     @endif
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="url">Url:</label>
                           <input name="url" class="form-control" type="text" id="url" value="">
                           @if ($errors->has('url')) <span class="text-danger">{{ $errors->first('url') }}</span> @endif
                        </div>
                     </div>
                     <input type="hidden" name="update_id" id="update_id" value="">
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="title">Title:</label> 
                           <input name="title" class="form-control" type="text" id="title" value="">
                           @if ($errors->has('title')) <span class="text-danger">{{ $errors->first('title') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="description">Description:</label>
                           <textarea name="description" class="form-control" type="text" id="description"></textarea>
                           @if ($errors->has('description')) <span class="text-danger">{{ $errors->first('description') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="keywords">Keywords:</label>
                           <textarea name="keywords" class="form-control" type="text" id="keywords"></textarea>
                           @if ($errors->has('keywords')) <span class="text-danger">{{ $errors->first('keywords') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="ogtitle">Og:Title:</label> 
                           <input name="ogtitle" class="form-control" type="text" id="ogtitle" value="">
                           @if ($errors->has('ogtitle')) <span class="text-danger">{{ $errors->first('ogtitle') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="ogdescription">Og:Description:</label>
                           <textarea name="ogdescription" class="form-control" type="text" id="ogdescription"></textarea>
                           @if ($errors->has('ogdescription')) <span class="text-danger">{{ $errors->first('ogdescription') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="ogimage">Og:Image:</label> 
                           <input name="ogimage" class="form-control" type="file" id="ogimage">
                           @if ($errors->has('ogimage')) <span class="text-danger">{{ $errors->first('ogimage') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="ogimageurl">Og:Image Url:</label> 
                           <input name="ogimageurl" class="form-control" type="text" id="ogimageurl" value="">
                           @if ($errors->has('ogimageurl')) <span class="text-danger">{{ $errors->first('ogimageurl') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="ogurl">Og:Url:</label> 
                           <input name="ogurl" class="form-control" type="text" id="ogurl" value="">
                           @if ($errors->has('ogurl')) <span class="text-danger">{{ $errors->first('ogurl') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="twittercard">Twitter Card:</label> 
                           <input name="twittercard" class="form-control" type="text" id="twittercard" value="">
                           @if ($errors->has('twittercard')) <span class="text-danger">{{ $errors->first('twittercard') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="twittersite">Twitter Site:</label> 
                           <input name="twittersite" class="form-control" type="text" id="twittersite" value="">
                           @if ($errors->has('twittersite')) <span class="text-danger">{{ $errors->first('twittersite') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="twittercreater">Twitter Creater:</label> 
                           <input name="twittercreater" class="form-control" type="text" id="twittercreater" value="">
                           @if ($errors->has('twittercreater')) <span class="text-danger">{{ $errors->first('twittercreater') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="h1">H1</label> 
                           <input name="h1" class="form-control" type="text" id="h1" value="">
                           @if ($errors->has('h1')) <span class="text-danger">{{ $errors->first('h1') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="h2">H2</label> 
                           <input name="h2" class="form-control" type="text" id="h2" value="">
                           @if ($errors->has('h2')) <span class="text-danger">{{ $errors->first('h2') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="h3">H3</label> 
                           <input name="h3" class="form-control" type="text" id="h3" value="">
                           @if ($errors->has('h3')) <span class="text-danger">{{ $errors->first('h3') }}</span> @endif
                        </div>
                     </div> <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="h4">H4</label> 
                           <input name="h4" class="form-control" type="text" id="h4" value="">
                           @if ($errors->has('h4')) <span class="text-danger">{{ $errors->first('h4') }}</span> @endif
                        </div>
                     </div>
                      <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="">Status:</label>
                           <select class="form-control" name="status">
                           <option value="" >--Select Status--</option>
                           <option value="0">Inactive</option>
                           <option value="1">Active</option>
                             
                           </select>
                           @if ($errors->has('status')) <span class="text-danger">{{ $errors->first('status') }}</span> @endif
                        </div>
                     </div>
                  </div>
                  
                  </div>
                  <div class="row">
                     <div class="col-12 text-center">
                        @if(isset($seoId) && $seoId!="")
                        <input class="btn mb-0 btn-primary" value="Update" type="submit" >
                        @else
                        <input class="btn mb-0 btn-primary" value="Submit" type="submit" >
                        @endif
                     </div>
                  </div>
               </form>
            </div>
         </div>
      </div>
   </div>
   <script>
      
   </script>
   <script type="text/javascript">

      $( function() {
         $( "#datepicker" ).datepicker();
         $( "#datepicker1" ).datepicker();
         $('.js-example-basic-multiple').select2();

         var contents;
         for (let i = 1; i <= 100; i++) {
            contents += "<option value="+i+">" + i + "</option>";
         }
         $('.count-list').html(contents);
      });

      $('.extra-fields-customer').click(function() {
         $('.customer_records_dynamic').append('<div class="remove"> <input type="text" name="learning_point[]" class="form-control learning" id="learning" onfocus="focused(this)" onfocusout="defocused(this)" required> <a href="#" class="remove-field btn-remove-customer"><i class="fa fa-times-circle" aria-hidden="true"></i></a></div>');
      });

      $('.extra-fields-customer1').click(function() {
         $('.customer_records_dynamic1').append('<div class="remove"> <input type="text" name="required_point[]" class="form-control learning" id="learning" onfocus="focused(this)" onfocusout="defocused(this)" required> <a href="#" class="remove-field btn-remove-customer"><i class="fa fa-times-circle" aria-hidden="true"></i></a></div>');
      });

      $('.extra-fields-customer2').click(function() {
         $('.customer_records_dynamic2').append('<div class="remove"> <input type="text" name="description_details[]" class="form-control description" id="description" onfocus="focused(this)" onfocusout="defocused(this)" required><br><input type="text" name="description_data[]" class="form-control description" id="description" onfocus="focused(this)" onfocusout="defocused(this)" required> <a href="#" class="remove-field btn-remove-customer"></a> <a href="#" class="remove-field btn-remove-customer"><i class="fa fa-times-circle" aria-hidden="true"></i></a></div>');
      });
      
      $(document).on('click', '.remove-field', function(e) {
         $(this).parent('.remove').remove();
         e.preventDefault();
      });

      $("#sprice").on('change',function(){
         var sellprice = $("#sprice").val();
         var price = $("#price").val();
         var pricedifference = price-sellprice;
         $("#pricediff").val(pricedifference);
      });

   </script>
   @include('layouts.admin.footer')
</div>
@endsection