@extends('admin.layouts.layout')

@push('page_style')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
@endpush

@section('content')
<div class="mb-4">
    <div class="servicestitle">
        <h3>{{ $module }}</h3>
        <div class="services_searchbtn d-flex align-items-center gap-2 ms-auto">          
          <div class="contact_btns">
              @if($permission['create'])
                <a href="{{ route($routePrefix . '.create') }}" class="add_btn btn"><img src="{{ asset('images/template.svg') }}"> Add New</a>
              @endif
              @if(isset($filters) && !empty($filters))
                <a href="javascript:void(0);" class="filter_btn btn w-auto show-panel" data-id="filter-panel"><img src="{{ asset('images/filter.svg') }}"></a>                
              @endif              
          </div>
        </div>
    </div>   
    <div class="row clearfix" id="filter-panel" style="display: {{ request()->get('filter') ? 'block' : 'none' }};">
        <div class="col-lg-12 col-sm-12">
        @include('admin.components.filter-form')
        </div>
    </div> 
    <div class="service_contentarea">
        <div class="table-responsive">
            <table class="table service_table">
                <tr>
                    <th>Company Name</th>
                    <th>Phone</th>
                    <th>Address</th>
                    <th>Zip Code</th>                    
                    <th>Owner Name</th>
                    <th>Owner Email</th>
                    <th>Status</th>
                    @if($permission['create'] || $permission['edit'] || $permission['destroy'])
                    <th width="25%" style="text-align: center;">Action</th>
                    @endif
                </tr>
                @foreach ($data as $key => $value)
                <tr>
                    <td>{{ $value->name }}</td>
                    <td>{{ \App\Helpers\Helper::formatPhone($value->company_phone ?? '') }}</td>
                    <td>{{ $value->address_line1 . ', ' . $value->city . ', ' . $value->state . ', ' . $value->postal }}</td>
                    <td>{{ $value->postal }}</td>
                    <td>
                        @php
                            // Use eager loaded relationship if available, otherwise fetch it
                            if ($value->relationLoaded('owner')) {
                                $owner = $value->owner->first();
                            } else {
                                $owner = $value->owner()->first();
                            }
                        @endphp
                        {{ $owner ? trim(($owner->first_name ?? '') . ' ' . ($owner->last_name ?? '')) : '-' }}
                    </td>
                    <td>{{ $owner ? ($owner->email ?? '-') : '-' }}</td>
                    <td>
                        @if($value->status == 1)
                            <span class="badge bg-success">Active</span>
                        @else
                            <span class="badge bg-danger">Deactivated</span>
                        @endif
                    </td>
                    @if($permission['edit'] || $permission['destroy'])
                    <td class="text-right">
                      <div class="d-flex gap-2 justify-content-center">
                        <a href="{{ route('tenant.assign-user', $value->id) }}" class="show-modal-lg" data-toggle="tooltip" title="Assign User" data-original-title="Assign User" data-tenant_id="{{ $value->id }}"><img src="{{ asset('images/user.png') }}"></a>
                        @if($permission['edit'])
                        <a href="{{ route($routePrefix . '.edit', [$value->id]) }}" data-toggle="tooltip" title="Edit" data-original-title="Edit"><img src="{{ asset('images/edit.svg') }}"></a>
                        @endif
                        @if($permission['destroy'])
                        <a data-toggle="tooltip" title="Delete" data-confirm="Are You Sure?|This action can not be undone. Do you want to continue?" data-confirm-yes="event.preventDefault();
                            document.getElementById('delete-form-{{$value->id}}').submit();" data-original-title="Delete"><img src="{{ asset('images/delete_black.svg') }}"></a>
                        {!! html()->form('DELETE', route(
                            $routePrefix . '.destroy',
                            [$value->id]
                            ))->attributes([
                            'style' => 'display:inline',
                            'id'    => 'delete-form-' . $value->id  
                        ])->open() !!}
                        {!! html()->form()->close() !!}
                        @endif
                        
                        @if($value->status == 1)
                        <button type="button" class="btn btn-sm btn-outline-danger btn-toggle-tenant-status" 
                            data-tenant-id="{{ $value->id }}" 
                            data-status="0"
                            data-name="{{ $value->name }}"
                            title="Deactivate Tenant">
                            <i class="fas fa-ban"></i>
                        </button>
                        @else
                        <button type="button" class="btn btn-sm btn-outline-success btn-toggle-tenant-status" 
                            data-tenant-id="{{ $value->id }}" 
                            data-status="1"
                            data-name="{{ $value->name }}"
                            title="Activate Tenant">
                            <i class="fas fa-check-circle"></i>
                        </button>
                        @endif
                      </div>
                    </td>
                    @endif
                </tr>
                @endforeach
                @if(count($data) == 0)
                <tr>
                    <td colspan="{{ ($permission['create'] || $permission['edit'] || $permission['destroy']) ? '8' : '7' }}">
                         <div class="alert alert-danger">No Data</div>
                    </td>
                </tr>
                @endif
            </table>
        </div>
    </div>
</div>

@include('admin.components.pagination')    

@push('page_script')
<script>
  $('#myModal').on('hidden.bs.modal', function () {
      location.reload(); // Reloads the page
  });
  
  // Toggle tenant status handler (Activate/Deactivate)
  $(document).on('click', '.btn-toggle-tenant-status', function() {
      const btn = $(this);
      const tenantId = btn.data('tenant-id');
      const newStatus = btn.data('status');
      const tenantName = btn.data('name');
      const action = newStatus == 1 ? 'activate' : 'deactivate';
      const actionText = newStatus == 1 ? 'Activate' : 'Deactivate';
      const iconType = newStatus == 1 ? 'question' : 'warning';
      const confirmBtnColor = newStatus == 1 ? '#28a745' : '#dc3545';
      
      let warningText = `Are you sure you want to ${action} "${tenantName}"?`;
      if (newStatus == 0) {
          warningText += '\n\nNote: All users associated with this tenant will be unable to login until the tenant is reactivated.';
      }
      
      Swal.fire({
          title: `${actionText} Tenant?`,
          text: warningText,
          icon: iconType,
          showCancelButton: true,
          confirmButtonColor: confirmBtnColor,
          cancelButtonColor: '#6c757d',
          confirmButtonText: `Yes, ${action}!`,
          cancelButtonText: 'Cancel'
      }).then((result) => {
          if (result.isConfirmed) {
              $.ajax({
                  url: '{{ route("tenant.toggle-status") }}',
                  method: 'POST',
                  data: {
                      _token: '{{ csrf_token() }}',
                      tenant_id: tenantId,
                      status: newStatus
                  },
                  success: function(response) {
                      if (response.success) {
                          Swal.fire({
                              title: 'Success!',
                              text: response.message,
                              icon: 'success',
                              timer: 2000,
                              showConfirmButton: false
                          }).then(() => {
                              window.location.reload();
                          });
                      } else {
                          Swal.fire('Error', response.message || 'Failed to update tenant status', 'error');
                      }
                  },
                  error: function(xhr) {
                      const errorMsg = xhr.responseJSON?.message || 'An error occurred while updating tenant status.';
                      Swal.fire('Error', errorMsg, 'error');
                  }
              });
          }
      });
  });
</script>
@endpush

@endsection