From d35cc2ca71f20c495373794db14b6e9fe87cdcb1 Mon Sep 17 00:00:00 2001 From: wanli Date: Wed, 4 Jan 2023 17:23:30 +0800 Subject: [PATCH 1/2] =?UTF-8?q?[Frontend]=20=E5=8A=A0=E5=85=A5=20=E9=9A=B1?= =?UTF-8?q?=E8=97=8F=E7=89=A9=E4=BB=B6=E5=92=8C=E9=A1=AF=E7=A4=BA=E7=89=A9?= =?UTF-8?q?=E4=BB=B6=E7=9A=84=E5=87=BD=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Frontend/js/forge/forgemodel.js | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/Frontend/js/forge/forgemodel.js b/Frontend/js/forge/forgemodel.js index 99d364f..752af71 100644 --- a/Frontend/js/forge/forgemodel.js +++ b/Frontend/js/forge/forgemodel.js @@ -956,6 +956,21 @@ function changeColorTransparency(nodeId, color) {//變綠色 viewer.setThemingColor(nodeId, color); } +//隱藏全物件 +function hideAllObjects() { + //viewer.hide(4);//只針對一個物件(dbid為4)做隱藏 + for (var i = 0; i < allDbIdsStr.length; i++) { + viewer.hide(parseInt(allDbIdsStr[i])); + } +} +//顯示全物件 +function showAllObjects() { + //viewer.show(4); //只針對一個物件(dbid為4)做顯示 + for (var i = 0; i < allDbIdsStr.length; i++) { + viewer.show(parseInt(allDbIdsStr[i])); + } +} + //======================== 外部呼叫function =========================== //紀錄熱點座標 function getHopspotPoint(data) { From f25aa146d20ef2155db222f23f8867e3b3857ede Mon Sep 17 00:00:00 2001 From: dev01 Date: Wed, 4 Jan 2023 17:31:34 +0800 Subject: [PATCH 2/2] =?UTF-8?q?[Frontend][=E7=B3=BB=E7=B5=B1=E7=9B=A3?= =?UTF-8?q?=E6=8E=A7]=20=E5=B7=A6=E6=96=B9=E9=81=B8=E5=96=AE=E5=BD=88?= =?UTF-8?q?=E5=87=BA=E7=A8=8B=E5=BA=8F=E5=BB=BA=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Frontend/_dashboard.html | 211 +-- Frontend/css/site.css | 28 +- Frontend/index.html | 1524 ++--------------- Frontend/js/forge/forgemodel.js | 223 ++- Frontend/js/site.js | 4 + .../yourteam/plugins/yt-navbar/yt-navbar.js | 148 ++ 6 files changed, 462 insertions(+), 1676 deletions(-) create mode 100644 Frontend/js/yourteam/plugins/yt-navbar/yt-navbar.js diff --git a/Frontend/_dashboard.html b/Frontend/_dashboard.html index 7205100..473449a 100644 --- a/Frontend/_dashboard.html +++ b/Frontend/_dashboard.html @@ -240,13 +240,7 @@ var tarElePath = ''; var sysSubList = []; - var floList = []; //每個樓層 - var subSeviceData = []; //每個設備訂閱點位值 - var allEleDevList = []; var viewer3DNodeIds = []; - var elev3DBind = {}; - var elev3DOption = {}; - var elev3DObj = []; var timeOuters = []; var eveDayElecChart = null; var eveWeekElecChart = null; @@ -288,25 +282,25 @@ $(document).ready(function () { show3DModel(); getSubList(); - getElevData(); getFirstEletric(); - subDeviceSetStatus(); timeOutGetData(); }); function demoSubList() { let isExiNames = $("#sysSubBtnList .dev-group button[id^=sysSubCardBtn]").toArray().map(x => $(x).text()); let strHtml = ``; + $.each(tempSysSubText, (idx, obj) => { - if (isExiNames.indexOf(obj.text) == -1) { + if (isExiNames.indexOf(obj.text) == -1 && $("#sysSubBtnList .dev-group").length < 12) { let iconObj = sysIconList.filter(x => x.mainSys == obj.mainSys && x.subSys == obj.subSys)[0]; - strHtml += `
+ strHtml = `
`; + $("#sysSubBtnList").append(strHtml); } }) - $("#sysSubBtnList").append(strHtml); + } //取得 左下方 各系統小類 @@ -386,10 +380,8 @@ let yesterday = displayDate(getTimeByType(null, -1), "date").replaceAll("/", "-") + "T00:00:00"; let tomorrow = displayDate(getTimeByType(null, 1), "date").replaceAll("/", "-") + "T00:00:00"; - - // 今日用電量 - getElectricMeterDayDataByBaja(devNum + "_kWh_tot", n4Sup, today, tomorrow, (data) => { + getElectricMeterDayDataByBaja(devNum + "_KWH", n4Sup, today, tomorrow, (data) => { let result = data?.data[0]?.sum; result = result ? parseFloat(result).toFixed(2) : 0; $("#todayUseElec").text(result); @@ -397,7 +389,7 @@ }) // 今日用電量 (每小時) - getElectricMeterHourDataByBaja(devNum + "_kWh_tot", n4Sup, yesterday, tomorrow, (data) => { + getElectricMeterHourDataByBaja(devNum + "_KWH", n4Sup, yesterday, tomorrow, (data) => { let todayData = data.data.filter(x => x.timestamp.$date.$year == getTimeByType("year") && x.timestamp.$date.$month == getTimeByType("month") && x.timestamp.$date.$day == getTimeByType("date")); let yesData = data.data.filter(x => x.timestamp.$date.$year == getTimeByType("year", -1) && x.timestamp.$date.$month == getTimeByType("month", -1) && x.timestamp.$date.$day == getTimeByType("date", -1)); @@ -406,7 +398,7 @@ }) // 昨日用電量 - getElectricMeterDayDataByBaja(devNum + "_kWh_tot", n4Sup, yesterday, today, (data) => { + getElectricMeterDayDataByBaja(devNum + "_KWH", n4Sup, yesterday, today, (data) => { let result = data?.data[0]?.sum; result = result ? parseFloat(result).toFixed(2) : 0; $("#yesUseElec").text(result); @@ -414,7 +406,7 @@ }) // 本週與上週用電量 (每天) - getElectricMeterDayDataByBaja(devNum + "_kWh_tot", n4Sup, prevTwoWeek, tomorrow, (data) => { + getElectricMeterDayDataByBaja(devNum + "_KWH", n4Sup, prevTwoWeek, tomorrow, (data) => { let curDay = (new Date()).getDay() == 0 ? 7 : (new Date()).getDay(); let curWeekData = data.data.filter(x => strToDate(displayDate(new Date(), "date"), null, 0 - (curDay - 1)) <= strToDate(x.timestamp.$cEncStr)); let prevWeekData = data.data.filter(x => strToDate(displayDate(new Date(), "date"), null, 0 - 7 - (curDay - 1)) <= strToDate(x.timestamp.$cEncStr) && strToDate(new Date(), null, 0 - 7) >= strToDate(x.timestamp.$cEncStr)); @@ -746,32 +738,6 @@ }) } - // 取得電梯資料 - function getElevData() { - let url = baseApiUrl + "/api/Device/GetDeviceList"; - let sendData = { - sub_system_tag: "EL", - building_tag: pageAct.buiTag, - }; - objSendData.Data = sendData; - ytAjax = new YourTeam.Ajax(url, objSendData, function (res) { - if (!res || res.code != "0000" || !res.data) { - - } else { - $.each(res.data, (index, floObj) => { - let masters = floObj.device_list.map(x => x.device_number?.split("_")[5]).Distinct(); - $.each(masters, (idx, master) => { - floObj.device_list.filter(x => x.device_number?.split("_")[5] == master).forEach((devObj) => { - allEleDevList.push(devObj); - allEleDevList = allEleDevList.oSort("priority"); - }) - }) - }) - - } - }, null, "POST").send(); - } - //function timeOutGetData() { // let timeOut3s = setInterval(() => { // getAlarmSub(); @@ -784,155 +750,24 @@ function show3DModel() { launchViewerNoTools(pageAct.urn, (viewer) => { - let nodeIds = allEleDevList.filter(x => !isNaN(parseInt(x.forge_dbid))).map(x => { return { devNum: x.device_number, nodeId: parseInt(x.forge_dbid) } }); + let elevOption = { + selector: "#forgeViewer", + viewer: viewer, + ordPath: { + "area_tag": pageAct.AreaTag, + "building_tag": pageAct.buiTag, + }, + } - $.each(nodeIds, (idx, item) => { - elev3DBind[item.devNum] = item.nodeId; - }) - nodeIds = nodeIds.map(x => x.nodeId); - $.each(nodeIds, function (idx, node) { - let options = { - element: $("#forgeViewer"), - viewer: viewer, - nodeId: node, - floorHeight: elev3DOption.floorHeight ?? [], - inited: function () { - - } - } - let elevator3DObj = new elevator3D(options); - let devNum = Object.keys(elev3DBind).filter(x => elev3DBind[x] == node)[0]; - let subData = subSeviceData.filter(x => x.device_number == devNum)[0]; - - if (elev3DObj.filter(x => x.nodeId == node).length == 0) { - elev3DObj.push({ id: devNum, nodeId: node, obj: elevator3DObj }); - } - - if (subData) { - let elevObj = elev3DObj.filter(x => x.nodeId == node)[0]; - if (!elevObj.id) { - elevObj.id = devNum; - } - elevObj.obj = Object.assign(elevObj, elevator3DObj ?? {}) - elevObj.obj.init(function () { - let frags = elevObj.obj.fragProxys.filter(x => x.nodeId == node); - frags.forEach((fragProxy) => { - fragProxy.frag.position.z = elev3DOption.floorHeight.filter(x => x.floor == subData["CP"])[0]?.height ?? 0; - fragProxy.frag.updateAnimTransform() - }) - elevObj.obj.viewer.impl.sceneUpdated(true); - }) - - - } - }) + // 電梯移動訂閱程序載入 + let forge3DElev = new Forge3DElevFull(elevOption); + forge3DElev.bajaEndCallback = function () { + endPageLoading(); + } + forge3DElev.init(); }); } - function subDeviceSetStatus() { - let subOrdPath = { - "area_tag": pageAct.AreaTag, - "building_tag": pageAct.buiTag, - "system_tag": "ELEV", - "name_tag": "EL", - }; - myBaja = new subscriptionDevices(); - myBaja.setSubscribeDevicesByBql(subOrdPath); - myBaja.setSubscribeDevicesCallBack(function (data) { - - if (allEleDevList.length == 0) { - return false; - } - data.device_number = data.device_number_full; - let matchDevice = allEleDevList.filter(x => x.device_number == data.device_number)[0]; - let master = matchDevice?.device_number.split("_")[5]; - - if (!matchDevice) { - return; - } - - if (data.point_name == "CP") { - if (elev3DObj.length != 0) { - let elevObj = elev3DObj.filter(x => x.nodeId == elev3DBind[matchDevice.device_number])[0]; - if (elevObj && elevObj.id) { - elevObj.obj.setElevatorFloor(data.value) - elevObj.obj.movElevator(); - } - } - } - - //將訂閱值塞入 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; - } - - }); - myBaja.setSubscribeDeviceEndCallBack(function (data) { - - let devNumArr = data.map(x => { return { devNum: x.device_number_full, priority: allEleDevList.filter(y => y.device_number == x.device_number_full)[0]?.priority } }).DistinctBy("devNum"); - devNumArr = devNumArr.oSort("priority"); - $.each(devNumArr, (idx, devObj) => { - devNum = devObj.devNum; - let subData = subSeviceData.filter(x => x.device_number == devNum)[0]; - - if (subData) { - //// 左側 3D 電梯 nodeID 與 device_number match - //if (Object.keys(elev3DBind).indexOf(devNum) == -1 && viewer3DNodeIds.length != 0) { - // elev3DBind[devNum] = viewer3DNodeIds[Object.keys(elev3DBind).length]; - //} - // 左側 3D 電梯 Viewer Option 設置 - /*elev3DOption.nodes = Object.keys(elev3DBind).map(x => elev3DBind[x]);*/ - - floList = Object.keys(subData).filter(x => x.startsWith("SP_FLS_")).map(x => x?.split("SP_FLS_")[1]); - - elev3DOption.nodeId = elev3DBind[devNum]; - elev3DOption.floorHeight = floList.map((x) => { return { floor: x } }); - elev3DOption.floorHeight.forEach((floObj, idx) => { - if (floObj.floor.startsWith("B")) { - let floor = parseInt(floObj.floor.split("B")[1].split("F")[0]); - floObj.height = floor * -13; - } else { - let floor = parseInt(floObj.floor.split("F")[0]); - if (floor == 1) { - floObj.height = 0; - } else if (floor == 2) { - floObj.height = 14.75; - } else { - floObj.height = (14.75 + ((floor - 2) * 9.75)); - } - } - }) - - if (elev3DObj.length != 0) { - let elevObj = elev3DObj.filter(x => x.nodeId == elev3DBind[devNum])[0]; - if (!elevObj.id) { - elevObj.id = devNum; - } - elevObj.obj = Object.assign(elevObj.obj, elev3DOption); - elevObj.obj.init(function () { - let frags = elevObj.obj.fragProxys.filter(x => x.nodeId == elev3DBind[devNum]); - frags.forEach((fragProxy) => { - fragProxy.frag.position.z = elev3DOption.floorHeight.filter(x => x.floor == subData["CP"])[0]?.height ?? 0; - fragProxy.frag.updateAnimTransform(); - }) - elevObj.obj.viewer.impl.sceneUpdated(true); - }); - } - } - }) - - }) - } - - $(window).on("timeout:5m", function () { console.log("五分鐘更新") getElectricBaja(); diff --git a/Frontend/css/site.css b/Frontend/css/site.css index a7e4001..2fbd50b 100644 --- a/Frontend/css/site.css +++ b/Frontend/css/site.css @@ -223,6 +223,22 @@ input:-webkit-autofill { grid-template-columns: var(--c-grid-temp-col); } +.vakata-context, .vakata-context ul { background-color: #3f3f3f; box-shadow: 2px 2px 2px #111111; } +.vakata-context li > a { color: white; text-shadow: 1px 1px 0 #4b4b4b; } +.vakata-context .vakata-context-hover > a { background-color: #666666; box-shadow: 0 0 2px #2f2f2f; } +.vakata-context li > a:hover { background-color: #636363; box-shadow: 0 0 2px #2f2f2f; } + +.yt-left-navbar { position: fixed; left: 0; top: 0; height: 100%; z-index: 10; background-color: var(--theme-fusion-900); width: auto; max-width: 300px; margin-top: 4.125rem; } +.yt-navbar-content ul { padding: 1rem 0rem; list-style-type: none; } +.yt-navbar-content ul li { position: relative; display: flex; flex-wrap: wrap; } +.yt-navbar-content ul li a { font-size: 0.9rem; padding: 0.75rem 2rem; position: relative; width: 100%; } +.yt-navbar-content ul li a:hover { background-color: var(--theme-fusion-600); } +.yt-navbar-content ul li a:active, .yt-navbar-content ul li a.active { background-color: var(--theme-fusion-500); } + +@media screen and (max-width: 576px){ + .yt-left-navbar { width: 100%; max-width: 100%; margin-top: 0; } +} + @keyframes lds-ring { 0% { transform: rotate(0deg); @@ -287,14 +303,10 @@ input:-webkit-autofill { } } /* ================================================================ */ -/* 單一方法 */ -/* ================================================================ */ - - -/* cursor */ -.cur-def { - cursor: default !important; -} + /* 單一方法 */ + /* ================================================================ */ + /* cursor */ + .cur-def { cursor: default !important; } .cur-poi { cursor: pointer !important; diff --git a/Frontend/index.html b/Frontend/index.html index c61e9df..e8a92ed 100644 --- a/Frontend/index.html +++ b/Frontend/index.html @@ -38,7 +38,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li - + @@ -133,1298 +133,22 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
-