新版推送
This commit is contained in:
dell
@ -0,0 +1,46 @@
|
||||
/*******************************************************************************
|
||||
* Copyright © 2020 HT.Cloud.Framework 版权所有
|
||||
* Author: HT.Cloud
|
||||
* Description: WaterCloud快速开发平台
|
||||
* Website：
|
||||
*********************************************************************************/
|
||||
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using HT.Cloud.Code;
|
||||
using HT.Cloud.Service.SystemSecurity;
|
||||
|
||||
namespace HT.Cloud.Web.Areas.SystemSecurity.Controllers
|
||||
{
|
||||
[Area("SystemSecurity")]
|
||||
public class DeviceIOController : BaseController
|
||||
{
|
||||
public ServerStateService _serverStateService { get; set; }
|
||||
|
||||
[HttpGet]
|
||||
public async Task<ActionResult> GetServerDataJson()
|
||||
{
|
||||
return await Task.Run(() =>
|
||||
{
|
||||
//windows环境
|
||||
var computer = ComputerHelper.GetComputerInfo();
|
||||
var arm = computer.RAMRate;
|
||||
var cpu = computer.CPURate;
|
||||
var iis = computer.RunTime;
|
||||
var TotalRAM = computer.TotalRAM;
|
||||
string ip = WebHelper.GetWanIp();
|
||||
string ipLocation = WebHelper.GetIpLocation(ip);
|
||||
var IP = string.Format("{0} ({1})", ip, ipLocation);
|
||||
return Content(new { ARM = arm, CPU = cpu, IIS = iis, TotalRAM = TotalRAM, IP = IP }.ToJson());
|
||||
});
|
||||
}
|
||||
|
||||
[HttpGet]
|
||||
public async Task<ActionResult> GetServerData()
|
||||
{
|
||||
var data = (await _serverStateService.GetList(2)).OrderBy(a => a.F_Date).ToList();
|
||||
return Content(data.ToJson());
|
||||
}
|
||||
}
|
||||
}
|
||||
297
HT.Cloud.Web/Areas/SystemSecurity/Views/DeviceIO/Index.cshtml
Normal file
297
HT.Cloud.Web/Areas/SystemSecurity/Views/DeviceIO/Index.cshtml
Normal file
@ -0,0 +1,297 @@
|
||||
@{
|
||||
ViewBag.Title = "Index";
|
||||
Layout = "~/Views/Shared/_Index.cshtml";
|
||||
}
|
||||
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment env
|
||||
<meta name="renderer" content="webkit">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<style>
|
||||
|
||||
.layui-card {
|
||||
border: 1px solid #f2f2f2;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin-right: 10px;
|
||||
color: #1aa094;
|
||||
}
|
||||
|
||||
.icon-cray {
|
||||
color: #ffb800 !important;
|
||||
}
|
||||
|
||||
.icon-blue {
|
||||
color: #1e9fff !important;
|
||||
}
|
||||
|
||||
.icon-tip {
|
||||
color: #ff5722 !important;
|
||||
}
|
||||
|
||||
.layuimini-qiuck-module {
|
||||
text-align: center;
|
||||
margin-top: 10px
|
||||
}
|
||||
|
||||
.layuimini-qiuck-module a i {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
text-align: center;
|
||||
border-radius: 2px;
|
||||
font-size: 30px;
|
||||
background-color: #F8F8F8;
|
||||
color: #333;
|
||||
transition: all .3s;
|
||||
-webkit-transition: all .3s;
|
||||
}
|
||||
|
||||
.layuimini-qiuck-module a cite {
|
||||
position: relative;
|
||||
top: 2px;
|
||||
display: block;
|
||||
color: #666;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.welcome-module {
|
||||
width: 100%;
|
||||
height: 210px;
|
||||
}
|
||||
|
||||
.panel {
|
||||
background-color: #fff;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 3px;
|
||||
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
|
||||
box-shadow: 0 1px 1px rgba(0,0,0,.05)
|
||||
}
|
||||
|
||||
.panel-body {
|
||||
padding: 10px
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 12px;
|
||||
color: inherit
|
||||
}
|
||||
|
||||
.label {
|
||||
display: inline;
|
||||
padding: .2em .6em .3em;
|
||||
font-size: 75%;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
vertical-align: baseline;
|
||||
border-radius: .25em;
|
||||
margin-top: .3em;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: inline;
|
||||
padding: .2em .6em .3em;
|
||||
font-size: 75%;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
vertical-align: baseline;
|
||||
border-radius: .25em;
|
||||
margin-top: .3em;
|
||||
}
|
||||
|
||||
.layui-red {
|
||||
color: red
|
||||
}
|
||||
|
||||
.main_btn > p {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.layui-bg-number {
|
||||
background-color: #F8F8F8;
|
||||
}
|
||||
|
||||
.layuimini-notice:hover {
|
||||
background: #f6f6f6;
|
||||
}
|
||||
|
||||
.layuimini-notice {
|
||||
padding: 7px 16px;
|
||||
clear: both;
|
||||
font-size: 12px !important;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
transition: background 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.layuimini-notice-title, .layuimini-notice-label {
|
||||
padding-right: 70px !important;
|
||||
text-overflow: ellipsis !important;
|
||||
overflow: hidden !important;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
.layuimini-notice-title {
|
||||
line-height: 28px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.layuimini-notice-extra {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -8px;
|
||||
right: 16px;
|
||||
display: inline-block;
|
||||
height: 16px;
|
||||
color: #999;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
layui.use(['layer', 'echarts', 'common'], function () {
|
||||
var $ = layui.jquery,
|
||||
layer = layui.layer,
|
||||
common = layui.common,
|
||||
echarts = layui.echarts;
|
||||
common = layui.common;
|
||||
common.iframeInterval(function () {
|
||||
loadInfo();
|
||||
}, 10000); //指定10秒刷新一次
|
||||
$(function () {
|
||||
loadInfo();
|
||||
loadChart();
|
||||
});
|
||||
wcLoading.close();
|
||||
function loadInfo() {
|
||||
$.ajax({
|
||||
url: "/SystemSecurity/ServerMonitoring/GetServerDataJson?v=" + new Date().Format("yyyy-MM-dd hh:mm:ss"),
|
||||
dataType: "json",
|
||||
success: function (data) {
|
||||
$('#cpucout').html(data.CPU + "%");
|
||||
$('#armcout').html(data.ARM + "%");
|
||||
$('#TotalRAM').html(data.TotalRAM);
|
||||
$('#OutIP').html(data.IP);
|
||||
}
|
||||
});
|
||||
}
|
||||
function loadChart() {
|
||||
var myChart = echarts.init(document.getElementById('echarts-records'), 'walden');
|
||||
var xData = [];
|
||||
var armData = [];
|
||||
var cpuData = [];
|
||||
common.ajax({
|
||||
url: "/SystemSecurity/ServerMonitoring/GetServerData",
|
||||
dataType: "json",
|
||||
async: false,
|
||||
success: function (data) {
|
||||
var length = data.length;
|
||||
for (var i = 0; i < length; i++) {
|
||||
if (data[i]['F_Date'] !== null) {
|
||||
xData.push(new Date(data[i]['F_Date']).Format("yyyy-MM-dd"));
|
||||
}
|
||||
if (data[i]['F_ARM'] !== null) {
|
||||
armData.push(data[i]['F_ARM']);
|
||||
}
|
||||
if (data[i]['F_CPU'] !== null) {
|
||||
cpuData.push(data[i]['F_CPU']);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
option = {
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
legend: {
|
||||
data: ['CPU使用率', 'ARM使用率']
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: xData
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'CPU使用率', type: 'line',
|
||||
data: cpuData,
|
||||
lineStyle: {
|
||||
normal: {
|
||||
width: 2
|
||||
}
|
||||
},
|
||||
smooth: true,
|
||||
symbol: 'circle',
|
||||
symbolSize: 10,
|
||||
showAllSymbol: true,
|
||||
color: '#2499F8',
|
||||
},
|
||||
{
|
||||
name: 'ARM使用率', type: 'line',
|
||||
data: armData,
|
||||
lineStyle: {
|
||||
normal: {
|
||||
width: 2
|
||||
}
|
||||
},
|
||||
smooth: true,
|
||||
symbol: 'circle',
|
||||
symbolSize: 10,
|
||||
showAllSymbol: true,
|
||||
color: '#F90',
|
||||
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
myChart.setOption(option);
|
||||
// echarts 窗口缩放自适应
|
||||
window.onresize = function () {
|
||||
myChart.resize();
|
||||
}
|
||||
};
|
||||
})
|
||||
</script>
|
||||
@* <div style="width:100%;height:100%;">
|
||||
<div class="layuimini-container" style="width:100%;height:100%;">
|
||||
<div class="layuimini-main">
|
||||
<div class="layui-row layui-col-space15">
|
||||
<div class="layui-col-md15">
|
||||
<iframe style="width:100%;height:90vh" src="http://testpro.yaolm.top/device-bind"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> *@\
|
||||
<head>
|
||||
<title>webtopo-svg-edit Example</title>
|
||||
<link href="https://unpkg.com/webtopo-svg-edit@0.0.8/dist/style.css" rel="stylesheet" />
|
||||
<script src="https://unpkg.com/vue@3.2.6/dist/vue.global.prod.js"></script>
|
||||
<script src="https://unpkg.com/vue-demi@0.13.11/lib/index.iife.js"></script>
|
||||
<script src="https://unpkg.com/pinia@2.0.33/dist/pinia.iife.prod.js"></script>
|
||||
<script src="https://unpkg.com/webtopo-svg-edit@0.0.8/dist/webtopo-svg-edit.umd.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script>
|
||||
const pinia = Pinia.createPinia()
|
||||
const app = Vue.createApp(WebtopoYLM.WebtopoSvgEdit)
|
||||
app.use(pinia)
|
||||
app.mount('#app')
|
||||
</script>
|
||||
</body>
|
||||
Reference in New Issue
Block a user