mirror of
https://github.com/OpenNebula/one.git
synced 2025-03-30 22:50:10 +03:00
Feature #4363: Fix cloud view dashboard
This commit is contained in:
parent
fc3ab2d7ab
commit
5455bae853
@ -296,7 +296,7 @@ define(function(require) {
|
||||
$(".section_content").hide();
|
||||
$("#provision_dashboard").fadeIn();
|
||||
|
||||
$("#provision_dashboard").html("");
|
||||
$("#provision_dashboard").html('');
|
||||
|
||||
if (Config.provision.dashboard.isEnabled("vms")) {
|
||||
$("#provision_dashboard").append(TemplateDashboardVms());
|
||||
|
@ -15,9 +15,9 @@
|
||||
{{! -------------------------------------------------------------------------- }}
|
||||
|
||||
<div class="row">
|
||||
<div class="large-11 large-centered columns">
|
||||
<h2 class="subheader">{{tr "Quotas"}}</h2>
|
||||
<br></div>
|
||||
<div class="large-12 columns">
|
||||
<h4>{{tr "Quotas"}}</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="large-10 large-centered columns">
|
||||
|
@ -13,115 +13,104 @@
|
||||
{{! See the License for the specific language governing permissions and }}
|
||||
{{! limitations under the License. }}
|
||||
{{! -------------------------------------------------------------------------- }}
|
||||
|
||||
<div class="row">
|
||||
<div class="large-11 large-centered columns">
|
||||
<h2 class="subheader">{{tr "Virtual Machines"}}</h2>
|
||||
<br></div>
|
||||
</div>
|
||||
<div class="row" id="provision_vms_dashboard">
|
||||
<div class="large-11 large-centered columns">
|
||||
<div class="large-12 columns">
|
||||
<h4>{{tr "Virtual Machines"}}</h4>
|
||||
<div class="row">
|
||||
<div class="large-4 columns text-center">
|
||||
<br>
|
||||
<div class="large-3 columns text-center">
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<span id="provision_dashboard_total" style="font-size:80px"> <i class="fa fa-spinner fa-spin"></i>
|
||||
</span>
|
||||
<br>
|
||||
<span style="color: #999;">{{tr "TOTAL"}}</span>
|
||||
<h2>
|
||||
<span id="provision_dashboard_total"> <i class="fa fa-spinner fa-spin"></i>
|
||||
</span>
|
||||
<br>
|
||||
<small class="subheader">{{tr "TOTAL"}}</small>
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<div class="row">
|
||||
<div class="large-12 columns text-center">
|
||||
<a href"#" class="medium button success large radius provision_create_vm_button" style="margin-left: 5px; margin-right: 5px"> <i class="fa fa-lg fa-plus-square"/></a>
|
||||
<a href"#" class="medium button large radius provision_vms_list_button" style="margin-left: 5px; margin-right: 5px">
|
||||
<div class="large-12 columns">
|
||||
<a href"#" class="medium button success provision_create_vm_button"> <i class="fa fa-lg fa-plus-square"/></a>
|
||||
<a href"#" class="medium button provision_vms_list_button">
|
||||
<i class="fa fa-lg fa-th"/></a>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row">
|
||||
<div class="large-12 columns"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large-2 columns">
|
||||
<div class="row">
|
||||
<div class="large-12 columns text-center">
|
||||
<span id="provision_dashboard_running" style="font-size:40px">
|
||||
<div class="large-9 columns text-center">
|
||||
<div class="large-10 large-centered columns">
|
||||
<div class="large-3 columns">
|
||||
<h4>
|
||||
<span id="provision_dashboard_running">
|
||||
<i class="fa fa-spinner fa-spin"></i>
|
||||
</span>
|
||||
<br>
|
||||
<span style="color: #999; font-size: 14px">{{tr "RUNNING"}}</span>
|
||||
</div>
|
||||
</span><br>
|
||||
<small class="subheader">{{tr "RUNNING"}}</small>
|
||||
</h4>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row">
|
||||
<div class="large-12 columns text-center ">
|
||||
<span id="provision_dashboard_deploying" style="font-size:40px">
|
||||
<div class="large-3 columns ">
|
||||
<h4>
|
||||
<span id="provision_dashboard_deploying" >
|
||||
<i class="fa fa-spinner fa-spin"></i>
|
||||
</span>
|
||||
<br>
|
||||
<span style="color: #999; font-size: 14px">{{tr "DEPLOYING"}}</span>
|
||||
</div>
|
||||
</span><br>
|
||||
<small class="subheader">{{tr "DEPLOYING"}}</small>
|
||||
</h4>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row">
|
||||
<div class="large-12 columns text-center">
|
||||
<span id="provision_dashboard_off" style="font-size:40px">
|
||||
<div class="large-3 columns">
|
||||
<h4>
|
||||
<span id="provision_dashboard_off">
|
||||
<i class="fa fa-spinner fa-spin"></i>
|
||||
</span>
|
||||
<br>
|
||||
<span style="color: #999; font-size: 14px">{{tr "OFF"}}</span>
|
||||
</div>
|
||||
</span><br>
|
||||
<small class="subheader">{{tr "OFF"}}</small>
|
||||
</h4>
|
||||
</div>
|
||||
<br>
|
||||
<div class="row">
|
||||
<div class="large-12 columns text-center ">
|
||||
<span id="provision_dashboard_error" style="font-size:40px">
|
||||
<div class="large-3 columns ">
|
||||
<h4>
|
||||
<span id="provision_dashboard_error">
|
||||
<i class="fa fa-spinner fa-spin"></i>
|
||||
</span>
|
||||
<br>
|
||||
<span style="color: #999; font-size: 14px">{{tr "ERROR"}}</span>
|
||||
</div>
|
||||
</span><br>
|
||||
<small class="subheader">{{tr "ERROR"}}</small>
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large-6 columns" id="dashboard_vm_accounting">
|
||||
<input style="display:none;" value="vm" id="acct_group_by"/>
|
||||
<div class="row">
|
||||
<div class="large-12 columns graph_legend">
|
||||
<h3 class="subheader">
|
||||
<small>{{tr "CPU hours"}}</small>
|
||||
</h3>
|
||||
</div>
|
||||
<div class="large-12 columns">
|
||||
<div class="large-12 columns centered graph text-center" id="acct_cpu_graph" style="height: 100px;">{{> ./empty-graphs}}</div>
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="large-12 columns graph_legend">
|
||||
<h3 class="subheader">
|
||||
<small>{{tr "Memory GB hours"}}</small>
|
||||
</h3>
|
||||
<div class="large-12 columns" id="dashboard_vm_accounting">
|
||||
<div class="large-4 columns text-center">
|
||||
<input style="display:none;" value="vm" id="acct_group_by"/>
|
||||
<div class="row">
|
||||
<div class="large-12 columns graph_legend">
|
||||
<span class="subheader">
|
||||
<span>{{tr "CPU hours"}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="large-12 columns">
|
||||
<div class="large-12 columns centered graph" id="acct_cpu_graph" style="height: 100px;">{{> ./empty-graphs}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large-12 columns">
|
||||
<div class="large-12 columns centered graph text-center" id="acct_mem_graph" style="height: 100px;">{{> ./empty-graphs}}</div>
|
||||
<div class="large-4 columns text-center">
|
||||
<div class="row">
|
||||
<div class="large-12 columns graph_legend">
|
||||
<span class="subheader">
|
||||
<span>{{tr "Memory GB hours"}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="large-12 columns">
|
||||
<div class="large-12 columns centered graph" id="acct_mem_graph" style="height: 100px;">{{> ./empty-graphs}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="large-12 columns graph_legend">
|
||||
<h3 class="subheader">
|
||||
<small>{{tr "Disk MB hours"}}</small>
|
||||
</h3>
|
||||
</div>
|
||||
<div class="large-12 columns">
|
||||
<div class="large-12 columns centered graph text-center" id="acct_disk_graph" style="height: 100px;">{{> ./empty-graphs}}</div>
|
||||
<div class="large-4 columns text-center">
|
||||
<div class="row">
|
||||
<div class="large-12 columns graph_legend">
|
||||
<span class="subheader">
|
||||
<span>{{tr "Disk MB hours"}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="large-12 columns">
|
||||
<div class="large-12 columns centered graph" id="acct_disk_graph" style="height: 100px;">{{> ./empty-graphs}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
@ -294,7 +294,7 @@ define(function(require) {
|
||||
color: "#999",
|
||||
size: 10
|
||||
},
|
||||
ticks: 4,
|
||||
ticks: 3,
|
||||
minTickSize: [1, "day"]
|
||||
},
|
||||
yaxis : { min: 0,
|
||||
|
@ -5,11 +5,16 @@
|
||||
h3,
|
||||
h4 {
|
||||
margin: 2rem 0;
|
||||
border-bottom: 1px solid #dfdfdf;
|
||||
}
|
||||
|
||||
a {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.provision_back {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.provision-search-input {
|
||||
@ -25,7 +30,8 @@
|
||||
|
||||
.right {
|
||||
&.provision_list_vms_filter,
|
||||
&.provision_list_flows_filter {
|
||||
&.provision_list_flows_filter,
|
||||
&.provision_list_templates_filter {
|
||||
margin-top: -0.5rem;
|
||||
}
|
||||
}
|
||||
|
@ -11,6 +11,7 @@
|
||||
//padding: 1rem;
|
||||
//color: $black;
|
||||
font-size: 1.1rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.without-link {
|
||||
@ -20,7 +21,8 @@
|
||||
//color: $black;
|
||||
font-size: 1.1rem;
|
||||
display: block;
|
||||
font-weight: normal;
|
||||
font-weight: bold;
|
||||
color: $bold-black;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1,5 +1,5 @@
|
||||
fieldset {
|
||||
padding: 1rem;
|
||||
padding: 2rem;
|
||||
|
||||
legend {
|
||||
|
||||
|
@ -144,8 +144,8 @@
|
||||
|
||||
& > li > a {
|
||||
font-size: 1.1rem;
|
||||
font-weight: normal;
|
||||
color: $dark-gray;
|
||||
font-weight: bold;
|
||||
color: $medium-gray;
|
||||
}
|
||||
|
||||
& > li.active > a {
|
||||
|
5
src/sunstone/public/scss/_provision.scss
Normal file
5
src/sunstone/public/scss/_provision.scss
Normal file
@ -0,0 +1,5 @@
|
||||
#provision_dashboard,
|
||||
#provision_create_vm,
|
||||
#provision_create_flow {
|
||||
padding: 2rem;
|
||||
}
|
@ -134,7 +134,7 @@ $header-color: inherit;
|
||||
$header-lineheight: 1.4;
|
||||
$header-margin-bottom: 0.5rem;
|
||||
$header-text-rendering: optimizeLegibility;
|
||||
$small-font-size: 80%;
|
||||
$small-font-size: 60%;
|
||||
$header-small-font-color: $dark-gray;
|
||||
$paragraph-lineheight: 1.6;
|
||||
$paragraph-margin-bottom: 1rem;
|
||||
|
@ -31,6 +31,7 @@
|
||||
@import './fieldset';
|
||||
@import './boxes';
|
||||
@import './vcenter';
|
||||
@import './provision';
|
||||
|
||||
|
||||
|
||||
@ -51,7 +52,7 @@ h5,
|
||||
h6 {
|
||||
font-weight: bold;
|
||||
color: #555;
|
||||
padding: 1rem;
|
||||
padding: 1rem 0;
|
||||
/* box-shadow: 0 5px 5px -4px rgba(0,0,0,0.1); */
|
||||
/* border-bottom: 1px solid #dfdfdf; */
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user