vm-bench/frontend/templates/polling.html
Claus Lohmar 844d86c105 style: Proxmox VE-inspired dark theme — pve-* class naming
Rewrote proxmox.css with consistent pve- prefix matching the Proxmox
VE design language: panels with orange-accent headers, clean tables,
orange progress bars, green/red/orange badges, subtle shadows.

Updated all templates (base, index, _analysis, polling, scp)
to use pve-btn, pve-input, pve-select, pve-panel, pve-progress,
pve-badge, pve-alert, pve-spinner, pve-hidden, pve-dim, etc.
2026-07-23 09:09:29 +00:00

81 lines
3.4 KiB
HTML

<div class="pve-container" id="polling-container"
data-job-id="{{ job_id }}" data-vmid="{{ vmid }}"
data-source-filename="{{ source_filename }}" data-vm-name="{{ vm_name }}">
<div class="pve-panel pve-center">
<div class="pve-panel-header">
<span class="pve-panel-title">Converting VM {{ vmid }}</span>
</div>
<div class="pve-panel-body">
<p class="pve-dim">Job: <span class="pve-code">{{ job_id }}</span> &nbsp;|&nbsp; {{ vm_name }}</p>
<div id="status-badge" class="pve-badge pve-badge-queued">
<span class="pve-spinner"></span> Queued
</div>
<div class="pve-progress">
<div class="pve-progress-bar" id="pve-progress-bar" style="width:0%">0%</div>
</div>
<p id="status-message" class="pve-dim">Waiting for backend...</p>
<p id="elapsed" class="pve-dim">Elapsed: 0s</p>
<div id="error-block" class="pve-alert pve-alert-error pve-hidden"></div>
</div>
</div>
<!-- Reuse section -->
<div id="reuse-section" class="pve-panel pve-hidden">
<div class="pve-panel-header">
<span class="pve-panel-title">Conversion Complete — VM {{ vmid }} Ready</span>
</div>
<div class="pve-panel-body">
<p style="margin-bottom:1rem;">Create another VM from this disk?</p>
<div class="pve-row">
<div class="pve-form-group">
<label>VM Name *</label>
<input type="text" id="reuse-vmname" name="vm_name" required class="pve-input"
placeholder="e.g. second-vm">
</div>
<div class="pve-form-group">
<label>VM ID *</label>
<input type="number" id="reuse-vmid" name="vmid" required class="pve-input"
min="21000" max="21100" placeholder="21051">
</div>
</div>
<div class="pve-btn-row" style="flex-wrap:wrap;">
<button id="btn-clone" class="pve-btn pve-btn-success">Clone (instant)</button>
<button id="btn-copy" class="pve-btn pve-btn-primary">Copy (re-convert)</button>
<button id="btn-cleanup" class="pve-btn">Clean Up &amp; Finish</button>
</div>
<div id="reuse-submit-status" class="pve-hidden" style="margin-top:0.5rem;"></div>
<!-- Copy options (hidden until Copy clicked) -->
<div id="copy-options" class="pve-hidden" style="margin-top:1rem; padding-top:1rem; border-top:1px solid var(--pve-border);">
<p class="pve-dim" style="margin-bottom:0.75rem;">Copy re-runs the conversion with new specs:</p>
<div class="pve-row">
<div class="pve-form-group">
<label>CPU Cores</label>
<input type="number" id="copy-cores" class="pve-input" value="2" min="1">
</div>
<div class="pve-form-group">
<label>RAM (MB)</label>
<input type="number" id="copy-ram" class="pve-input" value="4096" min="512">
</div>
</div>
<div class="pve-form-group">
<label>Target Disk Size (GB)</label>
<input type="number" id="copy-disk" class="pve-input" value="30" placeholder="Leave blank for auto-shrink">
<span class="pve-hint">Blank = auto-shrink to 30 GB.</span>
</div>
<div class="pve-form-group">
<label>Storage Pool</label>
<input type="text" id="copy-storage" class="pve-input" value="local-lvm">
</div>
<button id="btn-copy-start" class="pve-btn pve-btn-primary" style="margin-top:0.5rem;">Start Re-Conversion</button>
<div id="copy-status" class="pve-hidden" style="margin-top:0.5rem;"></div>
</div>
</div>
</div>
</div>