@extends('layouts.adminapp')

@section('content')
<style>
.richTextBtn{
    padding: 3px;
    font-size: 13px;
}
</style>

{{-- Designation --}}
<x-app-flash/>
  
  <div class="card">
    <div class="card-header">     
      <div class="row">
          <div class="col-sm-12 col-md-6 col-lg-7">
            <h1 class="h3 mb-2 text-gray-800">{{__('lng.CreateReceipt')}} </h1> 
          </div>
          <div class="col-sm-12 col-md-6 col-lg-5">
            <label for="">{{__('lng.SelectReceipt')}}</label>
            <select class="form-control" onchange="SelectReceiptPrintForm(this.value)">
              @foreach ($ReceiptPrintForms as $ReceiptPrintForm)
                <option value="{{$ReceiptPrintForm->id}}" {{$ReceiptPrintForm->id == $SelectReceiptPrintFormID? 'Selected':''}}>{{ preg_replace('/(?<!\ )[A-Z]/', ' $0', $ReceiptPrintForm->title) }}</option>
              @endforeach
            </select>
          </div>           
      </div>    
    </div>
        <div class="card-body" id="result-body">
        </div>
        <div class="card-footer">
        </div>
  </div>

<script>
    SelectReceiptPrintForm('{{$SelectReceiptPrintFormID}}');

    function SelectReceiptPrintForm(Value){
      // alert(Value);
        $.ajax({
            url: '{{ route('SelectReceiptPrintForm') }}',
            method: "get",
            data: {_token: '{{ csrf_token() }}',Value:Value},
            success: function (response){  
            // alert(response);
                LoadRechtextBox();
                document.getElementById('result-body').innerHTML=response; 
            }
        }); 
    }

  function RestoreDefault(ID){
      $.ajax({
          url: '{{ route('ReceiptPrintFormRestoreDefault') }}',
          method: "get",
          data: {_token: '{{ csrf_token() }}',id:ID},
          success: function (response){  
          // alert(response);
              LoadRechtextBox();
              document.getElementById('result-RestoreDefault').innerHTML=response; 
          }
      });
      window.location.reload();

  }

    function LoadRechtextBox(){
      $(document).ready(function() {
        $('#summernote').summernote({
          placeholder: 'Text.....',
          tabsize: 4,
          height: 375,
          focus: true   
        });
      });
      
    }

    function AddRechText(ButtonText){
      var MediumText='<button  onclick="removeText(this.id)" data-value='+ButtonText+' id='+ButtonText+' class="btn btn-primary richTextBtn" type="button">'+ButtonText+' </button> <span class='+ButtonText+'>&nbsp;</span>';
      $('#summernote').summernote('pasteHTML', MediumText);
      $('#summernote').summernote('editor.setLastRange', 3);

    }

    function removeText(Value){
      $('#'+Value).remove();
      $('.'+Value).remove();
    }

</script>

@endsection