Nate
/
BIM-Monitor


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302
							<?php
include($_SERVER['DOCUMENT_ROOT'] . "/Authorization/script/php/permission/check_right.php");
?>
<!doctype html>
<html class="fixed">

<head>
	<!-- Basic -->
	<meta charset="UTF-8">
	<title>儀表板 | R03監測儀器</title>
	<meta name="keywords" content="HTML5 Admin Template" />
	<meta name="description" content="JSOFT Admin - Responsive HTML5 Template">
	<meta name="author" content="JSOFT.net">
	<script src="/BIM-Monitor/script/php/clearData.php"></script>
	<!-- Mobile Metas -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
	<!-- Unity CSS -->
	<link rel="stylesheet" href="/BIM-Monitor/C3/C3Dev/TemplateData/style.css">
	<!-- Web Fonts  -->
	<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Shadows+Into+Light" rel="stylesheet" type="text/css">
	<!-- Vendor CSS -->
	<link rel="stylesheet" href="/Common/assets/vendor/bootstrap/css/bootstrap.css" />
	<link rel="stylesheet" href="/Common/assets/vendor/font-awesome/css/font-awesome.css" />
	<link rel="stylesheet" href="/Common/assets/vendor/magnific-popup/magnific-popup.css" />
	<link rel="stylesheet" href="/Common/assets/vendor/bootstrap-datepicker/css/datepicker3.css" />
	<link rel="stylesheet" href="/Common/assets/vendor/pnotify/pnotify.custom.css" />
	<!-- Specific Page Vendor CSS -->
	<link rel="stylesheet" href="/Common/assets/vendor/jquery-ui/css/ui-lightness/jquery-ui-1.10.4.custom.css" />
	<link rel="stylesheet" href="/Common/assets/vendor/bootstrap-multiselect/bootstrap-multiselect.css" />
	<link rel="stylesheet" href="/Common/assets/vendor/morris/morris.css" />
	<link rel="stylesheet" href="/Common/assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.css" />
	<!-- Theme CSS -->
	<link rel="stylesheet" href="/Common/assets/stylesheets/theme.css" />
	<!-- Skin CSS -->
	<link rel="stylesheet" href="/Common/assets/stylesheets/skins/default.css" />
	<!-- Theme Custom CSS -->
	<link rel="stylesheet" href="/Common/assets/stylesheets/theme-custom.css">
	<!-- Head Libs -->
	<script src="/Common/assets/vendor/modernizr/modernizr.js"></script>
	<!-- chart.js -->
	<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
	<!-- DataTable -->
	<script src="/Common/assets/vendor/jquery/jquery.js"></script>
	<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.css">
	<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js"></script>
	<!-- Icon -->
	<link rel="shortcut icon" href="/Common/assets/images/favicon.ico" />

	<!-- vue3 -->
	<script src="https://unpkg.com/vue@next"></script>
	<script src="/BIM-Monitor/script/js/global.js"></script>
	<script src="/Common/script/js/user-image.js"></script>
	<script type="application/javascript">
		var userName = "<?php echo $_SESSION['name'] ?>";
		var role = "<?php echo ($groupName); ?>";
		var right = <?php echo ($right); ?>;
		var pageHeader = 'R03儀表板';
		var test;
	</script>

</head>

<body>
	<section class="body">
		<!-- start: header -->
		<header-menu></header-menu>
		<!-- end: header -->
		<div class="inner-wrapper">
			<!-- start: sidebar -->
			<side-bar></side-bar>
			<!-- end: sidebar -->
			<section role="main" class="content-body">
				<header class="page-header">
					<h2>{{pageHeader}}</h2>
				</header>
				<div class="row">
					<div class="col-md-6">
						<section class="panel">
							<header class="panel-heading">
								<div class="panel-actions">
									<a style="display:none" href="#" class="fa fa-caret-down"></a>
									<a style="display:none" href="#" class="fa fa-times"></a>
								</div>
								<h2 id="tableName" class="panel-title">資料表</h2>
							</header>
							<div class="tabs tabs-bottom tabs-primary">
								<div class="panel-body">
									<div class="tab-content" style="padding: 20px;">
										<div id="popular" class="chart chart-unity tab-pane active">
											<!-- <div class="input-daterange input-group" data-plugin-datepicker="">
												<span class="input-group-addon">
													<i class="fa fa-calendar"></i>
												</span>
												<input type="text" class="form-control" name="start" autocomplete="off">
												<span class="input-group-addon">to</span>
												<input type="text" class="form-control" name="end" autocomplete="off">
											</div> -->
											<div id="legend" style="margin: auto; width: 50%;">
												<img src="/BIM-Monitor/assets/images/legend.png" />
											</div>

											<canvas id="myChart"></canvas>
										</div>
										<div id="recent" class="tab-pane">
											<div id="tabData">
												<table id="dataTable" class="display">
													<thead>
														<tr>
															<th>測量日期</th>
															<th id="unit">測量值 單位:</th>
														</tr>
													</thead>
													<tbody id="table">
													</tbody>
												</table>
											</div>
										</div>
									</div>
									<ul class="nav nav-tabs nav-justified">
										<li class="active"> <a href="#popular" data-toggle="tab" class="text-center"><i class="fa fa-bar-chart-o"></i> 折線圖</a> </li>
										<li> <a href="#recent" data-toggle="tab" class="text-center"><i class="fa fa-table"></i>資料表</a> </li>
									</ul>
								</div>
							</div>
						</section>
					</div>
					<div class="col-md-6">
						<section class="panel">
							<header class="panel-heading">
								<div class="panel-actions">
									<a style="display:none" href="#" class="fa fa-caret-down"></a>
									<a style="display:none" href="#" class="fa fa-times"></a>
								</div>
								<h2 class="panel-title">R03觀測模型</h2>
								<div class="panel-subtitle">
									<button id='monitorName' type="button" class="mb-xs mt-xs mr-xs btn btn-info" data-toggle="tooltip" data-placement="top" title="顯示目前監測儀器類別">SIS監測儀器</button>
									<button type="button" class="mb-xs mt-xs mr-xs btn btn-default" onclick="ResetCamera()">重置鏡頭</button>

									<div class="btn-group" style="display:none">
										<button type="button" class="mb-xs mt-xs mr-xs btn btn-default dropdown-toggle" data-toggle="dropdown">選擇觀測儀器 <span class="caret"></span></button>
										<ul id="monitorSelect" class="dropdown-menu" role="menu"> </ul>
									</div>

									<a id="monitorSelect2" class="mb-xs mt-xs mr-xs modal-basic modal-with-zoom-anim btn btn-primary" href="#modalHeaderColorPrimary" data-toggle="tooltip" data-placement="top" title="選擇觀測儀器">選擇觀測儀器</a>

									<div id="modalHeaderColorPrimary" class="zoom-anim-dialog modal-block modal-header-color modal-block-primary mfp-hide">
										<section class="panel">
											<header class="panel-heading">
												<h2 class="panel-title">請選擇觀測儀器</h2>
												<label style="color: #FFF"><input type="checkbox" id="errorCheck" onclick="CheckError()">僅顯示錯誤儀器</label>
											</header>
											<div class="panel-body">
												<div class="modal-wrapper">
													<div class="modal-icon"> <i class="fa fa-desktop"></i> </div>
													<div id="monitorButton" class="modal-text">綠色為正常|紅色為異常</div>
												</div>
											</div>
											<footer class="panel-footer">
												<div class="row">
													<div class="col-md-12 text-right">
														<button class="btn btn-default modal-dismiss">取消</button>
													</div>
												</div>
											</footer>
										</section>
									</div>
								</div>
							</header>

							<div class="panel-body">
								<div class="chart chart-unity">
									<div id="unity-container" class="unity-desktop">
										<div id="unity-loading-bar"> <img src="/Common/assets/images/loading-logo.gif" height="100%" />
											<div class="progress-striped m-md">
												<div id="unity-progress-bar-full" class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"> 0% </div>
											</div>
										</div>
										<canvas id="unity-canvas"></canvas>
										<div id="unity-warning"> </div>
									</div>
								</div>
							</div>

						</section>
					</div>
				</div>
				<div class="row">
					<div class="col-md-3">
						<section class="panel panel-featured-left panel-featured-primary">
							<div class="panel-body">
								<div class="widget-summary widget-summary-md">
									<div class="widget-summary-col widget-summary-col-icon">
										<div class="summary-icon bg-primary" id="sparklinePie"> </div>
									</div>
									<div class="widget-summary-col">
										<div class="summary">
											<h2 class="panel-title">異常比例</h2>
											<div class="info"> <strong id="percent" class="amount"></strong> </div>
										</div>
									</div>
								</div>
							</div>
						</section>
					</div>
					<div class="col-md-3">
						<section class="panel panel-featured-left panel-featured-primary">
							<div class="panel-body">
								<div class="widget-summary widget-summary-md">
									<div class="widget-summary-col widget-summary-col-icon">
										<div class="summary-icon bg-primary"> <i class="fa fa-database"></i> </div>
									</div>
									<div class="widget-summary-col">
										<div class="summary">
											<h2 class="panel-title">資料庫最後更新時間</h2>
											<div class="info"> <strong id="dbTime" class="amount"></strong> </div>
										</div>
									</div>
								</div>
							</div>
						</section>
					</div>
				</div>
			</section>
		</div>


	</section>
	<!-- Main-->

	<script src="/BIM-Monitor/script/js/r03.js"></script>

	<script>
		var userName = "<?php echo $_SESSION['name'] ?>";
		var role = "<?php echo ($groupName); ?>";
		var right = <?php echo $right; ?>;
		vm.mount('.body');
		addUserImage(userName.charAt(0), role);
		getTable("SM");
		$(document).ready(function() {
			getUpdateTime();
		})

		function getUpdateTime() {
			$.ajax({
				url: '/BIM-Monitor/script/php/dbUpdateTime-r03.php',
				type: "POST"
			}).success(function(data) {
				$("#dbTime").text(data);
			}).error(function(error) {
				console.log(error);
			});
		}
		if (right < 2) {
			$("#upload-btn").hide();
		}
	</script>

	<!-- Vendor -->
	<script src="/Common/assets/vendor/jquery-browser-mobile/jquery.browser.mobile.js"></script>
	<script src="/Common/assets/vendor/bootstrap/js/bootstrap.js"></script>
	<script src="/Common/assets/vendor/nanoscroller/nanoscroller.js"></script>
	<script src="/Common/assets/vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
	<script src="/Common/assets/vendor/magnific-popup/magnific-popup.js"></script>
	<script src="/Common/assets/vendor/jquery-placeholder/jquery.placeholder.js"></script>
	<!-- Specific Page Vendor -->
	<script src="/Common/assets/vendor/jquery-ui/js/jquery-ui-1.10.4.custom.js"></script>
	<script src="/Common/assets/vendor/jquery-ui-touch-punch/jquery.ui.touch-punch.js"></script>
	<script src="/Common/assets/vendor/jquery-appear/jquery.appear.js"></script>
	<script src="/Common/assets/vendor/bootstrap-multiselect/bootstrap-multiselect.js"></script>
	<script src="/Common/assets/vendor/jquery-easypiechart/jquery.easypiechart.js"></script>
	<script src="/Common/assets/vendor/flot/jquery.flot.js"></script>
	<script src="/Common/assets/vendor/flot-tooltip/jquery.flot.tooltip.js"></script>
	<script src="/Common/assets/vendor/flot/jquery.flot.pie.js"></script>
	<script src="/Common/assets/vendor/flot/jquery.flot.categories.js"></script>
	<script src="/Common/assets/vendor/flot/jquery.flot.resize.js"></script>
	<script src="/Common/assets/vendor/jquery-sparkline/jquery.sparkline.js"></script>
	<script src="/Common/assets/vendor/raphael/raphael.js"></script>
	<script src="/Common/assets/vendor/morris/morris.js"></script>
	<script src="/Common/assets/vendor/gauge/gauge.js"></script>
	<script src="/Common/assets/vendor/snap-svg/snap.svg.js"></script>
	<script src="/Common/assets/vendor/liquid-meter/liquid.meter.js"></script>
	<script src="/Common/assets/vendor/jqvmap/jquery.vmap.js"></script>
	<script src="/Common/assets/vendor/jqvmap/data/jquery.vmap.sampledata.js"></script>
	<script src="/Common/assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.js"></script>
	<script src="/Common/assets/vendor/jquery-autosize/jquery.autosize.js"></script>
	<script src="/Common/assets/vendor/pnotify/pnotify.custom.js"></script>
	<!-- Theme Base, Components and Settings -->
	<script src="/BIM-Monitor/assets/javascripts/theme.js"></script>
	<!-- Theme Custom -->
	<script src="/BIM-Monitor/assets/javascripts/theme.custom.js"></script>
	<!-- Theme Initialization Files -->
	<script src="/BIM-Monitor/assets/javascripts/theme.init.js"></script>
	<!-- Examples -->
	<script src="/BIM-Monitor/assets/javascripts/ui-elements/examples.modals.js"></script>

	<!-- <script src='/BIM-Monitor/script/js/warning.js'></script> -->
	<!-- Unity loader -->
	<script src="/BIM-Monitor/script/js/unity-loader.js"></script>
</body>

</html>