@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-body border-bottom">
              <div class="card-header d-flex justify-content-between align-items-center" style="padding: 0">
                <div>
                  <h4 class="card-title">{{ $title }}</h4>
                  <p>ამ თვეში - {{ $messagesThisMonth }}. დღეს - {{ $messagesToday }}</p>
                </div>
                <div>
                  <a href="http://212.72.155.180:2313/sms-message-search/all">
                    დომოფონზე გაგზავნილი შეტყობინებები
                  </a>
                </div>
              </div>
              <form id="blockFilterForm" class="align-items-center mt-2" method="GET"
                action="{{ route('messages.index') }}">
                <div class="d-flex mt-1 gap-2 w-50">
                  <select id="blockFilter" class="form-control" name="block_id">
                    <option value="">აირჩიე კორპუსი</option>
                    @foreach ($blocks as $block)
                      <option value="{{ $block->id }}" {{ request('block_id') == $block->id ? 'selected' : '' }}>
                        {{ $block->name }}
                      </option>
                    @endforeach
                  </select>

                  <select id="messageTypeFilter" class="form-control" name="message_type">
                    <option value="">სმს-ის ტიპი</option>
                    <option value="phone_operations"
                      {{ request('message_type') == 'phone_operations' ? 'selected' : '' }}>
                      დევაისებზე გაგზავნილი
                    </option>
                    <option value="notify_balance" {{ request('message_type') == 'notify_balance' ? 'selected' : '' }}>
                      აბონენტებთან გაგზავნილი
                    </option>
                  </select>
                </div>
                <button type="submit" class="btn btn-primary ml-2 mt-2">გაფილტვრა</button>
              </form>

            </div>
            <div class="card-datatable table-responsive p-1">
              <table class="dt-column-search table" id="messagesTable">
                <thead class="table-light">
                  <tr>
                    <th>სახელი, გვარი</th>
                    <th>აბონენტის ნომერი</th>
                    <th>კორპუსი</th>
                    <th>ნომერი</th>
                    <th>სტატუსი</th>
                    <th>შეტყობინება</th>
                    <th>თარიღი</th>
                  </tr>
                </thead>
              </table>
            </div>
          </div>
          <!-- list and filter end -->
        </section>
        <!-- users list ends -->
      </div>
    </div>
  </div>
  <!-- END: Content-->
@endsection

@push('scripts')
  <script>
    $(document).ready(function() {
      var table = $('#messagesTable').DataTable({
        "aaSorting": [],
        "processing": true,
        "serverSide": true,
        "ajax": {
          "url": "{{ route('messages.search') }}",
          "dataType": "json",
          "type": "POST",
          "data": function(d) {
            d._token = "{{ csrf_token() }}";
            d.block_id = $('#blockFilter').val();
            d.message_type = $('#messageTypeFilter').val(); 
          }
        },
        "drawCallback": function(settings) {
          feather.replace();
        },
        language: {
          url: '/app-assets/data/locales/ka.json'
        },
        columns: [{
            data: 'user',
            name: 'user',
            searchable: false,
            orderable: false
          },
          {
            data: 'account',
            name: 'account',
            searchable: false,
            orderable: false
          },
          {
            data: 'block',
            name: 'block',
            searchable: false,
            orderable: false
          }, // Added block column
          {
            data: 'number',
            name: 'number',
            searchable: false,
            orderable: false
          },
          {
            data: 'status',
            name: 'status',
            searchable: false,
            orderable: false
          },
          {
            data: 'message',
            name: 'message',
            searchable: false,
            orderable: false
          },
          {
            data: 'sent_at',
            name: 'sent_at',
            searchable: false,
            orderable: false
          },
        ],
        "pageLength": 10, // Set the page length
        "lengthMenu": [
          [10, 25, 50, -1],
          [10, 25, 50, "All"]
        ] // Adjust page length menu options
      });

      $('#blockFilterForm').on('submit', function(e) {
        e.preventDefault();
        table.ajax.reload();
      });
    });
  </script>
@endpush