jay.chang/ibms-dome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of https://gitea.mjm-staging.developers-homelab.net/BIMS/BIMS

Browse Source
This commit is contained in:
dev02 2022-12-03 08:38:36 +08:00
commit 38e81cd8c2
25 changed files with 1690 additions and 1129 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
Backend/App_Data/bajaJsList.ods
View File

Binary file not shown.

197
Frontend/_dashboard.html
View File

@ -9,8 +9,8 @@
<div class="p-3 bg-primary-300 rounded overflow-hidden position-relative text-white mb-g"> <div class="p-3 bg-primary-300 rounded overflow-hidden position-relative text-white mb-g">
<div class=""> <div class="">
<h3 class="display-4 d-block l-h-n m-0 fw-500"> <h3 class="display-4 d-block l-h-n m-0 fw-500">
21.5k 560
<small class="m-0 l-h-n">users signed up</small> <small class="m-0 l-h-n">今日用電量 kWH</small>
</h3> </h3>
</div> </div>
<i class="fal fa-user position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n1" style="font-size:6rem"></i> <i class="fal fa-user position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n1" style="font-size:6rem"></i>
@ -20,8 +20,8 @@
<div class="p-3 bg-warning-400 rounded overflow-hidden position-relative text-white mb-g"> <div class="p-3 bg-warning-400 rounded overflow-hidden position-relative text-white mb-g">
<div class=""> <div class="">
<h3 class="display-4 d-block l-h-n m-0 fw-500"> <h3 class="display-4 d-block l-h-n m-0 fw-500">
$10,203 6560
<small class="m-0 l-h-n">Visual Index Figure</small> <small class="m-0 l-h-n">昨日用電量</small>
</h3> </h3>
</div> </div>
<i class="fal fa-gem position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4" style="font-size: 6rem;"></i> <i class="fal fa-gem position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4" style="font-size: 6rem;"></i>
@ -69,8 +69,8 @@
<div class="p-3 bg-success-200 rounded overflow-hidden position-relative text-white mb-g"> <div class="p-3 bg-success-200 rounded overflow-hidden position-relative text-white mb-g">
<div class=""> <div class="">
<h3 class="display-4 d-block l-h-n m-0 fw-500"> <h3 class="display-4 d-block l-h-n m-0 fw-500">
- 103.72 9,218
<small class="m-0 l-h-n">Offset Balance Ratio</small> <small class="m-0 l-h-n">即時功率</small>
</h3> </h3>
</div> </div>
<i class="fal fa-lightbulb position-absolute pos-right pos-bottom opacity-15 mb-n5 mr-n6" style="font-size: 8rem;"></i> <i class="fal fa-lightbulb position-absolute pos-right pos-bottom opacity-15 mb-n5 mr-n6" style="font-size: 8rem;"></i>
@ -80,8 +80,8 @@
<div class="p-3 bg-info-200 rounded overflow-hidden position-relative text-white mb-g"> <div class="p-3 bg-info-200 rounded overflow-hidden position-relative text-white mb-g">
<div class=""> <div class="">
<h3 class="display-4 d-block l-h-n m-0 fw-500"> <h3 class="display-4 d-block l-h-n m-0 fw-500">
+40% 8,846
<small class="m-0 l-h-n">Product level increase</small> <small class="m-0 l-h-n">即時契約容量占比 kWH</small>
</h3> </h3>
</div> </div>
<i class="fal fa-globe position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4" style="font-size: 6rem;"></i> <i class="fal fa-globe position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4" style="font-size: 6rem;"></i>
@ -146,62 +146,12 @@
</div> </div>
<div class="row"> <div class="row">
<div class="col-sm-12 col-lg-4"> <div class="col-sm-12 col-lg-8">
<div class="row"> <div class="row" id="sysSubBtnList">
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-lightbulb-on fa-2x blink"></i></button>
<button type="button" class="btn btn-secondary">照明系統　　</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-thermometer-full fa-2x"></i></button>
<button type="button" class="btn btn-secondary">環境感測系統</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-car-battery fa-2x"></i></button>
<button type="button" class="btn btn-secondary" onclick="goElectricMeter()">電錶系統　　</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-wind fa-2x"></i></button>
<button type="button" class="btn btn-secondary">空調系統　　</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-window-restore fa-2x"></i></button>
<button type="button" class="btn btn-secondary">電梯系統　　</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-door-closed fa-2x"></i></button>
<button type="button" class="btn btn-secondary">門禁系統　　</button>
</div>
</div>
</div>
<div class="col-sm-12 col-lg-4">
<div class="row">
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-lightbulb-on fa-2x"></i></button>
<button type="button" class="btn btn-secondary">照明系統　　</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-thermometer-full fa-2x"></i></button>
<button type="button" class="btn btn-secondary">環境感測系統</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-car-battery fa-2x"></i></button>
<button type="button" class="btn btn-secondary">電錶系統　　</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-wind fa-2x"></i></button>
<button type="button" class="btn btn-secondary">空調系統　　</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-window-restore fa-2x"></i></button>
<button type="button" class="btn btn-secondary">電梯系統　　</button>
</div>
<div class="btn-group btn-group-lg col-lg-6 mb-4">
<button type="button" class="btn btn-secondary"><i class="fal fa-door-closed fa-2x"></i></button>
<button type="button" class="btn btn-secondary">門禁系統　　</button>
</div>
</div> </div>
</div> </div>
<div class="col-sm-12 col-lg-4"> <div class="col-sm-12 col-lg-4">
<div class="row"> <div class="row">
<div class="col-lg-6"> <div class="col-lg-6">
@ -213,7 +163,7 @@
</div> </div>
<div class="panel-container show"> <div class="panel-container show">
<div class="panel-content poisition-relative"> <div class="panel-content poisition-relative">
<div class="pb-5 pt-3"> <!--<div class="pb-5 pt-3">
<div class="d-flex mr-4"> <div class="d-flex mr-4">
<div class="mr-2"> <div class="mr-2">
<span class="peity-donut" data-peity="{ &quot;fill&quot;: [&quot;#967bbd&quot;, &quot;#ccbfdf&quot;], &quot;innerRadius&quot;: 14, &quot;radius&quot;: 20 }">7/10</span> <span class="peity-donut" data-peity="{ &quot;fill&quot;: [&quot;#967bbd&quot;, &quot;#ccbfdf&quot;], &quot;innerRadius&quot;: 14, &quot;radius&quot;: 20 }">7/10</span>
@ -223,6 +173,16 @@
<h4 class="font-weight-bold mb-0">70.60%</h4> <h4 class="font-weight-bold mb-0">70.60%</h4>
</div> </div>
</div> </div>
</div>-->
<div class="col-12 mb-2 position-relative">
<span class="text-center position-absolute t-white" style="top:83px;left:45px;">異常數量<br>18</span>
<img src="img/u110.png" class="w-100">
<span class="text-center position-absolute t-white" style="top:116px;left:142px;">賦歸數量<br>28</span>
</div>
<div class="col-12 mb-2 position-relative">
<span class="text-center position-absolute t-white" style="top:120px;left:37px;">已確認異常<br>8</span>
<img src="img/u106.png" class="w-100">
<span class="text-center position-absolute t-white" style="top:100px;left:140px;">未確認異常<br>6</span>
</div> </div>
</div> </div>
</div> </div>
@ -237,16 +197,26 @@
</div> </div>
<div class="panel-container show"> <div class="panel-container show">
<div class="panel-content poisition-relative"> <div class="panel-content poisition-relative">
<div class="pb-5 pt-3"> <!--<div class="pb-5 pt-3">
<div class="d-flex mr-0"> <div class="d-flex mr-0">
<div class="mr-2"> <div class="mr-2">
<span class="peity-donut" data-peity="{ &quot;fill&quot;: [&quot;#2196F3&quot;, &quot;#9acffa&quot;], &quot;innerRadius&quot;: 14, &quot;radius&quot;: 20 }">3/10</span> <span class="peity-donut" data-peity="{ &quot;fill&quot;: [&quot;#2196F3&quot;, &quot;#9acffa&quot;], &quot;innerRadius&quot;: 14, &quot;radius&quot;: 20 }">3/10</span>
</div> </div>
<div> <div>
<label class="fs-sm mb-0 mt-2 mt-md-0">Page Views</label> <label class="fs-sm mb-0 mt-2 mt-md-0">Page Views</label>
<h4 class="font-weight-bold mb-0">14,134</h4> <h4 class="font-weight-bold mb-0">14,134</h4>
</div> </div>
</div> </div>
</div>-->
<div class="col-12 mb-2 position-relative">
<span class="text-center position-absolute t-white" style="top:27px;left:55px;">已完成<br>6</span>
<img src="img/u40.png" class="" style="width:312px;margin-left:-45px;left:-22px;">
<span class="text-center position-absolute t-white" style="top:114px;left:162px;">未完成<br>8</span>
</div>
<div class="col-12 mb-2 position-relative">
<span class="text-center position-absolute t-white" style="top:89px;left:27px;">未派工<br>5</span>
<img src="img/u43.png" class="w-100">
<span class="text-center position-absolute t-white" style="top:122px;left:177px;">派工中<br>9</span>
</div> </div>
</div> </div>
</div> </div>
@ -327,8 +297,11 @@
[700, 1] [700, 1]
]; ];
$(document).ready(function () { var tarElePath = '';
$(document).ready(function () {
getSubList();
getFirstEletric();
/* init datatables */ /* init datatables */
$('#dt-basic-example').dataTable( $('#dt-basic-example').dataTable(
{ {
@ -713,4 +686,80 @@
$("#js-page-content").load("_sysMonAll.html", loadCallback); $("#js-page-content").load("_sysMonAll.html", loadCallback);
} }
function getSubList() {
let url = baseApiUrl + "/api/Device/GetMainSub";
let sendData = {
building_tag: pageAct.buiTag,
};
objSendData.Data = sendData;
ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
if (!res || res.code != "0000" || !res.data) {
} else {
let strHtml = ``;
$.each(res.data.history_Main_Systems, (index, mainSysObj) => {
$.each(mainSysObj.history_Sub_systems, (index2, subSysObj) => {
strHtml += `<div class="btn-group btn-group-lg col-lg-4 mb-4 dev-group" data-id="/${pageAct.AreaTag}/${pageAct.buiTag}/${mainSysObj.main_system_tag}/${subSysObj.sub_system_tag}">
<button type="button" class="btn btn-secondary col-4"><i class="fal fa-lightbulb-on fa-2x"></i></button>
<button type="button" class="btn btn-secondary">${subSysObj.full_name}</button>
</div>`;
})
})
$("#sysSubBtnList").html(strHtml);
getAlarmSub();
}
}, null, "POST").send();
}
function getFirstEletric() {
let url = baseApiUrl + "/api/Device/GetDeviceList";
let sendData = {
sub_system_tag: "E4",
building_tag: pageAct.buiTag,
};
objSendData.Data = sendData;
ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
if (!res || res.code != "0000" || !res.data) {
} else {
$.each(res.data, (index, floObj) => {
$.each(floObj.device_list, (index2, devObj) => {
tarElePath = devObj.device_number;
})
})
getElectricBaja();
}
}, null, "POST").send();
}
function getElectricBaja() {
let devPath = tarElePath.split("_").slice(0, 8).join("_");
let today = displayDate(new Date, "date").replaceAll("/", "-") + "T00:00:00";
let tomorrow = displayDate(new Date(new Date(today).getTime() + (24 * 60 * 60 * 1000)), "date").replaceAll("/", "-") + "T00:00:00";
getElectricMeterDayDataByBaja(devPath + "_KWH", "Mitsubishi_Sup", today, tomorrow, (data) => {
console.log(data)
})
}
function getAlarmSub() {
//$(".dev-group").each((idx, ele) => {
// let path = $(ele).data("id");
// let start = (new Date()).getTime();
// console.log("path enter baja:", path);
// getOneSystemStateByBaja(path, (data) => {
// let end = (new Date()).getTime();
// console.log("執行時間 :" + (end - start) / 1000 + " 秒","path : " + path, "輸出結果 :"+ data)
// })
//})
}
</script> </script>

3
Frontend/_historyData.html
View File

@ -232,7 +232,8 @@
t.fnClearTable(); t.fnClearTable();
if (res.data.length > 0) if (res.data.length > 0)
t.fnAddData(res.data); t.fnAddData(res.data);
} }
$(loadEle).Loading("close");
} }
function setValue(deviceNumber, deviceName, deviceItem, elem) { function setValue(deviceNumber, deviceName, deviceItem, elem) {

352
Frontend/_sysElevator.html
View File

@ -3,9 +3,11 @@
background-color: #fff; background-color: #fff;
min-height: 520px; min-height: 520px;
} }
.elevator-table-wrapper { .elevator-table-wrapper {
padding:0.8rem; padding: 0.8rem;
} }
table.elevator-build { table.elevator-build {
/*border: 1px double #000;*/ /*border: 1px double #000;*/
} }
@ -45,16 +47,16 @@
<div class="d-flex"> <div class="d-flex">
<!-- 左圖區 --> <!-- 左圖區 -->
<div class="col-3 my-3"> <div class="col-4 my-3">
<div style="position:relative "> <div style="position:relative ">
<div id="elevatorBlock" class="elevator"> <div id="elevatorBlock" class="elevator">
<div class="elevator-header"> <div class="elevator-header">
<div class="row m-0 align-items-center p-2 gap-3 btn-group btn-group-toggle"> <div class="row m-0 align-items-center p-2 gap-3 btn-group btn-group-toggle">
<button class="btn btn-secondary btn-sm" data-tabname="floShowType" data-target="#2dDiv"> <button class="btn btn-secondary btn-sm active" data-tabname="floShowType" data-target="#2dDiv">
2D 2D
</button> </button>
<button class="btn btn-secondary btn-sm active" data-tabname="floShowType" data-target="#3dDiv" onclick="show3D()"> <button class="btn btn-secondary btn-sm" data-tabname="floShowType" data-target="#3dDiv" onclick="show3D()">
3D 3D
</button> </button>
</div> </div>
@ -86,49 +88,9 @@
</div> </div>
<!-- End-左圖區 --> <!-- End-左圖區 -->
<!-- 中間卡片區 --> <!-- 中間卡片區 -->
<div class="col-7 my-3"> <div class="col-6 my-3">
<div id="eleCards" class="row"> <div id="eleCards" class="row">
<div class="card text-white bg-info mx-1 mb-3 col-4" style="max-width: 18rem">
<div type="button" class="card-body" data-toggle="modal" data-target="#card1">
<span class="d-flex">
<h5 class="card-title">號機別 : 1</h5>
<i class="fas fa-caret-up fa-3x ml-auto"></i>
</span>
<h4 class="d-flex justify-content-end">10F</h4>
<span class="d-flex">
<p class="card-text">狀態 : 運行中</p>
<i class="fas fa-caret-down fa-3x ml-auto animate__animated animate__flash animate__infinite animate__slower"></i>
</span>
</div>
</div>
<div class="card text-white bg-danger mx-1 mb-3 col-4" style="max-width: 18rem">
<div type="button" class="card-body">
<span class="d-flex">
<h5 class="card-title">號機別 : 2</h5>
<i class="fas fa-caret-up fa-3x ml-auto"></i>
</span>
<h4 class="d-flex justify-content-end">5F</h4>
<span class="d-flex">
<p class="card-text animate__animated animate__flash animate__infinite animate__slower">
狀態 : 維修
</p>
<i class="fas fa-caret-down fa-3x ml-auto"></i>
</span>
</div>
</div>
<div class="card text-white bg-info mx-1 mb-3 col-4" style="max-width: 18rem">
<div type="button" class="card-body">
<span class="d-flex">
<h5 class="card-title">號機別 : 3</h5>
<i class="fas fa-caret-up fa-3x ml-auto animate__animated animate__flash animate__infinite animate__slower"></i>
</span>
<h4 class="d-flex justify-content-end">3F</h4>
<span class="d-flex">
<p class="card-text">狀態 : 運行中</p>
<i class="fas fa-caret-down fa-3x ml-auto"></i>
</span>
</div>
</div>
</div> </div>
</div> </div>
<!-- End-中間卡片區 --> <!-- End-中間卡片區 -->
@ -520,7 +482,7 @@
<td> <td>
<div class="d-flex justify-content-center align-items-center"> <div class="d-flex justify-content-center align-items-center">
<div class="row mr-2"> <div class="row mr-2">
<input name="preMea" type="checkbox" class="toggle" data-toggle="toggle" data-point="SP_DP" > <input name="preMea" type="checkbox" class="toggle" data-toggle="toggle" data-point="SP_DP">
</div> </div>
<i id="preMeaSche" data-point="DP" class="fas fa-calendar-alt fs-1-1 mr-2 cur-poi"></i> <i id="preMeaSche" data-point="DP" class="fas fa-calendar-alt fs-1-1 mr-2 cur-poi"></i>
</div> </div>
@ -893,14 +855,16 @@
</div> </div>
<script> <script>
var eleManTable = null; var eleManTable = null;
var allDevList = []; //每個設備 var allDevList = []; //每個設備
var subSeviceData = []; //每個設備訂閱點位值 var subSeviceData = []; //每個設備訂閱點位值
var floList = []; //每個樓層 var floList = []; //每個樓層
var elevObj = null; //左側 2D 電梯物件 var elevObj = null; //左側 2D 電梯物件
var viewer3DNodeIds = [223, 228, 233]; var viewer3DNodeIds = [758, 753, 748];
var elev3DBind = {}; var elev3DBind = {};
var elev3DOption = {}; var elev3DOption = {};
var elev3DObj = [];
var subOrdPath = { var subOrdPath = {
"building_tag": pageAct.buiTag, "building_tag": pageAct.buiTag,
"system_tag": pageAct.sysMainTag, "system_tag": pageAct.sysMainTag,
@ -913,14 +877,15 @@
var global_emergency_alarm_device_number = []; var global_emergency_alarm_device_number = [];
var zoomToggle = 3; var zoomToggle = 3;
var isFirstLoad3D = true; var isFirstLoad3D = true;
var isFirstLoadSub = true;
$(function () { $(function () {
initChart(); initChart();
setBuildFloor(); setBuildFloor();
setCards(); setCards();
subDeviceSetStatus(); subDeviceSetStatus();
setEleManTable(); setEleManTable();
}) })
function getFloDevList() { function getFloDevList() {
@ -950,8 +915,8 @@
if (allDevList.length == 0) { if (allDevList.length == 0) {
return false; return false;
} }
data.device_number = data.device_number_full;
let matchDevice = allDevList.filter(x => x.device_number?.split("_")[x.device_number?.split("_").length - 1] == data.device_number)[0]; let matchDevice = allDevList.filter(x => x.device_number == data.device_number)[0];
let master = matchDevice.device_number.split("_")[5]; let master = matchDevice.device_number.split("_")[5];
//狀態 //狀態
if (data.point_name == "ST") { if (data.point_name == "ST") {
@ -965,13 +930,21 @@
if (data.point_name == "CP") { if (data.point_name == "CP") {
$(`#${matchDevice.device_number}_card [name=curFloor]`).text(data.value); $(`#${matchDevice.device_number}_card [name=curFloor]`).text(data.value);
} }
//往上或往下
if (getValueByName("RD") == "UP") { if (data.point_name == "RD") {
$(`#${matchDevice.device_number}_card [name=upFloArrow]`).addClass("light-flash-c"); //往上或往下
} if (getValueByName("RD") == "UP") {
if (getValueByName("RD") == "DOWN") { $(`#${matchDevice.device_number}_card [name=downFloArrow]`).removeClass("light-flash-c");
$(`#${matchDevice.device_number}_card [name=downFloArrow]`).addClass("light-flash-c"); $(`#${matchDevice.device_number}_card [name=upFloArrow]`).addClass("light-flash-c");
} else if (getValueByName("RD") == "DOWN") {
$(`#${matchDevice.device_number}_card [name=upFloArrow]`).removeClass("light-flash-c");
$(`#${matchDevice.device_number}_card [name=downFloArrow]`).addClass("light-flash-c");
} else {
$(`#${matchDevice.device_number}_card [name=upFloArrow]`).removeClass("light-flash-c");
$(`#${matchDevice.device_number}_card [name=downFloArrow]`).removeClass("light-flash-c");
}
} }
//消防回歸 //消防回歸
actLightByPoi("FE", "#emerReturn"); actLightByPoi("FE", "#emerReturn");
//群控故障 //群控故障
@ -1007,42 +980,105 @@
// 電梯管理 不服務樓層 detail // 電梯管理 不服務樓層 detail
subDeviceSetEleManNotSerFloor(master); subDeviceSetEleManNotSerFloor(master);
}); });
myBaja.setSubscribeDeviceEndCallBack(function (data) {
let devNumArr = data.map(x => { return { devNum: x.device_number_full, priority: allDevList.filter(y => y.device_number == x.device_number_full)[0]?.priority } }).DistinctBy("devNum");
devNumArr = devNumArr.oSort("priority");
$.each(devNumArr, (idx, devObj) => {
devNum = devObj.devNum;
let subData = subSeviceData.filter(x => x.device_number == devNum)[0];
if (subData) {
// 左側 3D 電梯 nodeID 與 device_number match
if (Object.keys(elev3DBind).indexOf(devNum) == -1) {
elev3DBind[devNum] = viewer3DNodeIds[Object.keys(elev3DBind).length];
}
// 左側 3D 電梯 Viewer Option 設置
/*elev3DOption.nodes = Object.keys(elev3DBind).map(x => elev3DBind[x]);*/
elev3DOption.nodeId = elev3DBind[devNum];
elev3DOption.floorHeight = floList.map((x) => { return { floor: x } });
elev3DOption.floorHeight.forEach((floObj, idx) => {
if (floObj.floor.startsWith("B")) {
let floor = parseInt(floObj.floor.split("B")[1].split("F")[0]);
floObj.height = floor * -13;
} else {
let floor = parseInt(floObj.floor.split("F")[0]);
if (floor == 1) {
floObj.height = 0;
} else if (floor == 2) {
floObj.height = 14.75;
} else {
floObj.height = (14.75 + ((floor - 2) * 9.75));
}
}
})
if (isFirstLoad3D == false && elev3DObj.length != 0) {
let elevObj = elev3DObj.filter(x => x.nodeId == elev3DBind[devNum])[0];
if (!elevObj.id) {
elevObj.id = devNum;
}
elevObj.obj = Object.assign(elevObj.obj, elev3DOption);
elevObj.obj.init(function () {
let frags = elevObj.obj.fragProxys.filter(x => x.nodeId == elev3DBind[devNum]);
frags.forEach((fragProxy) => {
fragProxy.frag.position.z = elev3DOption.floorHeight.filter(x => x.floor == subData["CP"])[0]?.height ?? 0;
fragProxy.frag.updateAnimTransform()
})
elevObj.obj.viewer.impl.sceneUpdated(true);
});
}
}
})
reloadEleManTable(setEleManTabDataFromBaja());
$(loadEle).Loading("close");
})
} }
// baja 訂閱 變更 電梯管理 Table // baja 訂閱 變更 電梯管理 Table
function setEleManTabDataFromBaja() { function setEleManTabDataFromBaja() {
let result = []; let result = [];
let masterList = allDevList.map(x => x.device_number.split("_")[5]).Distinct(); let masterList = allDevList.map(x => x.device_number.split("_")[5]).Distinct();
// Master(第六段) 區分 // Master(第六段) 區分
$.each(masterList, (idx, master) => { $.each(masterList, (idx, master) => {
let main = {}; let main = {};
// 匯入 Master 名稱` // 匯入 Master 名稱`
main.devName = master; main.devName = master;
let subData = subSeviceData.filter(x => x.device_number.split("_")[5] == master)[0]; let subData = subSeviceData.filter(x => x.device_number.split("_")[5] == master)[0];
$.each(Object.keys(subData), (idx3, subKey) => { if (subData) {
if (subKey.startsWith("SP_FLS_")) {
main[subKey] = subData[subKey];
}
})
main._rowType = "master";
result.push(main);
// 該 Master 底下的設備
let devListByMaster = allDevList.filter(x => x.device_number.split("_")[5] == master);
$.each(devListByMaster, (idx2, devObj) => {
let subData = subSeviceData.filter(x => x.device_number == devObj.device_number)[0];
main = {};
main.devNum = devObj.device_number;
main.devName = devObj.full_name;
main._rowType = "device";
// 該設備點位匯入
$.each(Object.keys(subData), (idx3, subKey) => { $.each(Object.keys(subData), (idx3, subKey) => {
main[subKey] = subData[subKey]; if (subKey.startsWith("SP_FLS_")) {
main[subKey] = subData[subKey];
}
}) })
// 匯入設備資訊(訂閱點位)
main._rowType = "master";
result.push(main); result.push(main);
}) // 該 Master 底下的設備
let devListByMaster = allDevList.filter(x => x.device_number.split("_")[5] == master);
$.each(devListByMaster, (idx2, devObj) => {
let subData = subSeviceData.filter(x => x.device_number == devObj.device_number)[0];
if (subData) {
main = {};
main.devNum = devObj.device_number;
main.devName = devObj.full_name;
main._rowType = "device";
// 該設備點位匯入
$.each(Object.keys(subData), (idx3, subKey) => {
main[subKey] = subData[subKey];
})
// 匯入設備資訊(訂閱點位)
result.push(main);
}
})
}
}) })
console.log("result:", result)
return result; return result;
} }
@ -1057,7 +1093,7 @@
function creLight(type = "trueText") { function creLight(type = "trueText") {
let lightType = type == "trueText" ? "bg-success" : "bg-danger"; let lightType = type == "trueText" ? "bg-success" : "bg-danger";
return $(creEle("span", null, null, null, [lightType, "circle-light"])).outerHtml(); return $(creEle("span", null, null, null, [lightType, "circle-light"])).outerHtml();
} }
@ -1075,12 +1111,14 @@
elevObj.setElevFloor(matchDevice.device_number, subData["CP"]); elevObj.setElevFloor(matchDevice.device_number, subData["CP"]);
} }
// 左側 3D 電梯 nodeID 與 device_number match if (isFirstLoad3D == false && elev3DObj.length != 0) {
if (Object.keys(elev3DBind).indexOf(matchDevice.device_number) == -1) { let elevObj = elev3DObj.filter(x => x.nodeId == elev3DBind[devNum])[0];
elev3DBind[matchDevice.device_number] = viewer3DNodeIds[elev3DBind.length]; if (elevObj && elevObj.id) {
elevObj.obj.setElevatorFloor(subData["CP"])
elevObj.obj.movElevator();
}
} }
elevObj.setEleMovStatus(matchDevice.device_number, subData["RD"] == "UP" ? 1 : subData["RD"] == "DOWN" ? 2 : 0); elevObj.setEleMovStatus(matchDevice.device_number, subData["RD"] == "UP" ? 1 : subData["RD"] == "DOWN" ? 2 : 0);
//現在樓層 //現在樓層
if (subData["CP"]) { if (subData["CP"]) {
@ -1088,10 +1126,14 @@
} }
//往上或往下 //往上或往下
if (subData["RD"] == "UP") { if (subData["RD"] == "UP") {
$(`#imdStaTable_${devNum} [name=downFloArrow]`).removeClass("light-flash-c");
$(`#imdStaTable_${devNum} [name=upFloArrow]`).addClass("light-flash-c"); $(`#imdStaTable_${devNum} [name=upFloArrow]`).addClass("light-flash-c");
} } else if (subData["RD"] == "DOWN") {
if (subData["RD"] == "DOWN") { $(`#imdStaTable_${devNum} [name=upFloArrow]`).removeClass("light-flash-c");
$(`#imdStaTable_${devNum} [name=downFloArrow]`).addClass("light-flash-c"); $(`#imdStaTable_${devNum} [name=downFloArrow]`).addClass("light-flash-c");
} else {
$(`#imdStaTable_${devNum} [name=upFloArrow]`).removeClass("light-flash-c");
$(`#imdStaTable_${devNum} [name=downFloArrow]`).removeClass("light-flash-c");
} }
//即時狀態(左側Table) //即時狀態(左側Table)
@ -1126,35 +1168,39 @@
} else { } else {
let strHtml = ``; let strHtml = ``;
let masterArr = []; let masterArr = [];
let masDiv = "";
$("#eleCards").html("");
$.each(res.data, (index, floObj) => { $.each(res.data, (index, floObj) => {
let masters = floObj.device_list.map(x => x.device_number?.split("_")[5]).Distinct();
$.each(floObj.device_list, (index2, devObj) => {
allDevList.push(devObj); $.each(masters, (idx, master) => {
if (masterArr.indexOf(devObj?.device_number?.split("_")[5]) == -1) {
let master = devObj?.device_number?.split("_")[5]; let masDiv = creDiv(["col-12", "row", "m-0", "gap-5"]);
masDiv = creDiv(["col-12"]); masDiv.append(creEle("h2", master, null, null, ["col-12", "p-0"]));
masDiv.append(creEle("h2", master, null, null)) strHtml = ``;
masterArr.push(master); floObj.device_list.filter(x => x.device_number?.split("_")[5] == master).forEach((devObj) => {
} allDevList.push(devObj);
allDevList = allDevList.oSort("priority")
strHtml += `<div id="${devObj.device_number}_card" class="card dev-card text-white mb-3 col-4 " name="devItem" data-id="${devObj.device_guid}" data-number="${devObj.device_number}" data-name="${devObj.full_name}" style="max-width: 18rem;"> masDiv.append($(`<div id="${devObj.device_number}_card" class="card dev-card text-white mb-3 col-4 " name="devItem" data-id="${devObj.device_guid}" data-number="${devObj.device_number}" data-name="${devObj.full_name}" style="max-width: 18rem;">
<div type="button" class="card-body"> <div type="button" class="card-body">
<span class="d-flex"> <span class="d-flex">
<h5 class="card-title">號機別 : ${devObj.full_name}</h5> <h5 class="card-title">號機別 : ${devObj.full_name}</h5>
<i name="upFloArrow" class="fas fa-caret-up fa-3x ml-auto" style="--flash-color-1:#6fe560;--flash-color-2:#fff;"></i> <i name="upFloArrow" class="fas fa-caret-up fa-3x ml-auto" style="--flash-color-1:#6fe560;--flash-color-2:#fff;"></i>
</span> </span>
<h4 name="curFloor" class="d-flex justify-content-end mb-0"></h4> <h4 name="curFloor" class="d-flex justify-content-end mb-0"></h4>
<span class="d-flex"> <span class="d-flex">
<p class="card-text">狀態 : <span name="devStatus"></span></p> <p class="card-text">狀態 : <span name="devStatus"></span></p>
<i name="downFloArrow" class="fas fa-caret-down fa-3x ml-auto" style="--flash-color-1:#6fe560;--flash-color-2:#fff;"></i> <i name="downFloArrow" class="fas fa-caret-down fa-3x ml-auto" style="--flash-color-1:#6fe560;--flash-color-2:#fff;"></i>
</span> </span>
</div> </div>
</div>`; </div>`));
masDiv.append(strHtml) })
$("#eleCards").append(masDiv);
}) })
}) })
$("#eleCards").html(masDiv);
initPopover(); initPopover();
//平面圖載入 //平面圖載入
chartHandler(`${baseImgUrl}/upload/floor_map/${res.data[0].floor_map_name}`); chartHandler(`${baseImgUrl}/upload/floor_map/${res.data[0].floor_map_name}`);
@ -1272,7 +1318,6 @@
// 電梯管理 Modal - 資料更新 // 電梯管理 Modal - 資料更新
function reloadEleManTable(datas) { function reloadEleManTable(datas) {
let tabCols = eleManTable.context[0].aoColumns.map(x => x.data); let tabCols = eleManTable.context[0].aoColumns.map(x => x.data);
$.each(datas, (idx, data) => { $.each(datas, (idx, data) => {
$.each(tabCols, (idx2, value) => { $.each(tabCols, (idx2, value) => {
@ -1291,15 +1336,16 @@
let datas = []; let datas = [];
let column_defs = [ let column_defs = [
{ "targets": [0], "width": "11%", "sortable": true }, { "targets": [0], "width": "10%", "sortable": false },
{ "targets": [1], "width": "11%", "sortable": true }, { "targets": [1], "width": "10%", "sortable": false },
{ "targets": [2], "width": "11%", "sortable": true }, { "targets": [2], "width": "10%", "sortable": false },
{ "targets": [3], "width": "11%", "sortable": true }, { "targets": [3], "width": "10%", "sortable": false },
{ "targets": [4], "width": "11%", "sortable": true }, { "targets": [4], "width": "10%", "sortable": false },
{ "targets": [5], "width": "11%", "sortable": true }, { "targets": [5], "width": "10%", "sortable": false },
{ "targets": [6], "width": "11%", "sortable": true }, { "targets": [6], "width": "10%", "sortable": false },
{ "targets": [7], "width": "11%", "sortable": true }, { "targets": [7], "width": "10%", "sortable": false },
{ "targets": [8], "width": "12%", "sortable": true }, { "targets": [8], "width": "10%", "sortable": false },
{ "targets": [9], "width": "10%", "sortable": false },
]; ];
let columns = [ let columns = [
@ -1365,6 +1411,7 @@
]; ];
eleManTable = new YourTeam.JqDataTables.getTableByStatic(tag, datas, columns, column_defs, null, null, null, null, "tpi"); eleManTable = new YourTeam.JqDataTables.getTableByStatic(tag, datas, columns, column_defs, null, null, null, null, "tpi");
eleManTable.order([]).draw();
} }
// 電梯管理 Modal - 設置 Detail 訂閱內容 // 電梯管理 Modal - 設置 Detail 訂閱內容
@ -1401,7 +1448,7 @@
$("#notSerFloTable").html(setNotSerFloTable(allSerFloors)); $("#notSerFloTable").html(setNotSerFloTable(allSerFloors));
let notSerFloors = Object.keys(subData).filter(x => x.startsWith("SP_FLS_") && subData[x] == "trueText").map(x => x?.split("SP_FLS_")[1]); let notSerFloors = Object.keys(subData).filter(x => x.startsWith("SP_FLS_") && subData[x] == "trueText").map(x => x?.split("SP_FLS_")[1]);
$(`[name^=notSerChk]`).prop("checked", false); $(`[name^=notSerChk]`).prop("checked", false);
$.each(notSerFloors, (idx, floor) => { $.each(notSerFloors, (idx, floor) => {
$(`[name=notSerChk${floor}]`).prop("checked", true); $(`[name=notSerChk${floor}]`).prop("checked", true);
@ -1642,7 +1689,7 @@
} }
return item; return item;
}); });
if (currentData == null || currentData.length == 0) { if (currentData == null || currentData.length == 0) {
this.currentData = []; this.currentData = [];
} }
@ -1688,7 +1735,7 @@
// animationDurationUpdate: 1500, // animationDurationUpdate: 1500,
tooltip: { tooltip: {
formatter: function (params) { formatter: function (params) {
if (params.data.device_node_guid != undefined && params.data.device_node_guid != null && params.data.device_node_guid != "") { if (params.data.device_node_guid != undefined && params.data.device_node_guid != null && params.data.device_node_guid != "") {
return `名稱：${params.data.device_node_full_name}<br> return `名稱：${params.data.device_node_full_name}<br>
Guid：${params.data.device_node_guid}` Guid：${params.data.device_node_guid}`
@ -2346,27 +2393,54 @@
//載入3D模型 //載入3D模型
function load3DModel() { function load3DModel() {
let option = {
nodes: [223, 228, 233],
element: "#forgeViewer",
floorHeight: [
{ floor: 1, height: 15 },
{ floor: 2, height: 24.5 },
{ floor: 3, height: 34 },
]
}
launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDLm53ZA==', option, () => {
console.log($("#forgeViewer")) launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDMjAyMjEyMDEubndk', (viewer) => {
let elevator = $("#forgeViewer")[0]._elevator3D[0]; $.each(viewer3DNodeIds, function (idx, node) {
elevator.obj.setElevatorFloor(3) let options = {
elevator.obj.movElevator() element: $("#forgeViewer"),
viewer: viewer,
nodeId: node,
floorHeight: elev3DOption.floorHeight ?? [],
inited: function () {
}
}
let elevator3DObj = new elevator3D(options);
let devNum = Object.keys(elev3DBind).filter(x => elev3DBind[x] == node)[0];
let subData = subSeviceData.filter(x => x.device_number == devNum)[0];
if (elev3DObj.filter(x => x.nodeId == node).length == 0) {
elev3DObj.push({ id: devNum, nodeId: node, obj: elevator3DObj });
}
if (subData) {
let elevObj = elev3DObj.filter(x => x.nodeId == node)[0];
if (!elevObj.id) {
elevObj.id = devNum;
}
elevObj.obj = Object.assign(elevObj, elevator3DObj ?? {})
elevObj.obj.init(function () {
let frags = elevObj.obj.fragProxys.filter(x => x.nodeId == node);
frags.forEach((fragProxy) => {
fragProxy.frag.position.z = elev3DOption.floorHeight.filter(x => x.floor == subData["CP"])[0]?.height ?? 0;
fragProxy.frag.updateAnimTransform()
})
elevObj.obj.viewer.impl.sceneUpdated(true);
})
}
})
//let elevator = elev3DObj[0];
//elevator.obj.setElevatorFloor(3)
//elevator.obj.movElevator()
//setElevatorSpeed(0.2) //setElevatorSpeed(0.2)
//setElevatorFloor(2) //setElevatorFloor(2)
//requestAnimationFrame(movElevator); //requestAnimationFrame(movElevator);
}); });
} }
function show3D() { function show3D() {
if (isFirstLoad3D) { if (isFirstLoad3D) {

2
Frontend/_sysMonAll.html
View File

@ -151,7 +151,7 @@
// Card 即時狀態 // Card 即時狀態
function drawStateTabBlo() { function drawStateTabBlo() {
let strHtml = `<div style="height:15rem"> let strHtml = `<div style="height:15rem">
<iframe src="http://localhost:8080/ord?station:%7Cslot:/TPE/B1/EE/E4/R2F/NA/WHT/N1|view:?fullScreen=true" width="100%" height="100%"></iframe> <iframe src="/ord?station:%7Cslot:/TPE/B1/EE/E4/R2F/NA/WHT/N1|view:?fullScreen=true" width="100%" height="100%"></iframe>
</div>` </div>`
return strHtml; return strHtml;
} }

21
Frontend/css/site.css
View File

@ -100,6 +100,15 @@ input.toggle:checked {
background: #97c193; background: #97c193;
} }
.loading-bg {
background: #0000009c;
background-repeat: no-repeat;
opacity:0;
width: 100%;
height: 100vh;
position: fixed;
z-index: 2000;
}
@keyframes flashing-c { @keyframes flashing-c {
0% { 0% {
@ -402,6 +411,18 @@ input.toggle:checked {
gap: 5px; gap: 5px;
} }
.gap-6 {
gap: 6px;
}
.gap-7 {
gap: 7px;
}
.gap-8 {
gap: 8px;
}
/* vertical-align */ /* vertical-align */
.va-t { .va-t {
vertical-align: top; vertical-align: top;

26
Frontend/css/yourteam/plugins/yt-alert/ytpop-alert.css Normal file
View File

@ -0,0 +1,26 @@
.alert[id^=success-alert] {
background-color: #3AB14D;
}
.alert[id^=danger-alert] {
background-color: #dc3545;
}
.alert[id^=tip-alert] {
background-color: #498ae5;
}
.yt-alert {
display: none;
position: fixed;
z-index: 3000;
bottom: 2%;
right: 2%;
width: 300px;
background-color: #dc3545;
color: white;
border-radius:5px;
display: flex;
align-items: center;
gap: 7px;
}

349
Frontend/forgetTest2.html
View File

@ -1,241 +1,136 @@
<html> <!DOCTYPE html>
<html>
<head> <head>
<meta name="viewport"
content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=no" />
<meta charset="utf-8" /> <meta charset="utf-8" />
<title></title>
<!-- The Viewer CSS -->
<link rel="stylesheet"
href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/style.min.css"
type="text/css" />
<!-- Developer CSS -->
<style>
body {
margin: 0;
}
#MyConytainerDiv {
width: 80%;
height: 100%;
position: relative;
float: left;
}
#MyViewerDiv {
width: 100%;
height: 100%;
margin: 0;
background-color: #f0f8ff;
}
#MyCar {
width: 10%;
margin: 5%;
position: relative;
float: left;
}
</style>
<title>Showing A360 Shared files</title>
</head> </head>
<body> <body>
<!-- The Viewer will be instantiated here -->
<div id="MyConytainerDiv"> <link rel="shortcut icon" href="https://github.com/Autodesk-Forge/learn.forge.viewmodels/raw/master/img/favicon.ico">
<div id="MyViewerDiv" ondragover="onDragOver(event)" ondrop="onDrop(event)"></div> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css">
</div> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.7/themes/default/style.min.css" />
<div id="MyCar" draggable="true" ondragstart="onDragStart(event)"> <!-- Autodesk Forge Viewer files -->
<img src="car.png" width="100%" /> <link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/style.min.css" type="text/css">
<img id="blank" />
<div id="MyControls" class="adsk control">
<p style="text-align: center; font-weight: bold;">Robot Controls</p>
<p id="id_printer">Selected_ID: </p>
<p id="all_id">All_ID: </p>
<button id="1F1oor" onclick="move1Floor()">1 Floor</button>
<button id="2F1oor" onclick="move2Floor()">2 Floor</button>
<button id="3F1oor" onclick="move3Floor()">3 Floor</button>
<button id="4F1oor" onclick="move4Floor()">4 Floor</button>
<button id="5F1oor" onclick="move5Floor()">5 Floor</button>
<button id="6F1oor" onclick="move6Floor()">6 Floor</button>
<button id="7F1oor" onclick="move7Floor()">7 Floor</button>
<button id="8F1oor" onclick="move8Floor()">8 Floor</button>
<button id="9F1oor" onclick="move9Floor()">9 Floor</button>
<button id="10F1oor" onclick="move10Floor()">10 Floor</button>
<button id="11F1oor" onclick="move11Floor()">11 Floor</button>
<button id="12F1oor" onclick="move12Floor()">12 Floor</button>
<button id="13F1oor" onclick="moveB1Floor()">B1 Floor</button>
<input id="lightBar" type="range" min="0" max="100" step="5" onchange="changeLightPower()">亮度
<!-- <input type="range">Main Axis</input> -->
</div> </div>
<!-- The Viewer JS --> <div>
<div id="forgeViewer"></div>
</div>
<!--Base JS-->
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
<script src="js/init.js"></script>
<!-- Common packages: jQuery, Bootstrap, jsTree -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.7/jstree.min.js"></script>
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.js"></script> <script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.js"></script>
<script src="js/forge/modeltest.js"></script>
<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
<!-- Developer JS -->
<script> <script>
// this is the iframe URL that shows up when sharing a model embed on a page $(document).ready(function () {
var myRevitFile = launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlX2ZvcmdlX3Rlc3QvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDLm53ZA');
"https://myhub.autodesk360.com/ue29c89b7/shares/public/SH7f1edQT22b515c761e81af7c91890bcea5?mode=embed"; // Revit file (A360/Forge/Napa.rvt)
var myDwfxFile =
"https://autodesk3743.autodesk360.com/shares/public/SH919a0QTf3c32634dcf03b8a55be243c021?mode=embed"; // Sports Car.dwfx
var viewer;
let mainModel = null;
let secondModel = null;
let extraZ = 0;
function getURN(embedURLfromA360, onURNCallback) {
$.get({
url: embedURLfromA360
.replace("public", "metadata")
.replace("mode=embed", ""),
dataType: "json",
success: function (metadata) {
if (onURNCallback) {
let urn = btoa(metadata.success.body.urn)
.replace("/", "_")
.replace("=", "");
onURNCallback(urn);
}
},
});
}
function getForgeToken(onTokenCallback) {
$.post({
url: myRevitFile
.replace("public", "sign")
.replace("mode=embed", "oauth2=true"),
data: "{}",
success: function (oauth) {
if (onTokenCallback)
onTokenCallback(oauth.accessToken, oauth.validitySeconds);
},
});
}
function onDragStart(event) {
event.dataTransfer.effectAllowed = 'copy';
// Hide the dragged image
var img = document.getElementById("blank");
event.dataTransfer.setDragImage(img, 0, 0);
}
// Load car model
const ModelState = {
unloaded: 0,
loading: 1,
loaded: 2,
};
let modelState = ModelState.unloaded;
function onDragOver(event) {
event.preventDefault();
switch (modelState) {
case ModelState.unloaded: {
modelState = ModelState.loading;
getURN(myDwfxFile, function (urn) {
let documentId = "urn:" + urn;
Autodesk.Viewing.Document.load(documentId, (doc) => {
let items = doc.getRoot().search(
{
type: "geometry",
role: "3d",
},
true
);
if (items.length === 0) {
console.error("Document contains no viewables.");
return;
}
let tr = new THREE.Matrix4();
tr.set(
0,
0,
0.005,
0,
0.005,
0,
0,
0,
0,
0.005,
0,
0,
0,
0,
0,
1
);
viewer
.loadDocumentNode(doc, items[0], {
keepCurrentModels: true,
placementTransform: tr,
})
.then(function (model2) {
secondModel = model2;
let bb = secondModel.getBoundingBox();
extraZ = bb.max.z;
modelState = ModelState.loaded;
});
});
});
break;
}
case ModelState.loaded: {
let res = viewer.impl.hitTest(
event.clientX,
event.clientY,
true,
null,
[mainModel.getModelId()]
);
let pt = null;
if (res) {
pt = res.intersectPoint;
} else {
pt = viewer.impl.intersectGround(event.clientX, event.clientY);
}
let tr = secondModel.getPlacementTransform();
tr.elements[12] = pt.x;
tr.elements[13] = pt.y;
tr.elements[14] = pt.z + extraZ;
secondModel.setPlacementTransform(tr);
viewer.impl.invalidate(true, true, true);
break;
}
}
}
function onDrop(event) {
event.preventDefault();
modelState = ModelState.unloaded;
}
let options = {
env: "AutodeskProduction",
getAccessToken: getForgeToken,
};
Autodesk.Viewing.Initializer(options, function onInitialized() {
var viewerDiv = document.getElementById("MyViewerDiv");
viewer = new Autodesk.Viewing.GuiViewer3D(viewerDiv);
viewer.start();
getURN(myRevitFile, function (urn) {
let documentId = "urn:" + urn;
Autodesk.Viewing.Document.load(documentId, (doc) => {
let items = doc.getRoot().search(
{
type: "geometry",
role: "3d",
},
true
);
if (items.length === 0) {
console.error("Document contains no viewables.");
return;
}
viewer.loadDocumentNode(doc, items[0], {}).then(function (model1) {
mainModel = model1;
});
});
});
}); });
function move1Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(0);
requestAnimationFrame(movElevator);
}
function move2Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(1);
requestAnimationFrame(movElevator);
}
function move3Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(2);
requestAnimationFrame(movElevator);
}
function move4Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(3);
requestAnimationFrame(movElevator);
}
function move5Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(4);
requestAnimationFrame(movElevator);
}
function move6Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(5);
requestAnimationFrame(movElevator);
}
function move7Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(6);
requestAnimationFrame(movElevator);
}
function move8Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(7);
requestAnimationFrame(movElevator);
}
function move9Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(8);
requestAnimationFrame(movElevator);
}
function move10Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(9);
requestAnimationFrame(movElevator);
}
function move11Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(10);
requestAnimationFrame(movElevator);
}
function move12Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(11);
requestAnimationFrame(movElevator);
}
function moveB1Floor() {
setElevatorSpeed(0.2);
setElevatorFloor(-1);
requestAnimationFrame(movElevator);
}
function changeLightPower() {
var value = document.getElementById('lightBar').value;
console.log("power: " + value);
setLightPower(value);
}
</script> </script>
</body> </body>
</html> </html>

BIN
Frontend/img/u106.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.0 KiB

BIN
Frontend/img/u110.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

BIN
Frontend/img/u40.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
Frontend/img/u43.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

700
Frontend/index.html
View File

@ -33,10 +33,12 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
<link rel="mask-icon" href="img/favicon/safari-pinned-tab.svg" color="#5bbad5"> <link rel="mask-icon" href="img/favicon/safari-pinned-tab.svg" color="#5bbad5">
<!-- Font Awesome --> <!-- Font Awesome -->
<link href="lib/fontawesome-free/css/all.min.css" rel="stylesheet" /> <link href="lib/fontawesome-free/css/all.min.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" media="screen, print" href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap.min.css"> <link rel="stylesheet" media="screen, print" href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap.min.css">
<link rel="stylesheet" media="screen, print" href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap4.min.css"> <link rel="stylesheet" media="screen, print" href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap4.min.css">
<link rel="stylesheet" href="css/site.css" /> <link rel="stylesheet" href="css/site.css" />
<link rel="stylesheet" href="css/yourteam/plugins/yt-tooltip/yt-tooltip.css" /> <link rel="stylesheet" href="css/yourteam/plugins/yt-tooltip/yt-tooltip.css" />
<link rel="stylesheet" href="css/yourteam/plugins/yt-alert/ytpop-alert.css" />
<link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/style.min.css" type="text/css"> <link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/style.min.css" type="text/css">
</head> </head>
<!-- BEGIN Body --> <!-- BEGIN Body -->
@ -1415,8 +1417,8 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
<img src="img/logo.png" alt="SmartAdmin WebApp" aria-roledescription="logo"> <img src="img/logo.png" alt="SmartAdmin WebApp" aria-roledescription="logo">
<!--<span class="page-logo-text mr-1">SmartAdmin WebApp</span> <!--<span class="page-logo-text mr-1">SmartAdmin WebApp</span>
<span class="position-absolute text-white opacity-50 small pos-top pos-right mr-2 mt-n2"></span> <span class="position-absolute text-white opacity-50 small pos-top pos-right mr-2 mt-n2"></span>
<i class="fal fa-angle-down d-inline-block ml-1 fs-lg color-primary-300"></i>--> <i class="fal fa-angle-down d-inline-block ml-1 fs-lg color-primary-300"></i>-->
</a> </a>
</div> </div>
@ -1465,10 +1467,10 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
<i class="fal fa-home fa-2x"></i><br>首頁 <i class="fal fa-home fa-2x"></i><br>首頁
</a> </a>
<!--<div class="dropdown-menu"> <!--<div class="dropdown-menu">
<button class="dropdown-item" type="button">Action</button> <button class="dropdown-item" type="button">Action</button>
<button class="dropdown-item" type="button">Another action</button> <button class="dropdown-item" type="button">Another action</button>
<button class="dropdown-item" type="button">Something else here</button> <button class="dropdown-item" type="button">Something else here</button>
</div>--> </div>-->
</div> </div>
<div class="btn-group mx-4"> <div class="btn-group mx-4">
<a href="javascript:;" class="dropdown-toggle no-arrow text-center" data-toggle="dropdown" <a href="javascript:;" class="dropdown-toggle no-arrow text-center" data-toggle="dropdown"
@ -1477,10 +1479,10 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
</a> </a>
<div class="dropdown-menu dropdown-select-menu js-auto-close" id="sysMonBtnList"> <div class="dropdown-menu dropdown-select-menu js-auto-close" id="sysMonBtnList">
<!--<button class="dropdown-item" type="button" name="sysMonBtn">電錶</button> <!--<button class="dropdown-item" type="button" name="sysMonBtn">電錶</button>
<button class="dropdown-item" type="button" name="sysMonBtn">照明系統</button> <button class="dropdown-item" type="button" name="sysMonBtn">照明系統</button>
<button class="dropdown-item" type="button" name="sysMonBtn">電梯系統</button> <button class="dropdown-item" type="button" name="sysMonBtn">電梯系統</button>
<button class="dropdown-item" type="button" name="sysMonBtn">環境感測</button> <button class="dropdown-item" type="button" name="sysMonBtn">環境感測</button>
<button class="dropdown-item" type="button" name="sysMonBtn">空調系統</button>--> <button class="dropdown-item" type="button" name="sysMonBtn">空調系統</button>-->
</div> </div>
</div> </div>
<div class="btn-group mx-4"> <div class="btn-group mx-4">
@ -1496,7 +1498,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
</a> </a>
</div> </div>
<div class="btn-group mx-4"> <div class="btn-group mx-4">
<a href="javascript:;" name ="topFunBtn" class="no-arrow text-center" <a href="javascript:;" name="topFunBtn" class="no-arrow text-center"
data-page="operation"> data-page="operation">
<i class="fal fa-server fa-2x"></i><br>運維管理 <i class="fal fa-server fa-2x"></i><br>運維管理
</a> </a>
@ -1516,11 +1518,6 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
</div> </div>
<div class="ml-auto d-flex"> <div class="ml-auto d-flex">
<div><span class="js-get-date"></span></div>
<div>天氣</div>
<!-- app user menu --> <!-- app user menu -->
<div> <div>
@ -1529,65 +1526,21 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
<img src="img/demo/avatars/avatar-admin.png" class="profile-image rounded-circle" <img src="img/demo/avatars/avatar-admin.png" class="profile-image rounded-circle"
alt="Dr. Codex Lantern"> alt="Dr. Codex Lantern">
<!-- you can also add username next to the avatar with the codes below: <!-- you can also add username next to the avatar with the codes below:
<span class="ml-1 mr-1 text-truncate text-truncate-header hidden-xs-down">Me</span> <span class="ml-1 mr-1 text-truncate text-truncate-header hidden-xs-down">Me</span>
<i class="ni ni-chevron-down hidden-xs-down"></i> --> <i class="ni ni-chevron-down hidden-xs-down"></i> -->
</a> </a>
<div class="dropdown-menu dropdown-menu-animated dropdown-lg"> <div class="dropdown-menu dropdown-menu-animated dropdown-lg">
<div class="dropdown-header bg-trans-gradient d-flex flex-row py-4 rounded-top">
<div class="d-flex flex-row align-items-center mt-1 mb-1 color-white"> <a id="logout" href="javascript:;" class="dropdown-item fw-500 pt-3 pb-3">
<span class="mr-2"> <span>登出</span>
<img src="img/demo/avatars/avatar-admin.png"
class="rounded-circle profile-image" alt="Dr. Codex Lantern">
</span>
<div class="info-card-text">
<div class="fs-lg text-truncate text-truncate-lg">Dr. Codex Lantern</div>
<span class="text-truncate text-truncate-md opacity-80">drlantern@gotbootstrap.com</span>
</div>
</div>
</div>
<div class="dropdown-divider m-0"></div>
<a href="#" class="dropdown-item" data-action="app-reset">
<span data-i18n="drpdwn.reset_layout">Reset Layout</span>
</a>
<a href="#" class="dropdown-item" data-toggle="modal" data-target=".js-modal-settings">
<span data-i18n="drpdwn.settings">Settings</span>
</a>
<div class="dropdown-divider m-0"></div>
<a href="#" class="dropdown-item" data-action="app-fullscreen">
<span data-i18n="drpdwn.fullscreen">Fullscreen</span>
<i class="float-right text-muted fw-n">F11</i>
</a>
<a href="#" class="dropdown-item" data-action="app-print">
<span data-i18n="drpdwn.print">Print</span>
<i class="float-right text-muted fw-n">Ctrl + P</i>
</a>
<div class="dropdown-multilevel dropdown-multilevel-left">
<div class="dropdown-item">
Language
</div>
<div class="dropdown-menu">
<a href="#?lang=fr" class="dropdown-item" data-action="lang"
data-lang="fr">Français</a>
<a href="#?lang=en" class="dropdown-item active" data-action="lang"
data-lang="en">English (US)</a>
<a href="#?lang=es" class="dropdown-item" data-action="lang"
data-lang="es">Español</a>
<a href="#?lang=ru" class="dropdown-item" data-action="lang"
data-lang="ru">Русский язык</a>
<a href="#?lang=jp" class="dropdown-item" data-action="lang"
data-lang="jp">日本語</a>
<a href="#?lang=ch" class="dropdown-item" data-action="lang"
data-lang="ch">中文</a>
</div>
</div>
<div class="dropdown-divider m-0"></div>
<a class="dropdown-item fw-500 pt-3 pb-3" href="page_login.html">
<span data-i18n="drpdwn.page-logout">Logout</span>
<span class="float-right fw-n">&commat;codexlantern</span>
</a> </a>
</div> </div>
</div> </div>
</div> </div>
<div class="ml-2 text-center">
<label class="mb-0 fs-1-2">Diamond Controls<span class="fs-09 position-absolute">®</span></label><br>
<label class="mb-0 fs-1-1">智慧大樓管理平台</label>
</div>
</header> </header>
<!-- END Page Header --> <!-- END Page Header -->
<!-- BEGIN Page Content --> <!-- BEGIN Page Content -->
@ -2078,433 +2031,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
</div> </div>
<!-- END Messenger --> <!-- END Messenger -->
<!-- BEGIN Page Settings --> <!-- BEGIN Page Settings -->
<div class="modal fade js-modal-settings modal-backdrop-transparent" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-dialog-right modal-md">
<div class="modal-content">
<div class="dropdown-header bg-trans-gradient d-flex justify-content-center align-items-center w-100">
<h4 class="m-0 text-center color-white">
Layout Settings
<small class="mb-0 opacity-80">User Interface Settings</small>
</h4>
<button type="button" class="close text-white position-absolute pos-top pos-right p-2 m-1 mr-2"
data-dismiss="modal" aria-label="Close">
<span aria-hidden="true"><i class="fal fa-times"></i></span>
</button>
</div>
<div class="modal-body p-0">
<div class="settings-panel">
<div class="mt-4 d-table w-100 px-5">
<div class="d-table-cell align-middle">
<h5 class="p-0">
App Layout
</h5>
</div>
</div>
<div class="list" id="fh">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="header-function-fixed"></a>
<span class="onoffswitch-title">Fixed Header</span>
<span class="onoffswitch-title-desc">header is in a fixed at all times</span>
</div>
<div class="list" id="nff">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="nav-function-fixed"></a>
<span class="onoffswitch-title">Fixed Navigation</span>
<span class="onoffswitch-title-desc">left panel is fixed</span>
</div>
<div class="list" id="nfm">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="nav-function-minify"></a>
<span class="onoffswitch-title">Minify Navigation</span>
<span class="onoffswitch-title-desc">Skew nav to maximize space</span>
</div>
<div class="list" id="nfh">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="nav-function-hidden"></a>
<span class="onoffswitch-title">Hide Navigation</span>
<span class="onoffswitch-title-desc">roll mouse on edge to reveal</span>
</div>
<div class="list" id="nft">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="nav-function-top"></a>
<span class="onoffswitch-title">Top Navigation</span>
<span class="onoffswitch-title-desc">Relocate left pane to top</span>
</div>
<div class="list" id="fff">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="footer-function-fixed"></a>
<span class="onoffswitch-title">Fixed Footer</span>
<span class="onoffswitch-title-desc">page footer is fixed</span>
</div>
<div class="list" id="mmb">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-main-boxed"></a>
<span class="onoffswitch-title">Boxed Layout</span>
<span class="onoffswitch-title-desc">Encapsulates to a container</span>
</div>
<div class="expanded">
<ul class="mb-3 mt-1">
<li>
<div class="bg-fusion-50" data-action="toggle" data-class="mod-bg-1"></div>
</li>
<li>
<div class="bg-warning-200" data-action="toggle" data-class="mod-bg-2"></div>
</li>
<li>
<div class="bg-primary-200" data-action="toggle" data-class="mod-bg-3"></div>
</li>
<li>
<div class="bg-success-300" data-action="toggle" data-class="mod-bg-4"></div>
</li>
<li>
<div class="bg-white border" data-action="toggle" data-class="mod-bg-none"></div>
</li>
</ul>
<div class="list" id="mbgf">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-fixed-bg"></a>
<span class="onoffswitch-title">Fixed Background</span>
</div>
</div>
<div class="mt-4 d-table w-100 px-5">
<div class="d-table-cell align-middle">
<h5 class="p-0">
Mobile Menu
</h5>
</div>
</div>
<div class="list" id="nmp">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="nav-mobile-push"></a>
<span class="onoffswitch-title">Push Content</span>
<span class="onoffswitch-title-desc">Content pushed on menu reveal</span>
</div>
<div class="list" id="nmno">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="nav-mobile-no-overlay"></a>
<span class="onoffswitch-title">No Overlay</span>
<span class="onoffswitch-title-desc">Removes mesh on menu reveal</span>
</div>
<div class="list" id="sldo">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="nav-mobile-slide-out"></a>
<span class="onoffswitch-title">Off-Canvas <sup>(beta)</sup></span>
<span class="onoffswitch-title-desc">Content overlaps menu</span>
</div>
<div class="mt-4 d-table w-100 px-5">
<div class="d-table-cell align-middle">
<h5 class="p-0">
Accessibility
</h5>
</div>
</div>
<div class="list" id="mbf">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-bigger-font"></a>
<span class="onoffswitch-title">Bigger Content Font</span>
<span class="onoffswitch-title-desc">content fonts are bigger for readability</span>
</div>
<div class="list" id="mhc">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-high-contrast"></a>
<span class="onoffswitch-title">High Contrast Text (WCAG 2 AA)</span>
<span class="onoffswitch-title-desc">4.5:1 text contrast ratio</span>
</div>
<div class="list" id="mcb">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-color-blind"></a>
<span class="onoffswitch-title">Daltonism <sup>(beta)</sup> </span>
<span class="onoffswitch-title-desc">color vision deficiency</span>
</div>
<div class="list" id="mpc">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-pace-custom"></a>
<span class="onoffswitch-title">Preloader Inside</span>
<span class="onoffswitch-title-desc">preloader will be inside content</span>
</div>
<div class="list" id="mpi">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-panel-icon"></a>
<span class="onoffswitch-title">SmartPanel Icons (not Panels)</span>
<span class="onoffswitch-title-desc">smartpanel buttons will appear as icons</span>
</div>
<div class="mt-4 d-table w-100 px-5">
<div class="d-table-cell align-middle">
<h5 class="p-0">
Global Modifications
</h5>
</div>
</div>
<div class="list" id="mcbg">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-clean-page-bg"></a>
<span class="onoffswitch-title">Clean Page Background</span>
<span class="onoffswitch-title-desc">adds more whitespace</span>
</div>
<div class="list" id="mhni">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-hide-nav-icons"></a>
<span class="onoffswitch-title">Hide Navigation Icons</span>
<span class="onoffswitch-title-desc">invisible navigation icons</span>
</div>
<div class="list" id="dan">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-disable-animation"></a>
<span class="onoffswitch-title">Disable CSS Animation</span>
<span class="onoffswitch-title-desc">Disables CSS based animations</span>
</div>
<div class="list" id="mhic">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-hide-info-card"></a>
<span class="onoffswitch-title">Hide Info Card</span>
<span class="onoffswitch-title-desc">Hides info card from left panel</span>
</div>
<div class="list" id="mlph">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-lean-subheader"></a>
<span class="onoffswitch-title">Lean Subheader</span>
<span class="onoffswitch-title-desc">distinguished page header</span>
</div>
<div class="list" id="mnl">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-nav-link"></a>
<span class="onoffswitch-title">Hierarchical Navigation</span>
<span class="onoffswitch-title-desc">Clear breakdown of nav links</span>
</div>
<div class="list" id="mdn">
<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
data-class="mod-nav-dark"></a>
<span class="onoffswitch-title">Dark Navigation</span>
<span class="onoffswitch-title-desc">Navigation background is darkend</span>
</div>
<hr class="mb-0 mt-4">
<div class="mt-4 d-table w-100 pl-5 pr-3">
<div class="d-table-cell align-middle">
<h5 class="p-0">
Global Font Size
</h5>
</div>
</div>
<div class="list mt-1">
<div class="btn-group btn-group-sm btn-group-toggle my-2" data-toggle="buttons">
<label class="btn btn-default btn-sm" data-action="toggle-swap"
data-class="root-text-sm" data-target="html">
<input type="radio" name="changeFrontSize"> SM
</label>
<label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text"
data-target="html">
<input type="radio" name="changeFrontSize" checked=""> MD
</label>
<label class="btn btn-default btn-sm" data-action="toggle-swap"
data-class="root-text-lg" data-target="html">
<input type="radio" name="changeFrontSize"> LG
</label>
<label class="btn btn-default btn-sm" data-action="toggle-swap"
data-class="root-text-xl" data-target="html">
<input type="radio" name="changeFrontSize"> XL
</label>
</div>
<span class="onoffswitch-title-desc d-block mb-0">
Change <strong>root</strong> font size to effect rem
values (resets on page refresh)
</span>
</div>
<hr class="mb-0 mt-4">
<div class="mt-4 d-table w-100 pl-5 pr-3">
<div class="d-table-cell align-middle">
<h5 class="p-0 pr-2 d-flex">
Theme colors
<a href="#" class="ml-auto fw-400 fs-xs" data-toggle="popover" data-trigger="focus"
data-placement="top" title="" data-html="true"
data-content="The settings below uses <code>localStorage</code> to load the external <strong>CSS</strong> file as an overlap to the base css. Due to network latency and <strong>CPU utilization</strong>, you may experience a brief flickering effect on page load which may show the intial applied theme for a split second. Setting the prefered style/theme in the header will prevent this from happening."
data-original-title="<span class='text-primary'><i class='fal fa-exclamation-triangle mr-1'></i> Heads up!</span>"
data-template="<div class=&quot;popover bg-white border-white&quot; role=&quot;tooltip&quot;><div class=&quot;arrow&quot;></div><h3 class=&quot;popover-header bg-transparent&quot;></h3><div class=&quot;popover-body fs-xs&quot;></div></div>">
<i class="fal fa-info-circle mr-1"></i> more info
</a>
</h5>
</div>
</div>
<div class="expanded theme-colors pl-5 pr-3">
<ul class="m-0">
<li>
<a href="#" id="myapp-0" data-action="theme-update" data-themesave data-theme=""
data-toggle="tooltip" data-placement="top" title="Wisteria (base css)"
data-original-title="Wisteria (base css)"></a>
</li>
<li>
<a href="#" id="myapp-1" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-1.css" data-toggle="tooltip"
data-placement="top" title="Tapestry" data-original-title="Tapestry"></a>
</li>
<li>
<a href="#" id="myapp-2" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-2.css" data-toggle="tooltip"
data-placement="top" title="Atlantis" data-original-title="Atlantis"></a>
</li>
<li>
<a href="#" id="myapp-3" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-3.css" data-toggle="tooltip"
data-placement="top" title="Indigo" data-original-title="Indigo"></a>
</li>
<li>
<a href="#" id="myapp-4" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-4.css" data-toggle="tooltip"
data-placement="top" title="Dodger Blue" data-original-title="Dodger Blue"></a>
</li>
<li>
<a href="#" id="myapp-5" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-5.css" data-toggle="tooltip"
data-placement="top" title="Tradewind" data-original-title="Tradewind"></a>
</li>
<li>
<a href="#" id="myapp-6" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-6.css" data-toggle="tooltip"
data-placement="top" title="Cranberry" data-original-title="Cranberry"></a>
</li>
<li>
<a href="#" id="myapp-7" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-7.css" data-toggle="tooltip"
data-placement="top" title="Oslo Gray" data-original-title="Oslo Gray"></a>
</li>
<li>
<a href="#" id="myapp-8" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-8.css" data-toggle="tooltip"
data-placement="top" title="Chetwode Blue"
data-original-title="Chetwode Blue"></a>
</li>
<li>
<a href="#" id="myapp-9" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-9.css" data-toggle="tooltip"
data-placement="top" title="Apricot" data-original-title="Apricot"></a>
</li>
<li>
<a href="#" id="myapp-10" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-10.css" data-toggle="tooltip"
data-placement="top" title="Blue Smoke" data-original-title="Blue Smoke"></a>
</li>
<li>
<a href="#" id="myapp-11" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-11.css" data-toggle="tooltip"
data-placement="top" title="Green Smoke" data-original-title="Green Smoke"></a>
</li>
<li>
<a href="#" id="myapp-12" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-12.css" data-toggle="tooltip"
data-placement="top" title="Wild Blue Yonder"
data-original-title="Wild Blue Yonder"></a>
</li>
<li>
<a href="#" id="myapp-13" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-13.css" data-toggle="tooltip"
data-placement="top" title="Emerald" data-original-title="Emerald"></a>
</li>
<li>
<a href="#" id="myapp-14" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-14.css" data-toggle="tooltip"
data-placement="top" title="Supernova" data-original-title="Supernova"></a>
</li>
<li>
<a href="#" id="myapp-15" data-action="theme-update" data-themesave
data-theme="css/themes/cust-theme-15.css" data-toggle="tooltip"
data-placement="top" title="Hoki" data-original-title="Hoki"></a>
</li>
</ul>
</div>
<hr class="mb-0 mt-4">
<div class="mt-4 d-table w-100 pl-5 pr-3">
<div class="d-table-cell align-middle">
<h5 class="p-0 pr-2 d-flex">
Theme Modes (beta)
<a href="#" class="ml-auto fw-400 fs-xs" data-toggle="popover" data-trigger="focus"
data-placement="top" title="" data-html="true"
data-content="This is a brand new technique we are introducing which uses CSS variables to infiltrate color options. While this has been working nicely on modern browsers without much issues, some users <strong>may still face issues on Internet Explorer </strong>. Until these issues are resolved or Internet Explorer improves, this feature will remain in Beta"
data-original-title="<span class='text-primary'><i class='fal fa-question-circle mr-1'></i> Why beta?</span>"
data-template="<div class=&quot;popover bg-white border-white&quot; role=&quot;tooltip&quot;><div class=&quot;arrow&quot;></div><h3 class=&quot;popover-header bg-transparent&quot;></h3><div class=&quot;popover-body fs-xs&quot;></div></div>">
<i class="fal fa-question-circle mr-1"></i> why beta?
</a>
</h5>
</div>
</div>
<div class="pl-5 pr-3 py-3">
<div class="ie-only alert alert-warning d-none">
<h6>Internet Explorer Issue</h6>
This particular component may not work as expected in Internet Explorer. Please use with
caution.
</div>
<div class="row no-gutters">
<div class="col-4 pr-2 text-center">
<div id="skin-default" data-action="toggle-replace"
data-replaceclass="mod-skin-light mod-skin-dark" data-class=""
data-toggle="tooltip" data-placement="top" title=""
class="d-flex bg-white border border-primary rounded overflow-hidden text-success js-waves-on"
data-original-title="Default Mode" style="height: 80px">
<div class="bg-primary-600 bg-primary-gradient px-2 pt-0 border-right border-primary">
</div>
<div class="d-flex flex-column flex-1">
<div class="bg-white border-bottom border-primary py-1"></div>
<div class="bg-faded flex-1 pt-3 pb-3 px-2">
<div class="py-3"
style="background:url('img/demo/s-1.png') top left no-repeat;background-size: 100%;">
</div>
</div>
</div>
</div>
Default
</div>
<div class="col-4 px-1 text-center">
<div id="skin-light" data-action="toggle-replace" data-replaceclass="mod-skin-dark"
data-class="mod-skin-light" data-toggle="tooltip" data-placement="top" title=""
class="d-flex bg-white border border-secondary rounded overflow-hidden text-success js-waves-on"
data-original-title="Light Mode" style="height: 80px">
<div class="bg-white px-2 pt-0 border-right border-"></div>
<div class="d-flex flex-column flex-1">
<div class="bg-white border-bottom border- py-1"></div>
<div class="bg-white flex-1 pt-3 pb-3 px-2">
<div class="py-3"
style="background:url('img/demo/s-1.png') top left no-repeat;background-size: 100%;">
</div>
</div>
</div>
</div>
Light
</div>
<div class="col-4 pl-2 text-center">
<div id="skin-dark" data-action="toggle-replace" data-replaceclass="mod-skin-light"
data-class="mod-skin-dark" data-toggle="tooltip" data-placement="top" title=""
class="d-flex bg-white border border-dark rounded overflow-hidden text-success js-waves-on"
data-original-title="Dark Mode" style="height: 80px">
<div class="bg-fusion-500 px-2 pt-0 border-right"></div>
<div class="d-flex flex-column flex-1">
<div class="bg-fusion-600 border-bottom py-1"></div>
<div class="bg-fusion-300 flex-1 pt-3 pb-3 px-2">
<div class="py-3 opacity-30"
style="background:url('img/demo/s-1.png') top left no-repeat;background-size: 100%;">
</div>
</div>
</div>
</div>
Dark
</div>
</div>
</div>
<hr class="mb-0 mt-4">
<div class="pl-5 pr-3 py-3 bg-faded">
<div class="row no-gutters">
<div class="col-6 pr-1">
<a href="#" class="btn btn-outline-danger fw-500 btn-block"
data-action="app-reset">Reset Settings</a>
</div>
<div class="col-6 pl-1">
<a href="#" class="btn btn-danger fw-500 btn-block"
data-action="factory-reset">Factory Reset</a>
</div>
</div>
</div>
</div> <span id="saving"></span>
</div>
</div>
</div>
</div>
<!-- END Page Settings --> <!-- END Page Settings -->
<!-- base vendor bundle: <!-- base vendor bundle:
DOC: if you remove pace.js from core please note on Internet Explorer some CSS animations may execute before a page is fully loaded, resulting 'jump' animations DOC: if you remove pace.js from core please note on Internet Explorer some CSS animations may execute before a page is fully loaded, resulting 'jump' animations
@ -2528,7 +2055,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
<!--The order of scripts is irrelevant. Please check out the plugin pages for more details about these plugins below:--> <!--The order of scripts is irrelevant. Please check out the plugin pages for more details about these plugins below:-->
<script src="lib/statistics/easypiechart/easypiechart.bundle.js"></script> <script src="lib/statistics/easypiechart/easypiechart.bundle.js"></script>
<!--Bajascript--> <!--Bajascript-->
<script src="js/bajascript/bscriptReq.js"></script> <script src="js/bajascript/bscriptReq.js"></script>
@ -2537,6 +2064,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.js"></script> <script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.js"></script>
<script src="js/forge/forgemodel.js"></script> <script src="js/forge/forgemodel.js"></script>
<script src="js/yourteam/plugins/yt-alert/ytpop-alert.js"></script>
<script type='text/javascript'> <script type='text/javascript'>
@ -2546,25 +2074,24 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
}); });
</script> </script>
<script src="js/n4js/bajatest.js"></script> <script src="js/n4js/bajatest.js"></script>
<script src="js/n4js/electricmeterbaja.js"></script>
<script src="js/bajascript/require.config.js"></script> <script src="js/bajascript/require.config.js"></script>
<script src="js/FileSaver.js"></script> <script src="js/FileSaver.js"></script>
<script> <script>
/*$('#js-page-content').smartPanel();*/ /*$('#js-page-content').smartPanel();*/
var jwt = localStorage.getItem("JWT-Authorization"); var jwt = localStorage.getItem("JWT-Authorization");
var pageAct = {}; //記錄全頁面已選擇項目 var pageAct = {}; //記錄全頁面已選擇項目
pageAct.AreaTag = "TPE";
if (!jwt) {
location.href = "login.html";
}
if (location.href.indexOf("ord") != -1) { if (location.href.indexOf("ord") != -1) {
location.href = "/file/index.html" location.href = "/file/index.html"
} }
pageLoading(true)
// 執行初步 Loading
var loadEle = pageLoading();
$(function () { $(function () {
// 二次引用 jquery.js // 二次引用 jquery.js
// - 在 require 內部程序需要引用 jquery，由於 require 的套件需要依賴 jquery ，就算 HTML 已經引用 jquery， require 也無法參考 // - 在 require 內部程序需要引用 jquery，由於 require 的套件需要依賴 jquery ，就算 HTML 已經引用 jquery， require 也無法參考
@ -2587,9 +2114,6 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
"n4js/historybaja", "n4js/historybaja",
"lib/statistics/flot/flot.bundle", "lib/statistics/flot/flot.bundle",
"lib/statistics/peity/peity.bundle", "lib/statistics/peity/peity.bundle",
"lib/jquery-validation/dist/jquery.validate",
"lib/jquery-validation/dist/additional-methods.min",
"lib/jquery-validation/dist/localization/messages_zh_TW",
], loadedMasterPack); ], loadedMasterPack);
} }
/** /**
@ -2616,7 +2140,19 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
* */ * */
function loadedJsPack() { function loadedJsPack() {
loadEvent(); loadEvent();
if (!jwt) {
myBaja = new MyBaja();
myBaja.setMyUserAccount(Login);
} else {
isValidLogin();
}
$(loadEle).Loading("close");
}
/**
* 登入驗證完成 Callback
* */
function isValidLogin() {
$("#app").load("_dashboard.html", loadCallback); $("#app").load("_dashboard.html", loadCallback);
getBuiList(); getBuiList();
@ -2695,20 +2231,20 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
console.log(result); console.log(result);
} }
/*})*/
//})
} }
// page loaded callback // page loaded callback
function loadCallback() { function loadCallback() {
initTabsByEle(); initTabsByEle();
resetYTTooltip(); resetYTTooltip();
} }
//事件先行讀取 // 事件先行讀取
function loadEvent() { function loadEvent() {
onEvent("click", "[name=topFunBtn]", function () { onEvent("click", "[name=topFunBtn]", function () {
let needLoad = ["sysElevator","historyData"];
_ytTabInited = [];
let page = $(this).data("page"); let page = $(this).data("page");
if (page != "systemMonitor") { if (page != "systemMonitor") {
@ -2716,11 +2252,22 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
pageAct.sysMainTag = null; pageAct.sysMainTag = null;
} }
$.each(tolSubList, (idx, sub) => { $.each(tolSubList, (idx, sub) => {
console.log("sub",sub,idx) console.log("sub", sub, idx)
sub.unsubscribeAll(); sub.unsubscribeAll();
sub.detach(); sub.detach();
}) })
$("#app").load(`_${page}.html`, loadCallback); $("#app").load(`_${page}.html`, loadCallback);
// 需要 Loading 的頁面
if (needLoad.indexOf(page) != -1) {
$(loadEle).Loading("start", "資料讀取中...");
}
})
onEvent("click", "#logout", function () {
localStorage.removeItem("JWT-Authorization");
location.href = "/logout";
}) })
onEvent("active:change", "#sysMonBtnList", function (e, actEle) { onEvent("active:change", "#sysMonBtnList", function (e, actEle) {
@ -2742,17 +2289,54 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
} }
function pageLoading(isShow = true) { /**
if (isShow) { * 頁面 Loading 建立
if ($("body .loading-bg").length == 0) { * */
let background = $(`<div class="loading-bg"></div>`) function pageLoading(text = null) {
$("body").append(background); let background = $(`<div class="loading-bg"></div>`);
} else { let aleObj = YT.Alert.Tip(text || "讀取中，請稍後", "show");
$("body .loading-bg").show(); $(background)[0]._aleObj = aleObj;
} $("body").css("overflow", "hidden");
} else { $("body .page-content-wrapper").append(background);
$("body .loading-bg").hide(); $(background).animate({ opacity: 1 }, 300);
return background;
}
// 登入驗證
function Login(account) {
console.log(account)
/*if ($("#login-form").valid()) {*/
var url = baseApiUrl + "/api/Login/";
var send_data = {
account: account,
password: "rJ2T5Kkj"
} }
if (location.href.indexOf("localhost:5966") != -1) {
location.href = "login.html";
}
$.ajax({
method: "post",
url: url,
data: JSON.stringify(send_data),
async: false,
contentType: "application/json; charset=UTF-8",
dataType: 'json',
success: function (rel) {
if (rel.code != "0000") {
toast_error(rel.msg || "系統內部發生錯誤，請聯絡系統管理員");
return;
}
else {
/*toast_ok(rel.msg);*/
localStorage.setItem('JWT-Authorization', rel.data.token);
isValidLogin();
}
},
error: function (xhr, textStatus, thrownError) {
alert(textStatus);
}
});
} }
//============================================================================== //==============================================================================
@ -2761,6 +2345,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
// Card - 基本資料 Table // Card - 基本資料 Table
function drawInfoTabBlo(devGuid) { function drawInfoTabBlo(devGuid) {
let tabEle = $(`<table class="table table-bordered table-striped text-center m-0">`); let tabEle = $(`<table class="table table-bordered table-striped text-center m-0">`);
let tbody = tabEle.append("<tbody>"); let tbody = tabEle.append("<tbody>");
let columnNames = ["設備編號", "設備名稱"]; let columnNames = ["設備編號", "設備名稱"];
@ -2794,7 +2379,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
function drawErrRecTabBlo() { function drawErrRecTabBlo() {
let strHtml = `<table id="errRecTable" class="table table-bordered table-striped text-center m-0 w-100"> let strHtml = `<table id="errRecTable" class="table table-bordered table-striped text-center m-0 w-100">
</table>` </table>`
return strHtml; return strHtml;
} }
@ -2802,7 +2387,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
function drawOpeRecTabBlo() { function drawOpeRecTabBlo() {
let strHtml = `<table id="opeRecTable" class="table table-bordered table-striped text-center m-0 w-100"> let strHtml = `<table id="opeRecTable" class="table table-bordered table-striped text-center m-0 w-100">
</table>` </table>`
return strHtml; return strHtml;
} }
@ -2815,37 +2400,37 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
$(ele).YTTooltip({ $(ele).YTTooltip({
html: `<div class="card m-1 border device-wrap"> html: `<div class="card m-1 border device-wrap">
<div class="card-header p-3"> <div class="card-header p-3">
<div class="position-absolute w-50" style="word-break: break-all;">
<label class="m-0 mt-2">${devName}</label>
</div>
<div id="card-tab" class="row justify-content-end nav nav-tabs" role="tablist">
<button type="button" id="state-tab" class="btn btn-icon nav-link active" role="tab" data-tabname="cardTab" data-target="#state"><i class="fa fa-desktop icon"></i></button>
<button type="button" id="info-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#info"><i class="fa fa-cog icon"></i></button>
<button type="button" id="errRec-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#errRec"><i class="fas fa-exclamation-triangle"></i></button>
<button type="button" id="opeRec-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#opeRec"><i class="fa fa-bars icon"></i></button>
<button class="btn p-2"><i class="fas fa-times fs-1 text-white-50" data-close="yttooltip"></i></button>
</div>
</div>
<div class="card-body p-2 tab-content">
<div id="state" class="show active" data-tabname="cardTab" data-tabrole="child">
${drawStateTabBlo(devNum)}
</div>
<div id="info" data-tabname="cardTab" data-tabrole="child">
${drawInfoTabBlo(devGuid)}
</div>
<div id="errRec" data-tabname="cardTab" data-tabrole="child">
${drawErrRecTabBlo()}
</div>
<div id="opeRec" data-tabname="cardTab" data-tabrole="child">
${drawOpeRecTabBlo()}
</div>
<div class="position-absolute w-50" style="word-break: break-all;">
<label class="m-0 mt-2">${devName}</label>
</div> </div>
</div>`, <div id="card-tab" class="row justify-content-end nav nav-tabs" role="tablist">
<button type="button" id="state-tab" class="btn btn-icon nav-link active" role="tab" data-tabname="cardTab" data-target="#state"><i class="fa fa-desktop icon"></i></button>
<button type="button" id="info-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#info"><i class="fa fa-cog icon"></i></button>
<button type="button" id="errRec-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#errRec"><i class="fas fa-exclamation-triangle"></i></button>
<button type="button" id="opeRec-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#opeRec"><i class="fa fa-bars icon"></i></button>
<button class="btn p-2"><i class="fas fa-times fs-1 text-white-50" data-close="yttooltip"></i></button>
</div>
</div>
<div class="card-body p-2 tab-content">
<div id="state" class="show active" data-tabname="cardTab" data-tabrole="child">
${drawStateTabBlo(devNum)}
</div>
<div id="info" data-tabname="cardTab" data-tabrole="child">
${drawInfoTabBlo(devGuid)}
</div>
<div id="errRec" data-tabname="cardTab" data-tabrole="child">
${drawErrRecTabBlo()}
</div>
<div id="opeRec" data-tabname="cardTab" data-tabrole="child">
${drawOpeRecTabBlo()}
</div>
</div>
</div>`,
group: "device", group: "device",
onShow: function (tooltipEle, oriEle) { onShow: function (tooltipEle, oriEle) {
var tab = new YT.Tab({ tabName: "cardTab" }) var tab = new YT.Tab({ tabName: "cardTab" })
@ -2861,6 +2446,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
// Card - 運維紀錄 Table // Card - 運維紀錄 Table
function loadOpeRecTable(devGuid) { function loadOpeRecTable(devGuid) {
let url = baseApiUrl + "/api/Device/GetOpeDevice?device_guid=" + devGuid; let url = baseApiUrl + "/api/Device/GetOpeDevice?device_guid=" + devGuid;
let tag = "#opeRecTable"; let tag = "#opeRecTable";
@ -2979,9 +2565,9 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
}) })
} }
//============================================================================== //==============================================================================
// ↑ 系統監控 - 共用 Function ↑ // ↑ 系統監控 - 共用 Function ↑
//============================================================================== //==============================================================================
</script> </script>
</body> </body>

113
Frontend/js/forge/forgemodel.js
View File

@ -49,7 +49,7 @@ var elevatorSpeed;
// sensorVals[i] = Math.random(); // sensorVals[i] = Math.random();
// } // }
function launchViewer(urn, eleOption ,callback) { function launchViewer(urn, callback) {
var options = { var options = {
env: 'AutodeskProduction', env: 'AutodeskProduction',
getAccessToken: getForgeToken getAccessToken: getForgeToken
@ -60,13 +60,11 @@ function launchViewer(urn, eleOption ,callback) {
//viewer = new Autodesk.Viewing.Viewer3D(document.getElementById('forgeViewer')); //viewer = new Autodesk.Viewing.Viewer3D(document.getElementById('forgeViewer'));
viewer.start(); viewer.start();
var documentId = 'urn:' + urn; var documentId = 'urn:' + urn;
Autodesk.Viewing.Document.load(documentId, function (doc) { Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
onDocumentLoadSuccess(doc, eleOption);
}, onDocumentLoadFailure);
$("#forgeViewer").on("autodesk:loaded", function () { $("#forgeViewer").on("autodesk:loaded", function () {
callback ? callback() : ""; callback ? callback(viewer) : "";
}) })
@ -139,7 +137,7 @@ class elevator3D {
this.init(); this.init();
} }
setTreeFrag = function () { setTreeFrag = function (callback) {
let tree = this.viewer.model.getData().instanceTree; let tree = this.viewer.model.getData().instanceTree;
let nodeId = this.nodeId; let nodeId = this.nodeId;
//tree.enumNodeChildren(nodeId, (node) => { //tree.enumNodeChildren(nodeId, (node) => {
@ -155,34 +153,44 @@ class elevator3D {
// }); // });
//}) //})
tree.enumNodeFragments(nodeId, (frag) => { if (nodeId) {
let fragProxy = this.viewer.impl.getFragmentProxy(this.viewer.model, frag); let childCnt = tree.getChildCount(nodeId);
this.fragProxy = fragProxy; let curIdx = 1;
this.fragProxys.push({ nodeId: nodeId, frag: fragProxy }); this.fragProxys.filter(x => x.nodeId == nodeId).forEach((x) => {
let idx = this.fragProxys.indexOf(x);
this.fragProxys.splice(idx,1);
})
tree.enumNodeFragments(nodeId, (frag) => {
let fragProxy = this.viewer.impl.getFragmentProxy(this.viewer.model, frag);
this.fragProxy.getAnimTransform(); this.fragProxys.push({ nodeId: nodeId, fragId: frag, frag: fragProxy });
let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
this.fragProxy.position = fragPosition; fragProxy.getAnimTransform();
let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
this.fragProxy.updateAnimTransform(); fragProxy.position = fragPosition;
},true);
fragProxy.updateAnimTransform();
if (childCnt == curIdx) {
this.initCallback ? this.initCallback() : "";
callback ? callback() : "";
}
curIdx++;
}, true);
}
this.viewer.impl.sceneUpdated(true); this.viewer.impl.sceneUpdated(true);
if (typeof $(this.ele)[0]._elevator3D == "undefined") { if (typeof $(this.ele)[0]._elevator3D == "undefined") {
$(this.ele)[0]._elevator3D = []; $(this.ele)[0]._elevator3D = [];
} }
$(this.ele)[0]._elevator3D.push({ nodeId: nodeId, obj: this }); $(this.ele)[0]._elevator3D.push({ nodeId: nodeId, obj: this });
this.initCallback ? this.initCallback() : "";
} }
init = function () { init = function (callback = null) {
this.setTreeFrag(); this.setTreeFrag(callback);
} }
setElevatorFloor = function (floor) { setElevatorFloor = function (floor) {
this.targetFloorZ = this.floorHeight.filter(x => x.floor == floor)[0].height; this.targetFloorZ = this.floorHeight.filter(x => x.floor == floor)[0]?.height ?? 0;
} }
setElevatorSpeed = function (speed) { //0.01 ~ 1 setElevatorSpeed = function (speed) { //0.01 ~ 1
@ -195,12 +203,15 @@ class elevator3D {
let nodeId = this.nodeId; let nodeId = this.nodeId;
let fragProxyZ = 0; let fragProxyZ = 0;
let movStatus = this.movStatus; // 0=no 1=up 2=down let movStatus = this.movStatus; // 0=no 1=up 2=down
let fragProxy = this.fragProxys.filter(x => x.nodeId == nodeId)[0]?.frag;
if (!fragProxy) {
return;
}
if (fragProxy.position.z > this.targetFloorZ) {
if (this.fragProxy.position.z > this.targetFloorZ) {
movStatus = 2 movStatus = 2
} }
else if (this.fragProxy.position.z < this.targetFloorZ) { else if (fragProxy.position.z < this.targetFloorZ) {
movStatus = 1 movStatus = 1
} }
@ -209,20 +220,20 @@ class elevator3D {
} }
tree.enumNodeFragments(nodeId, (frag) => { tree.enumNodeFragments(nodeId, (frag) => {
this.fragProxy = this.viewer.impl.getFragmentProxy(this.viewer.model, frag); let fragProxy = this.viewer.impl.getFragmentProxy(this.viewer.model, frag);
this.fragProxy.getAnimTransform(); fragProxy.getAnimTransform();
//let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26 //let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
if (movStatus == 2) { if (movStatus == 2) {
this.fragProxy.position.z -= this.speed; fragProxy.position.z -= this.speed;
} }
else if (movStatus == 1) { else if (movStatus == 1) {
this.fragProxy.position.z += this.speed; fragProxy.position.z += this.speed;
} }
fragProxyZ = this.fragProxy.position.z; fragProxyZ = fragProxy.position.z;
this.fragProxy.updateAnimTransform() fragProxy.updateAnimTransform()
},true); }, true);
this.viewer.impl.sceneUpdated(true); this.viewer.impl.sceneUpdated(true);
let movElevator = $(this.ele)[0]._elevator3D.filter(x => x.nodeId == this.nodeId)[0]?.obj.movElevator.bind(this); let movElevator = $(this.ele)[0]._elevator3D.filter(x => x.nodeId == this.nodeId)[0]?.obj.movElevator.bind(this);
@ -252,7 +263,7 @@ class elevator3D {
} }
} }
function onDocumentLoadSuccess(doc,eleOption) { function onDocumentLoadSuccess(doc, eleOption) {
var viewables = doc.getRoot().getDefaultGeometry(); var viewables = doc.getRoot().getDefaultGeometry();
viewer.loadDocumentNode(doc, viewables).then(i => { viewer.loadDocumentNode(doc, viewables).then(i => {
// documented loaded, any action? // documented loaded, any action?
@ -269,25 +280,25 @@ function onDocumentLoadSuccess(doc,eleOption) {
//var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex); //var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
//var domElem = document.getElementById('all_id'); //var domElem = document.getElementById('all_id');
//domElem.innerText = allDbIdsStr; //domElem.innerText = allDbIdsStr;
let nodes = eleOption.nodes ?? []; //let nodes = eleOption.nodes ?? [];
let element = eleOption.element ?? ""; //let element = eleOption.element ?? "";
$(element)[0]._elevator3D = []; //$(element)[0]._elevator3D = [];
$.each(nodes, function (idx, node) { //$.each(nodes, function (idx, node) {
let options = { // let options = {
element: $(element), // element: $(element),
viewer: viewer, // viewer: viewer,
nodeId: node, // nodeId: node,
floorHeight: eleOption.floorHeight ?? [], // floorHeight: eleOption.floorHeight ?? [],
inited: function () { // inited: function () {
if (idx == nodes.length - 1) { // if (idx == nodes.length - 1) {
$(element).trigger("autodesk:loaded"); // $(element).trigger("autodesk:loaded");
} // }
} // }
} // }
let elevator3DObj = new elevator3D(options); // let elevator3DObj = new elevator3D(options);
})
//})
$("#forgeViewer").trigger("autodesk:loaded");
//let tree = viewer.model.getData().instanceTree; //let tree = viewer.model.getData().instanceTree;
//let nodeId = 10952; //let nodeId = 10952;
//console.log("tree", tree) //console.log("tree", tree)

416
Frontend/js/forge/modeltest.js Normal file
View File

@ -0,0 +1,416 @@
var viewer;
// Initialize sensor values
//let sensorVals = [];
let fragProxy;
var targetFloorZ;
var elevatorSpeed;
// for (let i = 0; i < devices.length; i++) {
// sensorVals[i] = Math.random();
// }
function launchViewer(urn) {
var options = {
env: 'AutodeskProduction',
getAccessToken: getForgeToken
};
Autodesk.Viewing.Initializer(options, () => {
viewer = new Autodesk.Viewing.GuiViewer3D(document.getElementById('forgeViewer'));
//viewer = new Autodesk.Viewing.Viewer3D(document.getElementById('forgeViewer'));
viewer.start();
var documentId = 'urn:' + urn;
Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
//test
// for (let i = 0; i < urn.length; i++) {
// Autodesk.Viewing.Document.load(urn[i]["urn"], async (doc) => {
// let viewables = doc.getRoot().getDefaultGeometry();
// let model = await viewer.loadDocumentNode(doc, viewables, {
// preserveView: false,
// keepCurrentModels: true,
// placementTransform: (new THREE.Matrix4()).setPosition(urn[i]["xform"]),
// keepCurrentModels: true,
// globalOffset: {
// x: 0,
// y: 0,
// z: 0
// }
// });
// await viewer.waitForLoadDone(); //!<<< Wait for loading materials, properties and geometries for this model (URN)
// });
// }
//loadHeatmaps(viewer.getAllModels()[0]); //!<<< equals to viewer.model
});
}
function getAllLeafComponents(viewer, callback) {
var cbCount = 0;
var tree;
var jsData = []
function getLeafComponentsRec(current, parent) {
cbCount++;
if (tree.getChildCount(current) != 0) {
tree.enumNodeChildren(current, function (children) {
getLeafComponentsRec(children, current);
}, false);
}
var nodeName = viewer.model.getInstanceTree().getNodeName(current)
jsData.push({ id: current, parent: parent, text: nodeName })
if (--cbCount == 0) callback(jsData);
}
viewer.getObjectTree(function (objectTree) {
tree = objectTree;
var rootId = tree.getRootId()
var nodeName = viewer.model.getInstanceTree().getNodeName(rootId)
jsData.push({ id: rootId, parent: '#', text: nodeName })
var allLeafComponents = getLeafComponentsRec(rootId, '#');
});
}
function onDocumentLoadSuccess(doc) {
var viewables = doc.getRoot().getDefaultGeometry();
viewer.loadDocumentNode(doc, viewables).then(i => {
// documented loaded, any action?
});
viewer.addEventListener(Autodesk.Viewing.AGGREGATE_SELECTION_CHANGED_EVENT, (args) => {
var currSelection = viewer.getSelection();
var domElem = document.getElementById('id_printer');
domElem.innerText = currSelection[0];
});
viewer.addEventListener(Autodesk.Viewing.GEOMETRY_LOADED_EVENT, function () {
var instanceTree = viewer.model.getData().instanceTree;
var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
var domElem = document.getElementById('all_id');
domElem.innerText = allDbIdsStr;
let tree = viewer.model.getData().instanceTree;
let nodeId = 749;//10952;
let nodeId2 = 750;
let nodeId3 = 751;
tree.enumNodeFragments(nodeId, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
fragProxy.position = fragPosition
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
//------------ add -------------
tree.enumNodeFragments(nodeId2, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
fragProxy.position = fragPosition
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
tree.enumNodeFragments(nodeId3, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
fragProxy.position = fragPosition
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
});
NOP_VIEWER.getProperties(NOP_VIEWER.getSelection(), data => console.log(data));
}
function setElevatorFloor(floor) {
if (floor == 0)
targetFloorZ = 0;
else if (floor == 1)
targetFloorZ = 14.6;// 15;
else if (floor == 2)
targetFloorZ = 24.6;// 26;
else if (floor == 3)
targetFloorZ = 34.6;
else if (floor == 4)
targetFloorZ = 44.6;
else if (floor == 5)
targetFloorZ = 54.6;
else if (floor == 6)
targetFloorZ = 64.6;
else if (floor == 7)
targetFloorZ = 74.6;
else if (floor == 8)
targetFloorZ = 84.6;
else if (floor == 9)
targetFloorZ = 94.6;
else if (floor == 10)
targetFloorZ = 104.6;
else if (floor == 11)
targetFloorZ = 114.6;
else if (floor == 12)
targetFloorZ = 124.6;
else if (floor == -1)
targetFloorZ = -13;
}
function setElevatorSpeed(speed) { //0.01 ~ 1
elevatorSpeed = speed;
}
function movElevator() {
let tree = viewer.model.getData().instanceTree;
let nodeId = 749; //10952;
let nodeId2 = 750;
let nodeId3 = 751;
let fragProxyZ = 0;
var movStatus = 0; // 0=no 1=up 2=down
if (fragProxy.position.z > targetFloorZ) {
movStatus = 2
}
else if (fragProxy.position.z < targetFloorZ) {
movStatus = 1
}
if (movStatus == 0) {
return;
}
tree.enumNodeFragments(nodeId, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
//let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
if (movStatus == 2) {
fragProxy.position.z -= elevatorSpeed;
}
else if (movStatus == 1) {
fragProxy.position.z += elevatorSpeed;
}
fragProxyZ = fragProxy.position.z;
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
tree.enumNodeFragments(nodeId2, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
//let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
if (movStatus == 2) {
fragProxy.position.z -= elevatorSpeed;
}
else if (movStatus == 1) {
fragProxy.position.z += elevatorSpeed;
}
fragProxyZ = fragProxy.position.z;
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
tree.enumNodeFragments(nodeId3, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
//let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
if (movStatus == 2) {
fragProxy.position.z -= elevatorSpeed;
}
else if (movStatus == 1) {
fragProxy.position.z += elevatorSpeed;
}
fragProxyZ = fragProxy.position.z;
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
if (movStatus == 2) {
if (fragProxyZ >= targetFloorZ) {
requestAnimationFrame(movElevator);
}
}
else if (movStatus == 1) {
if (fragProxyZ <= targetFloorZ) {
requestAnimationFrame(movElevator);
}
}
//let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26
//fragProxy.position = fragPosition;
//fragProxy.updateAnimTransform();
//viewer.impl.sceneUpdated(true);
}
//function movElevator() {
// let tree = viewer.model.getData().instanceTree;
// let nodeId = 750;// 10952;
// let fragProxyZ = 0;
// var movStatus = 0; // 0=no 1=up 2=down
// if (fragProxy.position.z > targetFloorZ) {
// movStatus = 2
// }
// else if (fragProxy.position.z < targetFloorZ) {
// movStatus = 1
// }
// if (movStatus == 0) {
// return;
// }
// tree.enumNodeFragments(nodeId, function (frag) {
// fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
// fragProxy.getAnimTransform();
// //let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
// if (movStatus == 2) {
// fragProxy.position.z -= elevatorSpeed;
// }
// else if (movStatus == 1) {
// fragProxy.position.z += elevatorSpeed;
// }
// fragProxyZ = fragProxy.position.z;
// fragProxy.updateAnimTransform()
// });
// viewer.impl.sceneUpdated(true);
// if (movStatus == 2) {
// if (fragProxyZ >= targetFloorZ) {
// requestAnimationFrame(movElevator);
// }
// }
// else if (movStatus == 1) {
// if (fragProxyZ <= targetFloorZ) {
// requestAnimationFrame(movElevator);
// }
// }
// //let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26
// //fragProxy.position = fragPosition;
// //fragProxy.updateAnimTransform();
// //viewer.impl.sceneUpdated(true);
//}
function getAllDbIds(viewer) {
var instanceTree = viewer.model.getData().instanceTree;
var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
return allDbIdsStr.map(function (id) { return parseInt(id) });
}
/**
* Autodesk.Viewing.Document.load() failuire callback.
*/
function onDocumentLoadFailure(viewerErrorCode) {
console.error("onDocumentLoadFailure() - errorCode:" + viewerErrorCode);
}
function getForgeToken(callback) {
fetch(baseApiUrl + '/api/forge/oauth/token').then(res => {
res.json().then(data => {
callback(data.dictionary.access_token, data.dictionary.expires_in);
});
});
//callback("eyJhbGciOiJSUzI1NiIsImtpZCI6IlU3c0dGRldUTzlBekNhSzBqZURRM2dQZXBURVdWN2VhIn0.eyJzY29wZSI6WyJkYXRhOndyaXRlIiwiZGF0YTpyZWFkIiwiYnVja2V0OnJlYWQiLCJidWNrZXQ6dXBkYXRlIiwiYnVja2V0OmNyZWF0ZSJdLCJjbGllbnRfaWQiOiJUQTNocXNGZnpRYk5PVVhLcGxkS1VLU2V3NFNKMjF3NSIsImF1ZCI6Imh0dHBzOi8vYXV0b2Rlc2suY29tL2F1ZC9hand0ZXhwNjAiLCJqdGkiOiJiemxzWE5qWElvZ2R1UjUzTUJkdlhrTTNTT01qeVB1bHJrMmdTVWJudGNTeDg1b01kRG1xejg3Z05jenJkRzhpIiwiZXhwIjoxNjY4MTgzMDM2fQ.VU3qLwTJ9nlXnomKCdk4y5UcgszGEO_zlvE7w5mWWajeBMwKLo-zw7LJEqUEajRksvssppR9SbVsjLSx-vDVc3DRhCo3jYTWKPT1T3wQrlkOSqLeIrAdnKdBDNBWKgrGJt_xcmXc3dZ3XNKf9L_F6Ex808rUlo6cem1mcPpKl1jCBDqKu1mAX7aDtZ65TTQZbGGhbG4HdnET-d1i5w4LunGN11UAHhDUW3n0SWWIBL27PiiUQONZttajhD5st6IngYLcjr93BYVyJmDF7-wm4WZlHSw2OnXIfbJcFXEd83uVv_Rej4UXjzZ0e6kHwzc2nvGvKSIFu3Nt7CabdR8CkA", 3599);
}
async function loadHeatmaps(model) {
const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
// Given a model loaded from Forge
const structureInfo = new Autodesk.DataVisualization.Core.ModelStructureInfo(model);
const devices = [
{
id: "Oficina 6",
name: "Oficina-",
position: { x: 22.475382737884104, y: 7.4884431474006163, z: 3.0 },
sensorTypes: ["temperature", "humidity"]
}
];
var offset = Autodesk.viewer.model.getGlobalOffset();
removeOffset(devices[0], offset)
// Generates `SurfaceShadingData` after assigning each device to a room.
const shadingData = await Autodesk.structureInfo.generateSurfaceShadingData(devices);
// Use the resulting shading data to generate heatmap from.
await dataVizExtn.setupSurfaceShading(model, shadingData);
// Register color stops for the heatmap. Along with the normalized sensor value
// in the range of [0.0, 1.0], `renderSurfaceShading` will interpolate the final
// heatmap color based on these specified colors.
const sensorColors = [0x0000ff, 0x00ff00, 0xffff00, 0xff0000];
// Set heatmap colors for temperature
const sensorType = "temperature";
dataVizExtn.registerSurfaceShadingColors(sensorType, sensorColors);
// Function that provides sensor value in the range of [0.0, 1.0]
function getSensorValue(surfaceShadingPoint, sensorType) {
// The `SurfaceShadingPoint.id` property matches one of the identifiers passed
// to `generateSurfaceShadingData` function. In our case above, this will either
// be "cafeteria-entrace-01" or "cafeteria-exit-01".
const deviceId = surfaceShadingPoint.id;
// Read the sensor data, along with its possible value range
let sensorValue = readSensorValue(deviceId, sensorType);
const maxSensorValue = getMaxSensorValue(sensorType);
const minSensorValue = getMinSensorValue(sensorType);
// Normalize sensor value to [0, 1.0]
sensorValue = (sensorValue - minSensorValue) / (maxSensorValue - minSensorValue);
return clamp(sensorValue, 0.0, 1.0);
}
// This value can also be a room instead of a floor
const floorName = "01 - Entry Level";
dataVizExtn.renderSurfaceShading(floorName, sensorType, getSensorValue);
}

195
Frontend/js/n4js/bajatest.js
View File

@ -1,4 +1,5 @@
let baja_subscribe_device_callback_func; //設定BQL訂閱之後要回傳的Function let baja_subscribe_device_callback_func; //設定BQL訂閱之後要回傳的Function
let baja_subscribe_end_device_callback_func; //設定BQL訂閱結束之後要回傳的Function
let baja_my_user_account_func; //取得帳號資料要回傳的Function let baja_my_user_account_func; //取得帳號資料要回傳的Function
var ordPath; //當前點選選單的tag，用來抓出設備路徑，例如:旅館棟->H，消防偵煙器->F3 var ordPath; //當前點選選單的tag，用來抓出設備路徑，例如:旅館棟->H，消防偵煙器->F3
window.tolSubList = []; window.tolSubList = [];
@ -16,15 +17,24 @@ function subscriptionDevices() {
baja_subscribe_device_callback_func = callBackFunc; baja_subscribe_device_callback_func = callBackFunc;
} }
} }
// BQL訂閱結束回傳的Function
this.setSubscribeDeviceEndCallBack = function (callBackFunc) {
if (callBackFunc != undefined && callBackFunc != null) {
baja_subscribe_end_device_callback_func = callBackFunc;
}
}
} }
function MyBaja() { function MyBaja() {
// 取得使用者帳號 // 取得使用者帳號
this.setMyUserAccount = function (callBackFunc) { this.setMyUserAccount = function (callBackFunc = null) {
if (callBackFunc != undefined && callBackFunc != null) { require(['baja!'], function (baja) {
baja_my_user_account_func = callBackFunc; console.log("baja", baja)
} user_name = baja.getUserName();
callBackFunc ? callBackFunc(user_name) : "";
});
}; };
} }
@ -64,6 +74,7 @@ function BajaSubscribeDevicesByBql() {
var modify_target_device = { var modify_target_device = {
"device_number": target_device_number ? target_device_number : null, "device_number": target_device_number ? target_device_number : null,
"device_number_full": this.$parent.getSlotPath().$names.join("_"),
"point_name": point_name ? point_name : null, "point_name": point_name ? point_name : null,
"value": key "value": key
} }
@ -88,13 +99,14 @@ function BajaSubscribeDevicesByBql() {
var subStart, subFinish; var subStart, subFinish;
var component_index = 0; var component_index = 0;
var total_component_index = 0; var total_component_index = 0;
var totalTargetDevice = [];
var readBqlFinish = new Date(Date.now()); var readBqlFinish = new Date(Date.now());
// $("#readPath-finish-timestamp").html(readBqlFinish.toISOString()); // $("#readPath-finish-timestamp").html(readBqlFinish.toISOString());
// $("#readPath-finish-time").html((readBqlFinish.getTime() - init_start.getTime()) / 1000 + "sec"); // $("#readPath-finish-time").html((readBqlFinish.getTime() - init_start.getTime()) / 1000 + "sec");
console.log("讀取路徑完成-花費時間", (readBqlFinish.getTime() - init_start.getTime()) / 1000 + "sec"); console.log("讀取路徑完成-花費時間", (readBqlFinish.getTime() - init_start.getTime()) / 1000 + "sec");
table.cursor({ table.cursor({
before: function () { before: function () {
totalTargetDevice = [];
tableStart = new Date(Date.now()); tableStart = new Date(Date.now());
$("#table-start-timestamp").html(tableStart.toISOString()); $("#table-start-timestamp").html(tableStart.toISOString());
render_start = new Date(Date.now()); render_start = new Date(Date.now());
@ -107,6 +119,7 @@ function BajaSubscribeDevicesByBql() {
$("#sub-number").html(index + 1); $("#sub-number").html(index + 1);
total_component_index = index; total_component_index = index;
var target_device_number_split = this.getDisplay("slotPath").split('/'); var target_device_number_split = this.getDisplay("slotPath").split('/');
var target_device_number = target_device_number_split[target_device_number_split.length - 2]; var target_device_number = target_device_number_split[target_device_number_split.length - 2];
@ -122,7 +135,7 @@ function BajaSubscribeDevicesByBql() {
}); });
facets = facets_arr.reduce((obj, cur) => ({ ...obj, [cur[0]]: cur[1] }), {}) facets = facets_arr.reduce((obj, cur) => ({ ...obj, [cur[0]]: cur[1] }), {})
var point_out_split = this.getDisplay("out").split(' '); var point_out_split = this.getDisplay("out").split(' ');
let key = Object.keys(facets).find(k => facets[k] === point_out_split[0]); let key = Object.keys(facets).find(k => facets[k] === point_out_split[0]);
@ -133,10 +146,11 @@ function BajaSubscribeDevicesByBql() {
var modify_target_device = { var modify_target_device = {
"device_number": target_device_number ? target_device_number : null, "device_number": target_device_number ? target_device_number : null,
"device_number_full": this.getDisplay("slotPath").split("slot:")[1].split('/').slice(1,-1).join("_"),
"point_name": point_name ? point_name : null, "point_name": point_name ? point_name : null,
"value": key "value": key
} }
totalTargetDevice.push(modify_target_device);
//取得component當下就更新設備點位 //取得component當下就更新設備點位
if (baja_subscribe_device_callback_func != undefined && baja_subscribe_device_callback_func != null) { if (baja_subscribe_device_callback_func != undefined && baja_subscribe_device_callback_func != null) {
baja_subscribe_device_callback_func(modify_target_device); baja_subscribe_device_callback_func(modify_target_device);
@ -197,6 +211,10 @@ function BajaSubscribeDevicesByBql() {
tableFinish = new Date(Date.now()); tableFinish = new Date(Date.now());
// $("#table-finish-timestamp").html(tableFinish.toISOString()); // $("#table-finish-timestamp").html(tableFinish.toISOString());
// $("#table-time").html((tableFinish.getTime() - tableStart.getTime()) / 1000 + "sec"); // $("#table-time").html((tableFinish.getTime() - tableStart.getTime()) / 1000 + "sec");
//取得component當下就更新設備點位
if (baja_subscribe_end_device_callback_func != undefined && baja_subscribe_end_device_callback_func != null) {
baja_subscribe_end_device_callback_func(totalTargetDevice);
}
console.log("表格完成時間", (tableFinish.getTime() - tableStart.getTime()) / 1000 + "sec"); console.log("表格完成時間", (tableFinish.getTime() - tableStart.getTime()) / 1000 + "sec");
}, },
limit: -1, limit: -1,
@ -283,12 +301,7 @@ function getElevatorInfoByBaja(path, callback) {
}); });
} }
require(['baja!'], function (baja) {
user_name = baja.getUserName();
if (baja_my_user_account_func != undefined && baja_my_user_account_func != null) {
baja_my_user_account_func(user_name);
}
});
// baja.Ord.make('ip:greencloud.fic.com.tw|foxs:|station:|slot:/Arena/H/F3|bql:select name, displayname, slotPath, out.value, out from control:ControlPoint') // baja.Ord.make('ip:greencloud.fic.com.tw|foxs:|station:|slot:/Arena/H/F3|bql:select name, displayname, slotPath, out.value, out from control:ControlPoint')
// // baja.Ord.make('ip:greencloud.fic.com.tw|foxs:|station:|slot:/Arena/H/E1/B1F/TestData/H_E1_B1F_TestData_Data|bql:select slotPath,out.value from control:NumericWritable') // // baja.Ord.make('ip:greencloud.fic.com.tw|foxs:|station:|slot:/Arena/H/E1/B1F/TestData/H_E1_B1F_TestData_Data|bql:select slotPath,out.value from control:NumericWritable')
@ -346,3 +359,159 @@ require(['baja!'], function (baja) {
// }) // })
//測試
/**
* 取得電表即時資料 by baja
* @param {any} devicePath
* @param {any} callback
*/
function getElectricMeterNoweDataByBaja(devicePath, callback) {
var _result = "";
var _ss = "";
var _index = 0;
require(['baja!'], function (baja) {//TPE/B1/EE/E4/R2F/NA/WHT/N1
console.log('local:|foxs:|station:|slot:/' + devicePath + '|bql:select name, out, out.value from control:ControlPoint');
//baja.Ord.make('local:|foxs:|station:|slot:/' + devicePath + '|bql:select name, out, out.value from control:ControlPoint').get()
baja.Ord.make('local:|foxs:|station:|slot:/TPE/B1/EE/E4/R2F/NA/WHT/N1|bql:select name, out, out.value from control:ControlPoint').get()
.then(function (table) {
return table.cursor({
each: function (record) {
if (_index == 0)
_ss += '{"name":"' + record.get('name') + '", "value":' + record.get('out').get('value') + '"}';
else
_ss += ',{"name":"' + record.get('name') + '", "value":' + record.get('out').get('value') + '"}';
_index++;
},
after: function () {
_result += '{' + '"count": ' + _index + ', "data":[';
_result += _ss;
_result += ']}';
if (typeof callback === 'function') {
callback(_result);
}
},
limit: -1,
offset: 0
});
});
});
}
/**
* 取得電表 單日kwh by baja
* @param {any} devicePath
* @param {any} date_millisecond
* @param {any} callback
*/
function getElectricMeterOneDayKwhByBaja(devicePath, date_millisecond, callback) {
var _result = "";
var _ss = "";
var _index = 0;
require(['baja!'], function (baja) {//TPE/B1/EE/E4/R2F/NA/WHT/N1
console.log('transform:slot:/' + devicePath + '/History/TR_Month|bql: select * where timestamp.millis = ' + date_millisecond);
baja.Ord.make('transform:slot:/TPE/B1/EE/E4/R2F/NA/WHT/N1/History/TR_Month|bql: select * where timestamp.millis <= 1667404799000').get()
.then(function (table) {
return table.cursor({
each: function (record) {
if (_index == 0) {
//_ss += '{"timestamp":"' + record.get('timestamp') + '", "kwh1":' + record.get('kwh1') + '"}';
_ss += '{"timestamp":"' + record.get('timestamp') + '"}';
}
else {
//_ss += ',{"timestamp":"' + record.get('timestamp') + '", "kwh1":' + record.get('kwh1') + '"}';
_ss += ',{"timestamp":"' + record.get('timestamp') + '"}';
}
_index++;
},
after: function () {
_result += '{' + '"count": ' + _index + ', "data":[';
_result += _ss;
_result += ']}';
if (typeof callback === 'function') {
callback(_result);
}
},
limit: -1,
offset: 0
});
});
});
}
/**
* 取得電表每小時資料 by baja
* @param {any} devicePath
* @param {any} startDate_millisecond
* @param {any} endDate_millisecond
* @param {any} callback
*/
function getElectricMeterHourDataByBaja(devicePath, startDate_millisecond, endDate_millisecond, callback) {
var _result = "";
var _ss = "";
var _index = 0;
require(['baja!'], function (baja) {//TPE/B1/EE/E4/R2F/NA/WHT/N1
console.log('transform:slot:/' + devicePath + '/History/TR_Daily|bql: select * where timestamp.millis > ' + startDate_millisecond + ' and timestamp.millis < ' + endDate_millisecond);
baja.Ord.make('transform:slot:/TPE/B1/EE/E4/R2F/NA/WHT/N1/History/TR_Daily|bql: select timestamp, kwh1 where timestamp.millis >= 1667232000000 and timestamp.millis <= 1667404799000').get()
.then(function (table) {
return table.cursor({
each: function (record) {
if (_index == 0)
_ss += '{"kwh1":' + record.get('kwh1') + ', "timestamp":"' + record.get('timestamp') + '"}';
else
_ss += ',{"kwh1":' + record.get('kwh1') + ', "timestamp":"' + record.get('timestamp') + '"}';
_index++;
},
after: function () {
_result += '{' + '"count": ' + _index + ', "data":[';
_result += _ss;
_result += ']}';
if (typeof callback === 'function') {
callback(_result);
}
},
limit: -1,
offset: 0
});
});
});
}
/**
* 在單一系統下，取得各個系統的狀態 異常與否
* @param {any} systemPath
* @param {any} callback
*/
function getOneSystemStateByBaja(systemPath, callback) {
var _result = "";
var _ss = "";
var _index = 0;
require(['baja!'], function (baja) {
baja.Ord.make("local:|foxs:|alarm:|bql:select top 1 alarmData, alarmData.sourceName, sourceState where alarmData.sourceName like '%" + systemPath + "%' order by timestamp desc").get()
.then(function (table) {
return table.cursor({
each: function (record) {
//if (_index == 0)
// _ss += '{"sourceState":"' + record.get('sourceState') + '"}';
//else
// _ss += '{"sourceState":"' + record.get('sourceState') + '"}';
_ss += '{"sourceState":"' + record.get('sourceState') + '"}';
_index++;
},
after: function () {
_result += '{' + '"count": ' + _index + ', "data":[';
_result += _ss;
_result += ']}';
if (typeof callback === 'function') {
callback(_result);
}
},
limit: -1,
offset: 0
});
});
});
}

194
Frontend/js/n4js/electricmeterbaja.js
View File

@ -73,44 +73,44 @@ function getElectricMeterNoweDataByBaja(devicePath, callback) {
}); });
} }
/** ///**
* 取得電表每小時資料 by baja // * 取得電表每小時資料 by baja
* @param {any} devicePath // * @param {any} devicePath
* @param {any} startDate_millisecond // * @param {any} startDate_millisecond
* @param {any} endDate_millisecond // * @param {any} endDate_millisecond
* @param {any} callback // * @param {any} callback
*/ // */
function getElectricMeterHourDataByBaja(devicePath, startDate_millisecond, endDate_millisecond, callback) { //function getElectricMeterHourDataByBaja(devicePath, startDate_millisecond, endDate_millisecond, callback) {
var _result = ""; // var _result = "";
var _ss = ""; // var _ss = "";
var _index = 0; // var _index = 0;
require(['baja!'], function (baja) {//TPE/B1/EE/E4/R2F/NA/WHT/N1 // require(['baja!'], function (baja) {//TPE/B1/EE/E4/R2F/NA/WHT/N1
console.log('transform:slot:/' + devicePath + '/History/TR_Daily|bql: select * where timestamp.millis > ' + startDate_millisecond + ' and timestamp.millis < ' + endDate_millisecond); // console.log('transform:slot:/' + devicePath + '/History/TR_Daily|bql: select * where timestamp.millis > ' + startDate_millisecond + ' and timestamp.millis < ' + endDate_millisecond);
baja.Ord.make('transform:slot:/' + devicePath + '/History/TR_Daily|bql: select * where timestamp.millis > ' + startDate_millisecond + ' and timestamp.millis < ' + endDate_millisecond).get() // baja.Ord.make('transform:slot:/' + devicePath + '/History/TR_Daily|bql: select * where timestamp.millis > ' + startDate_millisecond + ' and timestamp.millis < ' + endDate_millisecond).get()
.then(function (table) { // .then(function (table) {
return table.cursor({ // return table.cursor({
each: function (record) { // each: function (record) {
if (_index == 0) // if (_index == 0)
_ss += '{"timestamp":' + record.get('timestamp') + ', "value":"' + record.get('kwh1') + '"}'; // _ss += '{"timestamp":' + record.get('timestamp') + ', "value":"' + record.get('kwh1') + '"}';
else // else
_ss += ',{"timestamp":' + record.get('timestamp') + ', "value":"' + record.get('kwh1') + '"}'; // _ss += ',{"timestamp":' + record.get('timestamp') + ', "value":"' + record.get('kwh1') + '"}';
_index++; // _index++;
}, // },
after: function () { // after: function () {
_result += '{' + '"count": ' + _index + ', "data":['; // _result += '{' + '"count": ' + _index + ', "data":[';
_result += _ss; // _result += _ss;
_result += ']}'; // _result += ']}';
if (typeof callback === 'function') { // if (typeof callback === 'function') {
callback(_result); // callback(_result);
} // }
}, // },
limit: -1, // limit: -1,
offset: 0 // offset: 0
}); // });
}); // });
}); // });
} //}
/** /**
* 取得電表 單日kwh by baja * 取得電表 單日kwh by baja
@ -187,4 +187,124 @@ function getElectricMeterWeekDataByBaja(devicePath, startDate_millisecond, endDa
}); });
}); });
}); });
}
/**
* 取得電表 期間內的平均用電量(kwh)資料 by baja
* @param {any} devicePath
* @param {any} company
* @param {any} startDate_millisecond
* @param {any} endDate_millisecond
* @param {any} callback
*/
function getElectricMeterKwhAvgDataByBaja(devicePath, company, startDate_millisecond, endDate_millisecond, callback) {
var _result = "";
var _ss = "";
var _index = 0;
require(['baja!'], function (baja) {//TPE_B1_EE_E4_R2F_NA_WHT_N1_KWH
console.log('transform:slot:/' + devicePath + '/History/TR_Daily|bql: select * where timestamp.millis > ' + startDate_millisecond + ' and timestamp.millis < ' + endDate_millisecond);
baja.Ord.make('local:|foxs:|history:/' + company + '/' + devicePath + '|bql:select AVG(value) from control:ControlPoint where timestamp.millis >= ' + startDate_millisecond + ' and timestamp.millis <= ' + endDate_millisecond).get()
.then(function (table) {
return table.cursor({
each: function (record) {
if (_index == 0)
_ss += '{"value":' + record.get('AVG$28value$29') + '"}';
else
_ss += ',{"value":' + record.get('AVG$28value$29') + '"}';
_index++;
},
after: function () {
_result += '{' + '"count": ' + _index + ', "data":[';
_result += _ss;
_result += ']}';
if (typeof callback === 'function') {
callback(_result);
}
},
limit: -1,
offset: 0
});
});
});
}
/**
* 取得點位 每小時資料 by baja
* @param {any} devicePath
* @param {any} company
* @param {any} startDateTime
* @param {any} endDateTime
* @param {any} callback
*/
function getElectricMeterHourDataByBaja(devicePath, company, startDateTime, endDateTime, callback) {
var _result = "";
var _ss = "";
var _index = 0;
require(['baja!'], function (baja) {//TPE_B1_EE_E4_R2F_NA_WHT_N1_KWH
console.log("local:|foxs:|history:/" + company + "/" + devicePath + "?peroid=timerange;start=" + startDateTime + ".000+08:00;end=" + endDateTime + ".000+08:00;|bql:history:HistoryRollup.rollup(baja:RelTime '3600000')");
baja.Ord.make("local:|foxs:|history:/" + company + "/" + devicePath + "?peroid=timerange;start=" + startDateTime + ".000+08:00;end=" + endDateTime + ".000+08:00;|bql:history:HistoryRollup.rollup(baja:RelTime '3600000')").get()
.then(function (table) {
return table.cursor({
each: function (record) {
if (_index == 0)
_ss += '{"timestamp":' + record.get('timestamp') + ', "endTimestamp":"' + record.get('endTimestamp') + ', "min":"' + record.get('min') + ', "max":"' + record.get('max') + ', "avg":"' + record.get('avg') + ', "sum":"' + record.get('sum') + '"}';
else
_ss += ',{"timestamp":' + record.get('timestamp') + ', "endTimestamp":"' + record.get('endTimestamp') + ', "min":"' + record.get('min') + ', "max":"' + record.get('max') + ', "avg":"' + record.get('avg') + ', "sum":"' + record.get('sum') + '"}';
_index++;
},
after: function () {
_result += '{' + '"count": ' + _index + ', "data":[';
_result += _ss;
_result += ']}';
if (typeof callback === 'function') {
callback(_result);
}
},
limit: -1,
offset: 0
});
});
});
}
/**
* 取得點位 每日資料 by baja
* @param {any} devicePath
* @param {any} company
* @param {any} startDateTime
* @param {any} endDateTime
* @param {any} callback
*/
function getElectricMeterDayDataByBaja(devicePath, company, startDateTime, endDateTime, callback) {
var _result = "";
var _ss = "";
var _index = 0;
require(['baja!'], function (baja) {//TPE_B1_EE_E4_R2F_NA_WHT_N1_KWH
console.log("local:|foxs:|history:/" + company + "/" + devicePath + "?peroid=timerange;start=" + startDateTime + ".000+08:00;end=" + endDateTime + ".000+08:00;|bql:history:HistoryRollup.rollup(baja:RelTime '86400000')");
baja.Ord.make("local:|foxs:|history:/" + company + "/" + devicePath + "?peroid=timerange;start=" + startDateTime + ".000+08:00;end=" + endDateTime + ".000+08:00;|bql:history:HistoryRollup.rollup(baja:RelTime '86400000')").get()
.then(function (table) {
return table.cursor({
each: function (record) {
if (_index == 0)
_ss += '{"timestamp":' + record.get('timestamp') + ', "endTimestamp":"' + record.get('endTimestamp') + ', "min":"' + record.get('min') + ', "max":"' + record.get('max') + ', "avg":"' + record.get('avg') + ', "sum":"' + record.get('sum') + '"}';
else
_ss += ',{"timestamp":' + record.get('timestamp') + ', "endTimestamp":"' + record.get('endTimestamp') + ', "min":"' + record.get('min') + ', "max":"' + record.get('max') + ', "avg":"' + record.get('avg') + ', "sum":"' + record.get('sum') + '"}';
_index++;
},
after: function () {
_result += '{' + '"count": ' + _index + ', "data":[';
_result += _ss;
_result += ']}';
if (typeof callback === 'function') {
callback(_result);
}
},
limit: -1,
offset: 0
});
});
});
} }

96
Frontend/js/site.js
View File

@ -19,9 +19,66 @@ $.fn.outerHtml = function () {
return $(this).prop("outerHTML"); return $(this).prop("outerHTML");
} }
/**
* fn 定義 | Loading 操作
* @param {any} type - close / start / exceed , exceed => 繼續執行並可切換文字
* @param {any} text - 右下角 Alert 文字
*/
$.fn.Loading = function (type = "close",text) {
let ele = this;
let aleObj = $(this)[0]._aleObj;
function closeLoading() {
$("body").css("overflow", "auto");
$(aleObj.ele).YTAlert().hide();
$(ele).animate({ opacity: 0 }, 300, () => {
$(ele).hide();
})
}
function showLoading() {
$("body").css("overflow", "hidden");
let aleObj = YT.Alert.Tip(text || "讀取中，請稍後", "show");
$(ele)[0]._aleObj = aleObj;
$(ele).show();
$(ele).animate({ opacity: 1 }, 300);
$(aleObj.ele).YTAlert().text(text);
}
if (type == "close") {
closeLoading();
} else if (type == "exceed") {
$(aleObj.ele).YTAlert().text(text);
} else if (type == "start") {
showLoading();
}
return $(this);
}
$.fn.YTAlert = function () {
let th = { element: this };
th.hide = function (delay = 0) {
let obj = this;
setTimeout(function () {
$(obj.element).fadeOut(300);
alertIdArray.splice($.inArray($(obj.element).prop("id"), alertIdArray), 1);
setTimeout(function () {
$(obj.element).remove();
}, 1000);
}, delay);
}
th.text = function (text) {
let obj = this;
let id = $(obj.element).prop("id").split("tip-alert-")[1];
$(`#alert-text-${id}`).text(text);
}
return th;
}
/** /**
* 設置 bootstrap dropdown 為下拉選單 * 設置 bootstrap dropdown 為下拉選單
* @param {any} menuEle .dropdown-menu element * @param {any} menuEle - .dropdown-menu element
*/ */
function setDropdownItem(menuEle) { function setDropdownItem(menuEle) {
if ($(menuEle).find(".dropdown-item.active").length == 0) { if ($(menuEle).find(".dropdown-item.active").length == 0) {
@ -52,6 +109,11 @@ function defDev(obj) {
obj.src = defSrc; obj.src = defSrc;
} }
/**
* jquery datatable - ajax send data reset
* @param {any} table
* @param {any} sendData
*/
function dtAjaxResetSendData(table,sendData) { function dtAjaxResetSendData(table,sendData) {
table.context[0].ajax.data = function (d) { table.context[0].ajax.data = function (d) {
d = sendData; d = sendData;
@ -59,6 +121,7 @@ function dtAjaxResetSendData(table,sendData) {
} }
} }
/** /**
* element 建造 * element 建造
* @param {any} text * @param {any} text
@ -108,6 +171,9 @@ function creOption(text = null, value = null, data = {}, attr = {}, cls = [], na
return creEle("option", text, id, name, cls, data, attr); return creEle("option", text, id, name, cls, data, attr);
} }
/**
* 根據該棟建築底下的'所有'電梯執行緒物件
* */
class ElevatorHandler { class ElevatorHandler {
constructor(ele, option = {}) { constructor(ele, option = {}) {
this.ele = ele; this.ele = ele;
@ -124,9 +190,11 @@ class ElevatorHandler {
this.init(); this.init();
} }
// 所有電梯初始化
init = function () { init = function () {
this.setTabWra(); this.setTabWra();
this.setTabFloor(); this.setTabFloor();
// 若已有每個設備的所在樓層，則預設到該樓層位置
if (Object.keys(this.curElevFloor).length != 0) { if (Object.keys(this.curElevFloor).length != 0) {
$.each(Object.keys(this.curElevFloor), (idx, elevKey) => { $.each(Object.keys(this.curElevFloor), (idx, elevKey) => {
this.setElevFloor(elevKey,this.curElevFloor[elevKey]); this.setElevFloor(elevKey,this.curElevFloor[elevKey]);
@ -158,16 +226,16 @@ class ElevatorHandler {
for (let e = 1; e <= _elevators.length + 2; e++) { for (let e = 1; e <= _elevators.length + 2; e++) {
let th = creEle("th"); let th = creEle("th");
th.css({ "width": `${_w}px`, "height": `${_h}px` }); th.css({ "width": `${_w}px`, "height": `${_h}px` ,"position":"relative"});
if (e != 1 && e != _elevators.length + 2) { if (e != 1 && e != _elevators.length + 2) {
let elevId = _elevators[e - 2]?.id; let elevId = _elevators[e - 2]?.id;
// 電梯方框 // 電梯方框
let span = creEle("span", null, "elevator-item-" + (elevId), null, ["elevator-item"]); let span = creEle("span", null, "elevator-item-" + (elevId), null, ["elevator-item"]);
let spanUp = creEle("span", null, null, null, ["elevator-item-toup"]); let spanUp = creEle("span", null, null, null, ["elevator-item-toup"]);
let spanDown = creEle("span", null, null, null, ["elevator-item-todown"]); let spanDown = creEle("span", null, null, null, ["elevator-item-todown"]);
span.css({ "width": `${_w - 3}px`, "height": `${_h - 3}px`, "top": `1.5px`, "transition":`transform ${1 / this.speed}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`}) span.css({ "width": `${_w - 3}px`, "height": `${_h - 3}px`, "top": `1.5px`,"left":"1.5px", "transition":`transform ${1 / this.speed}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`})
spanUp.css({ "width": `${_w - 3}px`, "height": `${(_h - 3) / 2}px`, "top": `1.5px`, "transition":`transform ${1 / this.speed}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`}) spanUp.css({ "width": `${_w - 3}px`, "height": `${(_h - 3) / 2}px`, "top": `1.5px`, "left": "1.5px", "transition":`transform ${1 / this.speed}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`})
spanDown.css({ "width": `${_w - 3}px`, "height": `${(_h - 3) / 2}px`, "top": `1.5px`, "transition":`transform ${1 / this.speed}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`,"top":`${1.5 + (_h-3) / 2}px`}) spanDown.css({ "width": `${_w - 3}px`, "height": `${(_h - 3) / 2}px`, "top": `1.5px`, "left": "1.5px", "transition":`transform ${1 / this.speed}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`,"top":`${1.5 + (_h-3) / 2}px`})
th.append(spanUp); th.append(spanUp);
th.append(span); th.append(span);
th.append(spanDown); th.append(spanDown);
@ -221,26 +289,18 @@ class ElevatorHandler {
} }
// 設置某個電梯到某個樓層
setElevFloor = function (elevId, floId) { setElevFloor = function (elevId, floId) {
let curFloId = this.curElevFloor[elevId]; let curFloId = this.curElevFloor[elevId];
let curSort = this.floors.filter(x => x.id == curFloId).map(x => x.sort)[0]; let curSort = this.floors.filter(x => x.id == curFloId).map(x => x.sort)[0];
let tarSort = this.floors.filter(x => x.id == floId).map(x => x.sort)[0]; let tarSort = this.floors.filter(x => x.id == floId).map(x => x.sort)[0];
let gapFloor = tarSort - curSort; let gapFloor = tarSort - curSort;
let cssEle = [$(`#elevator-item-${elevId}`)[0], $(`#elevator-item-${elevId}`).prev("span.elevator-item-toup")[0], $(`#elevator-item-${elevId}`).next("span.elevator-item-todown")[0]] let cssEle = [$(`#elevator-item-${elevId}`)[0], $(`#elevator-item-${elevId}`).prev("span.elevator-item-toup")[0], $(`#elevator-item-${elevId}`).next("span.elevator-item-todown")[0]]
clearTimeout(this.setTimeout);
console.log("123",this.movStatus)
if (this.movStatus[elevId] != 0) { if (this.movStatus[elevId] != 0) {
$(cssEle).css("transition", `transform ${1 / this.speed * Math.abs(gapFloor)}s cubic-bezier(0, 0, 0.62, 1) 0s`); $(cssEle).css("transition", `transform ${1 / this.speed * Math.abs(gapFloor)}s cubic-bezier(0, 0, 0.62, 1) 0s`);
} }
//if (gapFloor < 0) { clearTimeout(this.setTimeout);
// this.movStatus[elevId] = 2;
//} else if (gapFloor > 0) {
// this.movStatus[elevId] = 1;
//} else {
// this.movStatus[elevId] = 0;
//}
this.setTimeout = setTimeout(() => { this.setTimeout = setTimeout(() => {
/*this.movStatus[elevId] = 0;*/
$(cssEle).css("transition", `transform ${1 / this.speed * Math.abs(gapFloor)}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`); $(cssEle).css("transition", `transform ${1 / this.speed * Math.abs(gapFloor)}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`);
this.setEleUpDownStyle(elevId); this.setEleUpDownStyle(elevId);
}, (1 / this.speed * Math.abs(gapFloor)) * 1000) }, (1 / this.speed * Math.abs(gapFloor)) * 1000)
@ -250,15 +310,19 @@ class ElevatorHandler {
$(cssEle).css("transform", `translateY(${this.floorHeight * (this.floors.length - tarSort)}px)`); $(cssEle).css("transform", `translateY(${this.floorHeight * (this.floors.length - tarSort)}px)`);
} }
// 設定現在電梯狀態 (往上/往下/停止)
setEleMovStatus = function (elevId,status) { setEleMovStatus = function (elevId,status) {
this.movStatus[elevId] = status; this.movStatus[elevId] = status;
} }
// 電梯方框 往上或往下閃爍
setEleUpDownStyle = function (elevId) { setEleUpDownStyle = function (elevId) {
if (this.movStatus[elevId] == 1) { if (this.movStatus[elevId] == 1) {
$(`#elevator-item-${elevId}`).next("span.elevator-item-todown").removeClass("light-flash-c-bd")
$(`#elevator-item-${elevId}`).prev("span.elevator-item-toup").addClass("light-flash-c-bd") $(`#elevator-item-${elevId}`).prev("span.elevator-item-toup").addClass("light-flash-c-bd")
.css("--flash-color-1", "#44ea8e").css("--flash-color-2", "rgba(255,255,255,0)"); .css("--flash-color-1", "#44ea8e").css("--flash-color-2", "rgba(255,255,255,0)");
} else if (this.movStatus[elevId] == 2) { } else if (this.movStatus[elevId] == 2) {
$(`#elevator-item-${elevId}`).prev("span.elevator-item-toup").removeClass("light-flash-c-bd")
$(`#elevator-item-${elevId}`).next("span.elevator-item-todown").addClass("light-flash-c-bd") $(`#elevator-item-${elevId}`).next("span.elevator-item-todown").addClass("light-flash-c-bd")
.css("--flash-color-1", "#44ea8e").css("--flash-color-2", "rgba(255,255,255,0)"); .css("--flash-color-1", "#44ea8e").css("--flash-color-2", "rgba(255,255,255,0)");
} else { } else {
@ -267,10 +331,12 @@ class ElevatorHandler {
} }
} }
// 設定現在某個電梯所在樓層
setCurElevFloor = function (elevId,floId) { setCurElevFloor = function (elevId,floId) {
this.curElevFloor[elevId] = floId; this.curElevFloor[elevId] = floId;
} }
// 重新繪製
redraw = function () { redraw = function () {
$(this.ele).empty(); $(this.ele).empty();
this.setTabFloor(); this.setTabFloor();

120
Frontend/js/yourteam/plugins/yt-alert/ytpop-alert.js Normal file
View File

@ -0,0 +1,120 @@

alertIdArray = [];
window.YT = typeof YT == "undefined" ? {} : YT;
window.YT.Alert = { Success: null, Error: null, Tip: null };
YT.Alert.Success = function (text) {
let ranId = Math.floor(Math.random() * 100000);
$("body").append(`<div id='success-alert-${ranId}' class='alert alert-dismissible yt-alert shadow-lg fade show' role = 'alert' style='display:none;'>
<span class="material-icons fs-3">check_circle</span><strong>${text}</strong></div>`)
//紀錄上一筆出現的alert
alertIdArray.push("success-alert-" + ranId)
alertIdArray.length > 2 ? alertIdArray.shift() : ""
$("#success-alert-" + ranId).fadeIn(300);
//判斷上一筆是否還存在頁面中
if (typeof ($("#" + alertIdArray[0]).css("bottom")) != "undefined" && $("#" + alertIdArray[0]).css("display") != "none" && (alertIdArray[1] != "" || alertIdArray[1] != null)) {
//存在的話下一個alert出現在前一個alert上面
let newAlertWidth = parseInt($("#" + alertIdArray[0]).css("bottom").split('px')[0]) + parseInt($("#" + alertIdArray[0]).css("height")) + 10 + "px"
$("#" + alertIdArray[1]).css("bottom", newAlertWidth);
}
$("#success-alert-" + ranId).click(function () {
$("#success-alert-" + ranId).fadeOut(300);
})
setTimeout(function () { $("#success-alert-" + ranId).fadeOut(300); }, 6000);
setTimeout(function () {
$("#success-alert-" + ranId).remove();
alertIdArray.splice($.inArray("#success-alert-" + ranId, alertIdArray), 1);
}, 7000);
}
YT.Alert.Error = function (text) {
let ranId = Math.floor(Math.random() * 100000);
$("body").append(`<div id='danger-alert-${ranId}' class='alert alert-dismissible yt-alert shadow-lg fade show' role = 'alert' style='display:none;'>
<span class="material-icons fs-3">error</span><strong>${text}</strong></div>`)
alertIdArray.push("danger-alert-" + ranId);
alertIdArray.length > 2 ? alertIdArray.shift() : ""
$("#danger-alert-" + ranId).fadeIn(300);
if (typeof ($("#" + alertIdArray[0]).css("bottom")) != "undefined" && $("#" + alertIdArray[0]).css("display") != "none" && (alertIdArray[1] != "" || alertIdArray[1] != null)) {
let newAlertWidth = parseInt($("#" + alertIdArray[0]).css("bottom").split('px')[0]) + parseInt($("#" + alertIdArray[0]).css("height")) + 10 + "px"
$("#" + alertIdArray[1]).css("bottom", newAlertWidth);
}
$("#danger-alert-" + ranId).click(function () {
$("#danger-alert-" + ranId).fadeOut(300);
})
setTimeout(function () {
$("#danger-alert-" + ranId).fadeOut(300);
alertIdArray.splice($.inArray("#danger-alert-" + ranId, alertIdArray), 1);
}, 6000);
setTimeout(function () { $("#danger-alert-" + ranId).remove(); }, 7000);
}
YT.Alert.Tip = function (text, type = null, color = null) {
let ranId = Math.floor(Math.random() * 100000);
$("body").append(`<div id='tip-alert-${ranId}' class='alert alert-dismissible yt-alert shadow-lg fade show' role = 'alert' style='display:none;'>
<span class="material-icons fs-3">error</span><strong id="alert-text-${ranId}">${text}</strong></div>`)
alertIdArray.push("tip-alert-" + ranId);
alertIdArray.length > 2 ? alertIdArray.shift() : ""
if (color != null) {
$("#tip-alert-" + ranId).css("background-color", color);
}
if (type == null) {
$("#tip-alert-" + ranId).fadeIn(300);
if (typeof ($("#" + alertIdArray[0]).css("bottom")) != "undefined" && $("#" + alertIdArray[0]).css("display") != "none" && (alertIdArray[1] != "" || alertIdArray[1] != null)) {
let newAlertWidth = parseInt($("#" + alertIdArray[0]).css("bottom").split('px')[0]) + parseInt($("#" + alertIdArray[0]).css("height")) + 10 + "px"
$("#" + alertIdArray[1]).css("bottom", newAlertWidth);
}
$("#tip-alert-" + ranId).click(function () {
$("#tip-alert-" + ranId).fadeOut(300);
})
setTimeout(function () {
$("#tip-alert-" + ranId).fadeOut(300);
alertIdArray.splice($.inArray("#tip-alert-" + ranId, alertIdArray), 1);
}, 6000);
setTimeout(function () { $("#tip-alert-" + ranId).remove(); }, 7000);
} else if (type == "show") {
$("#tip-alert-" + ranId).fadeIn(300);
} else if (type == "hide") {
$("#tip-alert-" + ranId).fadeOut(300);
alertIdArray.splice($.inArray("#tip-alert-" + ranId, alertIdArray), 1);
setTimeout(function () {
$("#tip-alert-" + ranId).remove();
}, 1000);
}
return { id: "#tip-alert-" + ranId, ele: $("#tip-alert-" + ranId) };
}
//因非使用 Require 引用，$.fn 被二次引用 jquery.js 吃掉，則移至 site.js
//$.fn.YTAlert = function () {
// let th = { element: this };
// th.hide = function (delay = 0) {
// let obj = this;
// setTimeout(function () {
// $(obj.element).fadeOut(300);
// alertIdArray.splice($.inArray($(obj.element).prop("id"), alertIdArray), 1);
// setTimeout(function () {
// $(obj.element).remove();
// }, 1000);
// }, delay);
// }
// th.text = function (text) {
// let obj = this;
// let id = $(obj.element).prop("id").split("tip-alert-")[1];
// $(`#alert-text-${id}`).text(text);
// }
// return th;
//}

11
Frontend/js/yourteam/plugins/yt-tab/yt-tab.js
View File

@ -19,13 +19,14 @@ $(function () {
* 初始全頁面 yt tab * 初始全頁面 yt tab
* */ * */
function initTabsByEle() { function initTabsByEle() {
_ytTabInited = []; /*_ytTabInited = [];*/
$("[data-tabname][data-target]:not([data-tabrole=child])").each(function (index, value) { $("[data-tabname][data-target]:not([data-tabrole=child])").each(function (index, value) {
let tabName = $(value).data("tabname"); let tabName = $(value).data("tabname");
if (_ytTabInited.indexOf(tabName) == -1) {
var ytTab = new YT.Tab({ tabName: tabName }) var ytTab = new YT.Tab({ tabName: tabName })
_ytTabInited.push(tabName); _ytTabInited.push(tabName);
}
}) })
} }

9
Frontend/js/yourteam/yourteam.ajax.class.js
View File

@ -58,7 +58,13 @@ class Ajax {
*/ */
successFunction = function (data,callback) { successFunction = function (data,callback) {
if (data && data.unauthorized == 401) { if (data && data.unauthorized == 401) {
location.href = "login.html"; let href = location.href;
localStorage.removeItem("JWT-Authorization");
if (href.indexOf("localhost:5966") == -1) {
location.href = "/login";
} else {
location.href = "login.html";
}
} }
if (callback) { if (callback) {
callback(data); callback(data);
@ -79,6 +85,7 @@ class Ajax {
window.alert("執行失敗，請聯絡客服人員。"); window.alert("執行失敗，請聯絡客服人員。");
} else if (xhr.status == "401") { } else if (xhr.status == "401") {
window.alert("登入時間超時，請重新登入！"); window.alert("登入時間超時，請重新登入！");
localStorage.removeItem("JWT-Authorization");
location.href = "~/Login/Login"; location.href = "~/Login/Login";
} }
} }

2
Frontend/js/yourteam/yourteam.jquery.datatables.js
View File

@ -57,7 +57,7 @@ function fnInitJqDataTablesNoData(tag, dataSet = null, columns = null, columnDef
"processing": true, "processing": true,
"columns": columns, "columns": columns,
"aoColumnDefs": columnDefs, "aoColumnDefs": columnDefs,
"stateSave": true, "stateSave": false,
"pagingType": "full_numbers", "pagingType": "full_numbers",
"destroy": false, "destroy": false,
"initComplete": initComplete, "initComplete": initComplete,

10
Frontend/login.html
View File

@ -104,6 +104,9 @@
[ [
"lib/app.bundle", "lib/app.bundle",
"lib/app.menu", "lib/app.menu",
"lib/jquery-validation/dist/jquery.validate",
"lib/jquery-validation/dist/additional-methods.min",
"lib/jquery-validation/dist/localization/messages_zh_TW",
/*"lib/notifications/sweetalert2/sweetalert2.bundle",*/ /*"lib/notifications/sweetalert2/sweetalert2.bundle",*/
], loadedMasterPack); ], loadedMasterPack);
} }
@ -114,16 +117,11 @@
require( require(
[ [
"init", "init",
], loadedJsPack); ], loadedJsPack);
} }
function loadedJsPack() { function loadedJsPack() {
if (location.href.indexOf("localhost:5966") == -1) {
myBaja = new MyBaja();
myBaja.setMyUserAccount(Login)
}
if (localStorage.getItem('mitsubishi-t') == 'true') { if (localStorage.getItem('mitsubishi-t') == 'true') {
document.getElementById("rememberme").checked = true; document.getElementById("rememberme").checked = true;
remember = true; remember = true;

2
FrontendWebApi/ApiControllers/DeviceManageController.cs
View File

@ -226,7 +226,7 @@ namespace FrontendWebApi.ApiControllers
foreach (var f in fl) foreach (var f in fl)
{ {
List<DeviceLists> dl = new List<DeviceLists>(); List<DeviceLists> dl = new List<DeviceLists>();
sqlString = $@"select d.device_guid, d.full_name, d.device_coordinate, dk.device_image, d.device_number, CONCAT('{baseURL}', '{deviceKindFilePath}', dk.device_image) AS device_image_url,d.status, sqlString = $@"select d.device_guid, d.full_name, d.device_coordinate, d.priority, dk.device_image, d.device_number, CONCAT('{baseURL}', '{deviceKindFilePath}', dk.device_image) AS device_image_url,d.status,
dk.device_normal_point_id, dk.device_normal_point_guid, dk.device_normal_point_col, dk.device_normal_point_value, dk.device_normal_flashing, dk.device_normal_point_name, dk.device_normal_point_id, dk.device_normal_point_guid, dk.device_normal_point_col, dk.device_normal_point_value, dk.device_normal_flashing, dk.device_normal_point_name,
dk.device_close_point_id, dk.device_close_point_guid, dk.device_close_point_col, dk.device_close_point_value, dk.device_close_flashing, dk.device_close_point_name, dk.device_close_point_id, dk.device_close_point_guid, dk.device_close_point_col, dk.device_close_point_value, dk.device_close_flashing, dk.device_close_point_name,
dk.device_error_point_id, dk.device_error_point_guid, dk.device_error_point_col, dk.device_error_point_value, dk.device_error_flashing, dk.device_error_point_name dk.device_error_point_id, dk.device_error_point_guid, dk.device_error_point_col, dk.device_error_point_value, dk.device_error_flashing, dk.device_error_point_name

1
FrontendWebApi/Models/Device.cs
View File

@ -36,6 +36,7 @@ namespace FrontendWebApi.Models
public string device_coordinate { get; set; } public string device_coordinate { get; set; }
public string device_coordinate_3d { get; set; } public string device_coordinate_3d { get; set; }
public string status { get; set; } public string status { get; set; }
public int priority { get; set; }
public string device_status public string device_status
{ {
get get