MES / IOT · Files

@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
    ViewData["title"] = "项目工程表";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@section header
{

	<link href="~/css/iot/iconfont.css" rel="stylesheet" />

    <style type="text/css">

		/* head*/

		.head {
			padding-left: 7px;
		}

		.head-project {display: flex;width: 100%;height: 7vh;}

		.head-project-logo {display: flex;justify-content: flex-start;width: 70%; align-items: center;}

		.head-project-title {height: 10vh;text-align: center;line-height: 10vh;font-size:30px;padding-left: 6vh;}

		.head-project-route {display: flex;width: 30%;justify-content: flex-end;align-items: center;}

		.divcontent {
			display: flex;
			height: 100%;
		}

		.contcss {
			display: flex;
			width: 20%;
			margin-right: 1vw;
			box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
		}

		.top-refresh-data {

			height: 23px;
			line-height: 23px;

			background-color: #ffffff;

			margin-right: 2vw;

			font-size: 20px;

		}

		.divcontent-left {
			flex: 2;
			display: flex;
			flex-direction: column;
			justify-content: center;
			padding-left: 1vw;
		}

		.divcontent-right {
			flex: 1;
		}

		.imgdiv {
			height: 3vh;
			text-align: center;
			line-height: 10vh;
		}

		.textStyle {
			font-weight: 600;
			font-size: 1.2vw;
			color: black;
		}

		.layui-colla-content {
			padding: 10px 15px;
		}

		.iconfont {
			font-size: 42px;
		}

		.headStyle{
			position: fixed;
			background-color: #fff;
			z-index: 99;
			width: 99%
		}

		.layui-colla-item{margin-bottom:5px;}

    </style>			

}

<div class="vueApp">

	<div class="head headStyle" >

		<div class="head-breadcrumb">

			<span class="layui-breadcrumb" lay-separator="> " lay-filter="projectMap">

				<a href="/configure/BaseProject/ProjectOverview">项目概述</a>
			</span>
		</div>

		<div class="head-project">
			<div class="head-project-logo">
				<div><img style="width:190px;height:21px;" src="/images/logo.png" alt="" /></div>
				<div class="head-project-title">{{head.projectName}}</div>
			</div>
			<div class="head-project-route">

				<div class="footer-list div-flex top-refresh-data">

					数据刷新倒计时:<span style="color:cornflowerblue;display:block" id="refreshDataTime">{{refreshDataTime}}</span>

				</div>

				<a data-scr="/equipment/BaseEquipment/IndexProjectAndEq" href="" class="sys-a-det">切换到设备列表</a>

			</div>
		</div>
	</div>

	<div class="layui-collapse" style="padding-left:7px;padding-top: 3vw;">

		<!--设备概述-->

		<div class="layui-colla-item">

			<div class="layui-colla-title">设备概述</div>

			<div class="layui-colla-content layui-show">
				<div class="divcontent vueApp" style="height: 10vh">

					<div class="contcss">
						<div class="divcontent-left">
							<div>设备总数</div>

							<div class="textStyle">{{body.eqCount}}</div>

						</div>
						<div class="divcontent-right">
							<div class="imgdiv">
								<span class="iconfont icon-shebei" style="color: rgb(146, 133, 235);"></span>
							</div>
						</div>
					</div>
					<div class="contcss">
						<div class="divcontent-left">

							<div>运行数</div>

							<div class="textStyle">{{body.eqRunCount}}</div>

						</div>
						<div class="divcontent-right">
							<div class="imgdiv">

								<span class="iconfont icon-zaixianshu" style="color: #16baaa;"></span>

							</div>
						</div>
					</div>
					<div class="contcss">
						<div class="divcontent-left">

							<div>待机数</div>

							<div class="textStyle">{{body.eqStandBy}}</div>

						</div>
						<div class="divcontent-right">
							<div class="imgdiv">

								<span class="iconfont icon-daiji" style="color: rgb(146, 133, 235);"></span>

							</div>
						</div>
					</div>

					<div class="contcss">

						<div class="divcontent-left">

							<div>故障数</div>
							<div class="textStyle">{{body.eqError}}</div>
						</div>
						<div class="divcontent-right">
							<div class="imgdiv">

								<span class="iconfont icon-shebeiguzhang2" style="color: #ffb800;"></span>

							</div>
						</div>
					</div>
					<div class="contcss">
						<div class="divcontent-left">

							<div>离线数(5m)</div>

							<div class="textStyle" style="color:red;">{{body.eqOffline}}</div>

						</div>
						<div class="divcontent-right">
							<div class="imgdiv">

								<span class="iconfont icon-lixianshu"></span>

							</div>
						</div>

					</div>

				</div>

			</div>
		</div>

		<!--设备在线状况--> 

		<div class="layui-colla-item">
			<div class="layui-colla-title">设备在线状况</div>
			<div class="layui-colla-content">

				<div style="width:480px;margin-bottom: 33px;">

					<table id="mainList" lay-filter="mainList" lay-size="sm"></table>
				</div>

			</div>
		</div>

		<!--设备开机时间-->
		<div class="layui-colla-item">
			<div class="layui-colla-title">设备开机时间(近7天) 待实现</div>
			<div class="layui-colla-content">
				<div class="divcontent">
					<div id="eqPowerOnTime" style="width: 90vw;height: 300px;"></div>
				</div>
			</div>
		</div>

		<!--当天设备运行-->

		<div class="layui-colla-item">

			<div class="layui-colla-title">当天设备运行(运行+待机)/设备总数</div>

			<div class="layui-colla-content layui-show" style="height: 10vh">
				<div class="divcontent">
					<div class="contcss">
						<div class="divcontent-left">
							<div>在线率</div>

							<div class="textStyle">{{body.eqOnlineRate}}</div>

						</div>
						<div class="divcontent-right">
							<div class="imgdiv">
								<span class="iconfont icon-shebeizaixianshuai" style="color: rgb(146, 133, 235);"></span>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!--每台设备妥善率-->

		<div class="layui-colla-item">

			<div class="layui-colla-title">每台设备妥善率(近7天)  妥善率:(1-故障时间/24小时)*100</div>

			<div class="layui-colla-content">
				<div class="divcontent">
					<div id="eqTuoShanRate" style="width: 90vw;height: 300px;" ></div>
				</div>
			</div>
		</div>

		<!--设备故障次数-->

		<div class="layui-colla-item">

			<div class="layui-colla-title">设备故障次数(近7天)</div>

			<div class="layui-colla-content">
				<div class="divcontent">
					<div id="eqAlarmsNumber" style="width: 90vw;height: 300px;"></div>
				</div>
			</div>
		</div>

		<!--设备故障超40分钟-->

		<div class="layui-colla-item">

			<div class="layui-colla-title" style="color:#ff5722 ;">设备故障超40分钟(近7天)</div>

			<div class="layui-colla-content">
				<div class="divcontent">

					<div >

						<table id="mainAlarms" lay-filter="mainAlarms" lay-size="sm"></table>
					</div>
				</div>
			</div>
		</div>

		<!--扩展指标-->

		<div class="layui-colla-item">

			<div class="layui-colla-title">扩展指标(一周内)</div>

			<div class="layui-colla-content layui-show" style="height: 10vh">

				<div class="divcontent">
					<div class="contcss">
						<div class="divcontent-left">

							<div>妥善率</div>

							<div class="textStyle">待开发</div>

						</div>
						<div class="divcontent-right">
							<div class="imgdiv">
								<span class="iconfont icon-xiaoshuai" style="color: rgb(146, 133, 235);"></span>
							</div>
						</div>
					</div>
					<div class="contcss">
						<div class="divcontent-left">

							<div>MTTR</div>

							<div class="textStyle">待开发</div>

						</div>
						<div class="divcontent-right">
							<div class="imgdiv">

								<span class="iconfont icon-shebeiMTTR" style="color: rgb(146, 133, 235);"></span>

							</div>
						</div>
					</div>
					<div class="contcss">
						<div class="divcontent-left">
							<div>MTBF</div>

							<div class="textStyle">待开发</div>

						</div>
						<div class="divcontent-right">
							<div class="imgdiv">

								<span class="iconfont icon-MTBF" style="color: rgb(146, 133, 235);"></span>

							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

	<div style="margin: 20px;color:blue;">

		<span><span style="font-weight: bold;">妥善率：</span>(1-故障時間/N天)*100%</span>

		<span style="margin-left: 30px;"><span style="font-weight: bold;">MTTR：</span>故障時間H/故障次數</span>
		<span style="margin-left: 30px;"><span style="font-weight: bold;">MTBF：</span>正常運作時間H/故障次數</span>
	</div>

</div>

@section Scripts

    {

       <script src="~/js/echarts/echarts.common.min.js"></script>

	   <script type="text/javascript" src="~/echartsconfig/projectoverviewconfig.js"></script>

       <script type="text/javascript" src="/productjs/configure/ProjectOverview.js" asp-append-version="true"></script>

 }