@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>  --}}
{{-- <script src="https://cdn.ckeditor.com/ckeditor5/34.0.0/balloon-block/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>
<script src="{{ url('admn/ckeditor/ckeditor/ckeditor.js') }}"></script>
<script src="{{ url('admn/ckeditor/ckeditor/samples/js/sample.js') }}"></script>
<link href="{{ url('admn/ckeditor/ckeditor/samples/css/samples.css') }}" rel="stylesheet" />
<link href="{{ url('admn/ckeditor/ckeditor/samples/toolbarconfigurator/lib/codemirror/neo.css') }}" rel="stylesheet" />
<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">Blog Management</h6>
               </div>
            </div>
            <div class="card-body px-0 pb-2 mx-3 mb-5">
               <form action="{{route('admin.blog.store')}}" method="post" enctype="multipart/form-data">
                  @csrf
                  <div class="row" style="margin-bottom:40px">
                     <h4>Add Blog Management</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="blogimage">Blog Image:</label>
                           <input name="blogimage" class="form-control" type="file" id="blogimage" value="" loading="lazy">
                           @if ($errors->has('blogimage')) <span class="text-danger">{{ $errors->first('blogimage') }}</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="category">Category:</label>
                            <select name="category" class="form-control" id="category">
                                @if (count($categories) > 0)
                                <option value="desabled">Selecte Category</option>
                                    @foreach ($categories as $category)
                                        <option value="{{ $category->id }}"
                                                @if(isset($bolgdetail) && $bolgdetail->category == $category->id) selected @endif>
                                            {{ $category->name }}
                                        </option>
                                    @endforeach
                                @endif
                            </select>
                            @if ($errors->has('category'))
                                <span class="text-danger">{{ $errors->first('category') }}</span>
                            @endif
                        </div>

                     </div>
                     <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="title">Slug:</label>
                           <input name="slug" class="form-control" type="text" id="slug" value="">
                           @if ($errors->has('slug')) <span class="text-danger">{{ $errors->first('slug') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="posteddate">Posted Date:</label>
                           <input name="posteddate" class="form-control" type="date" id="posteddate" value="">
                           @if ($errors->has('posteddate')) <span class="text-danger">{{ $errors->first('posteddate') }}</span> @endif
                        </div>
                     </div>
                     <div class="col-md-6 form-fill">
                        <div class="form-group">
                           <label for="editor">Description:</label>
                           <textarea name="description" class="form-control" type="text" id="editor"></textarea>
                           @if ($errors->has('description')) <span class="text-danger">{{ $errors->first('description') }}</span> @endif
                        </div>
                     </div>
                     <script>

                        // CKEDITOR.replace( 'description' );
                        initSample();
                     </script>
                      <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