layout work, minor changes to virtual environment view

master
Steve L. Nyemba 8 years ago
parent 4a6ac0a799
commit 4a719397a5

@ -21,6 +21,19 @@ body {
font-family:sans-serif;
font-weight:lighter;
}
.button {
padding:8px;
margin:2px;
border-radius:4px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
cursor:pointer;
}
.button:hover{
background-color:#4682B4 ;
color:#ffffff;
}
.no-border{ border:1px solid transparent}
.border { border:1px solid #CAD5E0}
@ -29,13 +42,11 @@ body {
.border-left { border-left:1px solid #CAD5E0;}
.border-top { border-top:1px solid #CAD5E0;}
.grid {
font-family:helvetica;
font-family:sans-serif;
font-weight:lighter;
margin:4px;
padding:4px;
width:100%;
height:350px;
}
.grid-half {
height:195px;
@ -43,8 +54,8 @@ body {
width:98%;
padding:4px;
}
.grid-half .fa-check {color:green}
.grid-half .fa-times {color:maroon; }
.grid .fa-check {color:green}
.grid .fa-times {color:maroon; }
.menu {
margin:4px;
@ -73,11 +84,12 @@ input[type=text]:focus{
.padding-2x{padding:4px;}
.margin-2x {margin:4px;}
.info {
padding:4px;
margin:4px;
width:40%;
height:450px;
}
.height-quarter{height:25%;}
.width-half {width:47%; }
.width-75 {width:72%}

@ -50,8 +50,9 @@ monitor.processes.render = function(label,data) {
})
jx.dom.set.value('latest_processes','') ;
jx.dom.set.value('latest_processes_label',label)
var options = {width:$('#latest_processes').width(),height:$('#latest_processes').height()-2}
var options = {width:$('#latest_processes').width()}
options.pageSize = 10
options.pageIndex = 1
options.data = data
options.rowClass = function (item, index,evt) {
@ -185,18 +186,21 @@ monitor.processes.summary.init = function(logs){
jx.dom.set.value('summary_chart','')
jx.dom.append('summary_chart',context)
var options = {}
options.type = 'doughnut'
options.data = data
var conf = {width:50,height:50}
var chart = new Chart(context,options)
conf.type = 'doughnut'
conf.data = data
conf.options = {legend:{ position:'right'}}
var chart = new Chart(context,conf)
jx.dom.set.value('summary_ranking','')
context = jx.dom.get.instance('CANVAS')
jx.dom.append('summary_ranking',context)
conf = {type:'bar',responsive:true}
conf.options={scales:{xAxes:[{gridLines: {display:false}}],yAxes:[{gridLines: {display:false}}] }}
conf.options={scales:{xAxes:[{gridLines: {display:false}}],yAxes:[{gridLines: {display:false},scaleLabel:{display:true,labelString:'PROCESS COUNTS'} }] }}
conf.options.legend ={position:'right'}
conf.data = {labels:['Running','Idle','Crash']}
var labels = jx.utils.keys(series)

@ -33,21 +33,27 @@
<div class="left info ">
<div class="" style="text-transform:capitalize; height:32px">Monitoring <span id="latest_processes_label" class="bold"></span>
<div class="" style="text-transform:capitalize; height:28px">Monitoring <span id="latest_processes_label" class="bold"></span>
<div class="right menu">
<div class="right menu-item"><i class="fa fa-refresh"></i></div>
</div>
</div>
<div id="latest_processes" class="grid-half small border"></div>
<div id="process_summary" class="grid-half border">
<div class="">Global Process Summary</div>
<div id="latest_processes" class="grid border-right" style="margin:4px; padding:2px"></div>
<div class="left width-half border-right" id="summary_chart"></div> <div id="summary_details"></div>
<div class="left width-half" id="summary_ranking"></div>
<div id="process_summary" class="grid border-right" style="margin:4px">
<div class="" style="margin:4px; padding:4px">Global Process Summary By Status</div>
<div class="width-75" id="summary_chart" style="margin:4px"></div>
<div id="summary_details" class="left"></div>
</div>
<div class="grid border-right" style="margin:4px; margin-top:10px">
<div style="margin:4px; padding:4px">Global Process Summary By Groups</div>
<div class="width-75" id="summary_ranking" style="margin:4px"></div>
</div>
</div>
<div class="left info border-left">
<div class="left info">
<div>History of Processes <span id="trend_info" class="bold"></span>
</div>
@ -59,12 +65,17 @@
<div id="trends_chart" class="small grid" >
</div>
</div>
<div class="border-top" style="padding:4px;">
<div>
<b>Python Virtual Environment</b>
<div class="right button border">Inspect</div>
<div class="small">Requirements Assessment</div>
</div>
<div class="left" style="width:80%">
<div>Python Virtual Environment
<div class="small">Requirements Assessment</div>
</div>
</div>
</body>
Loading…
Cancel
Save