689 lines
		
	
	
		
			25 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			689 lines
		
	
	
		
			25 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<style>
 | 
						||
</style>
 | 
						||
 | 
						||
<div class="row">
 | 
						||
    <div id="leftDiv" class="col-sm-12 col-xl-6">
 | 
						||
 | 
						||
    </div>
 | 
						||
    <div id="rightDiv" class="col-sm-12 col-xl-6">
 | 
						||
 | 
						||
    </div>
 | 
						||
</div>
 | 
						||
 | 
						||
<!-- Modal center Add -->
 | 
						||
<div class="modal fade" id="lightSchModal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static"
 | 
						||
     data-keyboard="false">
 | 
						||
    <div class="modal-dialog modal-dialog-centered" role="document" style="min-width:60%">
 | 
						||
        <div class="modal-content">
 | 
						||
            <div class="modal-header">
 | 
						||
                <h4 class="modal-title">
 | 
						||
                    燈控排程
 | 
						||
                </h4>
 | 
						||
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
 | 
						||
                    <span aria-hidden="true"><i class="fal fa-times"></i></span>
 | 
						||
                </button>
 | 
						||
            </div>
 | 
						||
            <div class="modal-body">
 | 
						||
                <!--<table id="lightSchTable" class="table table-bordered table-striped text-center m-0 w-100">
 | 
						||
                </table>-->
 | 
						||
                <div id="lightSchBlock" style="height:60vh"></div>
 | 
						||
 | 
						||
            </div>
 | 
						||
            <div class="modal-footer">
 | 
						||
                <button type="button" class="btn btn-secondary" data-dismiss="modal">關閉</button>
 | 
						||
                <button type="button" id="lightSchSavBtn" class="btn btn-primary">儲存</button>
 | 
						||
            </div>
 | 
						||
        </div>
 | 
						||
    </div>
 | 
						||
</div>
 | 
						||
 | 
						||
<script>
 | 
						||
  var allDevList = [];  //全設備清單
 | 
						||
  var alarmDbIdList = []; // 紀錄異常 forge 圓點,避免點擊與異常顏色衝突
 | 
						||
  var subDeviceData = [];
 | 
						||
  var heatMap = null;
 | 
						||
  var buildMenuData = {};
 | 
						||
  var forgeInvType = null;
 | 
						||
  var forgeInvTypeDef = null;
 | 
						||
 | 
						||
  $(function () {
 | 
						||
    getBuildMenu((arr, data) => {
 | 
						||
      console.log("系統監控",arr, data)
 | 
						||
      buildMenuData = data;
 | 
						||
      if (arr.indexOf(4) != -1) {
 | 
						||
        getFloDevList(arr[0] == 4 ? "left" : "right");
 | 
						||
        setLightColor();
 | 
						||
      }
 | 
						||
      if (arr.indexOf(3) != -1) {
 | 
						||
        getHotspotPoint(() => {
 | 
						||
          show3DModel(data.urn_3D);
 | 
						||
          getInviForge();
 | 
						||
        });
 | 
						||
      }
 | 
						||
    });
 | 
						||
  })
 | 
						||
 | 
						||
  // 依據 drawing type 決定呈現畫面
 | 
						||
  function getHtmlByType(type = 0, data = {}) {
 | 
						||
    let strHtml = ``;
 | 
						||
    switch (type) {
 | 
						||
      case 2:
 | 
						||
        strHtml = `<div style="height:85vh">
 | 
						||
                                <iframe src="${data.system_url}" width="100%" height="100%"></iframe>
 | 
						||
                           </div>`;
 | 
						||
        break;
 | 
						||
      case 4:
 | 
						||
        strHtml = `<div class="d-flex mb-4" style="gap:15px">
 | 
						||
                                ${setTopLight()}
 | 
						||
                            </div>
 | 
						||
 | 
						||
                            <div class="col-12 p-0" id="floDevList">
 | 
						||
 | 
						||
                            </div>`;
 | 
						||
        break;
 | 
						||
      case 3:
 | 
						||
        strHtml = `<div class="d-flex mb-4" style="position: relative; gap:15px">
 | 
						||
                                <div name="forgeViewer" style="position: absolute;width: 100%;height:85vh;">
 | 
						||
                                ${setTopHeatBar()}
 | 
						||
                                  </div>
 | 
						||
                            </div>
 | 
						||
                            `;
 | 
						||
        break;
 | 
						||
    }
 | 
						||
 | 
						||
    return strHtml;
 | 
						||
  }
 | 
						||
  //baja 訂閱設備
 | 
						||
  function subDevice() {
 | 
						||
 | 
						||
    let myBaja = new subscriptionDevices();
 | 
						||
    var ordPath = {
 | 
						||
      "area_tag": pageAct.AreaTag,
 | 
						||
      "building_tag": pageAct.buiTag,
 | 
						||
      "system_tag": pageAct.sysMainTag,
 | 
						||
      "name_tag": pageAct.sysSubTag,
 | 
						||
    }
 | 
						||
    myBaja.setSubscribeDevicesByBql(ordPath);
 | 
						||
    myBaja.setSubscribeDevicesCallBack(function (data) {
 | 
						||
      // console.log(data)
 | 
						||
      let matchDevice = allDevList.filter(x => x.device_number == data.device_number_full)[0];
 | 
						||
      if (!matchDevice) {
 | 
						||
        return false;
 | 
						||
      }
 | 
						||
 | 
						||
      //將訂閱值塞入 subDeviceData
 | 
						||
      if (subDeviceData.findIndex(x => x.device_number == matchDevice.device_number) == -1) {
 | 
						||
        let obj = {};
 | 
						||
        obj.device_number = matchDevice.device_number;
 | 
						||
        obj.dbid = matchDevice.forge_dbid;
 | 
						||
        subDeviceData.push(obj)
 | 
						||
      }
 | 
						||
 | 
						||
      let subData = subDeviceData.filter(x => x.device_number == matchDevice.device_number)[0];
 | 
						||
 | 
						||
      if (subData) {
 | 
						||
        subData[data.point_name] = data.value;
 | 
						||
      }
 | 
						||
 | 
						||
      let norDevPoiName = matchDevice.device_normal_point_name;
 | 
						||
      let cloDevPoiName = matchDevice.device_close_point_name;
 | 
						||
      let errDevPoiName = matchDevice.device_error_point_name;
 | 
						||
 | 
						||
      if (data.point_name == "SSC") {
 | 
						||
        const lightOn = data.value.includes("true")
 | 
						||
        setLightOpenOrClose(lightOn, matchDevice.device_guid);
 | 
						||
        if (lightOn) {
 | 
						||
          setLightValues(matchDevice.device_guid, 200, 0xe1cf18);
 | 
						||
        } else {
 | 
						||
          setLightValues(matchDevice.device_guid, 0, 0xe1cf18);
 | 
						||
        }
 | 
						||
      }
 | 
						||
 | 
						||
      if (data.point_name == "Temp") {
 | 
						||
        console.log("Temp",data.device_number_full, parseInt(data.value))
 | 
						||
        heatMap?.changeTemp(data.device_number_full, !isNaN(parseInt(data.value)) ? parseInt(data.value) : 0);
 | 
						||
        let devIdx = allDevList.findIndex(x => x.device_number == data.device_number_full);
 | 
						||
        allDevList[devIdx]._temp = !isNaN(parseInt(data.value)) ? parseInt(data.value) : 0;
 | 
						||
      }
 | 
						||
 | 
						||
      if (data.point_name == norDevPoiName && data.value == matchDevice.device_normal_point_value) {
 | 
						||
        //顯示正常燈號
 | 
						||
        $(`#${matchDevice.device_number}_status`).attr("data-light-type", "normal").data("light-type", "normal");
 | 
						||
      } else if (data.point_name == cloDevPoiName && data.value == matchDevice.device_close_point_value) {
 | 
						||
        $(`#${matchDevice.device_number}_status`).attr("data-light-type", "close").data("light-type", "close");
 | 
						||
      } else if (data.point_name == errDevPoiName && data.value == matchDevice.device_error_point_value) {
 | 
						||
        $(`#${matchDevice.device_number}_status`).attr("data-light-type", "error").data("light-type", "error");
 | 
						||
      }
 | 
						||
 | 
						||
      setLightColor();
 | 
						||
      setForgeHotSpotColor(matchDevice);
 | 
						||
      lightDevForgeSpotLig(matchDevice)
 | 
						||
      // 從設備訂閱更新每個設備卡片即時點位
 | 
						||
      setDevItemPoiValBySub(data);
 | 
						||
    });
 | 
						||
 | 
						||
    myBaja.setSubscribeDeviceEndCallBack(function (data) {
 | 
						||
      endPageLoading();
 | 
						||
      if (data.findIndex(x => x.point_name == "Temp") != -1) {
 | 
						||
        // 顯示溫度條
 | 
						||
        showHeat("[name=forgeHeatBar]");
 | 
						||
      }
 | 
						||
    });
 | 
						||
 | 
						||
  }
 | 
						||
 | 
						||
  function lightDevForgeSpotLig(devObj) {
 | 
						||
 | 
						||
 | 
						||
  }
 | 
						||
 | 
						||
  // 從設備訂閱更新每個設備卡片即時點位
 | 
						||
  function setDevItemPoiValBySub(data) {
 | 
						||
 | 
						||
    let pointSpan = $(`.card.device-wrap[data-number=${data.device_number_full}] span[name=devItemPoiVal]`);
 | 
						||
    if (pointSpan && pointSpan.data("point") == data.point_name) {
 | 
						||
      // console.log(data)
 | 
						||
      pointSpan.text(data.value);
 | 
						||
    }
 | 
						||
  }
 | 
						||
 | 
						||
  function setLightColor() {
 | 
						||
    $("[data-light-type]").each((index, ele) => {
 | 
						||
      let type = $(ele).data("light-type");
 | 
						||
      let isFlashing = false;
 | 
						||
      let color = "#000";
 | 
						||
      switch (type) {
 | 
						||
        case "normal":
 | 
						||
          color = pageAct.sysSubObj.device_normal_color ?? "var(--theme-success)";
 | 
						||
          isFlashing = pageAct.sysSubObj.device_normal_flashing == "1";
 | 
						||
          break;
 | 
						||
        case "close":
 | 
						||
          color = pageAct.sysSubObj.device_close_color ?? "var(--theme-secondary)";
 | 
						||
          isFlashing = pageAct.sysSubObj.device_close_flashing == "1";
 | 
						||
          break;
 | 
						||
        case "error":
 | 
						||
          color = pageAct.sysSubObj.device_error_color ?? "var(--theme-danger)";
 | 
						||
          isFlashing = pageAct.sysSubObj.device_error_flashing == "1";
 | 
						||
          break;
 | 
						||
      }
 | 
						||
      $(ele).css("background-color", color);
 | 
						||
      //是否閃爍
 | 
						||
      if (isFlashing) {
 | 
						||
        $(ele).parents(".card.device-wrap").addClass("light-flash");
 | 
						||
      } else {
 | 
						||
        $(ele).parents(".card.device-wrap").removeClass("light-flash");
 | 
						||
      }
 | 
						||
    })
 | 
						||
  }
 | 
						||
 | 
						||
  // 設置昇位圖上方 燈號
 | 
						||
  function setTopLight() {
 | 
						||
    let sysSubObj = pageAct.sysSubObj;
 | 
						||
    let strHtml = ``;
 | 
						||
    if (sysSubObj.device_normal_point_name != null && sysSubObj.device_normal_point_value != null) {
 | 
						||
      strHtml += ` <div class="row m-0 align-items-center">
 | 
						||
                            <span id="sysNorLight" class="circle-light mr-2 " data-light-type="normal"></span>
 | 
						||
                            <label class="mb-0">${sysSubObj.device_normal_text}</label>
 | 
						||
                        </div>`;
 | 
						||
    }
 | 
						||
    if (sysSubObj.device_close_point_name != null && sysSubObj.device_close_point_value != null) {
 | 
						||
      strHtml += ` <div class="row m-0 align-items-center">
 | 
						||
                                    <span id="sysCloLight" class="circle-light mr-2" data-light-type="close"></span>
 | 
						||
                                    <label class="mb-0">${sysSubObj.device_close_text}</label>
 | 
						||
                            </div>`;
 | 
						||
    }
 | 
						||
    if (sysSubObj.device_error_point_name != null && sysSubObj.device_error_point_value != null) {
 | 
						||
      strHtml += ` <div class="row m-0 align-items-center">
 | 
						||
                            <span id="sysErrLight" class="circle-light mr-2" data-light-type="error"></span>
 | 
						||
                            <label class="mb-0">${sysSubObj.device_error_text}</label>
 | 
						||
                        </div>`;
 | 
						||
    }
 | 
						||
 | 
						||
    return strHtml;
 | 
						||
  }
 | 
						||
 | 
						||
  function setLightSchBlcok(obj) {
 | 
						||
    let devNum = $(obj).parents(".device-wrap").data("number");
 | 
						||
    let devPath = devNum.replaceAll("_", "/");
 | 
						||
    let iframe = `<iframe src="/ord?station:%7Cslot:/${devPath}/Sch|view:?fullScreen=true" style="min-height:100px;width:100%;height:100%"></iframe>`
 | 
						||
    $("#lightSchBlock").html(iframe);
 | 
						||
  }
 | 
						||
 | 
						||
  // forge 3D 異常點位變紅色
 | 
						||
  function setForgeHotSpotColor(device) {
 | 
						||
    let subData = subDeviceData.filter(x => x.device_number == device.device_number)[0]
 | 
						||
    if (subData && subData[device.device_error_point_name] == device.device_error_point_value && (!isNaN(parseInt(device.spriteDbid)) || !isNaN(parseInt(device._dbId)))) {
 | 
						||
      const _dbId = parseInt(device.spriteDbid) || parseInt(device._dbId)
 | 
						||
      alarmDbIdList = [...alarmDbIdList, _dbId]
 | 
						||
      // console.log("異常", _dbId)
 | 
						||
      changeColorForHotspot(_dbId, "error");
 | 
						||
    } else if (subData[device.device_error_point_name] !== device.device_error_point_value && (!isNaN(parseInt(device.spriteDbid)) || !isNaN(parseInt(device._dbId)))) {
 | 
						||
      const _dbId = parseInt(device.spriteDbid) || parseInt(device._dbId)
 | 
						||
      let index = alarmDbIdList.findIndex(dbId => dbId == _dbId);
 | 
						||
      index !== -1 && alarmDbIdList.splice(index, 1)
 | 
						||
    }
 | 
						||
  }
 | 
						||
 | 
						||
  // 取得昇位圖點位 (deviceItem)
 | 
						||
  function getRiserPoiObj() {
 | 
						||
    let tarDevItem = pageAct.devItems?.filter(x => x.is_show_riserDiagram == 1);
 | 
						||
    if (tarDevItem && tarDevItem[0]) {
 | 
						||
      return tarDevItem[0];
 | 
						||
    }
 | 
						||
    return null;
 | 
						||
  }
 | 
						||
 | 
						||
  // 取得設備列表 並繪製卡片
 | 
						||
  function getFloDevList(position = "left") {
 | 
						||
    let url = baseApiUrl + "/api/Device/GetDeviceList";
 | 
						||
    let sendData = {
 | 
						||
      sub_system_tag: pageAct.sysSubTag,
 | 
						||
      building_tag: pageAct.buiTag,
 | 
						||
      floor_tag: pageAct.floTag,
 | 
						||
    };
 | 
						||
    objSendData.Data = sendData;
 | 
						||
    ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
 | 
						||
      if (!res || res.code != "0000" || !res.data) {
 | 
						||
 | 
						||
      } else {
 | 
						||
        let strHtml = ``;
 | 
						||
        $.each(res.data, (index, floObj) => {
 | 
						||
          strHtml += `<div class='d-flex justify-content-start mb-5'>`
 | 
						||
          strHtml += `<button id="floItemBtn${floObj.full_name}" type="button" class="btn btn-primary waves-effect waves-themed mr-5 mt-1 align-self-start" >${floObj.full_name}</button>`
 | 
						||
          strHtml += `<div class="col p-0 d-grid grid-gap-5 grid-temp-col-c" style="--c-grid-temp-col:repeat(auto-fill,minmax(250px,1fr))">`
 | 
						||
          $.each(floObj.device_list, (index2, devObj) => {
 | 
						||
            allDevList.push(devObj);
 | 
						||
            let devItem = getRiserPoiObj();
 | 
						||
            strHtml += `<div class="card m-1 border device-wrap" data-number="${devObj.device_number}" data-position="${position}">
 | 
						||
                                        <div class="card-body p-2">
 | 
						||
                                            <div class="d-flex mb-2">
 | 
						||
                                                <div  class="mr-5 cur-poi">
 | 
						||
                                                    <span class="d-inline-block mr-3">
 | 
						||
                                                        <img src="${baseImgUrl + varPathDevIcon + devObj.device_image}" class="profile-image rounded-circle" onerror="defDev(this)" alt="...">
 | 
						||
                                                    </span>
 | 
						||
                                                    <a name="devItemName" data-number="${devObj.device_number}" href="javascript:;">${devObj.full_name}</a>
 | 
						||
                                                </div>
 | 
						||
                                            </div>
 | 
						||
                                        <div class="d-flex mb-0 mt-2 align-items-center">
 | 
						||
                                                <span id="${devObj.device_number}_status" class="circle-light"></span>
 | 
						||
                                                <span class="${devItem ? "" : "d-none"} ml-2">${devItem?.full_name}:<span name="devItemPoiVal" data-point="${devItem?.points}"></span>${devItem?.unit}</span>
 | 
						||
                                                <a href="javascript:;" name="devItem" data-id="${devObj.device_guid}" data-number="${devObj.device_number}" data-name="${devObj.full_name}" class=" ml-2 mb-0 " data-toggle="tooltip" title="默认的 Tooltip">詳細資料</a>
 | 
						||
                                            </div>
 | 
						||
                                        </div>
 | 
						||
                                    </div>`;
 | 
						||
          })
 | 
						||
          strHtml += "</div></div>";
 | 
						||
        })
 | 
						||
        // Niagara 產生 file 開頭字串問題
 | 
						||
        strHtml = strHtml.replaceAll(`src="/file/`, `src="`);
 | 
						||
 | 
						||
        if (!res.data || res.data.length == 0) {
 | 
						||
          endPageLoading();
 | 
						||
        } else {
 | 
						||
          // 訂閱 baja 設備
 | 
						||
          subDevice();
 | 
						||
        }
 | 
						||
 | 
						||
        // 繪製 html
 | 
						||
        $("#floDevList").append(strHtml);
 | 
						||
 | 
						||
        // 存入 device 基本資料至元素 data 屬性
 | 
						||
        $("#floDevList a[name=devItem]").each((idx, ele) => {
 | 
						||
          if (allDevList.findIndex(x => x.device_number == $(ele).data("number")) != -1) {
 | 
						||
            $(ele).data("devobj", allDevList.filter(x => x.device_number == $(ele).data("number"))[0]);
 | 
						||
          }
 | 
						||
        })
 | 
						||
 | 
						||
        // 初始化 pop 視窗
 | 
						||
        initPopover();
 | 
						||
        // 卡片設備名稱點擊事件
 | 
						||
        devItemNameEvent();
 | 
						||
      }
 | 
						||
    }, null, "POST").send();
 | 
						||
  }
 | 
						||
 | 
						||
  function getBuildMenu(callback = null) {
 | 
						||
    let url = baseApiUrl + "/api/Device/GetBuildMenu";
 | 
						||
    let sendData = {
 | 
						||
      main_system_tag: pageAct.sysMainTag,
 | 
						||
      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 leftData = {}, rightData = {};
 | 
						||
 | 
						||
        for (var key in res.data) {
 | 
						||
          if (key.startsWith("left")) {
 | 
						||
            leftData[key.split("left_")[1]] = res.data[key];
 | 
						||
          } else if (key.startsWith("right")) {
 | 
						||
            rightData[key.split("right_")[1]] = res.data[key];
 | 
						||
          }
 | 
						||
        }
 | 
						||
 | 
						||
        if (res.data.left_drawing != null) {
 | 
						||
          $("#leftDiv").html(getHtmlByType(res.data.left_drawing, leftData));
 | 
						||
        } else {
 | 
						||
          $("#leftDiv").html(getHtmlByType(0, leftData));
 | 
						||
        }
 | 
						||
        if (res.data.right_drawing != null) {
 | 
						||
          $("#rightDiv").html(getHtmlByType(res.data.right_drawing), rightData);
 | 
						||
        } else {
 | 
						||
          $("#rightDiv").html(getHtmlByType(0, rightData));
 | 
						||
        }
 | 
						||
 | 
						||
        callback ? callback([res.data.left_drawing, res.data.right_drawing], res.data) : "";
 | 
						||
      }
 | 
						||
    }, null, "POST").send();
 | 
						||
  }
 | 
						||
 | 
						||
  // Card 即時狀態
 | 
						||
  function drawStateTabBlo(devNum) {
 | 
						||
    let devPath = devNum.replaceAll("_", "/");
 | 
						||
    let position = $(`.card.device-wrap[data-number=${devNum}]`).data("position") || "left";
 | 
						||
    let width = buildMenuData[position + "_icon_click_url_width"] ? buildMenuData[position + "_icon_click_url_width"] + "px" : "100%";
 | 
						||
    let height = buildMenuData[position + "_icon_click_url_height"] ? buildMenuData[position + "_icon_click_url_height"] + "px" : "100%";
 | 
						||
    let strHtml
 | 
						||
if(pageAct.sysSubTag == "C") {
 | 
						||
  strHtml = `<div style="width:${width};height:${height};">
 | 
						||
                            <iframe src="./px/CCTV/TEST_RENDER.mp4" style="width:${width};height:${height};"></iframe>
 | 
						||
                       </div>`
 | 
						||
} else {
 | 
						||
  strHtml = `<div style="width:${width};height:${height};">
 | 
						||
                            <iframe src="/ord?station:%7Cslot:/${devPath}|view:?fullScreen=true" style="width:${width};height:${height};"></iframe>
 | 
						||
                       </div>`
 | 
						||
}
 | 
						||
 | 
						||
    return strHtml;
 | 
						||
  }
 | 
						||
 | 
						||
  function iframeResize(obj) {
 | 
						||
    obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
 | 
						||
  }
 | 
						||
 | 
						||
  function show3DModel(urn) {
 | 
						||
    $(loadEle).Loading("start");
 | 
						||
    launchViewerForHotspot(urn, (viewer, nodeIds) => {
 | 
						||
      // 隱藏 toolbar
 | 
						||
      document.querySelector("#guiviewer3d-toolbar").style.display = "none";
 | 
						||
      let devDbIds = allDevList.map(x => x.forge_dbid);
 | 
						||
      // 大類
 | 
						||
      let subDevDbId = [];
 | 
						||
      allDevList.forEach(({ device_nodes }) => {
 | 
						||
        subDevDbId = [...subDevDbId, ...device_nodes.map(n => n.forge_dbid)]
 | 
						||
      })
 | 
						||
      // console.log(devDbIds, subDevDbId)
 | 
						||
      // 從資料庫設定不可視模型的類型,若沒有取道該小類不可視類型,則套用資料庫設定預設類型
 | 
						||
      if (forgeInvType) {
 | 
						||
        setInviForge(forgeInvType, [...devDbIds, ...subDevDbId]);
 | 
						||
      } else {
 | 
						||
        setInviForge(forgeInvTypeDef, [...devDbIds, ...subDevDbId]);
 | 
						||
      }
 | 
						||
 | 
						||
      $(loadEle).Loading("close");
 | 
						||
      let sensorObjs = []
 | 
						||
      let devices = []
 | 
						||
      if (pageAct.sysSubTag === "M12") {
 | 
						||
        addHotPoint(viewer)
 | 
						||
        allDevList.forEach((device) => {
 | 
						||
          const sensorObj = new Forge3DSensor({
 | 
						||
            viewer: viewer,
 | 
						||
            ordPath: {
 | 
						||
              "area_tag": pageAct.AreaTag,
 | 
						||
              "building_tag": pageAct.buiTag,
 | 
						||
            },
 | 
						||
            selector: "[name=forgeViewer]",
 | 
						||
            elevCb: () => {
 | 
						||
              let elevOption = {
 | 
						||
                selector: "[name=forgeViewer]",
 | 
						||
                viewer: viewer,
 | 
						||
                ordPath: {
 | 
						||
                  "area_tag": pageAct.AreaTag,
 | 
						||
                  "building_tag": pageAct.buiTag,
 | 
						||
                },
 | 
						||
                sensorObjs
 | 
						||
              }
 | 
						||
 | 
						||
              // 電梯移動訂閱程序載入
 | 
						||
              let forge3DElev = new Forge3DElevFull(elevOption);
 | 
						||
              forge3DElev.bajaEndCallback = function () {
 | 
						||
                endPageLoading();
 | 
						||
              }
 | 
						||
              forge3DElev.init();
 | 
						||
            },
 | 
						||
            curDevice: {
 | 
						||
              ...device,
 | 
						||
              roomDbId: !isNaN(parseInt(device.room_dbid)) ? parseInt(device.room_dbid) : -1,
 | 
						||
              id: device.device_number,
 | 
						||
              position: isJSON(device.device_coordinate_3d) ? JSON.parse(device.device_coordinate_3d) : {}, // x: 0, y: 25, z: -2.5      (3.35, -4.81, 12.88
 | 
						||
              temp: 25,
 | 
						||
              forge_dbid: parseInt(device.forge_dbid)
 | 
						||
            }
 | 
						||
          });
 | 
						||
          sensorObjs.push(sensorObj)
 | 
						||
        })
 | 
						||
      } else {
 | 
						||
        devices = allDevList.map(x => {
 | 
						||
          return {
 | 
						||
            roomDbId: !isNaN(parseInt(x.room_dbid)) ? parseInt(x.room_dbid) : -1,
 | 
						||
            id: x.device_number,
 | 
						||
            position: isJSON(x.device_coordinate_3d) ? JSON.parse(x.device_coordinate_3d) : {}, // x: 0, y: 25, z: -2.5      (3.35, -4.81, 12.88
 | 
						||
            sensorTypes: ["temperature", "humidity"],
 | 
						||
            temp: 30,
 | 
						||
            forgeDbId: parseInt(x.forge_dbid)
 | 
						||
          }
 | 
						||
        })
 | 
						||
 | 
						||
        if ((pageAct.sysSubTag == "M12" || pageAct.sysSubTag == "ELEV") && elevatorShow) {
 | 
						||
          let elevOption = {
 | 
						||
            selector: "[name=forgeViewer]",
 | 
						||
            viewer: viewer,
 | 
						||
            ordPath: {
 | 
						||
              "area_tag": pageAct.AreaTag,
 | 
						||
              "building_tag": pageAct.buiTag,
 | 
						||
            },
 | 
						||
          }
 | 
						||
 | 
						||
          // 電梯移動訂閱程序載入
 | 
						||
          let forge3DElev = new Forge3DElevFull(elevOption);
 | 
						||
          forge3DElev.bajaEndCallback = function () {
 | 
						||
            endPageLoading();
 | 
						||
          }
 | 
						||
          forge3DElev.init();
 | 
						||
        }
 | 
						||
      }
 | 
						||
 | 
						||
      let option = {
 | 
						||
        devices: devices,
 | 
						||
      }
 | 
						||
 | 
						||
      if (pageAct.sysMainTag !== "LT" && pageAct.sysSubTag !== "M12") {
 | 
						||
        console.log(pageAct.sysSubTag, option)
 | 
						||
        heatMap = new ADHeatMaps(option);
 | 
						||
        heatMap.onComplete = () => {
 | 
						||
          $.each(allDevList, (idx, dev) => {
 | 
						||
            heatMap.changeTemp(dev.device_number, dev._temp || 0);
 | 
						||
          })
 | 
						||
        }
 | 
						||
      }
 | 
						||
 | 
						||
      if (subDeviceData.length != 0) {
 | 
						||
        let stSubArr = subDeviceData.map(x => Object.keys(x).filter(y => y == "ST").map(y => x));
 | 
						||
 | 
						||
        for (let sub of stSubArr) {
 | 
						||
          let matchDevice = allDevList.filter(x => x.device_number == sub[0]?.device_number)[0];
 | 
						||
          if (matchDevice) {
 | 
						||
            setForgeHotSpotColor(matchDevice);
 | 
						||
          }
 | 
						||
        }
 | 
						||
      }
 | 
						||
      if (pageAct.sysSubTag == "W2") {
 | 
						||
        // console.log("@@",pageAct, pageAct.sub_system_tag)
 | 
						||
        getWaterNodeId(viewer);
 | 
						||
      } else if (pageAct.sysSubTag == "E1") {
 | 
						||
        getE1NodeId(viewer)
 | 
						||
      }
 | 
						||
 | 
						||
    }, () => {
 | 
						||
      $(loadEle).Loading("close");
 | 
						||
    }, "[name=forgeViewer]");
 | 
						||
 | 
						||
 | 
						||
  }
 | 
						||
 | 
						||
  // 供水系統 - 取得欲染色 dbid
 | 
						||
  function getWaterNodeId() {
 | 
						||
    // let url = baseApiUrl + "/api/Device/GetForgeNodeIdFromVar";
 | 
						||
    // let sendData = { forgeNodeKey: "water_wupply" };
 | 
						||
    // objSendData.Data = sendData;
 | 
						||
    // ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
 | 
						||
    //     if (!res || res.code != "0000" || !res.data) {
 | 
						||
 | 
						||
    //     } else {
 | 
						||
    //         if (!isNaN(parseInt(res.data[0]?.system_value))) {
 | 
						||
    //             changeColor(parseInt(res.data[0]?.system_value))
 | 
						||
    //         }
 | 
						||
    //         console.log(res.data)
 | 
						||
    //     }
 | 
						||
    // }, null, "POST").send();
 | 
						||
    // console.log("1",viewer.model)
 | 
						||
    viewer.model.search("給水", (nodeIds) => {
 | 
						||
      // console.log("2",nodeIds)
 | 
						||
      viewer.show(nodeIds)
 | 
						||
    }, (e) => { console.log(e) })
 | 
						||
 | 
						||
  }
 | 
						||
 | 
						||
 | 
						||
  // 高壓配電盤染色
 | 
						||
  function getE1NodeId() {
 | 
						||
    viewer.model.search("高壓電力", (nodeIds) => {
 | 
						||
      // console.log("2",nodeIds)
 | 
						||
      viewer.show(nodeIds)
 | 
						||
    }, (e) => { console.log(e) })
 | 
						||
  }
 | 
						||
 | 
						||
  function getHotspotPoint(callback = null) {
 | 
						||
    let url = baseApiUrl + "/api/GetDevForCor";
 | 
						||
    let sendData = {
 | 
						||
      "device_area_tag": pageAct.AreaTag,
 | 
						||
      "device_building_tag": pageAct.buiTag,
 | 
						||
      "device_system_tag": pageAct.sysMainTag,
 | 
						||
      "device_name_tag": pageAct.sysSubTag,
 | 
						||
    };
 | 
						||
    console.log(sendData)
 | 
						||
    objSendData.Data = sendData;
 | 
						||
    ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
 | 
						||
      if (!res || res.code != "0000" || !res.data) {
 | 
						||
 | 
						||
      } else {
 | 
						||
 | 
						||
        let myDataList = [];
 | 
						||
        $.each(res.data, (idx, data) => {
 | 
						||
          let item = {};
 | 
						||
          item.position = {};
 | 
						||
          if (data.device_coordinate_3d != null && isJSON(data.device_coordinate_3d)) {
 | 
						||
            item.position = JSON.parse(data.device_coordinate_3d);
 | 
						||
          }
 | 
						||
          $.extend(item, data);
 | 
						||
          myDataList.push(item);
 | 
						||
        })
 | 
						||
        setHotspotPoint(myDataList);
 | 
						||
        if (pageAct.sysMainTag == "LT") {
 | 
						||
          setLightPoint(myDataList);
 | 
						||
        }
 | 
						||
        callback ? callback() : "";
 | 
						||
      }
 | 
						||
    }, null, "POST").send();
 | 
						||
 | 
						||
  }
 | 
						||
 | 
						||
  function setHotspotPoint(myDataList = []) {
 | 
						||
    console.log("2", myDataList)
 | 
						||
    getHopspotPoint(myDataList);
 | 
						||
  }
 | 
						||
 | 
						||
  function setLightPoint(myDataList = []) {
 | 
						||
    // console.log(myDataList)
 | 
						||
    getLightData(myDataList);
 | 
						||
  }
 | 
						||
 | 
						||
  // 取得 不可視 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();
 | 
						||
  }
 | 
						||
 | 
						||
  // 設置 模型隱藏或透明
 | 
						||
  function setInviForge(type, devDbIds) {
 | 
						||
    if (type == "Hide") {
 | 
						||
      hideAllObjects(devDbIds);
 | 
						||
    } else if (type == "Opacity") {
 | 
						||
      setTransparentBuilding(0, devDbIds);
 | 
						||
    }
 | 
						||
  }
 | 
						||
 | 
						||
  var parentEle = "";
 | 
						||
  onEvent("autodesk:click:sprite", "[name=forgeViewer]", function (e, obj) {
 | 
						||
    forgeUnFocusAll();
 | 
						||
    let rect = $("[name=forgeViewer]")[0].getBoundingClientRect();
 | 
						||
    let position = [rect.left + rect.width / 2, rect.top + rect.height / 3]
 | 
						||
    // console.log(position)
 | 
						||
    // let position = [obj.event.target.toolController.lastClickX - 300, obj.event.target.toolController.lastClickY - 300];
 | 
						||
    let devObj = obj.myData;
 | 
						||
    let name = allDevList.filter(x => x.device_guid == devObj.device_guid)[0]?.full_name || devObj.full_name;
 | 
						||
    devObj.full_name = name;
 | 
						||
    parentEle = crePosPopover(position, devObj);
 | 
						||
    $(parentEle).click();
 | 
						||
  })
 | 
						||
 | 
						||
  onEvent("autodesk:clickOut:sprite", "[name=forgeViewer]", function (e) {
 | 
						||
    $(parentEle).YTTooltip("hide");
 | 
						||
  })
 | 
						||
 | 
						||
  onEvent("autodesk:complete:sprite", "[name=forgeViewer]", function (e, obj) {
 | 
						||
    $("#floDevList a[name=devItem]").each((idx, ele) => {
 | 
						||
      let devNum = $(ele).data("number");
 | 
						||
      let dbid = obj.myDataList.filter(x => x.device_number == devNum)[0]?._dbId;
 | 
						||
      allDevList.forEach((dev, idx) => {
 | 
						||
        if (dev.device_number == devNum) {
 | 
						||
          dev.spriteDbid = dbid;
 | 
						||
          setForgeHotSpotColor(dev);
 | 
						||
        }
 | 
						||
      })
 | 
						||
      $(ele).data("dbId", dbid);
 | 
						||
 | 
						||
    })
 | 
						||
  })
 | 
						||
 | 
						||
  onEvent("yt:tooltip:show", "[name=devItem]", function (e, obj) {
 | 
						||
    forgeUnFocusAll();
 | 
						||
  })
 | 
						||
 | 
						||
  function forgeUnFocusAll() {
 | 
						||
    $("#floDevList a[name=devItem]").each((idx, ele) => {
 | 
						||
      const eleDbId = $(ele).data("dbId")
 | 
						||
      if (alarmDbIdList.some(dbId => dbId == eleDbId)) {
 | 
						||
        changeScaleForHotspot(eleDbId, false)
 | 
						||
        return
 | 
						||
      }
 | 
						||
      else {
 | 
						||
        // 3D 熱點解除
 | 
						||
        controlFocusHotspot(eleDbId, false);
 | 
						||
      }
 | 
						||
    })
 | 
						||
  }
 | 
						||
</script> |