etan39
/
cloudstack
mirror of https://github.com/apache/cloudstack.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

new UI - dashboard - implement Hosts Alerts section.

This commit is contained in:
Jessica Wang 2010-09-26 14:48:46 -07:00
parent bea86479d8
commit 0a03ca6721
2 changed files with 35 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
ui/new/jsp/dashboard.jsp
View File

@ -196,12 +196,12 @@
</div>
</div>
</div>
<!--Host Alerts-->
<!--Hosts Alerts-->
<div class="grid_container" style="width: 48%; margin-top: 15px; float: right;">
<div class="grid_header">
<div class="grid_header_cell" style="width: 60%; border: none;">
<div class="grid_header_title">
General Alerts</div>
Hosts Alerts</div>
</div>
<div class="grid_header_cell" style="width: 40%; border: none;">
<div class="grid_header_formbox">
@ -209,87 +209,12 @@
</div>
</div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 10%;">
<div class="row_celltitles">
<img src="images/alert_icon.png" /></div>
</div>
<div id="host_alert_grid_content">
<div style="height: 310px; text-align: center;">
<i>No Recent Alerts</i>
</div>
<div class="grid_row_cell" style="width: 70%;">
<div class="row_celltitles alert">
Alerts name</div>
<div class="row_celltitles alertdetails">
Details about the alert will appear here</div>
</div>
<div class="grid_row_cell" style="width: 19%;">
<div class="row_celltitles">
09/17/2010 14:33:49</div>
</div>
</div>
<div class="grid_rows odd">
<div class="grid_row_cell" style="width: 10%;">
<div class="row_celltitles">
<img src="images/alert_icon.png" /></div>
</div>
<div class="grid_row_cell" style="width: 70%;">
<div class="row_celltitles alert">
Alerts name</div>
<div class="row_celltitles alertdetails">
Details about the alert will appear here</div>
</div>
<div class="grid_row_cell" style="width: 19%;">
<div class="row_celltitles">
09/17/2010 14:33:49</div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 10%;">
<div class="row_celltitles">
<img src="images/alert_icon.png" /></div>
</div>
<div class="grid_row_cell" style="width: 70%;">
<div class="row_celltitles alert">
Alerts name</div>
<div class="row_celltitles alertdetails">
Details about the alert will appear here</div>
</div>
<div class="grid_row_cell" style="width: 19%;">
<div class="row_celltitles">
09/17/2010 14:33:49</div>
</div>
</div>
<div class="grid_rows odd">
<div class="grid_row_cell" style="width: 10%;">
<div class="row_celltitles">
<img src="images/alert_icon.png" /></div>
</div>
<div class="grid_row_cell" style="width: 70%;">
<div class="row_celltitles alert">
Alerts name</div>
<div class="row_celltitles alertdetails">
Details about the alert will appear here</div>
</div>
<div class="grid_row_cell" style="width: 19%;">
<div class="row_celltitles">
09/17/2010 14:33:49</div>
</div>
</div>
<div class="grid_rows even">
<div class="grid_row_cell" style="width: 10%;">
<div class="row_celltitles">
<img src="images/alert_icon.png" /></div>
</div>
<div class="grid_row_cell" style="width: 70%;">
<div class="row_celltitles alert">
Alerts name</div>
<div class="row_celltitles alertdetails">
Details about the alert will appear here</div>
</div>
<div class="grid_row_cell" style="width: 19%;">
<div class="row_celltitles">
09/17/2010 14:33:49</div>
</div>
</div>
</div>
</div>
</div>
@ -303,6 +228,6 @@
<div class="row_celltitles alertdetails" id="description"></div>
</div>
<div class="grid_row_cell" style="width: 19%;">
<div class="row_celltitles" id="sent"></div>
<div class="row_celltitles" id="date"></div>
</div>
</div>

34
ui/new/scripts/cloud.core2.dashboard.js
View File

@ -159,9 +159,10 @@ function afterLoadDashboardJSP() {
});
});
$("#capacity_zone_select").change();
// General Alerts
var $alertTemplate = $("#alert_template");
//???
// Show Recent Alerts
$.ajax({
data: createURL("command=listAlerts"),
dataType: "json",
@ -169,19 +170,38 @@ function afterLoadDashboardJSP() {
var alerts = json.listalertsresponse.alert;
if (alerts != null && alerts.length > 0) {
var alertGrid = $("#alert_grid_content").empty();
var length = (alerts.length>=5) ? 5 : alerts.length;
var $alertTemplate = $("#alert_template");
var length = (alerts.length>=5) ? 5 : alerts.length;
for (var i = 0; i < length; i++) {
var template = $alertTemplate.clone(true);
template.find("#type").text(toAlertType(alerts[i].type));
template.find("#descripton").append(sanitizeXSS(alerts[i].description));
setDateField(alerts[i].sent, template.find("#sent"));
template.find("#description").append(fromdb(alerts[i].description));
setDateField(alerts[i].sent, template.find("#date"));
alertGrid.append(template.show());
}
}
}
});
//???
// Hosts Alerts
$.ajax({
data: createURL("command=listHosts&state=Alert"),
dataType: "json",
success: function(json) {
var alerts = json.listhostsresponse.host;
if (alerts != null && alerts.length > 0) {
var alertGrid = $("#host_alert_grid_content").empty();
var length = (alerts.length>=4) ? 4 : alerts.length;
for (var i = 0; i < length; i++) {
var template = $alertTemplate.clone(true);
template.find("#type").text("Host - Alert State");
template.find("#description").append("Host - <b>" + fromdb(alerts[i].name) + "</b> has been detected in Alert state.");
setDateField(alerts[i].disconnected, template.find("#date"));
alertGrid.append(template.show());
}
}
}
});
}
else if (isDomainAdmin()) {