@extends('Backend.layouts.app')
@section('content')
    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.7/css/fileinput.css" media="all" rel="stylesheet" type="text/css"/>
    <link href="{{asset('css/news-notices.css')}}" media="all" rel="stylesheet" type="text/css"/>
    
    <div class="page-header row no-gutters py-4">
      <div class="col-12 col-sm-4 text-center text-sm-left mb-0">
        <span class="text-uppercase page-subtitle">Notices Page</span>
        <h3 class="page-title">Add New Notices</h3>
      </div>
    </div>
    <form class="add-new-post" action="{{isset($edit)?route('notices.update', $edit->id):route('notices.store')}}" method="post" enctype="multipart/form-data">
    <div class="row">
        <div class="col-lg-9 col-md-12">
            <!-- Add New Post Form -->
            <div class="card card-small mb-3">   
                <div class="card-body">

                        @csrf
                        @if(isset($edit))
                        @method('PATCH')
                        @endif
                        <input type="hidden" name="status" id="status" />
                        <label>News Title <span class="required">*</span> </label>
                        <input class="form-control form-control-lg mb-3" id="title" type="text" name="title" value="{{old('title')?old('title'):(isset($edit)?$edit->title:'')}}" placeholder="Album Title" data-preview-file-type="text">
                          @if($errors->first('title'))
                          <div class="text-danger mb-2">* 
                            {{$errors->first('title')}}
                          </div>
                          @endif
                        <label>Description<span class="required">*</span> </label>
					              <textarea id="mytextarea" name="description">{!! isset($edit)?$edit->description:(old('description')?old('description'):'') !!}</textarea>
                        <div class="form-group">
                        <label>Attach Files <span class="required">*</span> </label>
                            <div class="file-loading">
                                <input id="file-2" type="file" name="file[]" class="file form-control" data-overwrite-initial="true" multiple data-min-file-count="1" accept=".doc,docx,.pdf,.xls,.xlsx,.ppt,.pptx">
                            </div>                            
                              @if($errors->first('file.*'))
                              <div class="text-danger mb-2">* 
                                {{$errors->first('file.*')}}
                              </div>
                              @elseif($errors->first('file'))
                              <div class="text-danger mb-2">* 
                                {{$errors->first('file')}}
                              </div>                              
                              @endif
                        </div>
                </div>
            </div>
        </div>
        <div class="col-lg-3 col-md-12">
            <!-- Post Overview -->
            <div class='card card-small mb-3'>
              <div class="card-header border-bottom">
                <h6 class="m-0">Actions</h6>
              </div>
              <div class='card-body p-0'>
                <ul class="list-group list-group-flush">
                  <li class="list-group-item p-3">
                    <span class="d-flex mb-2">
                      <i class="material-icons mr-1">flag</i>
                      <strong class="mr-1">Status:</strong>
                      <strong class="text-warning"> {{isset($edit)?$edit->status:'Not saved'}}</strong>
                    </span>
                    <span class="d-flex">
                      <i class="material-icons mr-1">score</i>
                      <strong class="mr-1">Preview:</strong>
                      <strong class="text-warning">@if(isset($edit) && $edit->status=='Saved')<a target='_blank' href="{{url('/').'/'.$edit->slug.'/'.$edit->group_id}}"><i class='fa fa-eye'></i> Click</a>@else No @endif</strong>
                    </span>
                  </li>
                  <li class="list-group-item d-flex px-3">
                    @if(isset($edit))
                    <button type="submit" id="update" class="btn btn-sm btn-accent ml-auto" name="status" value="save">
                        <i class="material-icons">file_copy</i> {{$edit->status=='Saved'?'Update':'Save'}}
                    </button>
                    @else
                    <button type="submit" id="draft" class="btn btn-sm btn-outline-accent" name="status" value="draft">
                        <i class="material-icons">save</i> Save Draft
                    </button>
                    <button type="submit" id="save" class="btn btn-sm btn-accent ml-auto"  name="status" value="save">
                        <i class="material-icons">file_copy</i> Publish
                    </button>
                    @endif
                  </li>
                </ul>
              </div>
            </div>
            <!-- / Post Overview -->
            
            @if(isset($edit))
              <div class='card card-small mb-3'>
                <div class="card-header border-bottom">
                  <h6 class="m-0">Added Images</h6>
                </div>
                <div class='card-body p-0 added-images'>
                  @foreach($edit->files as $e)
                  <div class="file-preview-frame krajee-default  kv-preview-thumb">
                    <div class="kv-file-content">
                      <a href="{{$e->getFullUrl()}}" target="_blank">
                        <img class="img-thumbnail bg-black" src="{{ asset('/images/pdf.png') }}">
                      </a>
                    </div>
                    <div class="file-thumbnail-footer">
                      <div class="file-actions">
                        <div class="file-footer-buttons">
                          <a href="{{route('noticesfile.delete', $e->id)}}">
                            <button type="button" class="kv-file-remove btn btn-kv btn-default btn-outline-secondary" title="Remove file">
                            <i class="fa fa-trash"></i>
                          </button>
                          </a>
                        </div>
                      </div>
                      <div class="clearfix"></div>
                    </div>
                  </div>
                  @endforeach
                </div>
              </div>
            @endif
        </div>
    </div>
  </form>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.7/js/fileinput.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.7/themes/fa/theme.js" type="text/javascript"></script>

    <script type="text/javascript">
        $("#file-2").fileinput({
            theme: 'fa',
            uploadUrl: "{{route('gallery.featuredImage')}}",
            allowedFileExtensions: ['doc', 'docx','xls','xlsx','pdf','ppt','pptx'],
            overwriteInitial: false,
            maxFileSize:2000,
            maxFilesNum: 10,
            slugCallback: function (filename) {
                $(this).val(filename);
                return filename.replace('(', '_').replace(']', '_');
            }

        });

    </script>
    @endsection