<?php
/**
 * Migration page template
 *
 * @package     EasyInvoice
 * @subpackage  Migration
 * @since       2.0.0
 */

// Prevent direct access
if (!defined('ABSPATH')) {
    exit;
}

$version_checker = EasyInvoice\Migration\VersionChecker::get_instance();
$current_version = $version_checker->get_stored_version();
$target_version = $version_checker->get_target_version();
$is_completed = $version_checker->is_migration_completed();
?>

<?php if ($is_completed): ?>
    <!-- Migration Completed View -->
    <div class="wrap">
        <div class="migration-container">
            <div class="migration-header">
                <h2>Easy Invoice Migration</h2>
                <div class="notice notice-success inline">
                    <p><strong>✅ Migration Completed Successfully!</strong></p>
                    <p>Your Easy Invoice plugin has been successfully migrated to version <?php echo esc_html($target_version); ?>.</p>
                </div>
            </div>
            
            <div class="migration-info">
                <h3>Migration Summary</h3>
                <table class="widefat">
                    <tr>
                        <td><strong>Previous Version:</strong></td>
                        <td><?php echo esc_html($current_version); ?></td>
                    </tr>
                    <tr>
                        <td><strong>Current Version:</strong></td>
                        <td><?php echo esc_html($target_version); ?></td>
                    </tr>
                    <tr>
                        <td><strong>Migration Status:</strong></td>
                        <td><span class="dashicons dashicons-yes-alt" style="color: green;"></span> Completed</td>
                    </tr>
                </table>
            </div>
            
            <div class="migration-actions" style="margin-top: 20px;">
                <a href="<?php echo admin_url('admin.php?page=easy-invoice'); ?>" class="button button-primary">
                    <span class="dashicons dashicons-dashboard"></span> Go to Dashboard
                </a>
                <button id="view-migration-log" class="button button-secondary">
                    <span class="dashicons dashicons-list-view"></span> View Migration Log
                </button>
            </div>
            
            <div id="migration-log-container" style="display: none; margin-top: 20px;">
                <div class="migration-log-container">
                    <div class="log-header">
                        <h3>Migration Log</h3>
                        <button id="copy-log" class="button button-secondary" title="Copy log to clipboard">
                            <span class="dashicons dashicons-clipboard"></span> Copy Log
                        </button>
                    </div>
                    <div id="migration-log"></div>
                </div>
            </div>
        </div>
    </div>
<?php else: ?>
    <!-- Migration Pending View -->
    <div class="wrap">
        <div class="migration-container">
            <div class="migration-header">
                <h2>Easy Invoice Migration</h2>
                <p>
                    Current Version: <?php echo esc_html($current_version); ?><br>
                    Target Version: <?php echo esc_html($target_version); ?>
                </p>
            </div>

            <div class="migration-progress-bar">
                <div id="migration-progress"></div>
            </div>

            <div class="migration-steps">
                <div id="migration-step-settings" class="migration-step pending">
                    <div class="step-icon">1</div>
                    <div class="step-content">
                        <div class="step-title">Settings Migration</div>
                        <div class="step-message">Pending...</div>
                    </div>
                </div>

                <div id="migration-step-clients" class="migration-step pending">
                    <div class="step-icon">2</div>
                    <div class="step-content">
                        <div class="step-title">Clients Migration</div>
                        <div class="step-message">Pending...</div>
                    </div>
                </div>

                <div id="migration-step-post_types" class="migration-step pending">
                    <div class="step-icon">3</div>
                    <div class="step-content">
                        <div class="step-title">Posts Migration</div>
                        <div class="step-message">Pending...</div>
                    </div>
                </div>

                <div id="migration-step-meta" class="migration-step pending">
                    <div class="step-icon">4</div>
                    <div class="step-content">
                        <div class="step-title">Meta Data Migration</div>
                        <div class="step-message">Pending...</div>
                    </div>
                </div>
                    
                <div id="migration-step-pro_options" class="migration-step pending">
                    <div class="step-icon">5</div>
                    <div class="step-content">
                        <div class="step-title">Pro Options Migration</div>
                        <div class="step-message">Pending...</div>
                    </div>
                </div>

                <div id="migration-step-cleanup" class="migration-step pending">
                    <div class="step-icon">6</div>
                    <div class="step-content">
                        <div class="step-title">Cleanup</div>
                        <div class="step-message">Pending...</div>
                    </div>
                </div>
            </div>
                    
            <div id="migration-error"></div>

            <div class="migration-log-container">
                <div class="log-header">
                    <h3>Migration Log</h3>
                    <button id="copy-log" class="button button-secondary" title="Copy log to clipboard">
                        <span class="dashicons dashicons-clipboard"></span> Copy Log
                    </button>
                </div>
                <div id="migration-log"></div>
            </div>
                            
            <div class="migration-actions" style="margin-top: 20px;">
                <button id="start-migration" class="button button-primary">
                    Start Migration
                </button>
            </div>
        </div>
    </div>
<?php endif; ?>