{% extends 'base/layout.html' %}
{% load i18n %}

{% block title %}{% trans "Schedule Proxbox Sync" %}{% endblock %}

{% block content %}
<div class="row">
    <div class="col col-md-6">
        <div class="card">
            <h5 class="card-header">
                <i class="mdi mdi-clock-outline"></i>
                {% trans "Schedule Sync Job" %}
            </h5>
            <div class="card-body">
                <p class="text-muted">
                    {% blocktrans trimmed %}
                    Schedule a ProxBox sync operation to run at a specific time. Set a recurrence interval
                    to repeat the sync automatically (e.g. every 4 hours, daily, weekly).
                    Leave <strong>Schedule at</strong> blank to run immediately.
                    {% endblocktrans %}
                </p>

                <form method="post">
                    {% csrf_token %}
                    {% include "netbox_proxbox/inc/schedule_sync_form_fields.html" %}

                    <div class="d-flex gap-2">
                        <button type="submit" class="btn btn-primary">
                            <i class="mdi mdi-clock-plus-outline"></i>
                            {% trans "Schedule" %}
                        </button>
                        <a href="{% url 'core:job_list' %}" class="btn btn-outline-secondary">
                            <i class="mdi mdi-format-list-bulleted"></i>
                            {% trans "View Sync Jobs" %}
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="col col-md-6">
        <div class="card">
            <h5 class="card-header">
                <i class="mdi mdi-information-outline"></i>
                {% trans "Sync Types" %}
            </h5>
            <div class="card-body">
                <table class="table table-hover attr-table">
                    <thead>
                        <tr>
                            <th class="text-nowrap" style="width: 1%">{% trans "Type" %}</th>
                            <th>{% trans "Description" %}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td class="text-nowrap align-middle">
                                <span class="badge rounded-pill text-bg-red fw-normal">{% trans "All" %}</span>
                            </td>
                            <td class="align-middle">{% trans "Sync both devices (nodes) and virtual machines." %}</td>
                        </tr>
                        <tr>
                            <td class="text-nowrap align-middle">
                                <span class="badge rounded-pill text-bg-green fw-normal">{% trans "Devices" %}</span>
                            </td>
                            <td class="align-middle">{% trans "Sync Proxmox nodes as NetBox devices." %}</td>
                        </tr>
                        <tr>
                            <td class="text-nowrap align-middle">
                                <span class="badge rounded-pill text-bg-blue fw-normal">{% trans "Virtual Machines" %}</span>
                            </td>
                            <td class="align-middle">{% trans "Sync Proxmox VMs as NetBox virtual machines." %}</td>
                        </tr>
                        <tr>
                            <td class="text-nowrap align-middle">
                                <span class="badge rounded-pill text-bg-orange fw-normal">{% trans "VM Disks" %}</span>
                            </td>
                            <td class="align-middle">{% trans "Sync VM virtual disks (run after virtual machines)." %}</td>
                        </tr>
                        <tr>
                            <td class="text-nowrap align-middle">
                                <span class="badge rounded-pill text-bg-purple fw-normal">{% trans "VM Backups" %}</span>
                            </td>
                            <td class="align-middle">{% trans "Sync all VM backup records." %}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <div class="card mt-3">
            <h5 class="card-header">
                <i class="mdi mdi-repeat"></i>
                {% trans "Common Intervals" %}
            </h5>
            <div class="card-body">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>{% trans "Example" %}</th>
                            <th>{% trans "Frequency" %}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr><td><strong>15 minutes</strong></td><td>{% trans "Frequent sync" %}</td></tr>
                        <tr><td><strong>1 hour</strong></td><td>{% trans "Hourly sync" %}</td></tr>
                        <tr><td><strong>4 hours</strong></td><td>{% trans "Regular sync" %}</td></tr>
                        <tr><td><strong>12 hours</strong></td><td>{% trans "Twice daily" %}</td></tr>
                        <tr><td><strong>1 day</strong></td><td>{% trans "Daily sync" %}</td></tr>
                        <tr><td><strong>1 week</strong></td><td>{% trans "Weekly sync" %}</td></tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
{% endblock %}