[Frontend][系統監控] 3D viewer 跑版問題解決 | 電梯 2d 平面圖訂閱串接 | 2D動畫調整
This commit is contained in:
parent
6947fa22b9
commit
86426b5782
@ -3,7 +3,9 @@
|
||||
background-color: #fff;
|
||||
min-height: 520px;
|
||||
}
|
||||
|
||||
.elevator-table-wrapper {
|
||||
padding:0.8rem;
|
||||
}
|
||||
table.elevator-build {
|
||||
/*border: 1px double #000;*/
|
||||
}
|
||||
@ -25,6 +27,20 @@
|
||||
height: 47px;
|
||||
border: 4px solid orange;
|
||||
}
|
||||
|
||||
.elevator-item-toup {
|
||||
border: 4px solid rgba(255,255,255,0);
|
||||
position: absolute;
|
||||
border-bottom: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.elevator-item-todown {
|
||||
border: 4px solid rgba(255,255,255,0);
|
||||
position: absolute;
|
||||
border-top: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="d-flex">
|
||||
@ -35,30 +51,22 @@
|
||||
<div id="elevatorBlock" class="elevator">
|
||||
<div class="elevator-header">
|
||||
<div class="row m-0 align-items-center p-2 gap-3 btn-group btn-group-toggle">
|
||||
<button class="btn btn-secondary btn-sm active" data-tabname="floShowType" data-target="#3dDiv">
|
||||
3D
|
||||
</button>
|
||||
<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
|
||||
</button>
|
||||
</div>
|
||||
<div class="row m-0 align-items-center p-2 gap-3 btn-group btn-group-toggle">
|
||||
<button id="upFloBtn" class="btn btn-secondary btn-sm">
|
||||
上樓
|
||||
</button>
|
||||
<button id="downFloBtn" class="btn btn-secondary btn-sm">
|
||||
下樓
|
||||
<button class="btn btn-secondary btn-sm" data-tabname="floShowType" data-target="#3dDiv">
|
||||
3D
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="elevator-body d-flex align-items-center justify-content-center yt-table-container">
|
||||
<div id="3dDiv" data-tabname="floShowType" data-tabrole="child">
|
||||
<div id="forgeViewer"></div>
|
||||
</div>
|
||||
<div id="2dDiv" data-tabname="floShowType" data-tabrole="child">
|
||||
<div class="elevator-body d-flex align-items-center justify-content-center">
|
||||
<div id="2dDiv" class="p-2" data-tabname="floShowType" data-tabrole="child">
|
||||
<table id="floorTable" class="elevator-build m-auto">
|
||||
</table>
|
||||
</div>
|
||||
<div id="3dDiv" class="w-100" data-tabname="floShowType" data-tabrole="child">
|
||||
<div id="forgeViewer"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--<div>
|
||||
@ -886,10 +894,10 @@
|
||||
|
||||
<script>
|
||||
var eleManTable = null;
|
||||
var allDevList = [];
|
||||
var subSeviceData = [];
|
||||
var floList = [];
|
||||
var elevObj = null;
|
||||
var allDevList = []; //每個設備
|
||||
var subSeviceData = []; //每個設備訂閱點位值
|
||||
var floList = []; //每個樓層
|
||||
var elevObj = null; //左側 2D 電梯物件
|
||||
var subOrdPath = {
|
||||
"building_tag": pageAct.buiTag,
|
||||
"system_tag": pageAct.sysMainTag,
|
||||
@ -903,20 +911,19 @@
|
||||
var zoomToggle = 3;
|
||||
$(function () {
|
||||
initChart();
|
||||
|
||||
setBuildFloor();
|
||||
setCards();
|
||||
subDeviceSetStatus();
|
||||
setEleManTable();
|
||||
console.log("--- load 3d ---");
|
||||
load3DModel();
|
||||
})
|
||||
|
||||
function getFloDevList() {
|
||||
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
load3DModel();
|
||||
});
|
||||
|
||||
//baja 訂閱設備
|
||||
function subDeviceSetStatus() {
|
||||
myBaja = new subscriptionDevices();
|
||||
@ -953,7 +960,7 @@
|
||||
}
|
||||
//現在樓層
|
||||
if (data.point_name == "CP") {
|
||||
$(`#${matchDevice.device_number}_card [name=curFloor]`).text(data.value + "F");
|
||||
$(`#${matchDevice.device_number}_card [name=curFloor]`).text(data.value);
|
||||
}
|
||||
//往上或往下
|
||||
if (getValueByName("RD") == "UP") {
|
||||
@ -986,7 +993,9 @@
|
||||
if (subData) {
|
||||
subData[data.point_name] = data.value;
|
||||
}
|
||||
// 設置燈色、卡片閃爍
|
||||
setLightColor();
|
||||
// Card table 更新
|
||||
subDeviceSetTable(matchDevice.device_number);
|
||||
// 重繪 電梯管理 列表
|
||||
reloadEleManTable(setEleManTabDataFromBaja());
|
||||
@ -994,8 +1003,6 @@
|
||||
subDeviceSetEleManDet(matchDevice.device_number);
|
||||
// 電梯管理 不服務樓層 detail
|
||||
subDeviceSetEleManNotSerFloor(master);
|
||||
|
||||
console.log(elevObj)
|
||||
});
|
||||
|
||||
}
|
||||
@ -1042,21 +1049,28 @@
|
||||
|
||||
function creLight(type = "trueText") {
|
||||
let lightType = type == "trueText" ? "bg-success" : "bg-danger";
|
||||
debugger
|
||||
|
||||
return $(creEle("span", null, null, null, [lightType, "circle-light"])).outerHtml();
|
||||
}
|
||||
|
||||
let masterTag = devNum?.split("_")[5];
|
||||
|
||||
let notSerFloors = Object.keys(subData).filter(x => x.startsWith("SP_FLS_") && subData[x] == "trueText").map(x => x?.split("SP_FLS_")[1]);
|
||||
floList = Object.keys(subData).filter(x => x.startsWith("SP_FLS_")).map(x => x?.split("SP_FLS_")[1]);
|
||||
|
||||
elevObj.floors = floList.map((x, idx) => { return { id: x, name: x, sort: idx } });
|
||||
elevObj.redraw();
|
||||
|
||||
//左側 2D 電梯物件 樓層資料更新
|
||||
if (elevObj.floors.length != floList.length) {
|
||||
elevObj.floors = floList.map((x, idx) => { return { id: x, name: x, sort: idx + 1 } });
|
||||
elevObj.elevators = allDevList.map((x) => { return { id: x.device_number } });
|
||||
elevObj.curElevFloor[matchDevice.device_number] = subData["CP"];
|
||||
elevObj.redraw();
|
||||
} else {
|
||||
|
||||
elevObj.setElevFloor(matchDevice.device_number, subData["CP"]);
|
||||
}
|
||||
elevObj.setEleMovStatus(matchDevice.device_number, subData["RD"] == "UP" ? 1 : subData["RD"] == "DOWN" ? 2 : 0);
|
||||
//現在樓層
|
||||
if (subData["CP"]) {
|
||||
$(`#imdStaTable_${devNum} [name=curFloor]`).text(subData["CP"] + "F");
|
||||
$(`#imdStaTable_${devNum} [name=curFloor]`).text(subData["CP"]);
|
||||
}
|
||||
//往上或往下
|
||||
if (subData["RD"] == "UP") {
|
||||
@ -1127,33 +1141,12 @@
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
//左側 2D 樓層 Table
|
||||
function setBuildFloor() {
|
||||
let floors = floList.map((x, idx) => { return { id: x, name: x, sort: idx } });
|
||||
let options = {
|
||||
floors: floors,
|
||||
elevators: [
|
||||
{id:"elevator01"},
|
||||
],
|
||||
curElevFloor: {"elevator01":"1F"}
|
||||
}
|
||||
console.log(options)
|
||||
|
||||
elevObj = new ElevatorHandler("#floorTable", options);
|
||||
|
||||
let curSort = 3;
|
||||
onEvent("click", "#upFloBtn", function () {
|
||||
curSort++;
|
||||
elevObj.setElevFloor("elevator01", options.floors.filter(x => x.sort == curSort)[0]?.id);
|
||||
})
|
||||
onEvent("click", "#downFloBtn", function () {
|
||||
curSort--;
|
||||
elevObj.setElevFloor("elevator01", options.floors.filter(x => x.sort == curSort)[0]?.id);
|
||||
})
|
||||
elevObj = new ElevatorHandler("#floorTable");
|
||||
}
|
||||
|
||||
// Card 即時狀態
|
||||
function drawStateTabBlo(devNum) {
|
||||
let div = creDiv(["row"]);
|
||||
div.append(creDiv(["col-xl-6"]).append(drawImdStaBlock(devNum)))
|
||||
@ -1161,6 +1154,7 @@
|
||||
return div.outerHtml();
|
||||
}
|
||||
|
||||
// Card 即時狀態 - 左側 table
|
||||
function drawImdStaBlock(devNum) {
|
||||
let tabEle = $(`<table id="imdStaTable_${devNum}" class="table table-bordered table-striped text-center m-0">`);
|
||||
let tbody = tabEle.append("<tbody>");
|
||||
@ -1215,6 +1209,7 @@
|
||||
return tabEle.outerHtml();
|
||||
}
|
||||
|
||||
// Card 即時狀態 - 右側 table
|
||||
function drawOpeModBlock(devNum) {
|
||||
let tabEle = $(`<table id="opeModTable_${devNum}" class="table table-bordered table-striped text-center m-0">`);
|
||||
let tbody = tabEle.append("<tbody>");
|
||||
@ -1252,6 +1247,7 @@
|
||||
return tabEle.outerHtml();
|
||||
}
|
||||
|
||||
// 電梯管理 Modal - 資料更新
|
||||
function reloadEleManTable(datas) {
|
||||
|
||||
let tabCols = eleManTable.context[0].aoColumns.map(x => x.data);
|
||||
@ -1266,6 +1262,7 @@
|
||||
eleManTable.clear().rows.add(datas).draw();
|
||||
}
|
||||
|
||||
// 電梯管理 Modal - table 初始化
|
||||
function setEleManTable() {
|
||||
let tag = "#eleManTable";
|
||||
let datas = [];
|
||||
@ -1464,6 +1461,7 @@
|
||||
})
|
||||
})
|
||||
|
||||
// 電梯管理 Modal 不服務樓層 設定不服務樓層(BAJA)
|
||||
onEvent("click", "#eleManTable [name^=notSerChk]", function () {
|
||||
require(['baja!'], function (baja) {
|
||||
baja.Ord.make("local:|foxs:|station:|slot:/TPE/B1/ELEV/EL/R2F/NA/ELEV1/N1|bql:select name, displayName, out, out.value, slotPath, parent.name as 'device_number' from control:ControlPoint where name = 'CP' or name = 'RD' or name = 'DS' or name = 'ST' or name = 'LOAD' or name = 'MID' or name = 'HAND' or name = 'IND' or name = 'MD' or name = 'DNO'").get()
|
||||
@ -1610,7 +1608,6 @@
|
||||
resetData();
|
||||
})
|
||||
|
||||
|
||||
function initChart() {
|
||||
let chartDom = $("#floChart")[0];
|
||||
floChart = echarts.init(chartDom, null, { width: 'auto' });
|
||||
@ -2284,16 +2281,7 @@
|
||||
|
||||
//載入3D模型
|
||||
function load3DModel() {
|
||||
console.log("launchViewer~");
|
||||
launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6LW1vZGVsX3Rlc3QxMTIxLyVFMyU4MCU5MFRFU1QlRTMlODAlOTEubndk');
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!--<link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/style.min.css" type="text/css">
|
||||
|
||||
|
||||
|
||||
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
|
||||
<script src="js/init.js"></script>
|
||||
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.js"></script>
|
||||
<script src="js/forge/forgemodel.js"></script>-->
|
||||
@ -55,6 +55,12 @@ label[id$='-error'].error {
|
||||
animation: flashing-c 0.5s linear infinite;
|
||||
}
|
||||
|
||||
.light-flash-c-bd {
|
||||
--flash-color-1: #ffa100;
|
||||
--flash-color-2: #26272b;
|
||||
animation: flashing-c-bd 0.5s linear infinite;
|
||||
}
|
||||
|
||||
/* checkbox switch */
|
||||
input.toggle:checked::before {
|
||||
content: '';
|
||||
@ -131,6 +137,23 @@ input.toggle:checked {
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes flashing-c-bd {
|
||||
0% {
|
||||
border-color: var(--flash-color-1);
|
||||
}
|
||||
|
||||
49% {
|
||||
border-color: var(--flash-color-1);
|
||||
}
|
||||
|
||||
50% {
|
||||
border-color: var(--flash-color-2);
|
||||
}
|
||||
|
||||
99% {
|
||||
border-color: var(--flash-color-2);
|
||||
}
|
||||
}
|
||||
/* ================================================================ */
|
||||
/* 單一方法 */
|
||||
/* ================================================================ */
|
||||
|
||||
@ -2528,15 +2528,15 @@ 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:-->
|
||||
<script src="lib/statistics/easypiechart/easypiechart.bundle.js"></script>
|
||||
|
||||
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.js"></script>
|
||||
<script src="js/forge/forgemodel.js"></script>
|
||||
|
||||
|
||||
<!--Bajascript-->
|
||||
<script src="js/bajascript/bscriptReq.js"></script>
|
||||
<!--<script type='text/javascript' src='/module/js/com/tridium/js/ext/require/require.min.js?version=1496767636459'></script>-->
|
||||
<script src='js/bajascript/require.js'></script>
|
||||
|
||||
|
||||
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.js"></script>
|
||||
<script src="js/forge/forgemodel.js"></script>
|
||||
|
||||
|
||||
<script type='text/javascript'>
|
||||
@ -2549,7 +2549,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
<script src="js/bajascript/require.config.js"></script>
|
||||
<script src="js/FileSaver.js"></script>
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
/*$('#js-page-content').smartPanel();*/
|
||||
@ -2708,7 +2708,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
pageAct.sysMainTag = null;
|
||||
}
|
||||
$.each(tolSubList, (idx, sub) => {
|
||||
console.log("sub", sub, idx)
|
||||
console.log("sub",sub,idx)
|
||||
sub.unsubscribeAll();
|
||||
sub.detach();
|
||||
})
|
||||
@ -2773,7 +2773,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
function drawErrRecTabBlo() {
|
||||
let strHtml = `<table id="errRecTable" class="table table-bordered table-striped text-center m-0 w-100">
|
||||
|
||||
</table>`
|
||||
</table>`
|
||||
return strHtml;
|
||||
}
|
||||
|
||||
@ -2781,7 +2781,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
function drawOpeRecTabBlo() {
|
||||
let strHtml = `<table id="opeRecTable" class="table table-bordered table-striped text-center m-0 w-100">
|
||||
|
||||
</table>`
|
||||
</table>`
|
||||
return strHtml;
|
||||
}
|
||||
|
||||
@ -2794,37 +2794,37 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
$(ele).YTTooltip({
|
||||
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 class="position-absolute w-50" style="word-break: break-all;">
|
||||
<label class="m-0 mt-2">${devName}</label>
|
||||
</div>
|
||||
<div class="card-body p-2 tab-content">
|
||||
<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 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>`,
|
||||
</div>
|
||||
</div>`,
|
||||
group: "device",
|
||||
onShow: function (tooltipEle, oriEle) {
|
||||
var tab = new YT.Tab({ tabName: "cardTab" })
|
||||
@ -2958,9 +2958,9 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
|
||||
})
|
||||
}
|
||||
|
||||
//==============================================================================
|
||||
// ↑ 系統監控 - 共用 Function ↑
|
||||
//==============================================================================
|
||||
//==============================================================================
|
||||
// ↑ 系統監控 - 共用 Function ↑
|
||||
//==============================================================================
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
@ -1,25 +1,63 @@
|
||||
var viewer;
|
||||
|
||||
// const devices = [
|
||||
// {
|
||||
// id: "Sensor 1",
|
||||
// position: {
|
||||
// x: -22.779729106182415,
|
||||
// y: 5.431043023608719,
|
||||
// z: 4.553068469137088,
|
||||
// },
|
||||
// type: "combo",
|
||||
// sensorTypes: ["temperature", "co2"],
|
||||
// dbId: 1,
|
||||
// },
|
||||
// {
|
||||
// id: "Sensor 2",
|
||||
// position: {
|
||||
// x: 0.20752051811882666,
|
||||
// y: 5.431043023608719,
|
||||
// z: 4.553068469137088,
|
||||
// },
|
||||
// type: "combo",
|
||||
// sensorTypes: ["temperature", "co2"],
|
||||
// dbId: 2,
|
||||
// },
|
||||
// ];
|
||||
|
||||
// var sensorStyleDefinitions = {
|
||||
// co2: {
|
||||
// url: "https://d2zqnmauvnpnnm.cloudfront.net/assets-1/images/co2.svg",
|
||||
// color: 0xffffff,
|
||||
// },
|
||||
// temperature: {
|
||||
// url: "https://d2zqnmauvnpnnm.cloudfront.net/assets-1/images/thermometer.svg",
|
||||
// color: 0xffffff,
|
||||
// },
|
||||
// default: {
|
||||
// url: "https://d2zqnmauvnpnnm.cloudfront.net/assets-1/images/circle.svg",
|
||||
// color: 0xffffff,
|
||||
// },
|
||||
// };
|
||||
|
||||
// Initialize sensor values
|
||||
//let sensorVals = [];
|
||||
let fragProxy;
|
||||
var targetFloorZ;
|
||||
var elevatorSpeed;
|
||||
let bulbLight;
|
||||
//for (let i = 0; i < devices.length; i++) {
|
||||
// sensorVals[i] = Math.random();
|
||||
//}
|
||||
// for (let i = 0; i < devices.length; i++) {
|
||||
// sensorVals[i] = Math.random();
|
||||
// }
|
||||
|
||||
function launchViewer(urn) {
|
||||
var options = {
|
||||
env: 'AutodeskProduction',
|
||||
getAccessToken: getForgeToken,
|
||||
language: 'en'
|
||||
getAccessToken: getForgeToken
|
||||
};
|
||||
|
||||
Autodesk.Viewing.Initializer(options, () => {
|
||||
viewer = new Autodesk.Viewing.GuiViewer3D(document.getElementById('forgeViewer'));
|
||||
//viewer = new Autodesk.Viewing.Viewer3D(document.getElementById('forgeViewer'));//這是沒有工具列的
|
||||
//viewer = new Autodesk.Viewing.Viewer3D(document.getElementById('forgeViewer'));
|
||||
viewer.start();
|
||||
var documentId = 'urn:' + urn;
|
||||
Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
|
||||
@ -27,24 +65,24 @@ function launchViewer(urn) {
|
||||
|
||||
|
||||
//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
|
||||
// }
|
||||
// });
|
||||
// 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)
|
||||
// });
|
||||
//}
|
||||
// await viewer.waitForLoadDone(); //!<<< Wait for loading materials, properties and geometries for this model (URN)
|
||||
// });
|
||||
// }
|
||||
|
||||
//loadHeatmaps(viewer.getAllModels()[0]); //!<<< equals to viewer.model
|
||||
|
||||
@ -85,65 +123,36 @@ function onDocumentLoadSuccess(doc) {
|
||||
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.AGGREGATE_SELECTION_CHANGED_EVENT, (args) => {
|
||||
// var currSelection = viewer.getSelection();
|
||||
// var domElem = document.getElementById('id_printer');
|
||||
// domElem.innerText = currSelection[0];
|
||||
// });
|
||||
|
||||
// const targetElem = 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;
|
||||
|
||||
// const model = viewer.model;
|
||||
// const instanceTree = model.getData().instanceTree;
|
||||
// const fragList = model.getFragmentList();
|
||||
// let tree = viewer.model.getData().instanceTree;
|
||||
// let nodeId = 10952;
|
||||
|
||||
// let bounds = new THREE.Box3();
|
||||
// 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
|
||||
|
||||
// instanceTree.enumNodeFragments(targetElem, (fragId) => {
|
||||
// let box = new THREE.Box3();
|
||||
// fragList.getWorldBounds(fragId, box);
|
||||
// bounds.union(box);
|
||||
// }, true);
|
||||
// fragProxy.position = fragPosition
|
||||
|
||||
// const position = bounds.center();
|
||||
// console.log(position)
|
||||
// fragProxy.updateAnimTransform()
|
||||
|
||||
// });
|
||||
// viewer.impl.sceneUpdated(true);
|
||||
|
||||
//});
|
||||
|
||||
viewer.addEventListener(Autodesk.Viewing.GEOMETRY_LOADED_EVENT, function (data) {
|
||||
//var viewer = data.target;
|
||||
//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 = 10952;
|
||||
|
||||
//tree.enumNodeFragments(nodeId, function (frag) {
|
||||
// fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
|
||||
// console.log("p:" + fragProxy.position);
|
||||
// fragProxy.getAnimTransform();
|
||||
// let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
|
||||
// fragProxy.position = fragPosition;
|
||||
// fragProxy.updateAnimTransform();
|
||||
//});
|
||||
//viewer.impl.sceneUpdated(true);
|
||||
|
||||
});//, { once: true, }
|
||||
|
||||
//bulbLight = new THREE.PointLight(0xff0000, 20, 2, 1);//0xffee88
|
||||
//bulbLight.position.set(39.33340644836426, 19.965089797973633, 18);//17.880840301513672
|
||||
//bulbLight.castShadow = true;
|
||||
//bulbLight.power = 100;// 110000;
|
||||
//bulbLight.emissiveIntensity = bulbLight.intensity / Math.pow(0.02, 2.0);
|
||||
//viewer.scene.add(bulbLight);
|
||||
}
|
||||
|
||||
function setLightPower(value) {
|
||||
bulbLight.intensity = (value * 10);
|
||||
viewer.impl.sceneUpdated(true);
|
||||
//bulbLight.power = value;
|
||||
|
||||
}
|
||||
|
||||
function setElevatorFloor(floor) {
|
||||
|
||||
@ -12,6 +12,39 @@ function addzero(num) {
|
||||
* @param {any} alarmClass
|
||||
* @param {any} callback
|
||||
*/
|
||||
// function getAlarmByBaja(startDate_millisecond, endDate_millisecond, isRecover, isAck, alarmClass, callback) {
|
||||
// let _sourceTmp;
|
||||
// var _result = "";
|
||||
// var _ss = "";
|
||||
// var _bfName = "";
|
||||
// var _sourceName = "";
|
||||
// var _index = 0;
|
||||
// var _recoverState = isRecover ? "!= null" : "= null";
|
||||
// var _ackState = isAck ? "= 1" : "!= 1";
|
||||
|
||||
// require(['baja!'], function (baja) {
|
||||
// baja.Ord.make("local:|foxs:|alarm:|bql:select timestamp, ackState, alarmClass, alarmClassDisplayName, alarmValue, alarmData, alarmData.sourceName, uuid, alarmData.msgText, alarmData.numericValue, alarmData.presentValue, alarmData.status, alarmData.toState, normalTime from openAlarms where alarmClass = '" + alarmClass + "' and timestamp.millis > " + startDate_millisecond + " and timestamp.millis < " + endDate_millisecond + " and normalTime " + _recoverState + " order by timestamp asc").get()
|
||||
// .then(function (table) {
|
||||
// return table.cursor({
|
||||
// each: function (record) {
|
||||
// _sourceTmp = (record.get('alarmData').get('sourceName')).toString().split('_');
|
||||
// _bfName = _sourceTmp[1] + "-" + _sourceTmp[4];
|
||||
// _sourceName = _sourceTmp[7] + "-" + _sourceTmp[8];
|
||||
// _ss += ', "' + _index + '": {"buildingFloorName_zh":"' + _bfName + '", "uuid":"' + record.get('uuid') + '", "timestamp":"' + record.get('timestamp') + '", "alarmClass":"' + record.get('alarmClass') + '", "sourceName_zh":"' + _sourceName + '", "msgText":"' + record.get('alarmData').get('msgText') + '", "ackState":"' + record.get('ackState') + '", "normalTime":"' + record.get('normalTime') + '"}';
|
||||
// _index++;
|
||||
// },
|
||||
// after: function () {
|
||||
// _result += '{' + '"count": ' + _index;
|
||||
// _result += _ss;
|
||||
// _result += '}';
|
||||
// if (typeof callback === 'function') {
|
||||
// callback(_result);
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
function getAlarmByBaja(startDate_millisecond, endDate_millisecond, isRecover, isAck, alarmClass, callback) {
|
||||
let _sourceTmp;
|
||||
var _result = "";
|
||||
@ -57,6 +90,35 @@ function getAlarmByBaja(startDate_millisecond, endDate_millisecond, isRecover, i
|
||||
* @param {any} devicePath
|
||||
* @param {any} callback
|
||||
*/
|
||||
// function getOneDeviceAlarmTop10ByBaja(devicePath, callback) {
|
||||
// var _result = "";
|
||||
// var _ss = "";
|
||||
// var _index = 0;
|
||||
// //{ "count":2,"data": [{ "time": "2022/11/14 15:00:00", "errId": "0001", "ackCheck": "未確認", "errReason": "燈泡故障" }, { "time": "2022/11/14 15:00:00", "errId": "0002", "ackCheck": "未確認", "errReason": "燈泡故障" }]}
|
||||
// require(['baja!'], function (baja) {
|
||||
// baja.Ord.make("local:|foxs:|alarm:|bql:select top 10 timestamp, ackState, alarmData, alarmData.sourceName, sourceState, uuid, alarmData.msgText, normalTime where alarmData.sourceName like '%" + devicePath + "%' order by timestamp desc").get()
|
||||
// .then(function (table) {
|
||||
// return table.cursor({
|
||||
// each: function (record) {
|
||||
// if (_index == 0)
|
||||
// _ss += '{"uuid":"' + record.get('uuid') + '", "msgText":"' + record.get('alarmData').get('msgText') + '", "ackState":"' + record.get('ackState') + '", "timestamp":"' + record.get('timestamp') + '"}';
|
||||
// else
|
||||
// _ss += ',{"uuid":"' + record.get('uuid') + '", "msgText":"' + record.get('alarmData').get('msgText') + '", "ackState":"' + record.get('ackState') + '", "timestamp":"' + record.get('timestamp') + '"}';
|
||||
// _index++;
|
||||
// },
|
||||
// after: function () {
|
||||
// _result += '{' + '"count": ' + _index +', "data":[';
|
||||
|
||||
// _result += _ss+']';
|
||||
// _result += '}';
|
||||
// if (typeof callback === 'function') {
|
||||
// callback(_result);
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
function getOneDeviceAlarmTop10ByBaja(devicePath, callback) {
|
||||
var _result = "";
|
||||
var _ss = "";
|
||||
@ -109,6 +171,31 @@ function getOneDeviceAlarmTop10ByBaja(devicePath, callback) {
|
||||
* @param {any} systemPath
|
||||
* @param {any} callback
|
||||
*/
|
||||
// function getOneSystemAlarmStateByBaja(systemPath, callback) {
|
||||
// var _result = "";
|
||||
// var _ss = "";
|
||||
// var _index = 0;
|
||||
|
||||
// require(['baja!'], function (baja) {
|
||||
// baja.Ord.make("local:|foxs:|alarm:|bql:select alarmData, alarmData.sourceName, sourceState, uuid where alarmData.sourceName like '%" + systemPath + "%' order by timestamp desc").get()
|
||||
// .then(function (table) {
|
||||
// return table.cursor({
|
||||
// each: function (record) {
|
||||
// _ss += ', "' + _index + '": {"uuid":"' + record.get('uuid') + '", "sourceName":"' + record.get('alarmData').get('sourceName') + '", "sourceState":"' + record.get('sourceState') + '"}';
|
||||
// _index++;
|
||||
// },
|
||||
// after: function () {
|
||||
// _result += '{' + '"count": ' + _index;
|
||||
// _result += _ss;
|
||||
// _result += '}';
|
||||
// if (typeof callback === 'function') {
|
||||
// callback(_result);
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
function getOneSystemAlarmStateByBaja(systemPath, callback) {
|
||||
var _result = "";
|
||||
var _ss = "";
|
||||
|
||||
@ -8,6 +8,32 @@
|
||||
* @param {any} company
|
||||
* @param {any} callback
|
||||
*/
|
||||
// function getHistoryDataByBaja(devicePath, startDate_millisecond, endDate_millisecond, deviceName, company, callback) {
|
||||
// var _result = "";
|
||||
// var _ss = "";
|
||||
// var _index = 0;
|
||||
|
||||
// require(['baja!'], function (baja) {
|
||||
// baja.Ord.make('local:|foxs:|history:/' + company + '/' + devicePath + '|bql:select * from control:ControlPoint where timestamp.millis > ' + startDate_millisecond + ' and timestamp.millis < ' + endDate_millisecond).get()
|
||||
// .then(function (table) {
|
||||
// return table.cursor({
|
||||
// each: function (record) {
|
||||
// _ss += ', "' + _index + '": {"deviceName":"' + deviceName + '", "value":' + record.get('value') + ', "timestamp":"' + record.get('timestamp') + '"}';
|
||||
// _index++;
|
||||
// },
|
||||
// after: function () {
|
||||
// _result += '{' + '"count": ' + _index;
|
||||
// _result += _ss;
|
||||
// _result += '}';
|
||||
// if (typeof callback === 'function') {
|
||||
// callback(_result);
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
|
||||
function getHistoryDataByBaja(devicePath, startDate_millisecond, endDate_millisecond, deviceName, company, callback) {
|
||||
var _result = "";
|
||||
var _ss = "";
|
||||
|
||||
@ -114,11 +114,11 @@ class ElevatorHandler {
|
||||
this.eleId = "";
|
||||
this.eleWra = $("<div></div>");
|
||||
this.speed = 0.3;
|
||||
this.monStatus = 0; // 0=no 1=up 2=down
|
||||
this.movStatus = {}; // {id:elevator01,value:0} 0=no 1=up 2=down
|
||||
this.floorHeight = typeof option.fHeight == "undefined" ? 50 : option.fHeight;
|
||||
this.floorWidth = typeof option.fWidth == "undefined" ? 45 : option.fWidth;
|
||||
this.floors = typeof option.floors == "undefined" ? [{}] : option.floors;
|
||||
this.elevators = typeof option.elevators == "undefined" ? [{ id: "elevator01" }] : option.elevators;
|
||||
this.elevators = typeof option.elevators == "undefined" ? [{}] : option.elevators; // {id:elevator01}
|
||||
this.curElevFloor = typeof option.curElevFloor == "undefined" ? {} : option.curElevFloor;
|
||||
this.setTimeout = null;
|
||||
this.init();
|
||||
@ -130,7 +130,6 @@ class ElevatorHandler {
|
||||
if (Object.keys(this.curElevFloor).length != 0) {
|
||||
$.each(Object.keys(this.curElevFloor), (idx, elevKey) => {
|
||||
this.setElevFloor(elevKey,this.curElevFloor[elevKey]);
|
||||
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -161,11 +160,17 @@ class ElevatorHandler {
|
||||
let th = creEle("th");
|
||||
th.css({ "width": `${_w}px`, "height": `${_h}px` });
|
||||
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 spanUp = creEle("span", null, null, null, ["elevator-item-toup"]);
|
||||
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`})
|
||||
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`})
|
||||
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`})
|
||||
th.append(spanUp);
|
||||
th.append(span);
|
||||
th.append(spanDown);
|
||||
}
|
||||
theadTr.append(th);
|
||||
}
|
||||
@ -221,25 +226,46 @@ class ElevatorHandler {
|
||||
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 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]]
|
||||
clearTimeout(this.setTimeout);
|
||||
console.log(this.movStatus)
|
||||
if (this.movStatus != 0) {
|
||||
$(`#elevator-item-${elevId}`).css("transition", `transform ${1 / this.speed}s cubic-bezier(0, 0, 0.62, 1) 0s`);
|
||||
}
|
||||
if (gapFloor < 0) {
|
||||
this.movStatus = 2;
|
||||
} else if (gapFloor > 0) {
|
||||
this.movStatus = 1;
|
||||
} else {
|
||||
this.movStatus = 0;
|
||||
console.log("123",this.movStatus)
|
||||
if (this.movStatus[elevId] != 0) {
|
||||
$(cssEle).css("transition", `transform ${1 / this.speed * Math.abs(gapFloor)}s cubic-bezier(0, 0, 0.62, 1) 0s`);
|
||||
}
|
||||
//if (gapFloor < 0) {
|
||||
// this.movStatus[elevId] = 2;
|
||||
//} else if (gapFloor > 0) {
|
||||
// this.movStatus[elevId] = 1;
|
||||
//} else {
|
||||
// this.movStatus[elevId] = 0;
|
||||
//}
|
||||
this.setTimeout = setTimeout(() => {
|
||||
this.movStatus = 0;
|
||||
$(`#elevator-item-${elevId}`).css("transition", `transform ${1 / this.speed}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`)
|
||||
}, (1 / this.speed) * 1000)
|
||||
$(`#elevator-item-${elevId}`).css("transform", `translateY(${this.floorHeight * (this.floors.length - tarSort)}px)`);
|
||||
/*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`);
|
||||
this.setEleUpDownStyle(elevId);
|
||||
}, (1 / this.speed * Math.abs(gapFloor)) * 1000)
|
||||
this.setEleUpDownStyle(elevId);
|
||||
this.curElevFloor[elevId] = floId;
|
||||
$(cssEle).css("transition", `transform ${1 / this.speed * Math.abs(gapFloor)}s cubic-bezier(0.43, 0.05, 0.62, 1) 0s`)
|
||||
$(cssEle).css("transform", `translateY(${this.floorHeight * (this.floors.length - tarSort)}px)`);
|
||||
}
|
||||
|
||||
setEleMovStatus = function (elevId,status) {
|
||||
this.movStatus[elevId] = status;
|
||||
}
|
||||
|
||||
setEleUpDownStyle = function (elevId) {
|
||||
if (this.movStatus[elevId] == 1) {
|
||||
$(`#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)");
|
||||
} else if (this.movStatus[elevId] == 2) {
|
||||
$(`#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)");
|
||||
} else {
|
||||
$(`#elevator-item-${elevId}`).prev("span.elevator-item-toup").removeClass("light-flash-c-bd");
|
||||
$(`#elevator-item-${elevId}`).next("span.elevator-item-todown").removeClass("light-flash-c-bd");
|
||||
}
|
||||
}
|
||||
|
||||
setCurElevFloor = function (elevId,floId) {
|
||||
this.curElevFloor[elevId] = floId;
|
||||
@ -248,6 +274,11 @@ class ElevatorHandler {
|
||||
redraw = function () {
|
||||
$(this.ele).empty();
|
||||
this.setTabFloor();
|
||||
if (Object.keys(this.curElevFloor).length != 0) {
|
||||
$.each(Object.keys(this.curElevFloor), (idx, elevKey) => {
|
||||
this.setElevFloor(elevKey, this.curElevFloor[elevKey]);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -19,12 +19,13 @@ $(function () {
|
||||
* 初始全頁面 yt tab
|
||||
* */
|
||||
function initTabsByEle() {
|
||||
_ytTabInited = [];
|
||||
$("[data-tabname][data-target]:not([data-tabrole=child])").each(function (index, value) {
|
||||
let tabName = $(value).data("tabname");
|
||||
if (_ytTabInited.indexOf(tabName) == -1) {
|
||||
var ytTab = new YT.Tab({ tabName: tabName })
|
||||
_ytTabInited.push(tabName);
|
||||
}
|
||||
|
||||
var ytTab = new YT.Tab({ tabName: tabName })
|
||||
_ytTabInited.push(tabName);
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@ -58,7 +58,7 @@ function fnInitJqDataTablesNoData(tag, dataSet = null, columns = null, columnDef
|
||||
"columns": columns,
|
||||
"aoColumnDefs": columnDefs,
|
||||
"stateSave": true,
|
||||
"pagingType": "simple",
|
||||
"pagingType": "full_numbers",
|
||||
"destroy": false,
|
||||
"initComplete": initComplete,
|
||||
"drawCallback": fnDrawCallBack,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user