ibms-dome/Frontend/_sysElevator.html

2478 lines
114 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<style>
.elevator {
background-color: #fff;
min-height: 520px;
}
.elevator-table-wrapper {
padding: 0.8rem;
}
table.elevator-build { /*border: 1px double #000;*/
}
table.elevator-build td {
padding: 0.2rem 0.5rem;
height: 50px;
width: 45px;
border: 1px solid #000;
}
elevator .elevator-body, elevator .elevator-header {
padding: 0.7rem;
}
.elevator-item {
position: absolute;
width: 43px;
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;
}
.table-compact td {
padding: 0.2rem 0.3rem;
}
#emerTurn tr td:nth-child(2) {
width: 50%;
text-align: center;
justify-content: center;
}
#emerTurn tr td:nth-child(1) {
width: 35%;
}
</style>
<div class="d-flex">
<!-- 左圖區 -->
<div class="col-4 my-3">
<div style="position:relative ">
<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 " data-tabname="floShowType" data-target="#2dDiv">
2D
</button>
<button class="btn btn-secondary btn-sm active" data-tabname="floShowType" data-target="#3dDiv" onclick="show3D()">
3D
</button>
</div>-->
</div>
<div class="elevator-body d-flex align-items-center justify-content-center" style="height:85vh;">
<!--<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 h-100 position-relative" data-tabname="floShowType" data-tabrole="child">
<div id="forgeViewer" style=""></div>
</div>
</div>
</div>
<!--<div>
<img src="img/elevator.jpg" class="img-fluid" style="min-height: 520px" />
</div>-->
</div>
<!-- <img src="img/elevator.jpg" class="img-fluid" style="min-height: 520px" /> -->
</div>
<!-- End-左圖區 -->
<!-- 中間卡片區 -->
<div class="col-6 my-3">
<div id="eleCards" class="row col-12 p-0">
</div>
<div class="mt-2 col-8 p-0 d-none">
<!--<div class="pl-3 row">
<button id="resChartZoom" class="btn btn-info mb-2">圖檔重置</button>
</div>-->
<div id="floChart" style="height : 45vh!important;width:auto;"></div>
</div>
</div>
<!-- End-中間卡片區 -->
<!-- 右邊功能區 -->
<div class="col-2 my-3">
<div class="d-flex">
<div class="btn-group col-xxl-3 mb-2">
<button class="btn btn-info" data-toggle="modal" data-target="#staticBackdrop">
重播系統 <i class="fas fa-play"></i>
</button>
</div>
<div>
<i type="button" class="fas fa-cog fa-2x ml-3 my-2" data-toggle="modal" data-target="#eleManModal"></i>
</div>
</div>
<div class="card col-xxl-3 mt-3">
<div class="card-body text-center">
<h4>緊急回轉</h4>
</div>
</div>
<div class="col-12 p-2">
<table id="emerTurn" class="table-compact w-100">
<tbody>
<tr>
<td><label class="mb-0 fs-1-05 w-auto" for="flexRadioDefault1">緊急回歸</label></td>
<td><label id="emerReturnText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label></td>
<td><span id="emerReturn" class="circle-light bg-secondary"></span></td>
</tr>
<tr>
<td><label class="mb-0 fs-1-05 w-auto" for="flexRadioDefault1">群控故障</label></td>
<td><label id="groConFailText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label></td>
<td><span id="groConFail" class="circle-light bg-secondary"></span></td>
</tr>
<tr>
<td><label class="mb-0 fs-1-05 w-auto" for="flexRadioDefault1">緊急電源</label></td>
<td><label id="emerPowerText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label></td>
<td><span id="emerPower" class="circle-light bg-secondary"></span></td>
</tr>
<tr>
<td><label class="mb-0 fs-1-05 w-auto" for="flexRadioDefault1">火災回歸</label></td>
<td><label id="fireReturnText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label></td>
<td><span id="fireReturn" class="circle-light bg-secondary"></span></td>
</tr>
<tr>
<td><label class="mb-0 fs-1-05 w-auto" for="flexRadioDefault1">地震管制</label></td>
<td><label id="earQuaConText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label></td>
<td><span id="earQuaCon" class="circle-light bg-secondary"></span></td>
</tr>
<tr>
<td><label class="mb-0 fs-1-05 w-auto" for="flexRadioDefault1">遠端休止</label></td>
<td><label id="disResText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label></td>
<td><span id="disRes" class="circle-light bg-secondary"></span></td>
</tr>
</tbody>
</table>
</div>
<!--<div class="d-flex justify-content-around mt-2">
<div>
<label class="mb-0 fs-1-05" for="flexRadioDefault1">緊急回歸</label>
</div>
<div>
<label id="emerReturnText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label>
</div>
<div>
<span id="emerReturn" class="circle-light bg-secondary"></span>
</div>
</div>
<div class="d-flex justify-content-around mt-2">
<div>
<label class="mb-0 fs-1-05" for="flexRadioDefault1">群控故障</label>
</div>
<div>
<label id="groConFailText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label>
</div>
<div>
<span id="groConFail" class="circle-light bg-secondary"></span>
</div>
</div>
<div class="d-flex justify-content-around mt-2">
<div>
<label class="mb-0 fs-1-05" for="flexRadioDefault1">緊急電源</label>
</div>
<div>
<label id="emerPowerText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label>
</div>
<div>
<span id="emerPower" class="circle-light bg-secondary"></span>
</div>
</div>
<div class="d-flex justify-content-around mt-2">
<div>
<label class="mb-0 fs-1-05" for="flexRadioDefault1">火災回歸</label>
</div>
<div>
<label id="fireReturnText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label>
</div>
<div>
<span id="fireReturn" class="circle-light bg-secondary"></span>
</div>
</div>
<div class="d-flex justify-content-around mt-2">
<div>
<label class="mb-0 fs-1-05" for="flexRadioDefault1">地震管制</label>
</div>
<div>
<label id="earQuaConText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label>
</div>
<div>
<span id="earQuaCon" class="circle-light bg-secondary"></span>
</div>
</div>
<div class="d-flex justify-content-around mt-2">
<div class="">
<label class="mb-0 fs-1-05" for="flexRadioDefault1">遠端休止</label>
</div>
<div>
<label id="disResText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label>
</div>
<div>
<span id="disRes" class="circle-light bg-secondary"></span>
</div>
</div>
<div class="d-flex justify-content-around mt-2">
<div>
<label class="mb-0 fs-1-05" for="flexRadioDefault1">RET運轉</label>
</div>
<div>
<label id="retOpeText" class="mb-0 fs-1-05" for="flexRadioDefault1">未動作</label>
</div>
<div>
<span id="retOpe" class="circle-light bg-secondary"></span>
</div>
</div>-->
</div>
<!-- End-右邊功能區 -->
<!-- Modal-Card1 -->
<div class="modal fade" id="card1" data-keyboard="false" tabindex="-1"
aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header d-flex justify-content-between">
<div>
<h5 class="modal-title" id="staticBackdropLabel">1</h5>
</div>
<div class="">
<a type="button" class="mr-2" data-toggle="tooltip" data-placement="top"
title="即時狀態">
<i class="fal fa-tv fa-2x" data-toggle="modal"
data-target="#exampleModal"></i>
</a>
<a type="button" class="mr-2" data-toggle="tooltip" data-placement="top"
title="基本資訊">
<i class="fal fa-cog fa-2x" data-toggle="modal"
data-target="#exampleModal"></i>
</a>
<a type="button" class="mr-2" data-toggle="tooltip" data-placement="top"
title="異常資料">
<i class="fal fa-exclamation-triangle fa-2x" data-toggle="modal"
data-target="#exampleModal"></i>
</a>
<a type="button" class="" data-toggle="tooltip" data-placement="top"
title="運維紀錄">
<i class="fal fa-server fa-2x" data-toggle="modal"
data-target="#exampleModal"></i>
</a>
</div>
</div>
<div class="modal-body">
<div class="modal fade" id="exampleModal" tabindex="-1"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
...
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modal-ReplaySystem -->
<div class="modal fade" id="staticBackdrop" data-backdrop="static" data-keyboard="false"
tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="staticBackdropLabel">重播系統</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<label>
播放日期 : <input type="date"> ~ <input type="date"> 時段 :
<input type="time">
</label>
<div>
播放速度 :
<div class="btn-group mt-2">
<button class="btn btn-info">正常</button>
<button class="btn btn-info">1.5x</button>
<button class="btn btn-info">2.0x</button>
<button class="btn btn-info">3.0x</button>
</div>
</div>
<div class="row mt-2">
<div>
<button class="btn btn-info">
<i class="fas fa-play fa-1x"></i>
</button>
</div>
<div class="progress" style="width: 85%">
<div class="progress-bar bg-info" role="progressbar" style="width: 15%"
aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<!-- 電梯圖表 -->
<div class="mt-3">
<table class="table table-bordered">
<tbody class="text-center">
<tr>
<td></td>
<td colspan="4">Bank1</td>
<td colspan="2">Bank2</td>
</tr>
<tr>
<td></td>
<td colspan="2">#1</td>
<td colspan="2">#2</td>
<td colspan="2">#3</td>
</tr>
<tr>
<td>位置/模式</td>
<td>1F</td>
<td>自動運轉</td>
<td>1F</td>
<td>自動運轉</td>
<td>4F</td>
<td>自動運轉</td>
</tr>
<tr>
<td>負載/狀態</td>
<td>40%</td>
<td>*</td>
<td>0%</td>
<td>*</td>
<td>80%</td>
<td>*</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>10F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>9F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>8F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>7F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>6F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>5F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>4F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>3F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>2F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>1F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<td>B1F</td>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<th>B2F</th>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
<tr>
<th>B3F</th>
<td id="elevator1-1"></td>
<td></td>
<td id="elevator2-1"></td>
<td></td>
<td id="elevator3-1"></td>
<td></td>
</tr>
</tbody>
</table>
</div>
<!-- End-電梯圖表 -->
</div>
</div>
</div>
</div>
<!-- End-Modal-ReplaySystem -->
<!-- Modal-ElevatorManagement -->
<div class="modal fade" id="eleManModal" tabindex="-1" aria-labelledby="eleManModal" aria-hidden="true" data-keyboard="false">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title">電梯管理</h1>
<button type="button" class="close m-0 p-0 px-2 ml-auto" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div id="tabDiv">
<table id="eleManTable" class="table table-hover w-100">
</table>
</div>
<div id="detDevDiv" style="display:none">
<button class="btn btn-info" data-toggle="prevDiv"><i class="fas fa-angle-left mr-2"></i>上一頁</button>
<table id="eleManDevTable" class="table table-hover">
<thead>
<tr class="text-center">
<th scope="col">號機</th>
<th scope="col">狀態</th>
<th scope="col">所在樓層</th>
<th scope="col">防疫對策</th>
<th scope="col">遠隔休止</th>
<th scope="col">獨立運轉</th>
<th scope="col">VIP</th>
<th scope="col">回歸運轉</th>
</tr>
</thead>
<tbody>
<tr class="text-center">
<td name="devName"></td>
<td name="status"></td>
<td name="curFloor"></td>
<td>
<div class="d-flex justify-content-center align-items-center">
<div class="row mr-2">
<input name="preMea" type="checkbox" class="toggle" data-toggle="toggle" data-point="SP_DP">
</div>
<i id="preMeaSche" data-point="DP" class="fas fa-calendar-alt fs-1-1 mr-2 cur-poi"></i>
</div>
</td>
<td>
<div class="d-flex justify-content-center align-items-center">
<div class="row mr-2">
<input name="stop" type="checkbox" class="toggle" data-toggle="toggle" data-point="SP_RCS">
</div>
<i id="stopSche" data-point="RCS" class="fas fa-calendar-alt fs-1-1 mr-2 cur-poi"></i>
</div>
</td>
<td>
<div class="d-flex justify-content-center align-items-center">
<div class="row mr-2">
<input name="onlyOpe" type="checkbox" class="toggle" data-toggle="toggle" data-point="SP_IND">
</div>
<i id="onlyOpeSche" data-point="IND" class="fas fa-calendar-alt fs-1-1 mr-2 cur-poi"></i>
</div>
</td>
<td>
<div class="d-flex justify-content-center align-items-center">
<div class="row mr-2">
<input name="vip" type="checkbox" class="toggle" data-toggle="toggle" data-point="SP_VIP">
</div>
<i id="vipSche" data-point="VIP" class="fas fa-calendar-alt fs-1-1 mr-2 cur-poi"></i>
</div>
</td>
<td>
<div class="d-flex justify-content-center align-items-center">
<div class="row mr-2">
<input name="retOpe" type="checkbox" class="toggle" data-toggle="toggle" data-point="SP_RET">
</div>
<i id="retOpeSche" data-point="RET" class="fas fa-calendar-alt fs-1-1 mr-2 cur-poi"></i>
</div>
</td>
</tr>
</tbody>
</table>
<div id="bajaSche" class="w-100">
</div>
</div>
<div id="detMasDiv" style="display:none">
<button class="btn btn-info" data-toggle="prevDiv"><i class="fas fa-angle-left mr-2"></i>上一頁</button>
<div class="row m-0">
<table id="notSerFloTable" class="table table-hover col-xl-4">
</table>
<div id="bajaMasSche" class="col-xl-8">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End-Modal-ElevatorManagement -->
<!-- Modal-ElevatorManagement -->
<div class="modal fade" id="exampleModal1-1" tabindex="-1" aria-labelledby="exampleModalLabel"
aria-hidden="true" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title" id="exampleModalLabel">電梯管理</h1>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<table class="table table-hover">
<thead>
<tr class="text-center">
<th scope="col">號機</th>
<th scope="col">狀態</th>
<th scope="col">所在樓層</th>
<th scope="col">防疫對策</th>
<th scope="col">遠隔休止</th>
<th scope="col">獨立運轉</th>
<th scope="col">VIP</th>
<th scope="col">回歸運轉</th>
</tr>
</thead>
<tbody>
<tr class="text-center">
<th>1</th>
<th>運作中</th>
<th>3F</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID1-1"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID1-1">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID1-2"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID1-2">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID1-3"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID1-3">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID1-4"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID1-4">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID1-5"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID1-5">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- End-Modal-ElevatorManagement -->
<!-- Modal-ElevatorManagement -->
<div class="modal fade" id="exampleModal1-2" tabindex="-1" aria-labelledby="exampleModalLabel"
aria-hidden="true" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title" id="exampleModalLabel">電梯管理</h1>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<table class="table table-hover">
<thead>
<tr class="text-center">
<th scope="col">號機</th>
<th scope="col">狀態</th>
<th scope="col">所在樓層</th>
<th scope="col">防疫對策</th>
<th scope="col">遠隔休止</th>
<th scope="col">獨立運轉</th>
<th scope="col">VIP</th>
<th scope="col">回歸運轉</th>
</tr>
</thead>
<tbody>
<tr class="text-center">
<th>2</th>
<th>保養</th>
<th>2F</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID2-1"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID2-1">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID2-2"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID2-2">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID2-3"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID2-3">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID2-4"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID2-4">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID2-5"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID2-5">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- End-Modal-ElevatorManagement -->
<!-- Modal-ElevatorManagement -->
<div class="modal fade" id="exampleModal2-1" tabindex="-1" aria-labelledby="exampleModalLabel"
aria-hidden="true" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title" id="exampleModalLabel">電梯管理</h1>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<table class="table table-hover">
<thead>
<tr class="text-center">
<th scope="col">號機</th>
<th scope="col">狀態</th>
<th scope="col">所在樓層</th>
<th scope="col">防疫對策</th>
<th scope="col">遠隔休止</th>
<th scope="col">獨立運轉</th>
<th scope="col">VIP</th>
<th scope="col">回歸運轉</th>
</tr>
</thead>
<tbody>
<tr class="text-center">
<th>2</th>
<th>運作中</th>
<th>B1F</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID3-1"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID3-1">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID3-2"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID3-2">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID3-3"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID3-3">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID3-4"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID3-4">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
<th>
<div class="d-flex justify-content-center">
<div class="switch mr-2">
<input class="switch-checkbox" id="switchID3-5"
type="checkbox" name="switch-checkbox">
<label class="switch-label" for="switchID3-5">
<div class="switch-txt" turnOn="On" turnOff="Off"></div>
<div class="switch-Round-btn"></div>
</label>
</div>
<img type="button" src="img\u1673.svg">
</div>
</th>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- End-Modal-ElevatorManagement -->
<div class="page-content-overlay" data-action="toggle" data-class="mobile-nav-on"></div>
</div>
<script>
var eleManTable = null;
var allDevList = []; //每個設備
var subSeviceData = []; //每個設備訂閱點位值
var floList = []; //每個樓層
var elevObj = null; //左側 2D 電梯物件
var subOrdPath = {
"area_tag": pageAct.AreaTag,
"building_tag": pageAct.buiTag,
"system_tag": pageAct.sysMainTag,
"name_tag": pageAct.sysSubTag,
};
//平面圖參數
var floChart = null;
var currentData = [];
var allDeviceRowData = []; //所有設備原始資料
var global_emergency_alarm_device_number = [];
var zoomToggle = 3;
var isFirstLoad3D = true;
var isFirstLoadSub = true;
var forgeInvType = null;
var forgeInvTypeDef = null;
$(function () {
initChart();
getInviForge();
setBuildFloor();
setCards();
setEleManTable();
show3D();
})
function getFloDevList() {
}
//baja 訂閱設備
function subDeviceSetStatus(data) {
if (allDevList.length == 0) {
return false;
}
data.device_number = data.device_number_full;
let matchDevice = allDevList.filter(x => x.device_number == data.device_number)[0];
if (!matchDevice) return;
let master = matchDevice.device_number.split("_")[5];
//將訂閱值塞入 subSeviceData
if (subSeviceData.findIndex(x => x.device_number == matchDevice.device_number) == -1) {
let obj = {};
obj.device_number = matchDevice.device_number;
subSeviceData.push(obj)
}
let subData = subSeviceData.filter(x => x.device_number == matchDevice.device_number)[0];
if (subData) {
subData[data.point_name] = data.value;
}
function getValueByName(pointName) {
return data.point_name == pointName ? data.value : null;
}
function actLightByPoi(pointName, selector) {
if (getValueByName(pointName) == "trueText") {
$(selector).removeClass("bg-secondary").addClass("bg-orange");
$(selector).parent("div").prev().find("label").text("運轉中");
} else if (getValueByName(pointName) == "falseText") {
$(selector).removeClass("bg-orange").addClass("bg-secondary");
$(selector).parent("div").prev().find("label").text("未動作");
}
}
function actLightByPoiEx(pointName1, selector, pointName2, exCond) {
$(selector).removeClass("bg-orange").removeClass("bg-danger").removeClass("bg-secondary").removeClass("bg-success");
$(selector).parent("td").prev().find("label").text("未動作");
if (subData[pointName2] == exCond) {
if (subData[pointName1] == "falseText") {
$(selector).addClass("bg-secondary");
$(selector).parent("td").prev().find("label").text("取消控制");
} else {
$(selector).addClass("bg-danger");
$(selector).parent("td").prev().find("label").text("控制");
}
} else {
$(selector).parent("td").prev().find("label").text("休止");
$(selector).addClass("bg-success");
}
}
//狀態
if (data.point_name == "ST") {
$(`#${matchDevice.device_number}_card [name=devStatus]`).text(data.value);
//若為異常(match資料庫點位值)且後台有設定為閃爍
if (getValueByName("ST") == matchDevice.device_error_point_value) {
$(`#${matchDevice.device_number}_card`).addClass("light-flash");
} else {
$(`#${matchDevice.device_number}_card`).removeClass("light-flash");
}
}
//現在樓層
if (data.point_name == "CP") {
console.log("電梯樓層", matchDevice.device_number, data.value)
$(`#${matchDevice.device_number}_card [name=curFloor]`).text(data.value);
}
if (data.point_name == "RD") {
//往上或往下
if (getValueByName("RD") == "UP") {
$(`#${matchDevice.device_number}_card [name=downFloArrow]`).removeClass("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");
}
}
if (data.device_number.split("_").slice(-1) == "N1" && master == "BANK1") {
//消防回歸
actLightByPoi("FE", "#emerReturn");
//群控故障
actLightByPoi("GCM", "#groConFail");
//緊急電源
actLightByPoi("EPS", "#emerPower");
//火災回歸
actLightByPoi("FER", "#fireReturn");
//地震管制
actLightByPoi("EER", "#earQuaCon");
if (data.point_name == "DNO" || data.point_name == "SP_RCS") {
//遠端休止
actLightByPoiEx("SP_RCS", "#disRes", "DNO", "trueText");
}
if (data.point_name == "COR" || data.point_name == "SP_RET") {
//RET運轉
actLightByPoiEx("SP_RET", "#retOpe", "COR", "falseText");
}
}
// 設置燈色、卡片閃爍
setLightColor();
// Card table 更新
subDeviceSetTable(matchDevice.device_number);
// 重繪 電梯管理 列表
reloadEleManTable(setEleManTabDataFromBaja());
// 電梯管理 detail
subDeviceSetEleManDet(matchDevice.device_number);
// 電梯管理 不服務樓層 detail
//subDeviceSetEleManNotSerFloor(master);
}
// baja 訂閱 變更 電梯管理 Table
function setEleManTabDataFromBaja() {
let result = [];
let masterList = allDevList.map(x => x.device_number.split("_")[5]).Distinct();
// Master(第六段) 區分
$.each(masterList, (idx, master) => {
let main = {};
// 匯入 Master 名稱`
main.devName = master;
let subData = subSeviceData.filter(x => x.device_number.split("_")[5] == master)[0];
if (subData) {
$.each(Object.keys(subData), (idx3, subKey) => {
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];
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;
}
// Card - 設置列表中訂閱內容
function subDeviceSetTable(devNum) {
let subData = subSeviceData.filter(x => x.device_number == devNum)[0]
let matchDevice = allDevList.filter(x => x.device_number == devNum)[0];
if (!subData) {
return false;
}
function creLight(type = "trueText") {
let lightType = type == "trueText" ? "bg-success" : "bg-danger";
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]);
//左側 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"]);
}
//現在樓層
if (subData["CP"]) {
$(`#imdStaTable_${devNum} [name=curFloor]`).text(subData["CP"]);
}
//往上或往下
if (subData["RD"] == "UP") {
$(`#imdStaTable_${devNum} [name=downFloArrow]`).removeClass("light-flash-c");
$(`#imdStaTable_${devNum} [name=upFloArrow]`).addClass("light-flash-c");
} else if (subData["RD"] == "DOWN") {
$(`#imdStaTable_${devNum} [name=upFloArrow]`).removeClass("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)
$(`#imdStaTable_${devNum} #devName`).text(matchDevice.full_name);
$(`#imdStaTable_${devNum} #devNum`).text(devNum);
$(`#imdStaTable_${devNum} #status`).text(subData["ST"])
$(`#imdStaTable_${devNum} #group`).text(masterTag);
$(`#imdStaTable_${devNum} #weight`).text(subData["LOAD"])
//運轉模式(右側Table)
$(`#opeModTable_${devNum} #auto`).html(creLight(subData["DNO"]))
$(`#opeModTable_${devNum} #vip`).html(creLight(subData["MD"]))
$(`#opeModTable_${devNum} #onlyRun`).html(creLight(subData["IND"]))
$(`#opeModTable_${devNum} #manual`).html(creLight(subData["HAND"]))
$(`#opeModTable_${devNum} #runOpe`).html(creLight(subData["MID"]))
$(`#opeModTable_${devNum} #returnFin`).html(creLight(subData["COR"]))
$(`#opeModTable_${devNum} #notSerFloor`).text(notSerFloors.join("、"))
}
//取得設備 並繪製Card
function setCards() {
let url = baseApiUrl + "/api/Device/GetDeviceList";
let sendData = {
sub_system_tag: pageAct.sysSubTag,
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 = ``;
let masterArr = [];
$("#eleCards").html("");
$.each(res.data, (index, floObj) => {
let masters = floObj.device_list.map(x => x.device_number?.split("_")[5]).Distinct();
$.each(masters, (idx, master) => {
let masDiv = creDiv(["col-12", "row", "m-0", "gap-5"]);
masDiv.append(creEle("h2", master, null, null, ["col-12", "p-0"]));
strHtml = ``;
floObj.device_list.filter(x => x.device_number?.split("_")[5] == master).forEach((devObj) => {
allDevList.push(devObj);
allDevList = allDevList.oSort("priority")
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">
<span class="d-flex">
<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>
</span>
<h4 name="curFloor" class="d-flex justify-content-end mb-0"></h4>
<span class="d-flex">
<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>
</span>
</div>
</div>`));
})
$("#eleCards").append(masDiv);
})
})
initPopover();
//平面圖載入
chartHandler(`${baseImgUrl}/upload/floor_map/${res.data[0].floor_map_name}`);
getDevice(res.data[0].device_list);
}
}, null, "POST").send();
}
//左側 2D 樓層 Table
function setBuildFloor() {
elevObj = new ElevatorHandler("#floorTable");
}
// Card 即時狀態
function drawStateTabBlo(devNum) {
let div = creDiv(["row"]);
div.append(creDiv(["col-xl-6"]).append(drawImdStaBlock(devNum)))
div.append(creDiv(["col-xl-6"]).append(drawOpeModBlock(devNum)))
return div.outerHtml();
}
// Card 即時狀態 - 左側 table
function drawImdStaBlock(devNum) {
let tabEle = $(`<table id="imdStaTable_${devNum}" class="table table-bordered table-striped text-center m-0" style="min-width: 200px">`);
let tbody = tabEle.append("<tbody>");
let rows =
[
{ id: "devName", text: "號機" },
// { id: "devNum", text: "Tag Name" },
{ id: "status", text: "狀態" },
{ id: "group", text: "組別" },
{ id: "weight", text: "載重" },
];
let cols = [
{ width: "30%" },
{ width: "40%" },
{ width: "30%" },
]
let data = [{
row: 0, col: 2, style: "vertical-align:middle",
data: `<div class="flex-column">
<i name="upFloArrow" class="fas fa-caret-up fa-3x ml-auto" style="--flash-color-1:#6fe560;--flash-color-2:#fff;"></i>
<h4 name="curFloor" class="d-flex justify-content-center mb-0"></h4>
<i name="downFloArrow" class="fas fa-caret-down fa-3x ml-auto" style="--flash-color-1:#6fe560;--flash-color-2:#fff;"></i>
</div>
`}]
$.each(rows, (index, row) => {
let tr = $("<tr></tr>");
$.each(cols, (index2, col) => {
if (index < 1 || index > 99 || index2 != 2) {
let td = $("<td></td>");
td.css("width", col.width)
if (index2 == 0) {
td.text(row.text);
}
if (index2 == 1) {
td.prop("id", row.id)
}
if (index == 0 && index2 == 2) {
td.attr("rowspan", 99)
}
if (data.filter(x => x.row == index && x.col == index2).length != 0) {
let target = data.filter(x => x.row == index && x.col == index2)[0];
td.css("cssText", target.style);
td.html(target.data);
}
tr.append(td);
}
})
tbody.append(tr);
})
return tabEle.outerHtml();
}
// Card 即時狀態 - 右側 table
function drawOpeModBlock(devNum) {
let tabEle = $(`<table id="opeModTable_${devNum}" class="table table-bordered table-striped text-center m-0" style="min-width: 200px">`);
let tbody = tabEle.append("<tbody>");
let rows =
[
{ id: "auto", text: "自動" },
{ id: "vip", text: "VIP" },
{ id: "onlyRun", text: "獨立運轉" },
{ id: "manual", text: "手動" },
{ id: "runOpe", text: "保養運轉" },
{ id: "returnFin", text: "回歸完了" },
{ id: "notSerFloor", text: "不服務樓層" },
];
let cols = [
{ width: "50%" },
{ width: "50%" },
]
$.each(rows, (index, row) => {
let tr = $("<tr></tr>");
$.each(cols, (index2, col) => {
let td = $("<td></td>");
td.css("width", col.width)
if (index2 == 0) {
td.text(row.text);
}
if (index2 == 1) {
td.prop("id", row.id)
}
tr.append(td);
})
tbody.append(tr);
})
return tabEle.outerHtml();
}
// 電梯管理 Modal - 資料更新
function reloadEleManTable(datas) {
let tabCols = eleManTable.context[0].aoColumns.map(x => x.data);
$.each(datas, (idx, data) => {
$.each(tabCols, (idx2, value) => {
if (Object.keys(data).indexOf(value) == -1) {
datas[idx][value] = null;
}
})
})
eleManTable.clear().rows.add(datas).draw();
}
// 電梯管理 Modal - table 初始化
function setEleManTable() {
let tag = "#eleManTable";
let datas = [];
let column_defs = [
{ "targets": [0], "width": "10%", "sortable": false },
{ "targets": [1], "width": "10%", "sortable": false },
{ "targets": [2], "width": "10%", "sortable": false },
{ "targets": [3], "width": "10%", "sortable": false },
{ "targets": [4], "width": "10%", "sortable": false },
{ "targets": [5], "width": "10%", "sortable": false },
{ "targets": [6], "width": "10%", "sortable": false },
{ "targets": [7], "width": "10%", "sortable": false },
{ "targets": [8], "width": "10%", "sortable": false },
{ "targets": [9], "width": "10%", "sortable": false },
];
let columns = [
{
"title": "號機",
"data": "devName",
},
{
"title": "狀態",
"data": "ST",
},
{
"title": "所在樓層",
"data": "CP",
},
{
"title": "載重",
"data": "LOAD",
},
{
"title": "休止",
"data": "SP_RCS",
},
{
"title": "獨立運轉",
"data": "SP_IND",
},
{
"title": "VIP",
"data": "SP_VIP",
},
{
"title": "回歸",
"data": "SP_RET",
},
{
"title": "不服務樓層",
"data": null,
"render": function (data, type, row) {
let result = "";
if (row._rowType == "master") {
result = Object.keys(row).filter(x => x.startsWith("SP_FLS_") && row[x] == "trueText").map(x => x?.split("SP_FLS_")[1]).join("、");
}
return result;
}
},
{
"title": "動作",
"data": null,
"className": "text-center",
"render": function (data, type, row) {
let btn = '';
if (row._rowType == "master") {
btn = creBtn("編輯", "eleManMasEdit" + row.devName, null, ["btn", "btn-info"]);
} else if (row._rowType == "device") {
btn = creBtn("編輯", "eleManDevEdit" + row.devNum, null, ["btn", "btn-info"]);
}
btn.append(`<i class="fal fa-pen pl-1"></i>`);
return btn.outerHtml();
}
},
];
eleManTable = new YourTeam.JqDataTables.getTableByStatic(tag, datas, columns, column_defs, null, null, null, null, "tpi");
eleManTable.order([]).draw();
}
// 電梯管理 Modal - 設置 Detail 訂閱內容
function subDeviceSetEleManDet(devNum) {
if ($("#eleManModal").is(":visible") == false) {
return false;
}
let subData = subSeviceData.filter(x => x.device_number == devNum)[0]
let matchDevice = allDevList.filter(x => x.device_number == devNum)[0];
if (!subData) {
return false;
}
function bajaValToBool(boolText) {
return boolText == "trueText";
}
$("#eleManModal #detDevDiv [name=devName]").text(matchDevice.full_name);
$("#eleManModal #detDevDiv [name=status]").text(subData["ST"]);
$("#eleManModal #detDevDiv [name=curFloor]").text(subData["CP"]);
$("#eleManModal #detDevDiv [name=preMea]").prop("checked", bajaValToBool(subData["SP_DP"])); //防疫對策
$("#eleManModal #detDevDiv [name=stop]").prop("checked", bajaValToBool(subData["SP_RCS"]));
$("#eleManModal #detDevDiv [name=onlyOpe]").prop("checked", bajaValToBool(subData["SP_IND"]));
$("#eleManModal #detDevDiv [name=vip]").prop("checked", bajaValToBool(subData["SP_VIP"]));
$("#eleManModal #detDevDiv [name=retOpe]").prop("checked", bajaValToBool(subData["SP_RET"]));
}
// 電梯管理 Modal - 設置 不服務樓層 訂閱內容
function subDeviceSetEleManNotSerFloor(master) {
if ($("#eleManModal").is(":visible") == false) {
return false;
}
let subData = subSeviceData.filter(x => x.device_number.split("_")[5] == master)[0];
let allSerFloors = Object.keys(subData).filter(x => x.startsWith("SP_FLS_")).map(x => x?.split("SP_FLS_")[1]);
$("#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]);
$(`[name^=notSerChk]`).prop("checked", false);
$.each(notSerFloors, (idx, floor) => {
$(`[name=notSerChk${floor}]`).prop("checked", true);
})
}
// 電梯管理 Modal - 不服務樓層 設定列表
function setNotSerFloTable(floors) {
let tbody = $("<tbody></tbody>");
let rows = [];
$.each(floors, (idx, floor) => {
rows.push({ id: floor, text: floor });
})
let cols = [
{ width: "50%" },
{ width: "50%" },
]
let datas = [];
$.each(rows, (idx, row) => {
datas.push({
row: idx,
col: 1,
data: `<input name="notSerChk${row.text}" data-point="SP_FLS_${row.id}" type="checkbox" class="toggle" data-toggle="toggle">`,
})
})
$.each(rows, (index, row) => {
let tr = $("<tr></tr>");
$.each(cols, (index2, col) => {
let td = $("<td></td>");
td.css("width", col.width)
if (index2 == 0) {
td.text(row.text);
}
if (index2 == 1) {
td.prop("id", row.id)
}
if (datas.filter(x => x.row == index && x.col == index2).length != 0) {
let target = datas.filter(x => x.row == index && x.col == index2)[0];
td.css("cssText", target.style);
td.html(target.data);
}
tr.append(td);
})
tbody.append(tr);
})
return tbody.outerHtml();
}
// 電梯管理 Modal 按下設備編輯進入 Detail
onEvent("click", "#eleManTable [id^=eleManDevEdit]", function () {
let devNum = $(this).prop("id").split("eleManDevEdit")[1];
let scheBtn = ["preMeaSche", "stopSche", "onlyOpeSche", "vipSche", "retOpeSche"];
$("#detDevDiv").data("devnum", devNum);
$("#bajaSche").html("");
// 電梯管理 Modal 切換到 detail 頁面
modalTogDiv("#eleManModal", "#tabDiv", "#detDevDiv", "next", function () {
subDeviceSetEleManDet(devNum);
$.each(scheBtn, (idx, scheSelector) => {
onEvent("click", `#${scheSelector}`, function () {
let devNumPath = devNum.split("_").join("/");
let point = $(this).data("point");
let ifHtml = `<iframe src="/ord?station:%7Cslot:${devNumPath}/Sch_${point}|view:?fullScreen=true" width="100%" height="100%" style="height:30rem"></iframe>`
$("#bajaSche").html(ifHtml);
})
})
})
})
// 電梯管理 Modal 按下設備編輯進入 Detail
onEvent("click", "#eleManTable [id^=eleManMasEdit]", function () {
let master = $(this).prop("id").split("eleManMasEdit")[1];
let subData = subSeviceData.filter(x => x.device_number.split("_")[5] == master)[0];
$("#bajaMasSche").html("");
$("#detMasDiv").data("devnum", subData.device_number);
// 電梯管理 Modal 切換到 detail 頁面
modalTogDiv("#eleManModal", "#tabDiv", "#detMasDiv", "next", function () {
subDeviceSetEleManNotSerFloor(master);
let devNumPath = subData.device_number?.split("_").join("/");
let ifHtml = `<iframe src="/ord?station:%7Cslot:${devNumPath}/Sch_FLS|view:?fullScreen=true" width="100%" height="100%" style="height:30rem"></iframe>`
$("#bajaMasSche").html(ifHtml);
})
})
// 電梯管理 Modal 不服務樓層 設定不服務樓層(BAJA)
onEvent("change", "#notSerFloTable [name^=notSerChk]", function () {
let devNum = $("#detMasDiv").data("devnum");
let devNumPath = devNum?.split("_").join("/");
let checked = $(this).prop("checked");
let tarPoint = $(this).data("point");
require(['baja!'], function (baja) {
baja.Ord.make(`local:|foxs:|station:|slot:/${devNumPath}`).get()
.then(function (folder) {
folder.getSlots().isComponent().eachValue(function (point) {
if (point.getDisplayName() == tarPoint) {
point.set1({
value: checked
})
}
})
});
});
})
// 電梯管理 Modal 設備 設定點位(BAJA)
onEvent("change", "#eleManDevTable input:checkbox", function () {
let devNum = $("#detDevDiv").data("devnum");
let tarPoint = $(this).data("point");
let checked = $(this).prop("checked");
let devNumPath = devNum?.split("_").join("/");
require(['baja!'], function (baja) {
baja.Ord.make(`local:|foxs:|station:|slot:/${devNumPath}`).get()
.then(function (folder) {
folder.getSlots().isComponent().eachValue(function (point) {
if (point.getDisplayName() == tarPoint) {
point.set1({
value: checked
})
}
})
});
});
})
// 切換 modal 內 div 頁面
function modalTogDiv(modal, div1, div2, type = "next", callback = null) {
$(modal).find(div1).parent("div").css("overflow", "hidden");
$(modal).find(div1).css({ "position": "relative" });
$(modal).find(div2).css({ "position": "relative" });
let aniDiv1Obj = {}, aniDiv2Obj = {};
if (type == "next") {
aniDiv1Obj.left = "-200%";
aniDiv2Obj.left = "0%";
} else if (type == "back") {
aniDiv1Obj.left = "200%";
aniDiv2Obj.left = "0%";
}
$(modal).find(div1).animate(aniDiv1Obj, 400, function () {
$(modal).find(div1).css("display", "none");
$(modal).find(div2).css("display", "block");
$(modal).find(div2).animate(aniDiv2Obj, 400, function () {
callback ? callback() : "";
})
if (type == "next") {
$(modal).find("[data-toggle='prevDiv']").show();
} else {
$(modal).find("[data-toggle='prevDiv']").hide();
}
let modalId = $(modal).prop("id");
onEvent("click", `#${modalId} [data-toggle='prevDiv']`, function () {
modalTogDiv(modal, div2, div1, "back", function () {
})
})
});
}
//=====================================================================
// ↓ 樓層平面圖 ↓
//=====================================================================
function getDevice(devList) {
let selected_floor = devList[0];
//let selected_floor_objs = devList.filter(function (item) {
// return item.floor_guid == selected_floor.floor_guid;
//});
//currentData = selected_floor_objs[0].device;
currentData = $.map(devList, function (item) {
//資料處理
if (selected_floor.device_number != undefined
&& selected_floor.device_number != null
&& selected_floor.device_number != ""
&& selected_floor.device_number == item.device_number) {
item.selected = true;
} else {
item.selected = false;
}
if (item.device_coordinate != undefined && item.device_coordinate != null) {
var coordinate = item.device_coordinate.split(',')
item.value = [
parseFloat(coordinate[0]),
parseFloat(coordinate[1])
]
}
if (item.device_nodes != undefined
&& item.device_nodes != null
&& item.device_nodes.length > 0) {
if (item.device_master_number == selected_floor.device_master) {
//var datatable_data = {
// device_full_name: item.full_name,
// device_number: item.device_number,
// device_master: item.device_master_number
//}
//datatable_data_list.push(datatable_data);
$.map(item.device_nodes, function (item_node) {
item_node.selected = false;
if (item_node.device_node_coordinate != undefined && item_node.device_node_coordinate != null) {
var node_coordinate = item_node.device_node_coordinate.split(',')
item_node.value = [
parseFloat(node_coordinate[0]),
parseFloat(node_coordinate[1])
]
}
});
}
else {
//var index = datatable_data_list.findIndex(x => x.device_number == item.device_number);
//if (index < 0) {
// var datatable_data = {
// device_number: item.device_number,
// device_master: item.device_master_number
// }
// datatable_data_list.push(datatable_data);
//}
$.map(item.device_nodes, function (item_node) {
item_node.selected = false;
if (item_node.device_node_coordinate != undefined && item_node.device_node_coordinate != null) {
var node_coordinate = item_node.device_node_coordinate.split(',')
item_node.value = [
parseFloat(node_coordinate[0]),
parseFloat(node_coordinate[1])
]
}
});
}
}
return item;
});
if (currentData == null || currentData.length == 0) {
this.currentData = [];
}
// myBaja.setPrepareSubscribeDevices(currentData);
// myBaja.setCallBack(mySubscribeDevices);
//if (datatable_data_list.length > 0) {
// $("#datatablediv").show();
// dataTableDraw();
//} else {
// $("#datatablediv").hide();
//}
resetData();
}
onEvent("click", "#resChartZoom", function () {
floChart.setOption({
geo: {
center: null,
zoom: 1.2,
},
});
resetData();
})
function initChart() {
let chartDom = $("#floChart")[0];
floChart = echarts.init(chartDom, null, { width: 'auto' });
}
function chartHandler(url) {
floChart.clear();
$.get(url, function (svg) {
if (svg == undefined || svg == null) {
return;
}
echarts.registerMap('floor_svg', { svg: svg });
option = {
// animationDurationUpdate: 1500,
tooltip: {
formatter: function (params) {
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>
Guid${params.data.device_node_guid}`
}
else {
return `名稱:${params.data.full_name}<br>
Guid${params.data.device_guid}`
}
}
},
toolbox: { //工具欄
show: false
},
geo: {
map: 'floor_svg',
roam: true,
scaleLimit: { //限制放大縮小倍數
max: 32,
min: 1
},
layoutSize: '100%',
layoutCenter: ['40%', '50%'],
zoom: 1.2,
silent: true
},
series: [
{ //不管有無被選擇(圓點)
type: 'scatter',
coordinateSystem: 'geo',
geoIndex: 0,
symbol: 'circle',
symbolSize: 10,
symbolOffset: [10, 10],
label: {
show: false
},
/*data: currentData,*/
z: 2
},
{ //未選擇的設備(icon)
type: 'scatter',
coordinateSystem: 'geo',
geoIndex: 0,
symbolSize: 30,
label: {
formatter: '{b}',
position: 'bottom',
show: true,
backgroundColor: 'orange'
},
emphasis: {
label: {
show: true,
fontSize: '20',
fontWeight: 'bold',
color: 'yellow'
}
},
selectedMode: 'single',
data: null,
z: 1
},
{ //被選擇的設備(icon)
type: 'effectScatter',
coordinateSystem: 'geo',
geoIndex: 0,
showEffectOn: 'render',
symbolSize: 30,
label: {
formatter: '{b}',
position: 'bottom',
show: true,
backgroundColor: 'orange'
},
emphasis: {
label: {
show: true,
fontSize: '20',
fontWeight: 'bold',
color: 'yellow'
}
},
selectedMode: 'single',
data: null,
z: 1
},
{ //編輯模式底下的設備(圓點,只會有一個)
type: 'scatter',
coordinateSystem: 'geo',
geoIndex: 0,
symbol: 'circle',
symbolSize: 10,
symbolOffset: [10, 10],
label: {
show: false
},
/*data: currentData,*/
z: 2
},
{ //編輯模式底下的設備(icon只會有一個)
type: 'scatter',
coordinateSystem: 'geo',
geoIndex: 0,
symbolSize: 30,
label: {
formatter: '{b}',
position: 'bottom',
show: true,
backgroundColor: 'orange'
},
emphasis: {
label: {
show: true,
fontSize: '20',
fontWeight: 'bold',
color: 'yellow'
}
},
data: null,
z: 1
},
],
};
floChart.setOption(option);
if (currentData != undefined && currentData != null && currentData.length > 0) {
resetData();
}
var ordPath = {
"building_tag": pageAct.buiTag,
"system_tag": pageAct.sysMainTag,
}
//myBaja.setSubscribeDevicesByBql(ordPath);
//myBaja.setSubscribeDevicesCallBack(subscribeCallBack);
/*console.log(floChart)*/
floChart.getZr().on('click', function (params) {
// console.log("click", params);
var pixelPoint = [params.offsetX, params.offsetY];
var dataPoint = floChart.convertFromPixel({ geoIndex: 0 }, pixelPoint);
// console.log(dataPoint);
temp_device_on_floor_map = [{
device_guid: selected_temp_device.device_guid,
device_full_name: selected_temp_device.device_full_name,
device_node_guid: selected_temp_device.device_node_guid ? selected_temp_device.device_node_guid : null,
device_node_full_name: selected_temp_device.device_node_full_name ? selected_temp_device.device_node_full_name : null,
status: selected_temp_device.status,
value: dataPoint
}];
// currentData.push([dataPoint[0], dataPoint[1], 1]);
// floChart.setOption(option);
});
//floChart.on('selectchanged', function (params) {
// console.log("selectchanged", params);
// // currentData.push([dataPoint[0], dataPoint[1], 1]);
// // floChart.setOption(option);
// currentData = $.map(currentData, function (item) {
// item.selected = false;
// return item;
// });
// if (params.selected.length > 0) {
// currentData[params.selected[0].seriesIndex - 1].selected = true;
// }
//});
// floChart.getZr().on('mousewheel', function (params) {
// console.log(params)
// })
floChart.on('georoam', function (params) {
var zoom = floChart.getOption().geo[0].zoom;
if (zoom <= 2.5) {
/*ResetFloorMap();*/
floChart.setOption({
geo: {
roam: 'scale'
},
});
} else {
floChart.setOption({
geo: {
roam: true
},
});
}
resetData();
});
})
.fail(function () {
// toast_warning("查無該樓層地圖")
floChart.clear();
});
}
//訂閱設備的回傳值,並塞到全域變數
function subscribeCallBack(change_device, is_need_reset = false) {
if (change_device != undefined && change_device != null) {
var target_device = allDeviceRowData.filter(x => x.device_number == change_device.device_number)[0];
if (target_device == undefined || target_device == null) {
//新增
obj = {
device_number: change_device.device_number,
points: [{
name: change_device.point_name,
value: change_device.value
}]
};
allDeviceRowData.push(obj);
}
else {
selected_device_point = target_device.points.find(x => x.name == change_device.point_name);
if (selected_device_point != null) {
selected_device_point.value = change_device.value;
}
else {
obj = {
name: change_device.point_name,
value: change_device.value
}
target_device.points.push(obj);
}
}
if (is_need_reset) {
resetData();
}
}
}
// 重設平面圖設備資料
function resetData() {
const scatter_symbol_convertData = function (data, zoom) { //正常、關閉排除CCVT(圓點)
let res = [], temp = [];
data.forEach(function (item, index) {
if (global_emergency_alarm_device_number != undefined
&& global_emergency_alarm_device_number != null) {
if (global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) < 0 && item.device_system_category_layer3 != "C") {
//如果有子節點,則只針對子節點操作
if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
item.device_nodes.forEach(function (item_node, item_node_index) {
//添加父節點相關資訊
item_node.device_system_category_layer3 = item.device_system_category_layer3;
item_node.device_normal_color = item.device_normal_color;
item_node.device_close_color = item.device_close_color;
//判斷父節點狀態
var device_index = allDeviceRowData.findIndex(x => x.device_number == item.device_number)
var temp_point_value;
if (device_index > -1) {
if (item.device_normal_point_name != null || item.device_close_point_name != null) {
//當其中point name 不為null的情況
if (item.device_normal_point_name != null) {
temp_point_value = allDeviceRowData[device_index].points.find(x => x.name == item.device_normal_point_name);
temp_point_value = allDeviceRowData[device_index].points[item.device_normal_point_name];
if (temp_point_value == item.device_normal_point_value) {
item_node.device_color = item.device_normal_color;
}
}
if (item.device_close_point_name != null) {
temp_point_value = allDeviceRowData[device_index].points[item.device_close_point_name];
if (temp_point_value == item.device_close_point_value) {
item_node.device_color = item.device_close_color;
}
}
} else {
if (item.device_normal_point_name == "ER") {
temp_point_value = allDeviceRowData[device_index].points[item.device_normal_point_name];
if (temp_point_value == "true") {
item_node.device_color = item.device_normal_color;
} else {
temp_point_value = allDeviceRowData[device_index].points[item.device_close_point_name];
if (temp_point_value == item.device_close_point_value) {
item_node.device_color = item.device_close_color;
}
}
} else if (item.device_close_point_name == "ER") {
temp_point_value = allDeviceRowData[device_index].points[item.device_close_point_name];
if (temp_point_value == "true") {
item_node.device_color = item.device_close_color;
} else {
temp_point_value = allDeviceRowData[device_index].points[item.device_normal_point_name];
if (temp_point_value == item.device_normal_point_value) {
item_node.device_color = item.device_normal_color;
}
}
} else {
temp_point_value = allDeviceRowData[device_index].points[item.device_normal_point_name];
if (temp_point_value == item.device_normal_point_value) {
item_node.device_color = item.device_normal_color;
} else if (temp_point_value == item.device_close_point_value) {
item_node.device_color = item.device_close_color;
}
}
}
}
temp.push(item_node);
});
} else {
var device_index = allDeviceRowData.findIndex(x => x.device_number == item.device_number)
if (device_index > -1) {
if (item.device_normal_point_name != null || item.device_close_point_name != null) {
//當其中point name 有為null的情況
if (item.device_normal_point_name != null) {
// temp_point_value = allDeviceRowData[device_index].points[item.device_normal_point_name];
temp_point_value = allDeviceRowData[device_index].points.find(x => x.name == item.device_normal_point_name).value;
if (temp_point_value == item.device_normal_point_value) {
item.device_color = item.device_normal_color;
}
}
if (item.device_close_point_name != null) {
// temp_point_value = allDeviceRowData[device_index].points[item.device_close_point_name];
temp_point_value = allDeviceRowData[device_index].points.find(x => x.name == item.device_close_point_name).value;
if (temp_point_value == item.device_close_point_value) {
item.device_color = item.device_close_color;
}
}
} else {
if (item.device_normal_point_name == "ER") {
// temp_point_value = allDeviceRowData[device_index].points[item.device_normal_point_name];
temp_point_value = allDeviceRowData[device_index].points.find(x => x.name == item.device_normal_point_name).value;
if (temp_point_value == "true") {
item.device_color = item.device_normal_color;
} else {
// temp_point_value = allDeviceRowData[device_index].points[item.device_close_point_name];
temp_point_value = allDeviceRowData[device_index].points.find(x => x.name == item.device_close_point_name).value;
if (temp_point_value == item.device_close_point_value) {
item.device_color = item.device_close_color;
}
}
} else if (item.device_close_point_name == "ER") {
// temp_point_value = allDeviceRowData[device_index].points[item.device_close_point_name];
temp_point_value = allDeviceRowData[device_index].points.find(x => x.name == item.device_close_point_name).value;
if (temp_point_value == "true") {
item.device_color = item.device_close_color;
} else {
// temp_point_value = allDeviceRowData[device_index].points[item.device_normal_point_name];
temp_point_value = allDeviceRowData[device_index].points.find(x => x.name == item.device_normal_point_name).value;
if (temp_point_value == item.device_normal_point_value) {
item.device_color = item.device_normal_color;
}
}
} else {
// temp_point_value = allDeviceRowData[device_index].points[item.device_normal_point_name];
temp_point_value = allDeviceRowData[device_index].points.find(x => x.name == item.device_normal_point_name).value;
if (temp_point_value == item.device_normal_point_value) {
item.device_color = item.device_normal_color;
} else if (temp_point_value == item.device_close_point_value) {
item.device_color = item.device_close_color;
}
}
}
}
item.zoom = zoom;
temp.push(item);
}
}
}
});
// let temp = data.filter(function (item, index) {
// if (global_emergency_alarm_device_number != undefined && global_emergency_alarm_device_number != null) {
// return global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) < 0 && item.device_system_category_layer3 != "C";
// } else {
// return [];
// }
// });
temp.map(function (item) {
var obj = {
device_guid: item.device_guid,
device_number: item.device_number,
full_name: item.full_name ? item.full_name : null,
device_node_guid: item.device_node_guid ? item.device_node_guid : null,
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
device_system_category_layer3: item.device_system_category_layer3 ? item.device_system_category_layer3 : null,
status: item.status,
value: item.value,
deviceItems: item.deviceItems,
deviceURL: item.deviceURL
}
obj.itemStyle = { 'color': item.device_color };
res.push(obj);
});
return res;
}
const scatter_icon_convertData = function (data) { //正常、關閉(icon)
let res = [], temp = [];
data.forEach(function (item, index) {
if (global_emergency_alarm_device_number != undefined
&& global_emergency_alarm_device_number != null) {
if (global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) < 0 && item.device_system_category_layer3 != "C") {
//如果有子節點,則只針對子節點操作
if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
item.device_nodes.forEach(function (item_node, item_node_index) {
//添加父節點相關資訊
item_node.device_system_category_layer3 = item.device_system_category_layer3;
item_node.device_normal_color = item.device_normal_color;
item_node.device_image = item.device_image;
temp.push(item_node);
});
} else {
temp.push(item)
}
}
}
});
temp = data.filter(function (item, index) {
if (global_emergency_alarm_device_number != undefined && global_emergency_alarm_device_number != null) {
return global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) < 0 && item.device_system_category_layer3 != "C";
} else {
return [];
}
});
temp.map(function (item) {
var obj = {
device_guid: item.device_guid,
device_number: item.device_number,
full_name: item.full_name ? item.full_name : null,
device_node_guid: item.device_node_guid ? item.device_node_guid : null,
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
device_system_category_layer3: item.device_system_category_layer3 ? item.device_system_category_layer3 : null,
status: item.status,
symbol: 'image://' + baseImgUrl + "/upload/device_icon/" + item.device_image,
value: item.value,
deviceItems: item.deviceItems,
deviceURL: item.deviceURL
}
if (item.selected) {
obj.symbolSize = 50
}
res.push(obj);
});
return res;
}
const scatter_error_convertData = function (data) { //異常(圓點)
let res = [], temp = [];
data.forEach(function (item, index) {
if (global_emergency_alarm_device_number != undefined
&& global_emergency_alarm_device_number != null) {
if (global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) > -1 && item.device_system_category_layer3 != "C") {
//如果有子節點,則只針對子節點操作
if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
item.device_nodes.forEach(function (item_node, item_node_index) {
//添加父節點相關資訊
item_node.device_system_category_layer3 = item.device_system_category_layer3;
item_node.device_error_color = item.device_error_color;
temp.push(item_node);
});
} else {
temp.push(item)
}
}
}
});
// if (global_emergency_alarm_device_number != undefined && global_emergency_alarm_device_number != null) {
// temp = data.filter(function (item, index) {
// return global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) > -1 && item.device_system_category_layer3 != "C";
// });
// }
temp.map(function (item) {
var obj = {
device_guid: item.device_guid,
device_number: item.device_number,
full_name: item.full_name ? item.full_name : null,
device_node_guid: item.device_node_guid ? item.device_node_guid : null,
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
device_system_category_layer3: item.device_system_category_layer3 ? item.device_system_category_layer3 : null,
status: item.status,
value: item.value,
deviceItems: item.deviceItems,
deviceURL: item.deviceURL
}
obj.itemStyle = { 'color': item.device_error_color };
res.push(obj);
});
return res;
}
const scatter_error_icon_convertData = function (data) { //異常(icon)
let res = [], temp = [];
data.forEach(function (item, index) {
if (global_emergency_alarm_device_number != undefined
&& global_emergency_alarm_device_number != null) {
if (global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) > -1 && item.device_system_category_layer3 != "C") {
//如果有子節點,則只針對子節點操作
if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
item.device_nodes.forEach(function (item_node, item_node_index) {
//添加父節點相關資訊
item_node.device_system_category_layer3 = item.device_system_category_layer3;
item_node.device_error_color = item.device_error_color;
item_node.device_image = item.device_image;
temp.push(item_node);
});
} else {
temp.push(item)
}
}
}
});
if (global_emergency_alarm_device_number != undefined && global_emergency_alarm_device_number != null) {
temp = data.filter(function (item, index) {
return global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) > -1 && item.device_system_category_layer3 != "C";
});
}
temp.map(function (item) {
var obj = {
device_guid: item.device_guid,
device_number: item.device_number,
full_name: item.full_name ? item.full_name : null,
device_node_guid: item.device_node_guid ? item.device_node_guid : null,
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
device_system_category_layer3: item.device_system_category_layer3 ? item.device_system_category_layer3 : null,
status: item.status,
symbol: 'image://' + baseImgUrl + "/upload/device_icon/" + item.device_image,
value: item.value,
deviceItems: item.deviceItems,
deviceURL: item.deviceURL
}
res.push(obj);
});
return res;
}
const scatter_cctv_convertData = function (data) { //CCTV
let res = [];
let temp = data.filter(function (item, index) {
return item.device_system_category_layer3 == "C";
});
temp.map(function (item) {
var obj = {
device_guid: item.device_guid,
device_number: item.device_number,
full_name: item.full_name,
device_system_category_layer3: item.device_system_category_layer3,
device_ip: item.device_ip,
device_port: item.device_port,
status: item.status,
symbol: 'image://' + str_location_url + "/upload/device_icon/" + item.device_image,
value: item.value
}
res.push(obj);
});
return res;
}
if (!floChart.getOption()) {
return;
}
var zoom = 0;
if (floChart.getOption().geo && floChart.getOption().geo.length > 0) {
zoom = floChart.getOption().geo[0].zoom;
}
if (zoom <= zoomToggle) {
floChart.setOption({
series: [{
symbolOffset: [0, 0],
data: scatter_symbol_convertData(currentData) //正常、關閉(圓點)
}, {
data: [] //正常、關閉(icon)
}, {
symbolOffset: [0, 0],
data: scatter_error_convertData(currentData) //異常(圓點)
}, {
data: [] //異常(icon)
}, {
data: scatter_cctv_convertData(currentData) //CCTV
}]
});
} else {
floChart.setOption({
series: [{
symbolOffset: [10, 10],
data: scatter_symbol_convertData(currentData, zoom), //正常、關閉(圓點)
}, {
data: scatter_icon_convertData(currentData) //正常、關閉(icon)
}, {
symbolOffset: [10, 10],
data: scatter_error_convertData(currentData) //異常(圓點)
}, {
data: scatter_error_icon_convertData(currentData) //異常(icon)
}, {
data: scatter_cctv_convertData(currentData) //CCTV
}]
});
}
}
//=====================================================================
// ↑ 樓層平面圖 ↑
//=====================================================================
// 設置 模型隱藏或透明
function setInviForge(type, devDbIds) {
// console.log("devDbIds", devDbIds)
if (type == "Hide") {
hideAllObjects(devDbIds);
} else if (type == "Opacity") {
setTransparentBuilding(0, devDbIds);
}
}
// 取得 不可視 3D 模型類型
function getInviForge() {
let url = baseApiUrl + "/api/Device/GetForgeInvType";
ytAjax = new YourTeam.Ajax(url, null, function (res) {
if (!res || res.code != "0000" || !res.data) {
} else {
let datas = res.data;
forgeInvType = datas.filter(x => x.sub_system_tag == pageAct.sysSubTag)[0]?.invisible_value;
forgeInvTypeDef = datas.filter(x => x.invisible_type == "default_value")[0]?.invisible_value;
}
}, null, "POST").send();
}
//載入3D模型
function load3DModel() {
launchViewer(pageAct.urn, (viewer) => {
document.querySelector("#guiviewer3d-toolbar").style.display = "none";
let elevOption = {
selector: "#forgeViewer",
viewer: viewer,
ordPath: subOrdPath
}
// 電梯移動訂閱程序載入
let forge3DElev = new Forge3DElevFull(elevOption);
forge3DElev.bajaEndCallback = function () {
// 從資料庫設定不可視模型的類型,若沒有取道該小類不可視類型,則套用資料庫設定預設類型
if (forgeInvType) {
setInviForge(forgeInvType, this.getNodeIds());
} else {
setInviForge(forgeInvTypeDef, this.getNodeIds());
}
setTransparentBuilding(0);
endPageLoading();
}
forge3DElev.bajaChaCallback = function (data) {
subDeviceSetStatus(data);
}
forge3DElev.init();
});
}
function show3D() {
if (isFirstLoad3D) {
isFirstLoad3D = false;
load3DModel();
}
}
</script>