mirror of
https://github.com/apache/cloudstack.git
synced 2025-10-26 08:42:29 +01:00
New Ui for Dashboard User
This commit is contained in:
NIKITA
parent
f31f8adde5
commit
6761a96b30
@ -2905,4 +2905,98 @@ a:hover.search_button {
|
|||||||
padding:0;
|
padding:0;
|
||||||
cursor:pointer;
|
cursor:pointer;
|
||||||
cursor:hand;
|
cursor:hand;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox {
|
||||||
|
width:75%;
|
||||||
|
height:126px;
|
||||||
|
margin:5px auto;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_top {
|
||||||
|
width:100%;
|
||||||
|
height:75px;
|
||||||
|
float:left;
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_iconbox {
|
||||||
|
width:50%;
|
||||||
|
height:75px;
|
||||||
|
float:left;
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_icons {
|
||||||
|
width:90px;
|
||||||
|
height:53px;
|
||||||
|
margin:18px auto 0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_textbox {
|
||||||
|
width:50%;
|
||||||
|
height:75px;
|
||||||
|
float:left;
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_textbox p{
|
||||||
|
width:auto;
|
||||||
|
height:auto;
|
||||||
|
float:left;
|
||||||
|
font-size:13px;
|
||||||
|
font-weight:bold;
|
||||||
|
color:#333;
|
||||||
|
margin:40px 0 0 0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_bot {
|
||||||
|
width:100%;
|
||||||
|
height:51px;
|
||||||
|
float:left;
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_VMnumber {
|
||||||
|
width:100%;
|
||||||
|
height:auto;
|
||||||
|
float:left;
|
||||||
|
font-size:21px;
|
||||||
|
font-weight:bold;
|
||||||
|
text-align:center;
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_VMnumber span {
|
||||||
|
font-size:30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_VMnumber.running {
|
||||||
|
color:#687201;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_VMnumber.stopped {
|
||||||
|
color:#c10202;
|
||||||
|
}
|
||||||
|
|
||||||
|
.db_resourcebox_VMnumber.total {
|
||||||
|
color:#064f88;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dbaccounts_rows {
|
||||||
|
width:100%;
|
||||||
|
height:21px;
|
||||||
|
float:left;
|
||||||
|
background:#cccccc;
|
||||||
|
margin:0;
|
||||||
|
padding:5px 0 5px 0;
|
||||||
|
border-bottom:1px solid #999;
|
||||||
}
|
}
|
||||||
BIN
ui/new/images/db_accounticon.png
Normal file
BIN
ui/new/images/db_accounticon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 500 B |
BIN
ui/new/images/db_runningbg.gif
Normal file
BIN
ui/new/images/db_runningbg.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 384 B |
BIN
ui/new/images/db_runninicon.gif
Normal file
BIN
ui/new/images/db_runninicon.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.4 KiB |
BIN
ui/new/images/db_stoppedbg.gif
Normal file
BIN
ui/new/images/db_stoppedbg.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 393 B |
BIN
ui/new/images/db_stoppedicon.gif
Normal file
BIN
ui/new/images/db_stoppedicon.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
BIN
ui/new/images/db_totalbg.gif
Normal file
BIN
ui/new/images/db_totalbg.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 626 B |
BIN
ui/new/images/db_totalicon.gif
Normal file
BIN
ui/new/images/db_totalicon.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
BIN
ui/new/images/dbaccounts_headerbg.gif
Normal file
BIN
ui/new/images/dbaccounts_headerbg.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 189 B |
@ -1,233 +1,430 @@
|
|||||||
<%@ page import="java.util.*" %>
|
<%@ page import="java.util.*" %>
|
||||||
|
|
||||||
<%@ page import="com.cloud.utils.*" %>
|
<%@ page import="com.cloud.utils.*" %>
|
||||||
|
|
||||||
<%
|
<%
|
||||||
Locale browserLocale = request.getLocale();
|
Locale browserLocale = request.getLocale();
|
||||||
CloudResourceBundle t = CloudResourceBundle.getBundle("resources/resource", browserLocale);
|
CloudResourceBundle t = CloudResourceBundle.getBundle("resources/resource", browserLocale);
|
||||||
%>
|
%>
|
||||||
<!-- event detail panel (begin) -->
|
<!-- event detail panel (begin) -->
|
||||||
<div class="main_title" id="right_panel_header">
|
<div class="main_title" id="right_panel_header">
|
||||||
<div class="main_titleicon">
|
<div class="main_titleicon">
|
||||||
<img src="images/title_dashboardicon.gif" alt="Event" /></div>
|
<img src="images/title_dashboardicon.gif" alt="Dashboard" /></div>
|
||||||
<h1>
|
<h1>
|
||||||
Dashboard
|
Dashboard
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
<!--Dashboard-->
|
<!--Dashboard-->
|
||||||
<div class="contentbox" id="right_panel_content">
|
<div class="contentbox" id="right_panel_content">
|
||||||
<div class="info_detailbox errorbox" id="after_action_info_container" style="display: none">
|
<div class="info_detailbox errorbox" id="after_action_info_container" style="display: none">
|
||||||
<p id="after_action_info">
|
<p id="after_action_info">
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid_container" id="system_wide_capacity_container">
|
|
||||||
<div class="grid_header">
|
|
||||||
<div class="grid_header_cell" style="width: 60%; border: none;">
|
<!--Dashboard Admin starts here-->
|
||||||
<div class="grid_header_title">
|
<div class="grid_container" id="system_wide_capacity_container">
|
||||||
System Wide Capacity</div>
|
<div class="grid_header">
|
||||||
</div>
|
<div class="grid_header_cell" style="width: 60%; border: none;">
|
||||||
<div class="grid_header_cell" style="width: 40%; border: none;">
|
<div class="grid_header_title">
|
||||||
<div class="grid_header_formbox">
|
System Wide Capacity</div>
|
||||||
<select id="capacity_zone_select" class="select" style="width: 70px;">
|
</div>
|
||||||
</select>
|
<div class="grid_header_cell" style="width: 40%; border: none;">
|
||||||
<select id="capacity_pod_select" class="select" style="width: 70px;">
|
<div class="grid_header_formbox">
|
||||||
</select>
|
<select id="capacity_zone_select" class="select" style="width: 70px;">
|
||||||
</div>
|
</select>
|
||||||
</div>
|
<select id="capacity_pod_select" class="select" style="width: 70px;">
|
||||||
</div>
|
</select>
|
||||||
<div class="dbrow even" id="public_ip_address">
|
</div>
|
||||||
<div class="dbrow_cell" style="width: 29%;">
|
</div>
|
||||||
<div class="dbgraph_titlebox">
|
</div>
|
||||||
<h2>
|
<div class="dbrow even" id="public_ip_address">
|
||||||
Public IP Addresses</h2>
|
<div class="dbrow_cell" style="width: 29%;">
|
||||||
<div class="dbgraph_title_usedbox">
|
<div class="dbgraph_titlebox">
|
||||||
<p>
|
<h2>
|
||||||
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
Public IP Addresses</h2>
|
||||||
</p>
|
<div class="dbgraph_title_usedbox">
|
||||||
</div>
|
<p>
|
||||||
</div>
|
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
||||||
</div>
|
</p>
|
||||||
<div class="dbrow_cell" style="width: 58%; border: none;">
|
</div>
|
||||||
<div class="db_barbox low" id="bar_chart" style="width: 18%;">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 58%; border: none;">
|
||||||
<div class="dbrow_cell" style="width: 12%; border: none;">
|
<div class="db_barbox low" id="bar_chart" style="width: 18%;">
|
||||||
<div class="db_totaltitle" id="percentused"></div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 12%; border: none;">
|
||||||
<div class="dbrow odd" id="private_ip_address">
|
<div class="db_totaltitle" id="percentused"></div>
|
||||||
<div class="dbrow_cell" style="width: 29%;">
|
</div>
|
||||||
<div class="dbgraph_titlebox">
|
</div>
|
||||||
<h2>
|
<div class="dbrow odd" id="private_ip_address">
|
||||||
Private IP Addresses</h2>
|
<div class="dbrow_cell" style="width: 29%;">
|
||||||
<div class="dbgraph_title_usedbox">
|
<div class="dbgraph_titlebox">
|
||||||
<p>
|
<h2>
|
||||||
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
Private IP Addresses</h2>
|
||||||
</p>
|
<div class="dbgraph_title_usedbox">
|
||||||
</div>
|
<p>
|
||||||
</div>
|
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
||||||
</div>
|
</p>
|
||||||
<div class="dbrow_cell" style="width: 58%; border: none;">
|
</div>
|
||||||
<div class="db_barbox low" id="bar_chart" style="width: 20%;">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 58%; border: none;">
|
||||||
<div class="dbrow_cell" style="width: 12%; border: none;">
|
<div class="db_barbox low" id="bar_chart" style="width: 20%;">
|
||||||
<div class="db_totaltitle" id="percentused"></div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 12%; border: none;">
|
||||||
<div class="dbrow even" id="memory_allocated">
|
<div class="db_totaltitle" id="percentused"></div>
|
||||||
<div class="dbrow_cell" style="width: 29%;">
|
</div>
|
||||||
<div class="dbgraph_titlebox">
|
</div>
|
||||||
<h2>
|
<div class="dbrow even" id="memory_allocated">
|
||||||
Memory Allocated</h2>
|
<div class="dbrow_cell" style="width: 29%;">
|
||||||
<div class="dbgraph_title_usedbox">
|
<div class="dbgraph_titlebox">
|
||||||
<p>
|
<h2>
|
||||||
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
Memory Allocated</h2>
|
||||||
</p>
|
<div class="dbgraph_title_usedbox">
|
||||||
</div>
|
<p>
|
||||||
</div>
|
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
||||||
</div>
|
</p>
|
||||||
<div class="dbrow_cell" style="width: 58%; border: none;">
|
</div>
|
||||||
<div class="db_barbox mid" id="bar_chart" style="width: 66%;">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 58%; border: none;">
|
||||||
<div class="dbrow_cell" style="width: 12%; border: none;">
|
<div class="db_barbox mid" id="bar_chart" style="width: 66%;">
|
||||||
<div class="db_totaltitle" id="percentused"></div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 12%; border: none;">
|
||||||
<div class="dbrow odd" id="cpu">
|
<div class="db_totaltitle" id="percentused"></div>
|
||||||
<div class="dbrow_cell" style="width: 29%;">
|
</div>
|
||||||
<div class="dbgraph_titlebox">
|
</div>
|
||||||
<h2>
|
<div class="dbrow odd" id="cpu">
|
||||||
CPU</h2>
|
<div class="dbrow_cell" style="width: 29%;">
|
||||||
<div class="dbgraph_title_usedbox">
|
<div class="dbgraph_titlebox">
|
||||||
<p>
|
<h2>
|
||||||
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
CPU</h2>
|
||||||
</p>
|
<div class="dbgraph_title_usedbox">
|
||||||
</div>
|
<p>
|
||||||
</div>
|
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
||||||
</div>
|
</p>
|
||||||
<div class="dbrow_cell" style="width: 58%; border: none;">
|
</div>
|
||||||
<div class="db_barbox high" id="bar_chart" style="width: 83%;">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 58%; border: none;">
|
||||||
<div class="dbrow_cell" style="width: 12%; border: none;">
|
<div class="db_barbox high" id="bar_chart" style="width: 83%;">
|
||||||
<div class="db_totaltitle" id="percentused"></div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 12%; border: none;">
|
||||||
<div class="dbrow even" id="primary_storage_allocated">
|
<div class="db_totaltitle" id="percentused"></div>
|
||||||
<div class="dbrow_cell" style="width: 29%;">
|
</div>
|
||||||
<div class="dbgraph_titlebox">
|
</div>
|
||||||
<h2>
|
<div class="dbrow even" id="primary_storage_allocated">
|
||||||
Primary Storage Allocated</h2>
|
<div class="dbrow_cell" style="width: 29%;">
|
||||||
<div class="dbgraph_title_usedbox">
|
<div class="dbgraph_titlebox">
|
||||||
<p>
|
<h2>
|
||||||
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
Primary Storage Allocated</h2>
|
||||||
</p>
|
<div class="dbgraph_title_usedbox">
|
||||||
</div>
|
<p>
|
||||||
</div>
|
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
||||||
</div>
|
</p>
|
||||||
<div class="dbrow_cell" style="width: 58%; border: none;">
|
</div>
|
||||||
<div class="db_barbox low" id="bar_chart" style="width: 15%;">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 58%; border: none;">
|
||||||
<div class="dbrow_cell" style="width: 12%; border: none;">
|
<div class="db_barbox low" id="bar_chart" style="width: 15%;">
|
||||||
<div class="db_totaltitle" id="percentused"></div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 12%; border: none;">
|
||||||
<div class="dbrow odd" id="primary_storage_used">
|
<div class="db_totaltitle" id="percentused"></div>
|
||||||
<div class="dbrow_cell" style="width: 29%;">
|
</div>
|
||||||
<div class="dbgraph_titlebox">
|
</div>
|
||||||
<h2>
|
<div class="dbrow odd" id="primary_storage_used">
|
||||||
Primary Storage Used</h2>
|
<div class="dbrow_cell" style="width: 29%;">
|
||||||
<div class="dbgraph_title_usedbox">
|
<div class="dbgraph_titlebox">
|
||||||
<p>
|
<h2>
|
||||||
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
Primary Storage Used</h2>
|
||||||
</p>
|
<div class="dbgraph_title_usedbox">
|
||||||
</div>
|
<p>
|
||||||
</div>
|
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
||||||
</div>
|
</p>
|
||||||
<div class="dbrow_cell" style="width: 58%; border: none;">
|
</div>
|
||||||
<div class="db_barbox low" id="bar_chart" style="width: 40%;">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 58%; border: none;">
|
||||||
<div class="dbrow_cell" style="width: 12%; border: none;">
|
<div class="db_barbox low" id="bar_chart" style="width: 40%;">
|
||||||
<div class="db_totaltitle" id="percentused"></div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 12%; border: none;">
|
||||||
<div class="dbrow even" id="secondary_storage_used">
|
<div class="db_totaltitle" id="percentused"></div>
|
||||||
<div class="dbrow_cell" style="width: 29%;">
|
</div>
|
||||||
<div class="dbgraph_titlebox">
|
</div>
|
||||||
<h2>
|
<div class="dbrow even" id="secondary_storage_used">
|
||||||
Secondary Storage Used</h2>
|
<div class="dbrow_cell" style="width: 29%;">
|
||||||
<div class="dbgraph_title_usedbox">
|
<div class="dbgraph_titlebox">
|
||||||
<p>
|
<h2>
|
||||||
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
Secondary Storage Used</h2>
|
||||||
</p>
|
<div class="dbgraph_title_usedbox">
|
||||||
</div>
|
<p>
|
||||||
</div>
|
Used: <span id="capacityused">N</span>/<span id="capacitytotal">A</span>
|
||||||
</div>
|
</p>
|
||||||
<div class="dbrow_cell" style="width: 58%; border: none;">
|
</div>
|
||||||
<div class="db_barbox low" id="bar_chart" style="width: 20%;">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 58%; border: none;">
|
||||||
<div class="dbrow_cell" style="width: 12%; border: none;">
|
<div class="db_barbox low" id="bar_chart" style="width: 20%;">
|
||||||
<div class="db_totaltitle" id="percentused"></div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="dbrow_cell" style="width: 12%; border: none;">
|
||||||
</div>
|
<div class="db_totaltitle" id="percentused"></div>
|
||||||
<!--General Alerts-->
|
</div>
|
||||||
<div class="grid_container" style="width: 49%; margin-top: 15px;">
|
</div>
|
||||||
<div class="grid_header">
|
</div>
|
||||||
<div class="grid_header_cell" style="width: 60%; border: none;">
|
<!--General Alerts-->
|
||||||
<div class="grid_header_title">
|
<div class="grid_container" style="width: 49%; margin-top: 15px;">
|
||||||
General Alerts</div>
|
<div class="grid_header">
|
||||||
</div>
|
<div class="grid_header_cell" style="width: 60%; border: none;">
|
||||||
<div class="grid_header_cell" style="width: 40%; border: none;">
|
<div class="grid_header_title">
|
||||||
<div class="grid_header_formbox">
|
General Alerts</div>
|
||||||
<div class="gridheader_morebutt">
|
</div>
|
||||||
</div>
|
<div class="grid_header_cell" style="width: 40%; border: none;">
|
||||||
</div>
|
<div class="grid_header_formbox">
|
||||||
</div>
|
<div class="gridheader_morebutt">
|
||||||
</div>
|
</div>
|
||||||
<div id="alert_grid_content">
|
</div>
|
||||||
<div style="height: 310px; text-align: center;">
|
</div>
|
||||||
<i>No Recent Alerts</i>
|
</div>
|
||||||
</div>
|
<div id="alert_grid_content">
|
||||||
</div>
|
<div style="height: 310px; text-align: center;">
|
||||||
</div>
|
<i>No Recent Alerts</i>
|
||||||
<!--Hosts Alerts-->
|
</div>
|
||||||
<div class="grid_container" style="width: 48%; margin-top: 15px; float: right;">
|
</div>
|
||||||
<div class="grid_header">
|
</div>
|
||||||
<div class="grid_header_cell" style="width: 60%; border: none;">
|
<!--Hosts Alerts-->
|
||||||
<div class="grid_header_title">
|
<div class="grid_container" style="width: 48%; margin-top: 15px; float: right;">
|
||||||
Hosts Alerts</div>
|
<div class="grid_header">
|
||||||
</div>
|
<div class="grid_header_cell" style="width: 60%; border: none;">
|
||||||
<div class="grid_header_cell" style="width: 40%; border: none;">
|
<div class="grid_header_title">
|
||||||
<div class="grid_header_formbox">
|
Hosts Alerts</div>
|
||||||
<div class="gridheader_morebutt">
|
</div>
|
||||||
</div>
|
<div class="grid_header_cell" style="width: 40%; border: none;">
|
||||||
</div>
|
<div class="grid_header_formbox">
|
||||||
</div>
|
<div class="gridheader_morebutt">
|
||||||
</div>
|
</div>
|
||||||
<div id="host_alert_grid_content">
|
</div>
|
||||||
<div style="height: 310px; text-align: center;">
|
</div>
|
||||||
<i>No Recent Alerts</i>
|
</div>
|
||||||
</div>
|
<div id="host_alert_grid_content">
|
||||||
</div>
|
<div style="height: 310px; text-align: center;">
|
||||||
</div>
|
<i>No Recent Alerts</i>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div class="grid_rows" id="alert_template" style="display:none">
|
</div>
|
||||||
<div class="grid_row_cell" style="width: 10%;">
|
</div>
|
||||||
<div class="row_celltitles">
|
|
||||||
<img src="images/alert_icon.png" /></div>
|
<div class="grid_rows" id="alert_template" style="display:none">
|
||||||
</div>
|
<div class="grid_row_cell" style="width: 10%;">
|
||||||
<div class="grid_row_cell" style="width: 70%;">
|
<div class="row_celltitles">
|
||||||
<div class="row_celltitles alert" id="type"></div>
|
<img src="images/alert_icon.png" /></div>
|
||||||
<div class="row_celltitles alertdetails" id="description"></div>
|
</div>
|
||||||
</div>
|
<div class="grid_row_cell" style="width: 70%;">
|
||||||
<div class="grid_row_cell" style="width: 19%;">
|
<div class="row_celltitles alert" id="type"></div>
|
||||||
<div class="row_celltitles" id="date"></div>
|
<div class="row_celltitles alertdetails" id="description"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="grid_row_cell" style="width: 19%;">
|
||||||
|
<div class="row_celltitles" id="date"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!--Dashboard Admin ends here-->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!--Dashboard User starts here-->
|
||||||
|
<div class="grid_container" style="display:none;" >
|
||||||
|
<div class="grid_header">
|
||||||
|
<div class="grid_header_cell" style="width: 60%; border: none;">
|
||||||
|
<div class="grid_header_title">
|
||||||
|
Resources</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_rows" style="padding:0; border:none;">
|
||||||
|
<div class="dbrow_cell" style="width: 33%; height: 137px; background:url(images/db_runningbg.gif) repeat-x top left;border: none;">
|
||||||
|
<div class="db_resourcebox">
|
||||||
|
<div class="db_resourcebox_top">
|
||||||
|
<div class="db_resourcebox_iconbox">
|
||||||
|
<div class="db_resourcebox_icons"><img src="images/db_runninicon.gif" alt="Running" /></div>
|
||||||
|
</div>
|
||||||
|
<div class="db_resourcebox_textbox"><p>Running VMs:</div>
|
||||||
|
</div>
|
||||||
|
<div class="db_resourcebox_bot">
|
||||||
|
<div class="db_resourcebox_VMnumber running"><span>24</span> VM(s)</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="dbrow_cell" style="width: 33%; height: 137px; background:url(images/db_stoppedbg.gif) repeat-x top left; border: none;">
|
||||||
|
<div class="db_resourcebox">
|
||||||
|
<div class="db_resourcebox_top">
|
||||||
|
<div class="db_resourcebox_iconbox">
|
||||||
|
<div class="db_resourcebox_icons"><img src="images/db_stoppedicon.gif" alt="Running" /></div>
|
||||||
|
</div>
|
||||||
|
<div class="db_resourcebox_textbox"><p>Stopped VMs:</div>
|
||||||
|
</div>
|
||||||
|
<div class="db_resourcebox_bot">
|
||||||
|
<div class="db_resourcebox_VMnumber stopped"><span>24</span> VM(s)</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="dbrow_cell" style="width: 34%; height: 137px; background:url(images/db_totalbg.gif) repeat-x top left; border: none;">
|
||||||
|
<div class="db_resourcebox">
|
||||||
|
<div class="db_resourcebox_top">
|
||||||
|
<div class="db_resourcebox_iconbox">
|
||||||
|
<div class="db_resourcebox_icons"><img src="images/db_totalicon.gif" alt="Running" /></div>
|
||||||
|
</div>
|
||||||
|
<div class="db_resourcebox_textbox"><p>Total VMs:</div>
|
||||||
|
</div>
|
||||||
|
<div class="db_resourcebox_bot">
|
||||||
|
<div class="db_resourcebox_VMnumber total"><span>48</span> VM(s)</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Public Ips-->
|
||||||
|
|
||||||
|
<div class="grid_container" style="margin-top:15px; style="display:none;"" >
|
||||||
|
<div class="grid_header">
|
||||||
|
<div class="grid_header_cell" style="width: 60%; border: none;">
|
||||||
|
<div class="grid_header_title">
|
||||||
|
Public IPs</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_rows even" style="width:50%;">
|
||||||
|
<div class="grid_row_cell" style="width:40%; border:none;">
|
||||||
|
<div class="row_celltitles"> Available Public IPs: </div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width:59%; border:none;">
|
||||||
|
<div class="row_celltitles"> <strong> Unlimited</strong></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_rows odd" style="width:50%;">
|
||||||
|
<div class="grid_row_cell" style="width:40%; border:none;">
|
||||||
|
<div class="row_celltitles"> Owned Public IPs: </div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width:59%; border:none;">
|
||||||
|
<div class="row_celltitles"> <strong> 5</strong></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Recent errors-->
|
||||||
|
<div class="grid_container" style="width: 49%; margin-top: 15px; style="display:none;"">
|
||||||
|
<div class="grid_header">
|
||||||
|
<div class="grid_header_cell" style="width: 60%; border: none;">
|
||||||
|
<div class="grid_header_title">
|
||||||
|
Recent Errors</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_header_cell" style="width: 40%; border: none;">
|
||||||
|
|
||||||
|
</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" id="type">Error's Name</div>
|
||||||
|
<div class="row_celltitles alertdetails" id="description">Error Description will appear here</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width: 19%;">
|
||||||
|
<div class="row_celltitles" id="date">09/29/2010 15:20:10</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" id="type">Error's Name</div>
|
||||||
|
<div class="row_celltitles alertdetails" id="description">Error Description will appear here</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width: 19%;">
|
||||||
|
<div class="row_celltitles" id="date">09/29/2010 15:20:10</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" id="type">Error's Name</div>
|
||||||
|
<div class="row_celltitles alertdetails" id="description">Error Description will appear here</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width: 19%;">
|
||||||
|
<div class="row_celltitles" id="date">09/29/2010 15:20:10</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!--Accounts-->
|
||||||
|
<div class="grid_container" style="width: 49%; margin-top: 15px; float:right; background:#fff8c8 repeat top left; style="display:none;"">
|
||||||
|
<div class="grid_header" style="background:url(images/dbaccounts_headerbg.gif) repeat-x top left;">
|
||||||
|
<div class="grid_header_cell" style="width: 5%; border: none;">
|
||||||
|
<div class="grid_header_title">
|
||||||
|
<img src="images/db_accounticon.png" alt="Account" /></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_header_cell" style="width: 60%; border: none;">
|
||||||
|
<div class="grid_header_title" style="color:#FFF;">
|
||||||
|
My Account</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="dbaccounts_rows">
|
||||||
|
<div class="grid_row_cell" style="width: 30%;">
|
||||||
|
<div class="row_celltitles">Account ID</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width: 60%; border:none;">
|
||||||
|
<div class="row_celltitles"><strong>3</strong></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="dbaccounts_rows">
|
||||||
|
<div class="grid_row_cell" style="width: 30%;">
|
||||||
|
<div class="row_celltitles">Account</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width: 60%;border:none;">
|
||||||
|
<div class="row_celltitles"><strong>Niki</strong></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="dbaccounts_rows">
|
||||||
|
<div class="grid_row_cell" style="width: 30%;">
|
||||||
|
<div class="row_celltitles">Type</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width: 60%;border:none;">
|
||||||
|
<div class="row_celltitles"><strong>User</strong></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="dbaccounts_rows">
|
||||||
|
<div class="grid_row_cell" style="width: 30%;">
|
||||||
|
<div class="row_celltitles">Domain</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid_row_cell" style="width: 60%;border:none;">
|
||||||
|
<div class="row_celltitles"><strong>Root</strong></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--Dashboard User ends here-->
|
||||||
Loading…
x
Reference in New Issue
Block a user