@extends('Admin.Layout.main_layout')
@section('main_container')
<!-- begin app-main -->
<div class="app-main" id="main">
   <!-- begin container-fluid -->
   <div class="container-fluid">
      <!-- begin row -->
      <div class="row">
         <div class="col-md-12 m-b-30">
            <!-- begin page title -->
            <div class="d-block d-sm-flex flex-nowrap align-items-center">
               <div class="page-title mb-2 mb-sm-0">
                  <h1>Category</h1>
               </div>
               <div class="ml-auto d-flex align-items-center">
                  <a class="btn btn-dark text-white" href="{{ route('category') }}">Manage Category</a>
               </div>
            </div>
            <!-- end page title -->
         </div>
      </div>
      <!-- end row -->
      <!--mail-Compose-contant-start-->

      @php
function categoryTree($parent_id = 0, $sub_mark = '',$my_id='')
{

    $query =  DB::table('category')->where('parent_id','=', $parent_id)->get();
   
    if(count($query) > 0){
        foreach($query as $value){
            if($value->cat_id == $my_id){
                $s = "selected='selected'";
            }else{
                $s="";
            }
            echo '<option value="'.$value->cat_id.'" '.$s.' >'.$sub_mark.$value->cat_name.'</option>';
            categoryTree($value->cat_id, $sub_mark.'---',$my_id);
        }
    }
}
@endphp

      <div class="row account-contant">
         <div class="col-12">
            <div class="card card-statistics">
               <div class="card-body p-0">
                  <div class="page-account-form">
                     <div class="form-titel border-bottom p-3">
                        <h5 class="mb-0 py-2">Update Category</h5>
                     </div>
                     <div class="p-3">
                        <form role="form" method="POST" enctype="multipart/form-data" action="{{ route('updateCategory', $category->cat_id) }}">
                           @csrf

                        <div class="row">

                           <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="form-group">
                                    <label>Parent Category</label>
                                    <select name="parent_id"  class="form-control  selectpicker "  data-show-subtext="true" data-live-search="true">
                                    <option value="">Please Select</option>
                                    @php
                                    echo categoryTree(0,'',$category->parent_id);
                                    @endphp         
                                    </select>
                                </div>
                            </div>

                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="form-group">
                                    <label>Category Name<span style="color:#ff0000">*</span></label>
                                    <input class="form-control" name="category_name"  placeholder="Enter Category Name" value="{{  $category->cat_name }}" type="text" required>
                                    @error('category_name')
                                    <p class="text-danger"><small>{{ $message }}</small></p>
                                    @enderror
                                </div>
                            </div>

                        </div>
                        <div class="row">
                           <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                              <div class="form-group">
                                 <label>Category Slug</label>
                                 <input class="form-control" value="{{ $category->slug }}" name="slug" placeholder="Enter Slug" type="text">
                              </div>
                           </div>
                           <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="form-group">
                                    <label>Category Order</label>
                                    <input class="form-control" name="cat_order"  placeholder="Enter Category Order" value="{{  $category->cat_order }}" type="text">

                                </div>
                            </div>
                        </div>

                        <div class="row">
                           <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="form-group">
                                    <label>Sub Title</label>
                                    <input class="form-control" value="{{ $category->subtitle }}" name="subtitle" placeholder="Enter Alt Tag" type="text">
                                </div>
                            </div>

                            <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="form-group">
                                    <label>Alt Tag</label>
                                    <input class="form-control" value="{{ $category->alt_tag }}" name="alt_tag" placeholder="Enter Alt Tag" type="text">
                                </div>
                            </div>
                        </div>

                        <div class="row">
                           <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                              <div class="form-group">
                                 <label>Catlog Image</label>
                                 <input class="form-control" name="category_image" type="file"><br>
                                 @if(isset($category->cat_img) && $category->cat_img != null)
                                 <img src="{{ URL('public/upload/category') }}/{{ $category->cat_img }}" alt="" height="100px" width="100px">
                                 @else
                                    No Image
                                 @endif
                                 @error('category_image')
                                       <p class="text-danger"><small>{{ $message }}</small></p>
                                    @enderror
                              </div>
                           </div>

                           <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                              <div class="form-group">
                                 <label>Banner Image</label>
                                 <input class="form-control" name="banner_image" type="file"><br>
                                 @if(isset($category->banner_image) && $category->banner_image != null)
                                 <img src="{{ URL('public/upload/banner') }}/{{ $category->banner_image }}" alt="" height="100px" width="100px">
                                 @else
                                    No Image
                                 @endif
                                 @error('banner_image')
                                       <p class="text-danger"><small>{{ $message }}</small></p>
                                    @enderror
                              </div>
                           </div>
                        </div>
                        
                        <div class="row">
                             <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                <div class="form-group">
                                   <label>Category Name HTML</label>
                                    <input class="form-control" name="cat_html"  placeholder="Enter Category Name HTML" value="{{  $category->cat_html }}" type="text">

                                </div>
                            </div>
                        </div>

                        <div class="row">
                              <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                                 <div class="form-group">
                                    <label>Description</label>
                                       <textarea  id="desc" class="ckeditor form-control" name="desc" cols="50" rows="15" style="width:100%;px; height:300px;" mce_editable="true">{{ $category->desc }}
                                    </textarea>
                                 </div>
                              </div>
                        </div>

                        <div class="row">
                              <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                                 <div class="form-group">
                                    <label>Rubric Field</label>
                                       <textarea  id="rubric_field" class="ckeditor form-control" name="rubric_field" cols="50" rows="15" style="width:100%;px; height:300px;" mce_editable="true">{{ $category->rubric_field }}
                                    </textarea>
                                 </div>
                              </div>
                        </div>

                        <div class="row">
                              <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                                 <div class="form-group">
                                    <label>FAQ</label>
                                       <textarea  id="faq" class="ckeditor form-control" name="faq" cols="50" rows="15" style="width:100%;px; height:300px;" mce_editable="true">{{ $category->faq }}
                                    </textarea>
                                 </div>
                              </div>
                        </div>

                        <h2 class="p-1 text-black">SEO Field</h2>
                           <div class="row">
                              <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                 <div class="form-group">
                                    <label>Meta Title</label>
                                    <input class="form-control" value="{{ $category->meta_title }}"  placeholder="Enter Meta Title" name="meta_title" type="text">
                                 </div>
                              </div>
                              <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                 <div class="form-group">
                                    <label>Meta keyword</label>
                                    <input class="form-control" value="{{ $category->meta_keyword }}" name="meta_keyword" placeholder="Enter Keyword" type="text">
                                 </div>
                              </div>
                           </div>
                           <div class="row">
                              <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                                 <div class="form-group">
                                    <label>Meta Description</label>
                                    <textarea class="form-control"  name="meta_desc" cols="50" rows="15" style="width:100%;px; height:300px;" mce_editable="true">{{ $category->meta_desc }}</textarea>
                                 </div>
                              </div>
                           </div>
                           <div class="row">
                              <div class="col-lg-6 col-md-6 col-sm-12 col-12">
                                 <div class="text-left">
                                    <button type="submit" id="submit" class="btn btn-dark text-white my-4">Update</button>
                                    <a href="{{ route('category') }}" class="btn btn-danger my-4">Cancel</a>
                                 </div>
                              </div>
                           </div>
                        </form>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
      <!--mail-Compose-contant-end-->
   </div>
   <!-- end container-fluid -->
</div>
<!-- end app-main -->
</div>
<!-- end app-container -->
<script src="//cdn.ckeditor.com/4.14.1/standard/ckeditor.js"></script>
<script type="text/javascript">
   $(document).ready(function () {
       var editorOptions = {
           allowedContent: true,
           extraAllowedContent: 'div(*)', // Allow div elements
           // Add additional allowed elements or classes by separating them with commas
           extraAllowedContent: 'div(col-md-*,container-fluid,row)',
       };
       var rubric_field = CKEDITOR.replace('rubric_field', editorOptions);
       var faq = CKEDITOR.replace('faq', editorOptions);
       var desc = CKEDITOR.replace('desc', editorOptions);
   });
</script>
@endsection