<!DOCTYPE HTML>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
var performanceData = [];
var perData1 = [];
var ramData = [];
function LoadPerfData(id, objectName, counterName, instanceName, chartName,chartTitle){
$.ajax({
url: "/OperationsManager/data/performance",
type: "POST",
headers: {
"Content-Type": "application/json"
},
data: JSON.stringify({
"id":id,
"performanceCounters":[
{
"objectname":objectName,
"countername":counterName,
"instancename":instanceName
}
],
"legends":[
"target",
"path",
"lastvalue"
],
"duration":1440
}),
success: function (result) {
perData1 = [];
let dataDictionary = result.datasets[0].data;
for (var key in dataDictionary) {
if(dataDictionary.hasOwnProperty(key)) {
var datetime = new Date(key);
datetime = convertUTCDateToLocalDate(datetime);
perData1.push({
y: dataDictionary[key],
x: datetime
});
}
}
renderChart(chartName, chartTitle);
}
});
}
function GetPerfRules(id){
var ruleDict = [];
$.ajax({
url: "/OperationsManager/data/performanceCounters/{" + id + "}",
async: false,
type: "GET",
headers: {
"Content-Type": "application/json"
},
success: function (result) {
ruleDict = result.rows;
}
});
return ruleDict;
}
window.onload = function () {
$.ajax({
url: "/OperationsManager/data/state",
type: "POST",
data: {
"classId": "Microsoft.Windows.Library!Microsoft.Windows.Computer",
"objectIds": {
"1d62280e-f437-1369-316b-1e8659500e9a": -1
},
"criteria": "((HealthState = '0') OR (HealthState = '1') OR (HealthState = '2') OR (HealthState = '3') OR HealthState is null)",
"displayColumns": [
"healthstate",
"id",
"displayname",
"path",
"maintenancemode"
]
},
success: function (result) {
let objSel = document.getElementById("computers");
for (var i = 0; i < result.rows.length; i++) {
objSel.options[i] = new Option(result.rows[i].displayname, result.rows[i].id);
}
let lastObjSelected = localStorage.getItem("lastObjSelected");
if (lastObjSelected) {
$('#computers').val(lastObjSelected);
}
else {
$('#computers')[0].selectedIndex = 0;
}
ChangePerfObj();
}
});
}
function convertUTCDateToLocalDate(date) {
var newDate = new Date(date.getTime()+date.getTimezoneOffset()*60*1000);
var offset = date.getTimezoneOffset() / 60;
newDate.setMinutes(date.getMinutes() - date.getTimezoneOffset())
return newDate;
}
function renderChart(chartName, chartTitle) {
var chart = new CanvasJS.Chart(chartName, {
theme: "light1",
title: {
text: chartTitle
},
axisX: {
labelFormatter: function(e) {
return CanvasJS.formatDate(e.value, "hh:mm tt");
}
},
data: [{
type: "line",
dataPoints: perData1
}]
});
chart.render();
}
function GetInstances(dict, objectname, countername){
return dict.filter(function( item ) {
return (item.objectname == objectname && item.countername == countername);
});
}
function ChangePerfObj() {
var objSel = $('#computers');
LoadPerfData(objSel[0].value, "System", "System Up Time", "", "uptimeChart","System Up Time (24h)");
LoadPerfData(objSel[0].value, "Memory", "PercentMemoryUsed", "", "ramChart", "RAM Used % (24h)");
LoadPerfData(objSel[0].value, "Processor Information", "% Processor Time", "_Total", "cpuChart", "CPU Used % (24h)");
//debugger;
var RulesDict = GetPerfRules(objSel[0].value);
var diskInstances = GetInstances(RulesDict, "LogicalDisk", "% Free Space");
$('#trDisk').empty();
for (var i = 0; i < diskInstances.length; i++) {
let divName = "disk" + i + "Chart";
$('#trDisk').append('<td><div id="' + divName + '" style="height: 250px; width: 250px;"></div></td>');
LoadPerfData(objSel[0].value, "LogicalDisk", "% Free Space", diskInstances[i].instancename, divName, diskInstances[i].instancename + " - Disk Free % (24h)");
}
var lanInstances = GetInstances(RulesDict, "Network Adapter", "PercentBandwidthUsedTotal");
for (var i = 0; i < lanInstances.length; i++) {
let divName = "lan" + i + "Chart";
$('#trDisk').append('<td><div id="' + divName + '" style="height: 250px; width: 250px;"></div></td>');
LoadPerfData(objSel[0].value, "Network Adapter", "PercentBandwidthUsedTotal", lanInstances[i].instancename, divName, lanInstances[i].instancename + " - LAN Used % (24h)");
}
localStorage.setItem("lastObjSelected", objSel[0].value);
}
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/canvasjs/1.7.0/canvasjs.min.js"></script>
</head>
<body>
<div>
Computer: <select id="computers" name="computers" onchange="ChangePerfObj()"></select>
<table>
<tr>
<td><div id="uptimeChart" style="height: 250px; width: 250px;"></div></td>
<td><div id="cpuChart" style="height: 250px; width: 250px;"></div></td>
<td><div id="ramChart" style="height: 250px; width: 250px;"></div></td>
</tr>
<tr id="trDisk"></tr>
<!--<tr id="trLan"></tr>-->
</table>
</div>
</body>
</html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
var performanceData = [];
var perData1 = [];
var ramData = [];
function LoadPerfData(id, objectName, counterName, instanceName, chartName,chartTitle){
$.ajax({
url: "/OperationsManager/data/performance",
type: "POST",
headers: {
"Content-Type": "application/json"
},
data: JSON.stringify({
"id":id,
"performanceCounters":[
{
"objectname":objectName,
"countername":counterName,
"instancename":instanceName
}
],
"legends":[
"target",
"path",
"lastvalue"
],
"duration":1440
}),
success: function (result) {
perData1 = [];
let dataDictionary = result.datasets[0].data;
for (var key in dataDictionary) {
if(dataDictionary.hasOwnProperty(key)) {
var datetime = new Date(key);
datetime = convertUTCDateToLocalDate(datetime);
perData1.push({
y: dataDictionary[key],
x: datetime
});
}
}
renderChart(chartName, chartTitle);
}
});
}
function GetPerfRules(id){
var ruleDict = [];
$.ajax({
url: "/OperationsManager/data/performanceCounters/{" + id + "}",
async: false,
type: "GET",
headers: {
"Content-Type": "application/json"
},
success: function (result) {
ruleDict = result.rows;
}
});
return ruleDict;
}
window.onload = function () {
$.ajax({
url: "/OperationsManager/data/state",
type: "POST",
data: {
"classId": "Microsoft.Windows.Library!Microsoft.Windows.Computer",
"objectIds": {
"1d62280e-f437-1369-316b-1e8659500e9a": -1
},
"criteria": "((HealthState = '0') OR (HealthState = '1') OR (HealthState = '2') OR (HealthState = '3') OR HealthState is null)",
"displayColumns": [
"healthstate",
"id",
"displayname",
"path",
"maintenancemode"
]
},
success: function (result) {
let objSel = document.getElementById("computers");
for (var i = 0; i < result.rows.length; i++) {
objSel.options[i] = new Option(result.rows[i].displayname, result.rows[i].id);
}
let lastObjSelected = localStorage.getItem("lastObjSelected");
if (lastObjSelected) {
$('#computers').val(lastObjSelected);
}
else {
$('#computers')[0].selectedIndex = 0;
}
ChangePerfObj();
}
});
}
function convertUTCDateToLocalDate(date) {
var newDate = new Date(date.getTime()+date.getTimezoneOffset()*60*1000);
var offset = date.getTimezoneOffset() / 60;
newDate.setMinutes(date.getMinutes() - date.getTimezoneOffset())
return newDate;
}
function renderChart(chartName, chartTitle) {
var chart = new CanvasJS.Chart(chartName, {
theme: "light1",
title: {
text: chartTitle
},
axisX: {
labelFormatter: function(e) {
return CanvasJS.formatDate(e.value, "hh:mm tt");
}
},
data: [{
type: "line",
dataPoints: perData1
}]
});
chart.render();
}
function GetInstances(dict, objectname, countername){
return dict.filter(function( item ) {
return (item.objectname == objectname && item.countername == countername);
});
}
function ChangePerfObj() {
var objSel = $('#computers');
LoadPerfData(objSel[0].value, "System", "System Up Time", "", "uptimeChart","System Up Time (24h)");
LoadPerfData(objSel[0].value, "Memory", "PercentMemoryUsed", "", "ramChart", "RAM Used % (24h)");
LoadPerfData(objSel[0].value, "Processor Information", "% Processor Time", "_Total", "cpuChart", "CPU Used % (24h)");
//debugger;
var RulesDict = GetPerfRules(objSel[0].value);
var diskInstances = GetInstances(RulesDict, "LogicalDisk", "% Free Space");
$('#trDisk').empty();
for (var i = 0; i < diskInstances.length; i++) {
let divName = "disk" + i + "Chart";
$('#trDisk').append('<td><div id="' + divName + '" style="height: 250px; width: 250px;"></div></td>');
LoadPerfData(objSel[0].value, "LogicalDisk", "% Free Space", diskInstances[i].instancename, divName, diskInstances[i].instancename + " - Disk Free % (24h)");
}
var lanInstances = GetInstances(RulesDict, "Network Adapter", "PercentBandwidthUsedTotal");
for (var i = 0; i < lanInstances.length; i++) {
let divName = "lan" + i + "Chart";
$('#trDisk').append('<td><div id="' + divName + '" style="height: 250px; width: 250px;"></div></td>');
LoadPerfData(objSel[0].value, "Network Adapter", "PercentBandwidthUsedTotal", lanInstances[i].instancename, divName, lanInstances[i].instancename + " - LAN Used % (24h)");
}
localStorage.setItem("lastObjSelected", objSel[0].value);
}
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/canvasjs/1.7.0/canvasjs.min.js"></script>
</head>
<body>
<div>
Computer: <select id="computers" name="computers" onchange="ChangePerfObj()"></select>
<table>
<tr>
<td><div id="uptimeChart" style="height: 250px; width: 250px;"></div></td>
<td><div id="cpuChart" style="height: 250px; width: 250px;"></div></td>
<td><div id="ramChart" style="height: 250px; width: 250px;"></div></td>
</tr>
<tr id="trDisk"></tr>
<!--<tr id="trLan"></tr>-->
</table>
</div>
</body>
</html>
Комментариев нет:
Отправить комментарий