Kundesone/resources/views/components/custom-modals.blade.php

<!-- Custom Modal post -->
<div id="customModal" class="modal">
  <div class="modal-content">
    <span class="modal-close">&times;</span>
    <h5>Assign Post</h5>
    <form id="assignForm">
        <input type="hidden" id="ticket-ids" name="ticket_ids">
      <div class="mb-3">
        <label for="recipient-name" class="col-form-label">Recipient:</label>
        @php
        $companyId = getSelectedCompany();
        $company_users = get_company_users($companyId);
        @endphp
        <select name="user_assigned" class="form-control" required>
            <option>Select User</option>
            @foreach($company_users as $company_user)
            <option value="{{$company_user->user->id}}">{{$company_user->user->name}}</option>
            @endforeach
        </select>
      </div>
      <div class="mb-3">
        <label for="message-text" class="col-form-label">Message:</label>
        <textarea class="form-control" id="message-text" name="message" required></textarea>
      </div>
    </form>
    <button type="button" class="btn btn-primary assign-post">Send</button>
  </div>
</div>
<!-- Custom Modal move-->
<div id="customModal2" class="modal">
  <div class="modal-content">
    <span class="modal-close">&times;</span>
    <h5>Move</h5>
    <form>
      <div class="mb-3">
        <label for="recipient-name" class="col-form-label">Conversation moved:</label>
        <input type="text" class="form-control" id="recipient-name" placeholder="Inbox">
      </div>
     
    </form>
    <button type="button" class="btn btn-primary">Confirm</button>
  </div>
</div>
<!-- Custom Modal Replay to multiple-->
<div id="customModal3" class="modal">
  <div class="modal-content">
    <span class="modal-close">&times;</span>
    <h5>Replay to multiple</h5>
    <form>
      <div class="mb-3 mt-4">
        <p>Please choose only email conversations and try again</p>
      </div>
     
    </form>

  </div>
</div>

<script>
$(document).ready(function() {
    var $handleMultipleButton = $('.handle-multiple-btn');
    var $selectAllCheckbox = $('#select-all');
    var $ticketCheckboxes = $('.ticket-checkbox');
    var $actionButtons = $('.handle_multiple__options .tags button');
    
    // Function to toggle button states
    function updateButtonStates() {
        var selectedCount = $ticketCheckboxes.filter(':checked').length;
        $actionButtons.prop('disabled', selectedCount === 0);
    }

    // Toggle checkboxes visibility
    $handleMultipleButton.on('click', function() {
        $('.content').toggleClass('handle-multiple-active');
    });

    // Toggle all checkboxes based on 'Select all'
    $selectAllCheckbox.on('change', function() {
        $ticketCheckboxes.prop('checked', $selectAllCheckbox.prop('checked'));
        updateButtonStates();
    });

    // Toggle button states when individual checkboxes change
    $ticketCheckboxes.on('change', function() {
        updateButtonStates();
    });

    // Initialize button states
    updateButtonStates();
});

</script>

<!--Assigned Post Start-->
<script>
$(document).ready(function() {
    $('.assign-post').on('click', function() {
        
        var selectedTickets = [];
        $('.ticket-checkbox:checked').each(function() {
            selectedTickets.push($(this).attr('id').replace('ticket-', ''));
        });
        $('#ticket-ids').val(selectedTickets.join(','));

        // SweetAlert2 confirmation dialog
        Swal.fire({
            title: 'Are you sure?',
            text: 'You are about to send this message.',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes, send it!',
            cancelButtonText: 'Cancel'
        }).then((result) => {
            if (result.isConfirmed) {
                // Get form data
                var formData = $('#assignForm').serialize();

                // AJAX request to submit the form
                $.ajax({
                    url: 'assign/ticket',
                    method: 'POST',
                    headers: {
                        'X-CSRF-TOKEN': "{{ csrf_token() }}"
                    },
                    data: formData,
                    success: function(response) {
                        // Show success notification
                        Swal.fire(
                            'Assigned!',
                            'Post Assigned Successfully!',
                            'success'
                        );
                        
                        location.reload();
                        // Hide the modal
                        $('#customModal').modal('hide');
                    },
                    error: function(xhr) {
                        // Show error notification
                        Swal.fire(
                            'Error!',
                            'An error occurred. Please try again.',
                            'error'
                        );
                    }
                });
            }
        });
    });
});
</script>

<!--Assigned Post End-->

<!--Delete Post Start-->
<script>
$(document).ready(function() {
    $('#delete-posts').on('click', function() {
        
        var selectedTickets = [];
        $('.ticket-checkbox:checked').each(function() {
            selectedTickets.push($(this).attr('id').replace('ticket-', ''));
        });

        var ticket_ids = selectedTickets.join(',');

        // SweetAlert2 confirmation dialog
        Swal.fire({
            title: 'Are you sure?',
            text: 'You are about to delete selected tickets.',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes, delete them!',
            cancelButtonText: 'Cancel'
        }).then((result) => {
            if (result.isConfirmed) {
                // AJAX request to delete the tickets
                $.ajax({
                    url: 'delete/tickets',
                    method: 'POST',
                    headers: {
                        'X-CSRF-TOKEN': "{{ csrf_token() }}"
                    },
                    data: {
                        ticket_ids: ticket_ids
                    },
                    success: function(response) {
                        // Show success notification
                        Swal.fire(
                            'Deleted!',
                            'Tickets have been deleted successfully.',
                            'success'
                        );
                        // Reload the page or update the UI as needed
                        location.reload();
                    },
                    error: function(xhr) {
                        // Show error notification
                        Swal.fire(
                            'Error!',
                            'An error occurred. Please try again.',
                            'error'
                        );
                    }
                });
            }
        });
    });
});
</script>

<!--Delete Post End-->

<!--Update Status Start-->
<script>
$(document).ready(function() {
    $('.update-posts-status').on('click', function() {
        
        var status = $(this).data('status');
        
        var selectedTickets = [];
        $('.ticket-checkbox:checked').each(function() {
            selectedTickets.push($(this).attr('id').replace('ticket-', ''));
        });

        var ticket_ids = selectedTickets.join(',');

        // SweetAlert2 confirmation dialog
        Swal.fire({
            title: 'Are you sure?',
            text: 'You are about to update the status of selected tickets.',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes, update it!',
            cancelButtonText: 'Cancel'
        }).then((result) => {
            if (result.isConfirmed) {
                // AJAX request to submit the form
                $.ajax({
                    url: 'update/ticket/status',
                    method: 'POST',
                    headers: {
                        'X-CSRF-TOKEN': "{{ csrf_token() }}"
                    },
                    data: {
                        ticket_ids: ticket_ids,
                        status: status
                    },
                    success: function(response) {
                        // Show success notification
                        Swal.fire(
                            'Updated!',
                            'Tickets status has been updated successfully.',
                            'success'
                        );
                        // Optionally reload or update the page
                        location.reload();
                    },
                    error: function(xhr) {
                        // Show error notification
                        Swal.fire(
                            'Error!',
                            'An error occurred. Please try again.',
                            'error'
                        );
                    }
                });
            }
        });
    });
});
</script>

<!--Update Status End-->