mirror of
https://github.com/retspen/webvirtcloud
synced 2025-07-31 12:41:08 +00:00
Add sortable
This commit is contained in:
Retspen
parent
ed2b28c25e
commit
5f6b06b467
5 changed files with 197 additions and 91 deletions
|
|
@ -1,6 +1,9 @@
|
|||
{% extends "base.html" %}
|
||||
{% load i18n %}
|
||||
{% block title %}{% trans "Instances" %}{% endblock %}
|
||||
{% block style %}
|
||||
<link rel="stylesheet" href="{{ STATIC_URL }}/css/sortable-theme-bootstrap.css" />
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
<!-- Page Heading -->
|
||||
<div class="row">
|
||||
|
|
@ -17,7 +20,7 @@
|
|||
<div class="col-lg-12">
|
||||
<div class="table-responsive">
|
||||
{% if request.user.is_superuser %}
|
||||
<table class="table table-hover table-striped">
|
||||
<table class="table table-hover table-striped sortable-theme-bootstrap" data-sortable>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
|
|
@ -25,7 +28,7 @@
|
|||
<th>Status</th>
|
||||
<th>VCPU</th>
|
||||
<th>Memory</th>
|
||||
<th>Actions</th>
|
||||
<th data-sortable="false" style="width: 165px;">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
|
@ -190,6 +193,7 @@
|
|||
</div>
|
||||
{% endblock %}
|
||||
{% block script %}
|
||||
<script src="{{ STATIC_URL }}/js/sortable.min.js"></script>
|
||||
<script>
|
||||
function open_console(uuid) {
|
||||
window.open("{% url 'console' %}?token=" + uuid, "", "width=850,height=485");
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
{% extends "base.html" %}
|
||||
{% load i18n %}
|
||||
{% block title %}{% trans "Secrets" %} - {{ compute.name }}{% endblock %}
|
||||
{% block style %}
|
||||
<link rel="stylesheet" href="{{ STATIC_URL }}/css/sortable-theme-bootstrap.css" />
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
<!-- Page Heading -->
|
||||
<div class="row">
|
||||
|
|
@ -41,75 +44,78 @@
|
|||
{% else %}
|
||||
<div class="col-lg-12">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr class="active">
|
||||
<th>{% trans "UUID" %}</th>
|
||||
<th>{% trans "Type" %}</th>
|
||||
<th>{% trans "Usage" %}</th>
|
||||
<th style="width:90px;">{% trans "Action" %}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for secret in secrets_all %}
|
||||
<tr>
|
||||
<td>{{ secret.uuid }}</td>
|
||||
<td>{% ifequal secret.usageType 0 %}
|
||||
{% trans "volume" %}
|
||||
{% endifequal %}
|
||||
{% ifequal secret.usageType 1 %}
|
||||
{% trans "iscsi" %}
|
||||
{% endifequal %}
|
||||
{% ifequal secret.usageType 2 %}
|
||||
{% trans "ceph" %}
|
||||
{% endifequal %}
|
||||
</td>
|
||||
<td>{{ secret.usage }}</td>
|
||||
<td>
|
||||
<form action="" method="post" role="form">{% csrf_token %}
|
||||
<input type="hidden" name="uuid" value="{{ secret.uuid }}"/>
|
||||
<a data-toggle="modal" href="#editSecret{{ secret.uuid }}" class="btn btn-sm btn-default" title="{% trans "Edit" %}">
|
||||
<span class="glyphicon glyphicon-pencil"></span>
|
||||
</a>
|
||||
<button type="submit" class="btn btn-sm btn-default" name="delete" title="{% trans "Delete" %}" onclick="return confirm('{% trans "Are you sure?" %}')">
|
||||
<span class="glyphicon glyphicon-trash"></span>
|
||||
</button>
|
||||
</form>
|
||||
<table class="table table-hover sortable-theme-bootstrap" data-sortable>
|
||||
<thead>
|
||||
<tr class="active">
|
||||
<th>{% trans "UUID" %}</th>
|
||||
<th>{% trans "Type" %}</th>
|
||||
<th>{% trans "Usage" %}</th>
|
||||
<th data-sortable="false" style="width:90px;">{% trans "Action" %}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for secret in secrets_all %}
|
||||
<tr>
|
||||
<td>{{ secret.uuid }}</td>
|
||||
<td>{% ifequal secret.usageType 0 %}
|
||||
{% trans "volume" %}
|
||||
{% endifequal %}
|
||||
{% ifequal secret.usageType 1 %}
|
||||
{% trans "iscsi" %}
|
||||
{% endifequal %}
|
||||
{% ifequal secret.usageType 2 %}
|
||||
{% trans "ceph" %}
|
||||
{% endifequal %}
|
||||
</td>
|
||||
<td>{{ secret.usage }}</td>
|
||||
<td>
|
||||
<form action="" method="post" role="form">{% csrf_token %}
|
||||
<input type="hidden" name="uuid" value="{{ secret.uuid }}"/>
|
||||
<a data-toggle="modal" href="#editSecret{{ secret.uuid }}" class="btn btn-sm btn-default" title="{% trans "Edit" %}">
|
||||
<span class="glyphicon glyphicon-pencil"></span>
|
||||
</a>
|
||||
<button type="submit" class="btn btn-sm btn-default" name="delete" title="{% trans "Delete" %}" onclick="return confirm('{% trans "Are you sure?" %}')">
|
||||
<span class="glyphicon glyphicon-trash"></span>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="editSecret{{ secret.uuid }}" tabindex="-1" role="dialog"
|
||||
aria-labelledby="editSecret" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||
<h4 class="modal-title">{% trans "Set secret value" %}</h4>
|
||||
</div>
|
||||
<div class="tab-content">
|
||||
<form class="form-horizontal" method="post" role="form">{% csrf_token %}
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label">{% trans "Value" %}</label>
|
||||
<div class="col-sm-6">
|
||||
<input type="hidden" name="uuid" value="{{ secret.uuid }}">
|
||||
<input type="text" name="value" class="form-control" value="{{ secret.value }}" maxlength="45" required pattern="[a-zA-Z0-9]$+">
|
||||
</div>
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="editSecret{{ secret.uuid }}" tabindex="-1" role="dialog"
|
||||
aria-labelledby="editSecret" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||
<h4 class="modal-title">{% trans "Set secret value" %}</h4>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">{% trans "Close" %}</button>
|
||||
<button type="submit" class="btn btn-primary" name="set_value">{% trans "Set" %}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div> <!-- /.modal-content -->
|
||||
</div> <!-- /.tab-content -->
|
||||
</div> <!-- /.modal-dialog -->
|
||||
</div> <!-- /.modal -->
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-content">
|
||||
<form class="form-horizontal" method="post" role="form">{% csrf_token %}
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label">{% trans "Value" %}</label>
|
||||
<div class="col-sm-6">
|
||||
<input type="hidden" name="uuid" value="{{ secret.uuid }}">
|
||||
<input type="text" name="value" class="form-control" value="{{ secret.value }}" maxlength="45" required pattern="[a-zA-Z0-9]$+">
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">{% trans "Close" %}</button>
|
||||
<button type="submit" class="btn btn-primary" name="set_value">{% trans "Set" %}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div> <!-- /.modal-content -->
|
||||
</div> <!-- /.tab-content -->
|
||||
</div> <!-- /.modal-dialog -->
|
||||
</div> <!-- /.modal -->
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% block script %}
|
||||
<script src="{{ STATIC_URL }}/js/sortable.min.js"></script>
|
||||
{% endblock %}
|
||||
|
|
@ -1,6 +1,9 @@
|
|||
{% extends "base.html" %}
|
||||
{% load i18n %}
|
||||
{% block title %}{% trans "Storage" %} - {{ pool }}{% endblock %}
|
||||
{% block style %}
|
||||
<link rel="stylesheet" href="{{ STATIC_URL }}/css/sortable-theme-bootstrap.css" />
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
<!-- Page Heading -->
|
||||
<div class="row">
|
||||
|
|
@ -77,14 +80,14 @@
|
|||
<h3 class="page-header">{% trans "Volumes" %}</h3>
|
||||
{% if volumes %}
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-bordered" id="sortTable">
|
||||
<table class="table table-striped table-bordered sortable-theme-bootstrap" data-sortable>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width:35px;">#</th>
|
||||
<th>{% trans "Name" %}</th>
|
||||
<th style="width:80px;">{% trans "Size" %}</th>
|
||||
<th style="width:75px;">{% trans "Format" %}</th>
|
||||
<th colspan="2">{% trans "Action" %}</th>
|
||||
<th>{% trans "Size" %}</th>
|
||||
<th>{% trans "Format" %}</th>
|
||||
<th data-sortable="false" colspan="2">{% trans "Action" %}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
|
@ -177,25 +180,26 @@
|
|||
</div>
|
||||
{% endblock %}
|
||||
{% block script %}
|
||||
<script>
|
||||
$('.format-convert').hide();
|
||||
$(document).on('change', '.volume-convert', function () {
|
||||
if ($(this).prop('checked')) {
|
||||
$('.format-convert').show();
|
||||
if ($('.image-format').val() == 'qcow2') {
|
||||
$('.meta-prealloc').show();
|
||||
}
|
||||
} else {
|
||||
$('.format-convert').hide();
|
||||
$('.meta-prealloc').hide();
|
||||
}
|
||||
});
|
||||
$(document).on('change', '.image-format', function () {
|
||||
if ($(this).val() == "qcow2") {
|
||||
<script src="{{ STATIC_URL }}/js/sortable.min.js"></script>
|
||||
<script>
|
||||
$('.format-convert').hide();
|
||||
$(document).on('change', '.volume-convert', function () {
|
||||
if ($(this).prop('checked')) {
|
||||
$('.format-convert').show();
|
||||
if ($('.image-format').val() == 'qcow2') {
|
||||
$('.meta-prealloc').show();
|
||||
} else {
|
||||
$('.meta-prealloc').hide();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
} else {
|
||||
$('.format-convert').hide();
|
||||
$('.meta-prealloc').hide();
|
||||
}
|
||||
});
|
||||
$(document).on('change', '.image-format', function () {
|
||||
if ($(this).val() == "qcow2") {
|
||||
$('.meta-prealloc').show();
|
||||
} else {
|
||||
$('.meta-prealloc').hide();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue