@extends('layouts.app')

@push('styles')
<style>
   .home_1 { border-bottom: 0!important; }
   .dataTables_wrapper {
   min-height: auto;
   }
   .addNewBtn {
      display: inline-block;
      padding: 6px 12px;
      margin-left: 5px;
      color: white;
      text-decoration: none;
      border-radius: 4px;
      font-size: 0.875rem;
   }
</style>
@endpush

@section('title','Mailbox - '.ucfirst($mailbox->name))

@section('content')
<div class="loadPages01">
   <!-- Top Actions Header -->
   <div class="actionsHeader">
      {{-- <ul>
         <li><button class="btn btn-block"><i class="las la-print"></i> Print</button></li>
         <li><button class="btn btn-block"><i class="las la-file-pdf"></i> PDF</button></li>
         <li><button class="btn btn-block"><i class="las la-file-excel"></i> Excel</button></li>
         <li><button class="btn btn-block"><i class="las la-file-word"></i> Word</button></li>
      </ul> --}}
   </div>
   
   <div class="card card-body card-dashboard-twentyfive border-left-0 border-right-0 p-0 viewPage">
      <div class="align-items-stretch">
         <div class="card bd-0 navtab-card01 viewPageTabs">
            <div class="card-header card-header-tab">
               <!-- Tabs can be added here if needed -->
            </div>
            
            <div class="az-tab-content tab-content-box tab-content-box-view viewPaneTab">
               <div id="azTab1" class="az-tab-pane active">
                  <div class="mail-view personal-div01 mx-2 bg-white">
                     <div class="message-body py-3 px-2">
                        <div class="item-details-page">
                           <div class="row">
                              <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                                 @if(!empty(Request::get('block')) && Request::get('block')==1)
                                    <h5 class="mb-2 mt-2 groupTitle">Edit Mail Account</h5>
                                    @include('admin.master.mailbox.components.block_1')
                                 @else
                                    <h5 class="mb-2 mt-2 groupTitle">Mailbox Information
                                       <a href="javascript:void(0)" style="background-color:#1eae1e;" class="addNewBtn" id="syncBtn">
                                          <i class="las la-sync"></i> Sync Now
                                       </a>
                                       <a href="javascript:void(0)" style="background-color:orange;" class="addNewBtn" id="testBtn">
                                          <i class="las la-check"></i> Test Mailbox
                                       </a>
                                       @can('mailbox.edit')
                                       <a style="background-color:#0078d4;" href="{{ route('masters.mailbox.show', crypt_encrypt($mailbox->id)) }}?block=1" class="addNewBtn">
                                          <i class="las la-pen"></i> Edit
                                       </a>
                                       @endcan
                                       @can('mailbox.delete')
                                       <a style="background: red" href="javascript:void(0)" class="addNewBtn" id="deleteBtn">
                                          <i class="las la-trash"></i> Delete
                                       </a>
                                       <form method="POST" action="{{ route('masters.mailbox.delete', crypt_encrypt($mailbox->id)) }}" id="delete-form">
                                          @csrf
                                          @method('DELETE')
                                       </form>
                                       @endcan
                                    </h5>
                                    
                                    <div class="group">
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Name <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->name }}</label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Queue<span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->queue->name ?? 'N/A' }}</label>
                                       </div>

                                       <div class="row">
                                          <label class="col-lg-4 items-label">Protocol <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ strtoupper($mailbox->protocol) }}</label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Validate Certificate <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->validate_cert ? 'Yes' : 'No' }}</label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Encryption <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ strtoupper($mailbox->encryption) }}</label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Host <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->host }}</label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Port <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->port }}</label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Username <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->username }}</label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Sync Interval (Minutes)<span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->sync_interval }}</label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Next Sync <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->next_sync_at ? date('d-m-Y H:i', strtotime($mailbox->next_sync_at)) : 'N/A' }}</label>
                                       </div>
                                       
                                       @if($mailbox->updated_at)
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Last Synced <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ date('d-m-Y H:i', strtotime($mailbox->updated_at)) }}</label>
                                       </div>
                                       @endif
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Status <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">
                                             @if($mailbox->status)
                                                <span class="badge badge-success">Active</span>
                                             @else
                                                <span class="badge badge-danger">Inactive</span>
                                             @endif
                                          </label>
                                       </div>
                                       
                                       <div class="row">
                                          <label class="col-lg-4 items-label">Created At <span class="dot-input01">:</span></label> 
                                          <label class="col-lg-8">{{ $mailbox->created_at ? date('d-m-Y H:i', strtotime($mailbox->created_at)) : 'N/A' }}</label>
                                       </div>
                                    </div>
                                 @endif
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>
@endsection

@push('scripts')
<script>
$(document).ready(function() {
    // Test Mailbox
    $('#testBtn').on('click', function() {
        $.ajax({
            url: "{{ route('masters.mailbox.test', crypt_encrypt($mailbox->id)) }}",
            method: 'GET',
            beforeSend: function() {
                $('#testBtn').prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Testing...');
            },
            success: function(response) {
                if (response.status) {
                    toastr.success(response.message);
                } else {
                    toastr.error(response.message);
                }
            },
            error: function(xhr) {
                if (xhr.status === 403) {
                    toastr.error('You do not have permission to test mailbox.');
                } else if (xhr.status === 401) {
                    toastr.error('Please login to continue.');
                    window.location.href = "{{ route('admin.login') }}";
                } else {
                    toastr.error('An error occurred while testing mailbox.');
                }
            },
            complete: function() {
                $('#testBtn').prop('disabled', false).html('<i class="las la-check"></i> Test Mailbox');
            }
        });
    });

    // Sync Mailbox
    $('#syncBtn').on('click', function() {
        $.ajax({
            url: "{{ route('masters.mailbox.sync', crypt_encrypt($mailbox->id)) }}",
            method: 'GET',
            beforeSend: function() {
                $('#syncBtn').prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Syncing...');
            },
            success: function(response) {
                if (response.status) {
                    toastr.success(response.message);
                    // Reload the page after 2 seconds to show updated sync time
                    setTimeout(function() {
                        location.reload();
                    }, 2000);
                } else {
                    toastr.error(response.message);
                }
            },
            error: function(xhr) {
                if (xhr.status === 403) {
                    toastr.error('You do not have permission to sync mailbox.');
                } else if (xhr.status === 401) {
                    toastr.error('Please login to continue.');
                    window.location.href = "{{ route('admin.login') }}";
                } else {
                    toastr.error('An error occurred while syncing mailbox.');
                }
            },
            complete: function() {
                $('#syncBtn').prop('disabled', false).html('<i class="las la-sync"></i> Sync Now');
            }
        });
    });

    // Delete Mailbox
    $('#deleteBtn').on('click', function() {
        swal({
            title: "Are you sure?",
            text: "Do you really want to delete this mailbox? This action cannot be undone.",
            icon: "warning",
            buttons: true,
            dangerMode: true,
        }).then((willDelete) => {
            if (willDelete) {
                $('#delete-form').submit();
            }
        });
    });
});
</script>
@endpush