1
0
Fork 0
mirror of https://github.com/retspen/webvirtcloud synced 2026-11-11 04:36:48 +00:00
webvirtcloud/storages/templates/create_stg_vol_block.html
catborise c401479cf9 feat(templates): every confirmation asks in the page's own dialog
Deleting or detaching a disk, deleting a network card, forcing a VM off,
reverting or deleting a snapshot, stopping or deleting a pool, a
network, an interface, a filter or a secret, and the other actions that
ask first opened the browser's yes/no box (confirm()), and the ISO
upload told its mistakes in the browser's alert().

One dialog in the base page now asks for all of them: its title and
confirming button carry the button's own words, its body the button's
question, the confirming button red for a destructive action. Confirmed,
the button is clicked again, so its form sends what it did before. A
button inside another dialog (the flavors) hides that one while asking
and shows it again after; Cancel gives the focus back, and the
confirming button acts once. The ISO upload's mistakes show in its
dialog's error box, announced.
2026-10-31 20:44:39 +03:00

72 lines
4.8 KiB
HTML

{% load i18n %}
{% load django_bootstrap5 %}
{% load bootstrap_icons %}
{% if request.user.is_superuser %}
{% if state != 0 %}
{% if pool == "iso" %}
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#IsoUpload">
<span aria-hidden="true">{% bs_icon 'upload' %}</span> {% trans "Upload ISO" %}
</button>
<div class="modal fade" id="IsoUpload" tabindex="-1" role="dialog" aria-labelledby="IsoUploadLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="IsoUploadLabel">{% trans "Upload ISO Image" %}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% trans "Close" %}"></button>
</div>
<form id="isoUploadForm" enctype="multipart/form-data" method="post" aria-label="{% trans "Upload iso form" %}">{% csrf_token %}
<div class="modal-body">
<label for="id_file" class="form-label">{% trans "ISO file" %}</label>
<input type="file" name="file" id="id_file" class="form-control" accept=".iso" required aria-describedby="id_file_help">
<div class="form-text" id="id_file_help">{% trans "The browser sends it: keep the page open until the upload ends." %}</div>
<div id="upload-status" class="d-none align-items-center gap-2 text-primary mt-3" role="status" aria-live="polite">
<span class="spinner-border spinner-border-sm" aria-hidden="true"></span>
<span id="upload-status-text">{% trans "Starting upload..." %}</span>
</div>
<div id="upload-error-message" class="alert alert-danger mt-3 d-none" role="alert"></div>
</div>
<div class="modal-footer">
<input type="hidden" name="iso_upload" value="true">
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{% trans "Cancel" %}</button>
<button type="submit" class="btn btn-primary">{% trans "Upload" %}</button>
</div>
</form>
</div> <!-- /.modal-content -->
</div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->
{% else %}
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#AddImage">
<span aria-hidden="true">{% bs_icon 'plus-lg' %}</span> {% trans "New volume" %}
</button>
<div class="modal fade" id="AddImage" tabindex="-1" role="dialog" aria-labelledby="AddImageLabel" aria-hidden="true"
{% if form.errors %}data-open{% endif %}>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="AddImageLabel">{% trans "New volume" %}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% trans "Close" %}"></button>
</div>
<div class="modal-body">
<form id="create-volume" method="post" aria-label="{% trans "Create volume to storage form" %}">
{% csrf_token %}
<div class="row">
<div class="col-12">{% bootstrap_field form.name %}</div>
<div class="col-sm-6">{% bootstrap_field form.size %}</div>
<div class="col-sm-6">{% bootstrap_field form.format %}</div>
<div class="col-12">{% bootstrap_field form.meta_prealloc %}</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{% trans "Cancel" %}</button>
<button type="submit" form="create-volume" class="btn btn-primary" name="create_volume">{% trans "Create" %}</button>
</div>
</div> <!-- /.modal-content -->
</div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->
{% endif %}
{% endif %}
{% endif %}