@extends('dashboard.layout.layout')

@section('content')
  <!-- BEGIN: Content-->
  <div class="app-content content ">
    <div class="content-overlay"></div>
    <div class="header-navbar-shadow"></div>
    <div class="content-wrapper container-xxl p-0">
      <div class="content-header row">
      </div>
      <div class="content-body">
        <!-- users list start -->
        <section class="app-user-list">
          <!-- list and filter start -->
          <div class="card">
            <div class="card-header">
              <h4 class="card-title mb-3">{{ $title }}</h4>
              @can('reports.store')
                <button type="button" class="btn btn-success waves-effect mb-3" data-bs-toggle="modal"
                  data-bs-target="#addTransaction"><i data-feather='plus'></i> ტრანზაქციის დამატება</button>
              @endcan
            </div>
            <div class="containr">
              <form method="GET" action="{{ route('reports.show', 1) }}" class="row pe-2 ps-2">
                <div class="from-group col-md-3 mb-2">
                  <input type="text" name="account_number"
                    @if (request()->has('account_number')) value="{{ request('account_number') }}" @endif
                    placeholder="აბონენტის ნომერი" class="form-control">
                </div>
                <div class="from-group col-md-3 mb-2">
                  <select name="provider_id" class="form-select select2" data-placeholder="პროვაიდერი">
                    <option value="">პროვაიდერი</option>
                    @foreach ($providers as $provider)
                      <option @if (request()->has('provider_id') && request('provider_id') == $provider->id) selected @endif value="{{ $provider->id }}">
                        {{ $provider->name }}</option>
                    @endforeach
                  </select>
                </div>
                <div class="from-group col-md-3 mb-2">
                  <select name="service_id" class="form-select select2" data-placeholder="სერვისი">
                    <option value="">სერვისი</option>
                    @foreach ($services as $service)
                      <option @if (request()->has('service_id') && request('service_id') === $service->id) selected @endif value="{{ $service->id }}">
                        {{ $service->name }}</option>
                    @endforeach
                  </select>
                </div>
                <div class="from-group col-md-3 mb-2">
                  <select name="block_id" class="form-select select2" data-placeholder="კორპუსი">
                    <option value="">კორპუსი</option>
                    @foreach ($blocks as $block)
                      <option @if (request()->has('block_id') && request('block_id') == $block->id) selected @endif value="{{ $block->id }}">
                        {{ $block->name }}</option>
                    @endforeach
                  </select>
                </div>
                <div class="from-group col-md-3 mb-2">
                  <input type="text" name="date_from" class="bg-white form-control flatpickr-basic flatpickr-input"
                    @if (request()->has('date_from')) value="{{ request('date_from') }}" @endif
                    placeholder="თარიღი დან" />
                </div>
                <div class="from-group col-md-3 mb-2">
                  <input type="text" name="date_to" class="bg-white form-control flatpickr-basic flatpickr-input"
                    @if (request()->has('date_to')) value="{{ request('date_to') }}" @endif placeholder="თარიღი მდე" />
                </div>
                <div class="from-group col-md-3 mb-2">
                  <button class="btn btn-success w-100" type="submit"><i data-feather='search'></i> გაფილტვრა</button>
                </div>
              </form>
            </div>
            <div class="card-body border-bottom">
              <div class="alert alert-info p-1 mb-2">
                ერთი გადახდა შეიძლება დაიყოს რამდენიმე ტიპად (მაგ. ტელეფონი + ძირითადი), ამიტომ ერთი და იგივე ტრანზაქციის ID
                შესაძლოა რამდენიმე სტრიქონად გამოჩნდეს.
              </div>
              <div class="card-datatable table-responsive p-1">
                <table class="dt-column-search table" id="reportsTable">
                  <thead class="table-light">
                    <tr>
                      <th>სახელი, გვარი</th>
                      <th>აბონენტის ნომერი</th>
                      <th>კორპუსი</th>
                      <th>თანხა</th>
                      <th>სერვისი</th>
                      <th>ტრანზაქციის ID</th>
                      <th>ტრანზაქციის ტიპი</th>
                      <th>კომენტარი</th>
                      <th>თარიღი</th>
                      <th>დრო</th>
                    </tr>
                  </thead>
                  <tfoot>
                    <tr>
                      <th>სახელი, გვარი</th>
                      <th>აბონენტის ნომერი</th>
                      <th>კორპუსი</th>
                      <th>თანხა</th>
                      <th>სერვისი</th>
                      <th>ტრანზაქციის ID</th>
                      <th>ტრანზაქციის ტიპი</th>
                      <th>კომენტარი</th>
                      <th>თარიღი</th>
                      <th>დრო</th>
                    </tr>
                  </tfoot>
                </table>
              </div>
            </div>
          </div>
          <!-- list and filter end -->
        </section>
        <!-- users list ends -->
      </div>
    </div>
  </div>
  <!-- END: Content-->
  @can('reports.store')
    <div class="modal fade text-start modal-success" id="addTransaction" tabindex="-1" aria-labelledby="myModalLabel110"
      aria-hidden="true">
      <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content" method="POST" action="{{ route('reports.store') }}">
          @csrf
          <div class="modal-header">
            <h5 class="modal-title" id="myModalLabel110">ტრანსაქციის დამატება</h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <div class="row justify-content-between">
              <div class="form-group col-6">
                <label for="account_number">აბონენტის ნომერი</label>
                <input type="text" name="account_number" class="form-control" id="account_number"
                  placeholder="აბონენტის ნომერი" required>
              </div>
              <div class="form-group col-6">
                <label for="amount">თანხა</label>
                <input type="text" name="amount" class="form-control" id="amount" placeholder="თანხა" required>
              </div>
              <div class="form-group col-12 mt-3">
                <label for="datetime">თარიღი (ამ ფორმატით: {{ \Carbon\Carbon::now() }})</label>
                <input type="text" name="datetime" class="form-control" id="datetime"
                  placeholder="{{ \Carbon\Carbon::now() }}">
              </div>
              <div class="form-group col-12 mt-3">
                <label for="comment">კომენტარი</label>
                <input type="text" name="comment" class="form-control" id="comment" placeholder="კომენტარი">
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button type="submit" class="btn btn-success" data-bs-dismiss="modal">დამატება</button>
          </div>
        </form>
      </div>
    </div>
  @endcan
  <div class="modal fade text-start modal-success" id="editComment" tabindex="-1" aria-labelledby="editComment"
    aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
      <div class="modal-content" id="commentSubmit">
        <div class="modal-header">
          <h5 class="modal-title" id="editComment">კომენტარის რედაქტირება</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body">
          <div class="row justify-content-between">
            <input type="hidden" name="_token" id="CSRFtoken" value="{{ csrf_token() }}" />
            <input id="transactionId" value="" hidden />
            <div class="form-group col-12">
              <label for="commentInput">კომენტარი</label>
              <textarea name="commentInput" rows="5" class="form-control" id="commentInput" placeholder="კომენტარი"
                value=""></textarea>
            </div>
          </div>
        </div>
        <div class="modal-footer">
          <button type="submit" id="saveComment" class="btn btn-success" data-bs-dismiss="modal">შენახავა</button>
        </div>
      </div>
    </div>
  </div>
@endsection
@push('scripts')
  <script src="https://cdn.datatables.net/buttons/2.3.2/js/dataTables.buttons.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
  <script src="https://cdn.datatables.net/buttons/2.3.2/js/buttons.html5.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.2/moment.min.js"></script>
  <script src="https://cdn.datatables.net/datetime/1.2.0/js/dataTables.dateTime.min.js"></script>
  <script>
    function editComment(value) {
      $('#commentSubmit').attr('action', '/reports/' + value);
      $.get("/reports/" + value + "/edit", function(data) {
        $('#commentInput').val(data.comment)
        $('#transactionId').val(value)
      });
    }
    $('#saveComment').click(function(e) {
      e.preventDefault();
      let commentInput = $('#commentInput').val();
      console.log(commentInput);
      let id = $('#transactionId').val();
      $.ajax({
        url: '/reports/' + id,
        type: 'PUT',
        data: {
          "_token": "{{ csrf_token() }}",
          comment: commentInput
        },
        success: function(res) {
          if (res.success === 1) {
            new Notify({
              title: 'Success',
              text: 'კომენტარი განახლდა',
              status: 'success',
              autoclose: true,
              effect: 'slide',
              type: 2,
              autotimeout: 3500
            })
          }
        }
      });
    });
    $(function() {
      var table = $('#reportsTable').DataTable({
        dom: 'Blfrtip',
        lengthMenu: [
          [25, 50, 75, 100, -1],
          ['25 ჩანაწერი', '50 ჩანაწერი', '75 ჩანაწერი', '100 ჩანაწერი', 'ყველას ჩვენება']
        ],
        buttons: [],
        "drawCallback": function(settings) {
          feather.replace();
          var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
          var tooltipList = tooltipTriggerList.map(function(tooltipTriggerEl) {
            return new bootstrap.Tooltip(tooltipTriggerEl)
          })
        },
        language: {
          url: '/app-assets/data/locales/ka.json'
        },
        serverSide: true,
        ajax: "{{ route('reports.create') }}",
        columns: [{
            data: 'name',
            name: 'name'
          },
          {
            data: 'account',
            name: 'account'
          },
          {
            data: 'block',
            name: 'block'
          },
          {
            data: 'amount',
            name: 'amount'
          },
          {
            data: 'service',
            name: 'service'
          },
          {
            data: 'tnx_id',
            name: 'tnx_id'
          },
          {
            data: 'tnx_type',
            name: 'tnx_type'
          },
          {
            data: 'comment',
            name: 'comment',
            class: 'text-center'
          },
          {
            data: 'paid_at',
            name: 'paid_at'
          },
          {
            data: 'time',
            name: 'time'
          },
        ],
      });
    });
  </script>
@endpush