lpf
/
CNCEC_SUBQHSE_WUHUAN
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
CNCEC_SUBQHSE_WUHUAN/SGGL/FineUIPro.Web/HSSE/TowerCrane/TowerCraneState.aspx

518 lines
23 KiB
Plaintext
Raw Normal View History

塔吊
2025-06-04 09:11:41 +08:00
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TowerCraneState.aspx.cs" Inherits="FineUIPro.Web.HSSE.TowerCrane.TowerCraneState" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>塔吊状态</title>
塔吊
2025-06-13 21:17:50 +08:00
<script src="../../common/lib/flex.js"></script>
<link rel="stylesheet" href="../../res/css/commontower.css" />
<link rel="stylesheet" href="../../res/css/indextower.css" />
塔吊
2025-06-04 09:11:41 +08:00
</head>
<body>
<form id="form1" runat="server">
<f:PageManager ID="PageManager1" AutoSizePanelID="Panel1" runat="server" />
<f:Panel ID="Panel1" runat="server" ShowBorder="false" ShowHeader="false" Layout="Region">
<Items>
<f:Panel runat="server" ID="panelLeftRegion" RegionPosition="Left" RegionSplit="true"
EnableCollapse="true" Width="300px" Title="塔吊状态" ShowBorder="true" Layout="VBox"
ShowHeader="true" AutoScroll="true" BodyPadding="5px" IconFont="ArrowCircleLeft">
<Toolbars>
<f:Toolbar ID="Toolbar1" Position="Top" runat="server" ToolbarAlign="Left">
<Items>
<f:TextBox ID="txtIsono" runat="server" Label="塔吊" EmptyText="输入查询条件" AutoPostBack="true"
OnTextChanged="Tree_TextChanged" Width="250px" LabelWidth="70px" LabelAlign="Right">
</f:TextBox>
塔吊
2025-06-13 21:17:50 +08:00
<f:HiddenField ID="hfTowerCraneId" ClientIDMode="Static"></f:HiddenField>
塔吊
2025-06-04 09:11:41 +08:00
</Items>
</f:Toolbar>
</Toolbars>
<Items>
<f:Tree ID="tvControlItem" ShowHeader="false" Height="500px" Title="塔吊状态" OnNodeCommand="tvControlItem_NodeCommand"
塔吊
2025-06-13 21:17:50 +08:00
runat="server" ShowBorder="false" EnableCollapse="true"
AutoLeafIdentification="true" EnableSingleExpand="true" EnableTextSelection="true" >
塔吊
2025-06-04 09:11:41 +08:00
</f:Tree>
</Items>
</f:Panel>
<f:Panel runat="server" ID="panelCenterRegion" RegionPosition="Center" ShowBorder="true"
Layout="VBox" ShowHeader="false" BodyPadding="5px" IconFont="PlusCircle" Title="塔吊状态"
TitleToolTip="塔吊状态" AutoScroll="true">
<Items>
塔吊
2025-06-13 21:17:50 +08:00
<f:ContentPanel ID="ContentPanel1" CssClass="bodyregion" ShowBorder="false" ShowHeader="false" runat="server">
<div class="y_wrap">
<div class="y_l_site">
<div class="y_box">
<div class="tit">
<div class="y_c_icon"><span></span></div>
<p>设备报警</p>
</div>
<div class="y_box_main" id="sbbj">
<div>
<div>当日预警</div>
<div><span class="c_5b97f9" id="DailyWarning">0</span><span>次</span></div>
</div>
<div>
<div>当日报警</div>
<div><span class="c_ff5353" id="DailyAlarm">0</span><span>次</span></div>
</div>
</div>
</div>
<div class="y_box">
<div class="tit">
<div class="y_c_icon"><span></span></div>
<p>预警趋势</p>
</div>
<div class="y_box_main" style="height:4rem;width:7rem" id="BJQS"></div>
</div>
<div class="y_box">
<div class="tit">
<div class="y_c_icon"><span></span></div>
<p>设备信息</p>
</div>
<div class="y_box_main" id="sbxx">
<div class="y_row">
<div class="y_span">
<div class="y_span_lab"><span></span><span>设备名称</span></div>
<div class="y_span_val" id="divTowerCraneName" ></div>
</div>
<div class="y_span">
<div class="y_span_lab">
<span style="background-color: #92b8f5"></span
><span>设备编号</span>
</div>
<div class="y_span_val" id="divTowerCraneCode" ></div>
</div>
</div>
<div class="y_row">
<div class="y_span">
<div class="y_span_lab">
<span style="background-color: #a8eeff"></span
><span>最大吊重</span>
</div>
<div class="y_span_val" id="divMaxHoist" >T</div>
</div>
<div class="y_span">
<div class="y_span_lab">
<span style="background-color: #4efac6"></span
><span>最大力矩</span>
</div>
<div class="y_span_val" id="divMaxMoment" runat="server">T-M</div>
</div>
</div>
<div class="y_row">
<div class="y_span">
<div class="y_span_lab">
<span style="background-color: #a9f841"></span
><span>前臂长</span>
</div>
<div class="y_span_val" id="divFrontArmLength" runat="server">米</div>
</div>
<div class="y_span">
<div class="y_span_lab">
<span style="background-color: #e5fa29"></span
><span>后臂长</span>
</div>
<div class="y_span_val" id="divBackArmLength" runat="server">米</div>
</div>
</div>
<div class="y_row">
<div class="y_span">
<div class="y_span_lab">
<span style="background-color: #f8c63e"></span
><span>塔帽高</span>
</div>
<div class="y_span_val" id="divTowerCap" runat="server" > </div>
</div>
<div class="y_span">
<div class="y_span_lab">
<span style="background-color: #f1540b"></span
><span>塔臂高</span>
</div>
<div class="y_span_val" id="divArmHeigh" runat="server" >米</div>
</div>
</div>
</div>
</div>
</div>
<div class="y_r_site">
<div class="y_r_site_sub">
<div id="tdzt">
<div></div>
<p>设备编号</p>
</div>
<div id="sp">
<live-player id="player01" live="true" aspect="16:9"></live-player>
</div>
</div>
<div id="zt">
<div>
<span></span>
<span id="Hoist">0T</span>
<span>吊重</span>
</div>
<div>
<span></span>
<span id="Range">0M</span>
<span>幅度</span>
</div>
<div>
<span></span>
<span id="Camber">0度</span>
<span>倾度</span>
</div>
<div>
<span></span>
<span id="WindSpeed">0.00M-T</span>
<span>风速</span>
</div>
<div>
<span></span>
<span id="Moment">0T</span>
<span>力矩</span>
</div>
<div>
<span></span>
<span id="Height">0M</span>
<span>高度</span>
</div>
</div>
<div class="y_r_site_sub1">
<div class="y_box">
<div class="tit">
<div class="y_c_icon"><span></span></div>
<p>实时力矩</p>
</div>
<div class="y_box_main" style="height:3.5rem;width:6rem" id="SSLJ"></div>
</div>
<div class="y_box">
<div class="tit">
<div class="y_c_icon" ><span></span></div>
<p>实时吊重</p>
</div>
<div class="y_box_main" style="height:3.5rem;width:6rem" id="SSDZ"></div>
</div>
</div>
</div>
</div>
</f:ContentPanel>
塔吊
2025-06-04 09:11:41 +08:00
</Items>
</f:Panel>
</Items>
</f:Panel>
</form>
塔吊
2025-06-13 21:17:50 +08:00
<script src="../../res/liveplayer/liveplayer-element.min.js"></script>
<script type="text/javascript" src="../../res/lib/echarts.min.js"></script>
塔吊
2025-06-04 09:11:41 +08:00
<script type="text/javascript">
塔吊
2025-06-13 21:17:50 +08:00
// 报警趋势
塔吊
2025-06-04 09:11:41 +08:00
塔吊
2025-06-13 21:17:50 +08:00
function createBJQSMap(data,dataX) {
// 初始化ECharts实例
const trendChart = echarts.init(document.getElementById("BJQS"));
// 配置项
const option = {
title: {
text: "预警数量",
textStyle: {
color: "#000", // 标题颜色
fontSize: 14,
},
top: "0%", // 顶部对齐
right: "-3%", // 右侧偏移位置
textAlign: "right", // 文本右对齐
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
grid: {
left: "3%",
right: "4%",
bottom: "6%",
containLabel: true,
},
xAxis: {
type: "category",
data: dataX,
axisLine: {
lineStyle: {
color: "#5b97f9", // 坐标轴颜色
},
},
axisLabel: {
color: "#c9c9c9", // 坐标轴标签颜色
},
},
yAxis: {
type: "value",
axisLine: {
lineStyle: {
color: "#5b97f9",
},
},
axisLabel: {
color: "#c9c9c9",
},
splitLine: {
lineStyle: {
color: "rgba(91, 151, 249, 0.2)", // 网格线颜色
},
},
},
series: [
{
name: "报警次数",
type: "line",
smooth: true,
symbol: "none",
data: data,
lineStyle: {
color: "#b828fc", // 报警线颜色
},
itemStyle: {
color: "#b828fc",
},
},
],
};
// 应用配置
trendChart.setOption(option);
// 响应式调整
window.addEventListener("resize", function () {
trendChart.resize();
});
}
function createSSLJMap(data,dataX) {
// 初始化ECharts实例
const trendChart = echarts.init(document.getElementById("SSLJ"));
// 配置项
const option = {
grid: {
left: "3%",
right: "4%",
bottom: "6%",
containLabel: true,
},
xAxis: {
type: "category",
data: dataX,
axisLine: {
lineStyle: {
color: "#5b97f9", // 坐标轴颜色
},
},
axisLabel: {
color: "#c9c9c9", // 坐标轴标签颜色
},
},
yAxis: {
type: "value",
axisLine: {
lineStyle: {
color: "#5b97f9",
},
},
axisLabel: {
color: "#c9c9c9",
},
splitLine: {
lineStyle: {
color: "rgba(91, 151, 249, 0.2)", // 网格线颜色
},
},
},
series: [
{
name: "实时力矩",
type: "line",
smooth: true,
symbol: "none",
data: data,
lineStyle: {
color: "#599df7", // 报警线颜色
},
itemStyle: {
color: "#599df7",
},
},
],
};
// 应用配置
trendChart.setOption(option);
// 响应式调整
window.addEventListener("resize", function () {
trendChart.resize();
});
}
function createSSDZMap(data, datax) {
debugger
// 初始化ECharts实例
const trendChart = echarts.init(document.getElementById("SSDZ"));
// 配置项
const option = {
grid: {
left: "3%",
right: "4%",
bottom: "6%",
containLabel: true,
},
xAxis: {
type: "category",
data: datax,
axisLine: {
lineStyle: {
color: "#5b97f9", // 坐标轴颜色
},
},
axisLabel: {
color: "#c9c9c9", // 坐标轴标签颜色
},
},
yAxis: {
type: "value",
axisLine: {
lineStyle: {
color: "#5b97f9",
},
},
axisLabel: {
color: "#c9c9c9",
},
splitLine: {
lineStyle: {
color: "rgba(91, 151, 249, 0.2)", // 网格线颜色
},
},
},
series: [
{
name: "吊重",
type: "line",
smooth: true,
symbol: "none",
data: data,
lineStyle: {
color: "#599df7", // 报警线颜色
},
itemStyle: {
color: "#599df7",
},
},
],
};
// 应用配置
trendChart.setOption(option);
// 响应式调整
window.addEventListener("resize", function () {
trendChart.resize();
});
}
var currentTowerCraneId = "";
function runGetData() {
var TowerCraneId = $("#hfTowerCraneId-inputEl").val();
if (TowerCraneId != undefined) {
$.ajax({
url: "TowerCraneState.aspx/GetData",
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: JSON.stringify({
TowerCraneId: TowerCraneId
}),
success: function (data) {
if (data.d != '' && data.d != undefined) {
var d = JSON.parse(data.d);
$('#divTowerCraneName').text(d.TowerCraneName)
$('#divTowerCraneCode').text(d.TowerCraneCode)
$('#divTowerCap').text(d.TowerCap)
$('#divMaxHoist').text(d.MaxHoist+'T')
$('#divMaxMoment').text(d.MaxMoment)
$('#divFrontArmLength').text(d.FrontArmLength + '米')
$('#divBackArmLength').text(d.BackArmLength + '米')
$('#divArmHeigh').text(d.ArmHeigh + '米')
$('#DailyWarning').text(d.DailyWarning)
$('#DailyAlarm').text(d.DailyAlarm)
$('#Camber').text(d.Camber)
$('#Height').text(d.Height)
$('#Hoist').text(d.Hoist)
$('#Moment').text(d.Moment)
$('#Range').text(d.Range)
$('#WindSpeed').text(d.WindSpeed)
createSSDZMap(d.SSDZ, d.SSDZX)
createSSLJMap(d.SSLJ, d.SSLJX)
createBJQSMap(d.BJQS, d.BJQSX)
}
}
})
}
setTimeout(function () {
runGetData();
}, 5000);
}
var videoHost = 'https://camera.cwcec.com:10000/';
function initVideo(VideoUserName, VideoPassWord) {
var player = document.getElementById('player01');
player.setAttribute("video-url",'');
$.get(videoHost + 'api/v1/login?username=' + VideoUserName + '&password=' + VideoPassWord, function (data1) {
authToken = data1.AuthToken;
$.get(videoHost + 'api/v1/device/channeltree?token=' + authToken, function (data2) {
for (var i = 0; i < data2.length && i <= 0; i++) {
$.get(videoHost + 'api/v1/device/channeltree?serial=' + data2[i].serial + '&token=' + authToken, function (data3) {
debugger
if (data3.length > 0) {
$.get(videoHost + 'api/v1/stream/start?serial=' + data3[0].id.split(':')[0] + '&code=' + data3[0].id.split(':')[1] + '&token=' + authToken, function (data4) {
console.log(data4.HLS)
var player = document.getElementById('player01');
player.setAttribute("video-url", data4.HLS);
}, 'json');
}
}, 'json');
}
}, 'json');
}, 'json');
}
runGetData()
塔吊
2025-06-04 09:11:41 +08:00
</script>
</body>
</html>