<?php defined('BASEPATH') or exit('No direct script access allowed'); ?>

<div class="row">
    <div class="col-md-12">
        <div class="panel_s">
            <div class="panel-body">
                <div class="row">
                    <div class="col-md-6">
                        <h4 class="no-margin">
                            <i class="fa fa-tasks" aria-hidden="true"></i>
                            <?php echo _l('desk_moloni_queue_management'); ?>
                        </h4>
                    </div>
                    <div class="col-md-6 text-right">
                        <div class="btn-group">
                            <?php if (has_permission('desk_moloni', '', 'create')) { ?>
                            <button type="button" class="btn btn-success" data-toggle="modal" data-target="#add-task-modal">
                                <i class="fa fa-plus"></i> <?php echo _l('desk_moloni_add_task'); ?>
                            </button>
                            <?php } ?>
                            <button type="button" class="btn btn-info" id="refresh-queue">
                                <i class="fa fa-refresh"></i> <?php echo _l('refresh'); ?>
                            </button>
                            <?php if (has_permission('desk_moloni', '', 'edit')) { ?>
                            <button type="button" class="btn btn-warning" id="toggle-processing">
                                <i class="fa fa-pause" id="toggle-processing-icon"></i>
                                <span id="toggle-processing-text"><?php echo _l('desk_moloni_pause_processing'); ?></span>
                            </button>
                            <?php } ?>
                        </div>
                        <a href="<?php echo admin_url('modules/desk_moloni'); ?>" class="btn btn-default ml-2">
                            <i class="fa fa-arrow-left"></i> <?php echo _l('back_to_dashboard'); ?>
                        </a>
                    </div>
                </div>
                <hr class="hr-panel-separator" />

                <!-- Queue Summary Cards -->
                <div class="row" id="queue-summary">
                    <div class="col-lg-3 col-md-6">
                        <div class="panel panel-info">
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-xs-3">
                                        <i class="fa fa-tasks fa-3x"></i>
                                    </div>
                                    <div class="col-xs-9 text-right">
                                        <div class="huge" id="total-tasks"><?php echo h($queue_summary['total_tasks'] ?? 0); ?></div>
                                        <div><?php echo _l('desk_moloni_total_tasks'); ?></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6">
                        <div class="panel panel-warning">
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-xs-3">
                                        <i class="fa fa-clock-o fa-3x"></i>
                                    </div>
                                    <div class="col-xs-9 text-right">
                                        <div class="huge" id="pending-tasks"><?php echo h($queue_summary['pending_tasks'] ?? 0); ?></div>
                                        <div><?php echo _l('desk_moloni_pending_tasks'); ?></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6">
                        <div class="panel panel-primary">
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-xs-3">
                                        <i class="fa fa-cog fa-3x fa-spin"></i>
                                    </div>
                                    <div class="col-xs-9 text-right">
                                        <div class="huge" id="processing-tasks"><?php echo h($queue_summary['processing_tasks'] ?? 0); ?></div>
                                        <div><?php echo _l('desk_moloni_processing_tasks'); ?></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6">
                        <div class="panel panel-danger">
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-xs-3">
                                        <i class="fa fa-exclamation-triangle fa-3x"></i>
                                    </div>
                                    <div class="col-xs-9 text-right">
                                        <div class="huge" id="failed-tasks"><?php echo h($queue_summary['failed_tasks'] ?? 0); ?></div>
                                        <div><?php echo _l('desk_moloni_failed_tasks'); ?></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Filters and Search -->
                <div class="row">
                    <div class="col-md-12">
                        <div class="panel_s">
                            <div class="panel-body">
                                <form id="queue-filters">
                                    <div class="row">
                                        <div class="col-md-2">
                                            <select class="form-control" name="status" id="filter-status">
                                                <option value=""><?php echo _l('desk_moloni_all_statuses'); ?></option>
                                                <option value="pending"><?php echo _l('desk_moloni_status_pending'); ?></option>
                                                <option value="processing"><?php echo _l('desk_moloni_status_processing'); ?></option>
                                                <option value="completed"><?php echo _l('desk_moloni_status_completed'); ?></option>
                                                <option value="failed"><?php echo _l('desk_moloni_status_failed'); ?></option>
                                                <option value="retry"><?php echo _l('desk_moloni_status_retry'); ?></option>
                                            </select>
                                        </div>
                                        <div class="col-md-2">
                                            <select class="form-control" name="entity_type" id="filter-entity-type">
                                                <option value=""><?php echo _l('desk_moloni_all_entities'); ?></option>
                                                <?php foreach ($entity_types as $type) { ?>
                                                <option value="<?php echo h($type); ?>"><?php echo _l('desk_moloni_entity_' . $type); ?></option>
                                                <?php } ?>
                                            </select>
                                        </div>
                                        <div class="col-md-2">
                                            <select class="form-control" name="task_type" id="filter-task-type">
                                                <option value=""><?php echo _l('desk_moloni_all_task_types'); ?></option>
                                                <?php foreach ($task_types as $type) { ?>
                                                <option value="<?php echo h($type); ?>"><?php echo _l('desk_moloni_task_' . $type); ?></option>
                                                <?php } ?>
                                            </select>
                                        </div>
                                        <div class="col-md-2">
                                            <select class="form-control" name="priority" id="filter-priority">
                                                <option value=""><?php echo _l('desk_moloni_all_priorities'); ?></option>
                                                <option value="1"><?php echo _l('desk_moloni_priority_high'); ?></option>
                                                <option value="5"><?php echo _l('desk_moloni_priority_normal'); ?></option>
                                                <option value="9"><?php echo _l('desk_moloni_priority_low'); ?></option>
                                            </select>
                                        </div>
                                        <div class="col-md-2">
                                            <input type="date" class="form-control" name="date_from" id="filter-date-from" placeholder="<?php echo _l('desk_moloni_date_from'); ?>">
                                        </div>
                                        <div class="col-md-2">
                                            <input type="date" class="form-control" name="date_to" id="filter-date-to" placeholder="<?php echo _l('desk_moloni_date_to'); ?>">
                                        </div>
                                    </div>
                                    <div class="row mt-3">
                                        <div class="col-md-12">
                                            <button type="button" class="btn btn-primary" id="apply-filters">
                                                <i class="fa fa-filter"></i> <?php echo _l('apply_filters'); ?>
                                            </button>
                                            <button type="button" class="btn btn-default" id="clear-filters">
                                                <i class="fa fa-times"></i> <?php echo _l('clear_filters'); ?>
                                            </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Queue Table -->
                <div class="row">
                    <div class="col-md-12">
                        <div class="panel_s">
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="checkbox">
                                            <input type="checkbox" id="select-all-tasks">
                                            <label for="select-all-tasks"><?php echo _l('desk_moloni_select_all'); ?></label>
                                        </div>
                                    </div>
                                    <div class="col-md-6 text-right">
                                        <?php if (has_permission('desk_moloni', '', 'edit')) { ?>
                                        <div class="btn-group" id="bulk-actions" style="display: none;">
                                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                <i class="fa fa-cogs"></i> <?php echo _l('desk_moloni_bulk_actions'); ?> <span class="caret"></span>
                                            </button>
                                            <ul class="dropdown-menu">
                                                <li><a href="#" data-action="retry"><?php echo _l('desk_moloni_retry_selected'); ?></a></li>
                                                <li><a href="#" data-action="cancel"><?php echo _l('desk_moloni_cancel_selected'); ?></a></li>
                                                <li><a href="#" data-action="priority_high"><?php echo _l('desk_moloni_set_high_priority'); ?></a></li>
                                                <li><a href="#" data-action="priority_normal"><?php echo _l('desk_moloni_set_normal_priority'); ?></a></li>
                                                <li><a href="#" data-action="priority_low"><?php echo _l('desk_moloni_set_low_priority'); ?></a></li>
                                                <li role="separator" class="divider"></li>
                                                <li><a href="#" data-action="delete" class="text-danger"><?php echo _l('desk_moloni_delete_selected'); ?></a></li>
                                            </ul>
                                        </div>
                                        <?php } ?>
                                        <?php if (has_permission('desk_moloni', '', 'delete')) { ?>
                                        <button type="button" class="btn btn-warning" id="clear-completed">
                                            <i class="fa fa-trash"></i> <?php echo _l('desk_moloni_clear_completed'); ?>
                                        </button>
                                        <?php } ?>
                                    </div>
                                </div>
                                
                                <div class="table-responsive mt-3">
                                    <table class="table table-hover" id="queue-table">
                                        <thead>
                                            <tr>
                                                <th width="30px">
                                                    <input type="checkbox" id="table-select-all">
                                                </th>
                                                <th><?php echo _l('desk_moloni_task_id'); ?></th>
                                                <th><?php echo _l('desk_moloni_task_type'); ?></th>
                                                <th><?php echo _l('desk_moloni_entity'); ?></th>
                                                <th><?php echo _l('desk_moloni_priority'); ?></th>
                                                <th><?php echo _l('desk_moloni_status'); ?></th>
                                                <th><?php echo _l('desk_moloni_attempts'); ?></th>
                                                <th><?php echo _l('desk_moloni_scheduled_at'); ?></th>
                                                <th><?php echo _l('desk_moloni_actions'); ?></th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td colspan="9" class="text-center">
                                                    <i class="fa fa-spinner fa-spin"></i> <?php echo _l('loading'); ?>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>

                                <!-- Pagination -->
                                <div class="row">
                                    <div class="col-md-6">
                                        <div id="pagination-info"></div>
                                    </div>
                                    <div class="col-md-6">
                                        <nav aria-label="Queue pagination">
                                            <ul class="pagination pull-right" id="pagination-controls">
                                            </ul>
                                        </nav>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Add Task Modal -->
<div class="modal fade" id="add-task-modal" tabindex="-1" role="dialog" aria-labelledby="addTaskModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="addTaskModalLabel">
                    <i class="fa fa-plus"></i> <?php echo _l('desk_moloni_add_sync_task'); ?>
                </h4>
            </div>
            <form id="add-task-form">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="task_type"><?php echo _l('desk_moloni_task_type'); ?></label>
                                <select class="form-control" name="task_type" id="task_type" required>
                                    <option value=""><?php echo _l('desk_moloni_select_task_type'); ?></option>
                                    <option value="sync_client"><?php echo _l('desk_moloni_sync_client'); ?></option>
                                    <option value="sync_product"><?php echo _l('desk_moloni_sync_product'); ?></option>
                                    <option value="sync_invoice"><?php echo _l('desk_moloni_sync_invoice'); ?></option>
                                    <option value="sync_estimate"><?php echo _l('desk_moloni_sync_estimate'); ?></option>
                                    <option value="sync_credit_note"><?php echo _l('desk_moloni_sync_credit_note'); ?></option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="entity_type"><?php echo _l('desk_moloni_entity_type'); ?></label>
                                <select class="form-control" name="entity_type" id="entity_type" required>
                                    <option value=""><?php echo _l('desk_moloni_select_entity_type'); ?></option>
                                    <option value="client"><?php echo _l('desk_moloni_entity_client'); ?></option>
                                    <option value="product"><?php echo _l('desk_moloni_entity_product'); ?></option>
                                    <option value="invoice"><?php echo _l('desk_moloni_entity_invoice'); ?></option>
                                    <option value="estimate"><?php echo _l('desk_moloni_entity_estimate'); ?></option>
                                    <option value="credit_note"><?php echo _l('desk_moloni_entity_credit_note'); ?></option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-8">
                            <div class="form-group">
                                <label for="entity_id"><?php echo _l('desk_moloni_entity_id'); ?></label>
                                <input type="number" class="form-control" name="entity_id" id="entity_id" required min="1">
                                <small class="help-block"><?php echo _l('desk_moloni_entity_id_help'); ?></small>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="priority"><?php echo _l('desk_moloni_priority'); ?></label>
                                <select class="form-control" name="priority" id="priority">
                                    <option value="1"><?php echo _l('desk_moloni_priority_high'); ?></option>
                                    <option value="5" selected><?php echo _l('desk_moloni_priority_normal'); ?></option>
                                    <option value="9"><?php echo _l('desk_moloni_priority_low'); ?></option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label for="payload"><?php echo _l('desk_moloni_additional_payload'); ?> (<?php echo _l('optional'); ?>)</label>
                                <textarea class="form-control" name="payload" id="payload" rows="3" placeholder='{"key": "value"}'></textarea>
                                <small class="help-block"><?php echo _l('desk_moloni_payload_help'); ?></small>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">
                        <?php echo _l('cancel'); ?>
                    </button>
                    <button type="submit" class="btn btn-primary">
                        <i class="fa fa-plus"></i> <?php echo _l('desk_moloni_add_task'); ?>
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Task Details Modal -->
<div class="modal fade" id="task-details-modal" tabindex="-1" role="dialog" aria-labelledby="taskDetailsModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="taskDetailsModalLabel">
                    <i class="fa fa-info-circle"></i> <?php echo _l('desk_moloni_task_details'); ?>
                </h4>
            </div>
            <div class="modal-body" id="task-details-content">
                <div class="text-center">
                    <i class="fa fa-spinner fa-spin"></i> <?php echo _l('loading'); ?>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">
                    <?php echo _l('close'); ?>
                </button>
            </div>
        </div>
    </div>
</div>

<script src="<?php echo module_dir_url('desk_moloni', 'assets/js/queue_management.js'); ?>"></script>

<style>
.huge {
    font-size: 40px;
}

.panel-footer {
    background-color: transparent;
    border-top: 1px solid #e7e7e7;
}

.status-badge {
    font-size: 11px;
    padding: 4px 8px;
    border-radius: 12px;
}

.priority-badge {
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 8px;
}

.priority-high {
    background-color: #d73925;
    color: white;
}

.priority-normal {
    background-color: #5bc0de;
    color: white;
}

.priority-low {
    background-color: #5cb85c;
    color: white;
}

.task-actions .btn {
    margin-right: 2px;
    margin-bottom: 2px;
}

.table th {
    background-color: #f8f9fa;
}

.queue-filter-form {
    background-color: #f8f9fa;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}

#bulk-actions {
    margin-left: 10px;
}

.pagination {
    margin: 0;
}

#pagination-info {
    line-height: 32px;
    font-size: 13px;
    color: #666;
}
</style>