2478 lines
		
	
	
		
			114 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			2478 lines
		
	
	
		
			114 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<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">×</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">×</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">×</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">×</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">×</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") {
 | 
						||
            $(`#${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">`);
 | 
						||
        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">`);
 | 
						||
        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) => {
 | 
						||
 | 
						||
 | 
						||
            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>
 |