@extends('layouts.metronic')

@section('content')
<div class="portlet light bordered">
    <div class="portlet-title">
        <div class="caption font-dark">            
            <span class="caption-subject bold uppercase"><i class="fa fa-edit"></i> {{ (!empty($offer))?'Editare':'Adăugare' }} Ofertă</span>
        </div>            
    </div>

    <div class="panel-body">
        @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
        @endif

        <div class="col-md-2"></div>
        <div class="col-md-8">
            <div class="row">
                <form method="POST" action="{{ route('offer.save') }}"> 
                    <input type="hidden" name="_token" value="{{ csrf_token() }}">                        
                    
                    @if (!empty($offer))    
                        <input type="hidden" name="id" value="{{ $offer->id }}">
                    @endif

                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="name">Nume</label>
                            <input type="text" class="form-control" id="name" name="name" value="{{ (!empty($offer))?$offer->name:'' }}" required>
                        </div>
                        <div class="form-group">
                            <label for="name">Pdf Link</label>
                            <div class="input-group">
                                <span class="input-group-btn">
                                    <a id="lfm_pdf" data-input="thumbnail_pdf" class="btn btn-primary">
                                        <i class="fa fa-file"></i> Alege
                                    </a>
                                </span>
                                <input id="thumbnail_pdf" class="form-control" type="text" name="pdfPath" value="{{ (!empty($offer))?$offer->pdfPath:'' }}" required>
                                
                            </div>  
                            
                            
                        </div>
                        @if (!empty($offer) && $offer->pdfPath != null )
                        <div class="form-group">
                            <button class="btn sbold green" type="button" data-toggle="modal" data-target="#myModal"> Vizualizează PDF</button>
                        </div>
                        @endif
                    </div>
                    
                    <div id="toggleOfferPanel" class="col-md-6">
                        <div class="form-group">
                            <label>  
                                <a data-toggle="tooltip" title="<img width='800px' src='{{ asset('layout/HINT - Banner Oferte.png') }}' />">Titlu Link</a>
                            </label>
                            <input type="text" maxlength="20" class="form-control" id="link_title" name="link_title" value="{{ (!empty($offer))?$offer->link_title:'' }}">
                        </div>

                        <div class="form-group">
                            <label>  
                                <a data-toggle="tooltip" title="<img width='800px' src='{{ asset('layout/HINT - Banner Oferte.png') }}' />">Descriere Link</a>
                            </label>
                            <input type="text" maxlength="120" class="form-control" id="link_description" name="link_description" value="{{ (!empty($offer))?$offer->link_description:'' }}">
                        </div>

                        <div class="form-group">                                
                            <label>  
                                <a data-toggle="tooltip" title="<img width='800px' src='{{ asset('layout/HINT - Banner Oferte.png') }}' />">Link Icon</a>
                            </label>
                            <div class="input-group">
                                <span class="input-group-btn">
                                    <a id="lfm_link" data-input="thumbnail_link" data-preview="holder_link" class="btn btn-primary">
                                        <i class="fa fa-file"></i> Alege
                                    </a>
                                </span>
                                <input id="thumbnail_link" class="form-control" type="text" name="link_iconPath" value="{{ (!empty($offer))?$offer->link_iconPath:'' }}">
                            </div>
                            <div class="input-group">
                                <br>
                                <img id="holder_link" width="200px" src="{{ (!empty($offer))?$offer->link_iconPath:'' }}">
                            </div>
                        </div>
                    </div>

                    

                    <div class="form-group">
                        <div class="col-md-6">
                            <a href="{{ route('offer_category.edit', $offer->offer_category_id) }}">
                                <button type="button" class="btn btn-danger">                            
                                    <i class="fa fa-close" aria-hidden="true"></i> Închide
                                </button>
                            </a>
                        </div>

                        <div class="col-md-6">
                            <button type="submit" class="btn btn-primary pull-right"><i class="fa fa-save" aria-hidden="true"></i> Salvează</button>
                        </div>
                    </div>
                </form>
            </div>
         </div>   
        <div class="col-md-3"></div>
    </div>
</div>

<div class="modal fade" id="myModal" role="dialog">
   <div class="modal-dialog" style="width:60%">
      <!-- Modal content-->
       <div class="modal-content">
            <div class="modal-header">
                <a class="pull-right" style="color:red" data-dismiss="modal"><i class="fa fa-close"></i></a>
            </div>
            <div class="modal-body" style="height: 85vh; overflow-y: auto;">
                <embed src="{{ (!empty($offer))?$offer->pdfPath:'' }}" type="application/pdf" width="100%" height="99%" />                              
            </div>            
      </div>
   </div>
</div>

@endsection

@section('head')  
<style>
    .tooltip-inner {
        max-width: 100% !important;
    }

.tooltip-main {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  font-weight: 700;
  background: #f3f3f3;
  border: 1px solid #737373;
  color: #737373;
  margin: 4px 121px 0 5px;
  float: right;
  text-align: left !important;
}

.tooltip-qm {
  float: left;
  margin: -2px 0px 3px 4px;
  font-size: 12px;
}

.tooltip-inner {
  max-width: 100% !important;
  max-height: 100% !important;
  font-size: 12px;
  padding: 10px 15px 10px 20px;
  background: #FFFFFF;
  color: rgb(0, 0, 0, .7);
  border: 1px solid #737373;
  text-align: left;
}

.tooltip.show {
  opacity: 1;
}

.bs-tooltip-auto[x-placement^=bottom] .arrow::before,
.bs-tooltip-bottom .arrow::before {
  border-bottom-color: #f00;
  /* Red */
}

</style>
@endsection

@section('scripts')  
<script src="/vendor/laravel-filemanager/js/lfm.js"></script>

<script>   
    $('#toggleOfferPanel [data-toggle="tooltip"]').tooltip({
        animated: 'fade',
        placement: 'bottom',
        html: true
    });

    $('#lfm_link').filemanager('images'); 
    $('#lfm_pdf').filemanager('files'); 
</script>
@endsection

@section('menuVariables')
    var menuItemName = "menuOffers";
    var submenuItemName = "";
@stop