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.
81 lines
3.4 KiB
HTML
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> | {{ 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 & 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>
|