mirror of
https://github.com/retspen/webvirtcloud
synced 2026-11-10 04:06:47 +00:00
ca74c02c4f
An accessibility scan with every modal opened found 49 fields without a name: the labels of the instance create forms (custom, template and each flavor's modal), the interface, network, secret and storage pool modals did not point at their fields. Each label now has a for= and its field an id, prefixed per form (and per flavor), so a click on the label focuses the field too. The "Advanced" collapse buttons and the memory and processing bars are named. The VCPU config select had id="vcpu_mode" in each of these forms, nine times on the create page; the unique-ID test did not see it as the test driver reports no CPU modes. The id goes (nothing used it), and the test now renders that branch.
258 lines
19 KiB
HTML
258 lines
19 KiB
HTML
{% load i18n %}
|
|
{% load bootstrap_icons %}
|
|
{% if request.user.is_superuser %}
|
|
<a href="#AddStgPool" type="button" class="btn btn-success float-end" title="{% trans "Create Storage Pool" %}" data-bs-toggle="modal">
|
|
<span aria-hidden="true">{% bs_icon 'plus-circle-fill' %} </span>
|
|
</a>
|
|
|
|
<!-- Modal Storage pool -->
|
|
<div class="modal fade" id="AddStgPool" tabindex="-1" role="dialog" aria-labelledby="AddStgPoolLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">{% trans "Create Storage Pool" %}</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<ul class="nav nav-tabs" aria-label="Storage create types">
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link active" data-bs-toggle="tab" data-bs-target="#dirtab" type="button" role="tab" aria-controls="dirtab" aria-selected="true">
|
|
{% trans "DIR" %}
|
|
</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#lvmtab" type="button" role="tab" aria-controls="lvmtab" aria-selected="false">
|
|
{% trans "LVM" %}
|
|
</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#cephtab" type="button" role="tab" aria-controls="cephtab" aria-selected="false">
|
|
{% trans "CEPH" %}
|
|
</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#netfstab" type="button" role="tab" aria-controls="netfstab" aria-selected="false">
|
|
{% trans "NETFS" %}
|
|
</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#isotab" type="button" role="tab" aria-controls="isotab" aria-selected="false">
|
|
{% trans "ISO" %}
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="dirtab">
|
|
<form method="post" action="" role="form" aria-label="Create storage with pool dir path form">{% csrf_token %}
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<label for="stg_dir_stg_type" class="col-sm-3 col-form-label">{% trans "Type" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_dir_stg_type" type="text" class="form-control" name="stg_type" value="dir" disabled>
|
|
<input type="hidden" name="stg_type" value="dir">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_dir_name" class="col-sm-3 col-form-label">{% trans "Name" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_dir_name" type="text" class="form-control" name="name" placeholder="{% trans "default" %}" maxlength="20" required pattern="[a-zA-Z0-9\.\-_]+">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_dir_target" class="col-sm-3 col-form-label">{% trans "Path" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_dir_target" type="text" name="target" class="form-control" value="/var/lib/libvirt/images" required>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% trans "Close" %}</button>
|
|
<button type="submit" class="btn btn-primary" name="create">{% trans "Create" %}</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="tab-pane" id="lvmtab">
|
|
<form method="post" action="" role="form" aria-label="Create storage pool with LVM pool">{% csrf_token %}
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<label for="stg_logical_stg_type" class="col-sm-3 col-form-label">{% trans "Type" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_logical_stg_type" type="text" class="form-control" name="stg_type" value="logical" disabled>
|
|
<input type="hidden" name="stg_type" value="logical">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_logical_name" class="col-sm-3 col-form-label">{% trans "Name" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_logical_name" type="text" class="form-control" name="name" placeholder="{% trans "default" %}" maxlength="20" required pattern="[a-zA-Z0-9\.\-_]+">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_logical_source" class="col-sm-3 col-form-label">{% trans "Device" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_logical_source" type="text" class="form-control" name="source" value="/dev/sdb" required>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% trans "Close" %}</button>
|
|
<button type="submit" class="btn btn-primary" name="create">{% trans "Create" %}</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="tab-pane" id="cephtab">
|
|
<form method="post" action="" role="form" aria-label="Create storage pool with ceph form">{% csrf_token %}
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<label for="stg_rbd_stg_type" class="col-sm-3 col-form-label">{% trans "Type" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_rbd_stg_type" type="text" class="form-control" name="stg_type" value="rbd" disabled>
|
|
<input type="hidden" name="stg_type" value="rbd">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_rbd_name" class="col-sm-3 col-form-label">{% trans "Name" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_rbd_name" type="text" class="form-control" name="name" placeholder="rbdpool" maxlength="20" required pattern="[a-zA-Z0-9\.\-_]+">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_rbd_ceph_user" class="col-sm-3 col-form-label">{% trans "Ceph User" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_rbd_ceph_user" type="text" class="form-control" name="ceph_user" placeholder="libvirt" maxlength="20" required pattern="[a-zA-Z0-9\.\-_]+">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_rbd_ceph_pool" class="col-sm-3 col-form-label">{% trans "Ceph Pool" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_rbd_ceph_pool" type="text" class="form-control" name="ceph_pool" placeholder="libvirt-pool" maxlength="20" required pattern="[a-zA-Z0-9\.\-_]+">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_rbd_ceph_host" class="col-sm-3 col-form-label">{% trans "Ceph Host" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_rbd_ceph_host" type="text" class="form-control" name="ceph_host" placeholder="mon0.ceph.host" maxlength="20" required pattern="[a-zA-Z0-9\.\-_]+">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_rbd_secret" class="col-sm-3 col-form-label">{% trans "Secrets" %}</label>
|
|
<div class="col-sm-6">
|
|
<select id="stg_rbd_secret" name="secret" class="form-control">
|
|
{% if secrets %}
|
|
{% for secret in secrets %}
|
|
<option value="{{ secret }}">{{ secret }}</option>
|
|
{% endfor %}
|
|
{% else %}
|
|
<option value="None">{% trans "None" %}</option>
|
|
{% endif %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
|
|
{% trans "Close" %}
|
|
</button>
|
|
{% if secrets %}
|
|
<button type="submit" class="btn btn-primary" name="create">
|
|
{% trans "Create" %}
|
|
</button>
|
|
{% else %}
|
|
<button class="btn btn-primary disabled" name="create">
|
|
{% trans "Create" %}
|
|
</button>
|
|
{% endif %}
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="tab-pane" id="netfstab">
|
|
<form method="post" action="" role="form" aria-label="Create storage pool with net filesystem form">{% csrf_token %}
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<label for="stg_netfs_stg_type" class="col-sm-3 col-form-label">{% trans "Type" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_netfs_stg_type" type="text" class="form-control" name="stg_type" value="netfs" disabled>
|
|
<input type="hidden" name="stg_type" value="netfs">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_netfs_name" class="col-sm-3 col-form-label">{% trans "Name" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_netfs_name" type="text" class="form-control" name="name" placeholder="netfspool" maxlength="20" required pattern="[a-zA-Z0-9\.\-_]+">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_netfs_netfs_host" class="col-sm-3 col-form-label">{% trans "Hostname" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_netfs_netfs_host" type="text" class="form-control" name="netfs_host" placeholder="nfs.example.com" maxlength="20" required pattern="[a-zA-Z0-9\.\-_]+">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_netfs_source" class="col-sm-3 col-form-label">{% trans "Remote Path" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_netfs_source" type="text" class="form-control" name="source" placeholder="/srv/storage/" maxlength="100" required>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="source_format" class="col-sm-3 col-form-label">{% trans "Format" %}</label>
|
|
<div class="col-sm-6">
|
|
<select name="source_format" class="form-control" id="source_format">
|
|
<option value="auto">{% trans "auto" %}</option>
|
|
<option value="nfs">{% trans "nfs" %}</option>
|
|
<option value="glusterfs">{% trans "glusterfs" %}</option>
|
|
<option value="cifs">{% trans "cifs" %}</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_netfs_target" class="col-sm-3 col-form-label">{% trans "Local Path" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_netfs_target" type="text" class="form-control" name="target" placeholder="/srv/storage/" maxlength="100" required>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
|
|
{% trans "Close" %}
|
|
</button>
|
|
<button type="submit" class="btn btn-primary" name="create">
|
|
{% trans "Create" %}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="tab-pane" id="isotab">
|
|
<form method="post" action="" role="form" aria-label="Create iso pool form">{% csrf_token %}
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<label for="stg_iso_name" class="col-sm-3 col-form-label">{% trans "Name" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_iso_name" type="text" class="form-control" name="name" value="iso" disabled>
|
|
<input type="hidden" name="name" value="iso">
|
|
<input type="hidden" name="stg_type" value="dir">
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label for="stg_iso_target" class="col-sm-3 col-form-label">{% trans "Path" %}</label>
|
|
<div class="col-sm-6">
|
|
<input id="stg_iso_target" type="text" class="form-control" name="target" value="/var/lib/libvirt/iso" required>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
|
|
{% trans "Close" %}
|
|
</button>
|
|
<button type="submit" class="btn btn-primary" name="create">
|
|
{% trans "Create" %}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div> <!-- /.modal-body -->
|
|
</div> <!-- /.modal-content -->
|
|
</div> <!-- /.modal-dialog -->
|
|
</div> <!-- /.modal -->
|
|
{% endif %}
|