R03 DEV 1.0

R03/Index.php

@@ -87,18 +87,27 @@ include($_SERVER['DOCUMENT_ROOT'] . "/Authorization/script/php/permission/check_
 							<div class="tabs tabs-bottom tabs-primary">
 								<div class="panel-body">
 									<div class="tab-content">
-										<div id="popular" class="chart chart-unity tab-pane active">
+										<div id="popular" class="chart chart-unity tab-pane">
 											<canvas id="myChart" height="100%"></canvas>
 										</div>
-										<div id="recent" class="tab-pane">
+										<div id="recent" class="tab-pane active">
 											<div id="tabData">
-												<table id="dataTable" class="display"></table>
+												<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>
+										<li> <a href="#popular" data-toggle="tab" class="text-center"><i class="fa fa-bar-chart-o"></i> 折線圖</a> </li>
+										<li class="active"> <a href="#recent" data-toggle="tab" class="text-center"><i class="fa fa-table"></i>資料表</a> </li>
 									</ul>
 								</div>
 							</div>
@@ -113,7 +122,7 @@ include($_SERVER['DOCUMENT_ROOT'] . "/Authorization/script/php/permission/check_
 								</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="顯示目前監測儀器類別">OW監測儀器</button>
+									<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">
@@ -218,13 +227,32 @@ include($_SERVER['DOCUMENT_ROOT'] . "/Authorization/script/php/permission/check_
 			</section>
 		</div>
 		<!-- Main-->
-		
+
 		<script src="/BIM-Monitor/script/js/r03.js"></script>
-		
+
 		<script>
 			vm.mount('.body');
 			addUserImage(userName.charAt(0), role);
-			
+			getTable("SM");
+			$(document).ready(function() {
+
+			})
+
+			/*function getTable(type) {
+				$.ajax({
+					url: '/BIM-Monitor/script/php/get_monitor_table.php',
+					type: "POST",
+					dataType: "JSON",
+					data: {
+						type: type
+					}
+				}).success(function(data) {
+					console.log("回傳資料:");
+					console.log(data);
+				}).error(function(error) {
+					console.log(error);
+				});
+			}*/
 		</script>
 
 		<!-- Vendor -->
@@ -268,7 +296,7 @@ include($_SERVER['DOCUMENT_ROOT'] . "/Authorization/script/php/permission/check_
 		<!-- <script src='/BIM-Monitor/script/js/warning.js'></script> -->
 		<!-- Unity loader -->
 		<script src="/BIM-Monitor/script/js/unity-loader.js"></script>
-		
+
 
 	</section>
 </body>

R03/display_info.json

@@ -0,0 +1,90 @@
+[
+ {
+  "type": "BS",
+  "display": "Settlement",
+  "haveDepth": false,
+  "unit": "mm"
+ },
+ {
+  "type": "EP",
+  "display": "WaterValue",
+  "haveDepth": false,
+  "unit": "t\/m²"
+ },
+ {
+  "type": "ETI",
+  "display": "Tilt",
+  "haveDepth": false,
+  "unit": "秒"
+ },
+ {
+  "type": "EXM",
+  "display": "TotalExtensionValue",
+  "haveDepth": false,
+  "unit": "mm"
+ },
+ {
+  "type": "OW",
+  "display": "WaterLevelElevation",
+  "haveDepth": false,
+  "unit": "m"
+ },
+ {
+  "type": "RB",
+  "display": "RebarStress",
+  "haveDepth": false,
+  "unit": "kg\/cm²"
+ },
+ {
+  "type": "SB",
+  "display": "TotalSettlement",
+  "haveDepth": false,
+  "unit": "mm"
+ },
+ {
+  "type": "SID",
+  "display": "TotalDisplacement",
+  "haveDepth": true,
+  "unit": "mm"
+ },
+ {
+  "type": "SIS",
+  "display": "TotalDisplacement",
+  "haveDepth": true,
+  "unit": "mm",
+  "warning1": true,
+  "warning2": true,
+  "action1": true,
+  "action2": true
+ },
+ {
+  "type": "SM",
+  "display": "TotalSettlement",
+  "haveDepth": false,
+  "unit": "mm"
+ },
+ {
+  "type": "SP",
+  "display": "WaterLevelElevation",
+  "haveDepth": false,
+  "unit": "m"
+ },
+ {
+  "type": "SS",
+  "display": "Settlement",
+  "haveDepth": false,
+  "unit": "mm"
+ },
+ {
+  "type": "TI",
+  "display": "TotalTilt",
+  "haveDepth": false,
+  "unit": "秒"
+ },
+ {
+  "type": "VG",
+  "display": "AverageForce",
+  "haveDepth": false,
+  "unit": "t"
+ }
+]

script/js/global.js

@@ -149,12 +149,17 @@ vm.component('side-bar', {
 });
 
 vm.component('monitor-li', {
-    template: `<li> <a href="#" class="monitor" :monitor="id">
+    template: `<li> <a :href="GetHref(id)" class="monitor" :monitor="id">
                     {{name}}<span :id="id" class="pull-right" data-toggle="tooltip" data-placement="right" title="(異常儀器數量/所有儀器數量)">0</span>
                 </a> </li>`,
     props: {
         id: String,
         name: String,
+    },
+    methods: {
+        GetHref(id) {
+            return "#"+id;
+        }
     }
 });
 

script/js/r03.js

@@ -16,21 +16,24 @@ $.ajaxSettings.async = true;
 var lastNode;
 var errorArray = [];
 var switchNumber = 0;
-passString('OW');
+passString('SIS');
 var wellTBA = [];
 var wellNameLists = [];
 var isAll = true;
 var isCompare = false;
 var saveCheckCompare = "";
 
+var dataTable;
 
 $(document).ready(function () {
 
     GetCheckAllAJAXValue();
     LoadPage();
-
+    $("#menu > ul > li.nav-parent.nav-active.nav-expanded > ul > li.nav-parent.nav-active.nav-expanded > ul > li:nth-child(1) > a").css("color","#0088cc");
     $(".monitor").on('click', function () {
+        $('.monitor').css('color', '#abb4be')
         let site = $(this).parent().parent().parent().attr("monitor");
+        $(this).css("color","#0088cc");
         if (site != 'r03') {
             location.href = `../${site}/Index.php`;
         } else {
@@ -39,18 +42,47 @@ $(document).ready(function () {
             isCompare = false;
             passString(option);
             document.getElementById("monitorName").innerHTML = option + "監測儀器";
-            if (lastNode != null) {
+            /*if (lastNode != null) {
                 lastNode.style = "color:#abb4be;";
             }
             document.getElementById("errorCheck").checked = false;
             document.getElementById("compareCheck").checked = false;
 
             lastNode = document.getElementById(option).parentNode;
-            lastNode.style = "color:#0088cc;";
-
+            lastNode.style = "color:#0088cc;";*/
+            
             LoadPage();
         }
     });
+
+    dataTable = $('#dataTable').DataTable({
+        bProcessing: true,
+        responsive: true,
+        "searching": true,
+        "pageLength": 10,
+        "language": {
+            "processing": "處理中...",
+            "loadingRecords": "載入中...",
+            "lengthMenu": "顯示 _MENU_ 項結果",
+            "zeroRecords": "沒有符合的結果或是沒有資料",
+            "info": "顯示第 _START_ 至 _END_ 項結果，共 _TOTAL_ 項",
+            "infoEmpty": "顯示第 0 至 0 項結果，共 0 項",
+            "infoFiltered": "(從 _MAX_ 項結果中過濾)",
+            "infoPostFix": "",
+            "search": "",
+            "paginate": {
+                "first": '<i class="fa fa-step-backward"></i>',
+                "previous": '<i class="fa fa-backward"></i>',
+                "next": '<i class="fa fa-forward"></i>',
+                "last": '<i class="fa fa-step-forward"></i>'
+            },
+            "aria": {
+                "sortAscending": ": 升冪排列",
+                "sortDescending": ": 降冪排列"
+            }
+        },
+    });
+
 })
 
 //Pass monitor equipment's name to index.php select form
@@ -105,7 +137,7 @@ function LoadPage() {
     else
         document.getElementById("displayCompareChart").style.display = 'none';
 
-    if(isLoad){
+    if (isLoad) {
         if (option == "HM" || option == "SIS" || option == "RS" || option == "VG" || option == "SID") {
             myGameInstance.SendMessage("Monitor", "ChangeTransparent");
             myGameInstance.SendMessage("Monitor", "RemoveModel", "true");
@@ -114,7 +146,7 @@ function LoadPage() {
             myGameInstance.SendMessage("Monitor", "RemoveModel", "false");
         }
     }
-    
+
 
     if (option != "ELP" && option != "SIS" && option != "SID") {
         document.getElementById("phase").style.display = "none";
@@ -128,11 +160,11 @@ function LoadPage() {
         dataValue = dataValue.concat(',', wellTBALocal[i]);
 
     }
-    if(isLoad){
+    if (isLoad) {
         myGameInstance.SendMessage("Monitor", "AddDataTable", dataValue);
         myGameInstance.SendMessage("Monitor", "Initialization");
     }
-    
+
     var wellNameList = window.localStorage.getItem("wellNameList");
     var wellNameListsLocal = wellNameList.split(",");
 
@@ -166,41 +198,61 @@ function showWell(str, changeCamera) {
     var executed = false;
     var xhttp;
     isCompare = false;
-    document.getElementById("compareCheck").checked = false;
+    $("#compareCheck").checked = false;
     if (str == "") {
-        document.getElementById("dataTable").innerHTML = "";
+        $("#dataTable").innerHTML = "";
         return;
     }
     strLocal = str;
 
-    document.getElementById("monitorSelect2").innerHTML = strLocal;
-    xhttp = new XMLHttpRequest();
-    xhttp.onreadystatechange = function () {
-        if (this.readyState == 4 && this.status == 200) {
+    $("#monitorSelect2").innerHTML = strLocal;
+    getTable(str, changeCamera);
+    if (isLoad) {
+        myGameInstance.SendMessage("MainCamera", "GetDataFromWebGL", str);
+    }
+    if (!changeCamera) {
+        ResetCamera();
+    }
 
-            document.getElementById("tableName").innerHTML = strLocal + "資料表";
-            saveCheckCompare = strLocal + "資料表";
-            displayChart(str, "myChart");
-            reset();
-            if(isLoad){
-                myGameInstance.SendMessage("MainCamera", "GetDataFromWebGL", str);
-            }
-            
+}
+var sparklinePieData = [];
 
-            if (!changeCamera) {
-                ResetCamera();
-            }
+function getTable(monitor) {
+    $.ajax({
+        url: '/BIM-Monitor/script/php/get_monitor_table.php',
+        type: "GET",
+        dataType: "JSON",
+        data: {
+            monitor: monitor
+        }
+    }).success(function (result) {
+        let table = result.table;
+        dataTable.clear();
+        dataTable.draw();
+        let unit = result.unit;
+        $("#tableName").text(monitor + "資料表");
+        $("#unit").text(`測量值(${unit})`);
+        table.forEach(function (data) {
+            dataTable.row.add( data)
+            dataTable.draw();
+        });
 
-            document.getElementById("dataTable").innerHTML = this.responseText;
-            $('#dataTable').DataTable();
+        /*$("#tableName").innerHTML = monitor + "資料表";
+        saveCheckCompare = monitor + "資料表";
+        displayChart(monitor, "myChart");
+        reset();
 
-        }
-    };
-    xhttp.open("GET", "/BIM-Monitor/script/php/getData2.php?q=" + str, true);
-    xhttp.send();
+        document.getElementById("dataTable").innerHTML = data;*/
+
+        console.log(dataTable);
+
+    }).error(function (error) {
+        console.log(error);
+    }).complete(function (e) {
 
+    });
 }
-var sparklinePieData = [];
+
 
 function getCheckValue() {
     var dataArray = [];
@@ -536,7 +588,7 @@ function displayCompareChart() {
 
 //Reset the camera
 function ResetCamera() {
-    if(isLoad){
+    if (isLoad) {
         myGameInstance.SendMessage("MainCamera", "ResetCamera");
     }
 }
@@ -601,7 +653,7 @@ function SetList() {
 }
 
 function UpdateGPS(GPS) {
-    if(isLoad){
+    if (isLoad) {
         myGameInstance.SendMessage("PlayerArmature", "UpdateGPS", GPS);
     }
 }

script/php/connect_sql.php

@@ -0,0 +1,7 @@
+<?php
+include("./sql_detail.php");
+$connectionInfo = array("Database" => "$dbname", "UID" => "$username", "PWD" => "$password", "CharacterSet" => "UTF-8");
+$conn = sqlsrv_connect($hostname, $connectionInfo);
+if ($conn === false) {
+    die(print_r(sqlsrv_errors(), true));
+}

script/php/get_monitor_table.php

@@ -0,0 +1,42 @@
+<?php
+include("./connect_sql.php");
+$json = file_get_contents('../../r03/display_info.json');
+$display_info = json_decode($json, true);
+
+$type = "";
+if (isset($_GET["monitor"])) {
+    $monitor = $_GET["monitor"];
+    $type = explode('-', $monitor)[0];
+    if($type == "SIS" || $type == "SID"){
+        $monitor .= "A";
+    }
+}
+
+$key = array_search($type, array_column($display_info, 'type'));
+if ($key !== false) {
+    $display = $display_info[$key]["display"];
+    $unit = $display_info[$key]["unit"];
+    //echo($display);
+    $sql = "SELECT [Date],[{$display}] FROM [{$type}_Data] WHERE [EquipmentID] = '{$monitor}';";
+    $stmt = sqlsrv_query($conn, $sql);
+    $fetchResult = sqlsrv_query($conn, $sql);
+    $table = [];
+    while ($row = sqlsrv_fetch_array($fetchResult, SQLSRV_FETCH_NUMERIC)) {
+        array_push($table, $row);
+    }
+    if ($stmt === false) {
+        if (($errors = sqlsrv_errors()) != null) {
+            foreach ($errors as $error) {
+                echo "SQLSTATE: " . $error['SQLSTATE'] . "<br />";
+                echo "code: " . $error['code'] . "<br />";
+                echo "message: " . $error['message'] . "<br />";
+                echo ($sql . "<br />");
+                var_dump($row);
+            }
+        }
+    }
+}
+
+$ajax["table"] = $table;
+$ajax["unit"] = $unit;
+echo (json_encode($ajax));

script/php/sql_detail.php

@@ -0,0 +1,5 @@
+<?php
+$hostname = 'GMGIS\SQLEXPRESS';
+$username = 'BIMuser';
+$password = 'Component3444';
+$dbname = "BIMMonitor";