<?php
/**
 * Account work log tab template
 *
 * @link       https://yourwebsite.com
 * @since      1.0.0
 *
 * @package    Subscription_System
 * @subpackage Subscription_System/public/partials/account-tabs
 */

// Get user ID
$user_id = $current_user->ID;

// Pagination settings
$items_per_page = 10;
$current_page = isset($_GET['wl_page']) ? max(1, intval($_GET['wl_page'])) : 1;
$offset = ($current_page - 1) * $items_per_page;

// Get user's work logs
global $wpdb;
$table_name = $wpdb->prefix . 'subscription_work_logs';

// Check if the table exists
if ($wpdb->get_var("SHOW TABLES LIKE '$table_name'") != $table_name) {
    echo '<div class="notice notice-error"><p>Work logs table does not exist. Please contact the administrator.</p></div>';
} else {
    // Count total work logs for pagination
    $total_logs = $wpdb->get_var($wpdb->prepare(
        "SELECT COUNT(*) FROM $table_name WHERE user_id = %d",
        $user_id
    ));
    
    $total_pages = ceil($total_logs / $items_per_page);
    
    // Join with channels and work items tables to get names
    $query = "
        SELECT l.*, 
               c.name as channel_name, 
               w.name as work_item_name
        FROM $table_name l
        LEFT JOIN {$wpdb->prefix}subscription_channels c ON l.channel_id = c.id
        LEFT JOIN {$wpdb->prefix}subscription_work_items w ON l.work_item_id = w.id
        WHERE l.user_id = %d
        ORDER BY l.performed_at DESC
        LIMIT %d OFFSET %d
    ";
    
    $work_logs = $wpdb->get_results($wpdb->prepare($query, $user_id, $items_per_page, $offset));
}
?>

<div class="account-tab-content">
    <h2>My Work Logs</h2>
    
    <div class="work-log-container">
        <?php if (empty($work_logs)) : ?>
            <div class="notice notice-info">
                <p>You don't have any work logs yet.</p>
            </div>
        <?php else : ?>
            <div class="work-logs-list">
                <table class="work-logs-table">
                    <thead>
                        <tr>
                            <th>Sr. No</th>
                            <th>Channel</th>
                            <th>Work Item</th>
                            <th>Importance</th>
                            <th>Performed At</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php 
                        $serial_number = $offset + 1;
                        foreach ($work_logs as $log) : 
                        ?>
                            <tr>
                                <td><?php echo esc_html($serial_number++); ?></td>
                                <td><?php echo esc_html($log->channel_name ? $log->channel_name : 'None'); ?></td>
                                <td><?php echo esc_html($log->work_item_name ? $log->work_item_name : 'None'); ?></td>
                                <td><?php echo esc_html($log->importance); ?></td>
                                <td><?php echo esc_html(date_i18n(get_option('date_format') . ' ' . get_option('time_format'), strtotime($log->performed_at))); ?></td>
                                <td>
                                    <button type="button" class="view-work-log-btn button button-small" 
                                            data-id="<?php echo esc_attr($log->id); ?>"
                                            data-channel="<?php echo esc_attr($log->channel_name ? $log->channel_name : 'None'); ?>"
                                            data-workitem="<?php echo esc_attr($log->work_item_name ? $log->work_item_name : 'None'); ?>"
                                            data-importance="<?php echo esc_attr($log->importance); ?>"
                                            data-notes="<?php echo esc_attr($log->notes); ?>"
                                            data-performed="<?php echo esc_attr(date_i18n(get_option('date_format') . ' ' . get_option('time_format'), strtotime($log->performed_at))); ?>"
                                            data-created="<?php echo esc_attr(date_i18n(get_option('date_format') . ' ' . get_option('time_format'), strtotime($log->created_at))); ?>">
                                        View
                                    </button>
                                </td>
                            </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
                
                <?php if ($total_pages > 1) : ?>
                    <div class="work-logs-pagination">
                        <div class="pagination-info">
                            <?php 
                            $from = min($total_logs, $offset + 1);
                            $to = min($total_logs, $offset + $items_per_page);
                            echo sprintf('Showing %d-%d of %d work logs', esc_html($from), esc_html($to), esc_html($total_logs)); 
                            ?>
                        </div>
                        <div class="pagination-links">
                            <?php if ($current_page > 1) : ?>
                                <a href="?tab=worklog&wl_page=1" class="page-numbers first-page">&laquo;</a>
                                <a href="?tab=worklog&wl_page=<?php echo esc_attr($current_page - 1); ?>" class="page-numbers prev-page">&lsaquo;</a>
                            <?php endif; ?>
                            
                            <?php
                            $start_page = max(1, $current_page - 2);
                            $end_page = min($total_pages, $current_page + 2);
                            
                            if ($start_page > 1) {
                                echo '<span class="page-numbers dots">...</span>';
                            }
                            
                            for ($i = $start_page; $i <= $end_page; $i++) {
                                if ($i == $current_page) {
                                    echo '<span class="page-numbers current">' . esc_html($i) . '</span>';
                                } else {
                                    echo '<a href="?tab=worklog&wl_page=' . esc_attr($i) . '" class="page-numbers">' . esc_html($i) . '</a>';
                                }
                            }
                            
                            if ($end_page < $total_pages) {
                                echo '<span class="page-numbers dots">...</span>';
                            }
                            ?>
                            
                            <?php if ($current_page < $total_pages) : ?>
                                <a href="?tab=worklog&wl_page=<?php echo esc_attr($current_page + 1); ?>" class="page-numbers next-page">&rsaquo;</a>
                                <a href="?tab=worklog&wl_page=<?php echo esc_attr($total_pages); ?>" class="page-numbers last-page">&raquo;</a>
                            <?php endif; ?>
                        </div>
                    </div>
                <?php endif; ?>
            </div>
        <?php endif; ?>
    </div>
    
    <!-- Modal for viewing work log details -->
    <div id="work-log-modal" class="modal" style="display: none;">
        <div class="modal-content">
            <span class="close">&times;</span>
            <h3>Work Log Details</h3>
            <div class="work-log-details">
                <div class="detail-row">
                    <div class="detail-label">Channel:</div>
                    <div class="detail-value" id="modal-channel"></div>
                </div>
                <div class="detail-row">
                    <div class="detail-label">Work Item:</div>
                    <div class="detail-value" id="modal-workitem"></div>
                </div>
                <div class="detail-row">
                    <div class="detail-label">Importance:</div>
                    <div class="detail-value" id="modal-importance"></div>
                </div>
                <div class="detail-row">
                    <div class="detail-label">Performed At:</div>
                    <div class="detail-value" id="modal-performed"></div>
                </div>
                <div class="detail-row">
                    <div class="detail-label">Created At:</div>
                    <div class="detail-value" id="modal-created"></div>
                </div>
                <div class="detail-row notes-row">
                    <div class="detail-label">Notes:</div>
                    <div class="detail-value" id="modal-notes"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
    .work-logs-table {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 20px;
    }
    
    .work-logs-table th,
    .work-logs-table td {
        padding: 10px;
        border: 1px solid #ddd;
        text-align: left;
    }
    
    .work-logs-table th {
        background-color: #f5f5f5;
        font-weight: bold;
    }
    
    .work-logs-table tr:nth-child(even) {
        background-color: #f9f9f9;
    }
    
    .work-logs-table tr:hover {
        background-color: #f1f1f1;
    }
    
    .view-work-log-btn {
        background-color: #0073aa;
        color: white;
        border: none;
        padding: 5px 10px;
        border-radius: 3px;
        cursor: pointer;
    }
    
    .view-work-log-btn:hover {
        background-color: #005177;
    }
    
    /* Pagination styles */
    .work-logs-pagination {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 20px;
        padding: 10px 0;
        border-top: 1px solid #ddd;
    }
    
    .pagination-info {
        color: #666;
        font-size: 14px;
    }
    
    .pagination-links {
        display: flex;
        align-items: center;
    }
    
    .pagination-links .page-numbers {
        display: inline-block;
        min-width: 30px;
        height: 30px;
        margin: 0 3px;
        padding: 0 5px;
        line-height: 28px;
        text-align: center;
        background-color: #f0f0f1;
        border: 1px solid #dcdcde;
        border-radius: 3px;
        color: #2271b1;
        text-decoration: none;
    }
    
    .pagination-links .page-numbers.current {
        background-color: #2271b1;
        border-color: #2271b1;
        color: #fff;
    }
    
    .pagination-links .page-numbers:hover:not(.current) {
        background-color: #f6f7f7;
    }
    
    /* Modal styles */
    .modal {
        display: none;
        position: fixed;
        z-index: 1000;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
        background-color: rgba(0,0,0,0.4);
    }
    
    .modal-content {
        background-color: #fefefe;
        margin: 10% auto;
        padding: 20px;
        border: 1px solid #888;
        width: 80%;
        max-width: 800px;
        border-radius: 4px;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    }
    
    .close {
        color: #aaa;
        float: right;
        font-size: 28px;
        font-weight: bold;
        cursor: pointer;
    }
    
    .close:hover,
    .close:focus {
        color: black;
        text-decoration: none;
    }
    
    .work-log-details {
        margin-top: 20px;
    }
    
    .detail-row {
        display: flex;
        margin-bottom: 10px;
        border-bottom: 1px solid #f0f0f0;
        padding-bottom: 10px;
    }
    
    .detail-label {
        font-weight: bold;
        width: 120px;
        flex-shrink: 0;
    }
    
    .detail-value {
        flex-grow: 1;
    }
    
    
    .notes-row .detail-value {
        margin-top: 10px;
        padding: 15px;
        background-color: #f9f9f9;
        border: 1px solid #e5e5e5;
        border-radius: 4px;
        min-height: 100px;
    }
</style>

<script>
jQuery(document).ready(function($) {
    // View work log details
    $('.view-work-log-btn').on('click', function() {
        var id = $(this).data('id');
        var channel = $(this).data('channel');
        var workitem = $(this).data('workitem');
        var importance = $(this).data('importance');
        var notes = $(this).data('notes');
        var performed = $(this).data('performed');
        var created = $(this).data('created');
        
        // Populate modal with data
        $('#modal-channel').text(channel);
        $('#modal-workitem').text(workitem);
        $('#modal-importance').text(importance);
        $('#modal-notes').html(notes);
        $('#modal-performed').text(performed);
        $('#modal-created').text(created);
        
        // Show modal
        $('#work-log-modal').show();
    });
    
    // Close modal
    $('.close').on('click', function() {
        $('#work-log-modal').hide();
    });
    
    // Close modal when clicking outside
    $(window).on('click', function(e) {
        if ($(e.target).is('.modal')) {
            $('.modal').hide();
        }
    });
});
</script> 