This commit is contained in:
GiteaAdmin 2023-02-06 10:20:48 +08:00
commit 125b24f6d5
32 changed files with 364 additions and 244 deletions

View File

@ -15,8 +15,8 @@
"ASPNETCORE_ENVIRONMENT": "Development",
"ASPNETCORE_HOSTINGSTARTUPASSEMBLIES": "Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation",
"FORGE_CALLBACK_URL": "http://localhost:3000/api/forge/callback/oauth",
"FORGE_CLIENT_ID": "TA3hqsFfzQbNOUXKpldKUKSew4SJ21w5",
"FORGE_CLIENT_SECRET": "D002f92d839144f8"
"FORGE_CLIENT_ID": "VeGoOgZcAVCBkiThYvLRSVrCTH6TTwyh",
"FORGE_CLIENT_SECRET": "Rl1KHJIAI8GSAfhK"
}
},
"Backend": {

View File

@ -278,7 +278,7 @@
var file = input3Dfile;
var formData = new FormData();
formData.append('fileToUpload', file);
formData.append('bucketKey', "ta3hqsffzqbnouxkpldkuksew4sj21w5-bims_models");//forge上傳平台-資料夾
formData.append('bucketKey', "vegoogzcavcbkithyvlrsvrcth6ttwyh-202302_ibms");//forge上傳平台-資料夾
$.ajax({
url: '/api/forge/oss/objects',
@ -454,7 +454,7 @@
var file = input3Dfile;
var formData = new FormData();
formData.append('fileToUpload', file);
formData.append('bucketKey', "ta3hqsffzqbnouxkpldkuksew4sj21w5-bims_models");//forge上傳平台-資料夾
formData.append('bucketKey', "vegoogzcavcbkithyvlrsvrcth6ttwyh-202302_ibms");//forge上傳平台-資料夾
$.ajax({
url: '/api/forge/oss/objects',
@ -484,6 +484,7 @@
//formData2.append("orgName_3D", file_names[0]);
//formData2.append("extName_3D", file_names[1]);
}
console.log("urn_3D", urn)
formData2.append("urn_3D", urn);
formData2.append("orgName_3D", m3d_names[0]);
formData2.append("extName_3D", m3d_names[1]);
@ -961,7 +962,7 @@
function translateObject(urn) {
$("#forgeViewer").empty();
//if (node == null) node = $('#appBuckets').jstree(true).get_selected(true)[0];
var bucketKey = "ta3hqsffzqbnouxkpldkuksew4sj21w5-bims_models";//forge上傳平台-資料夾
var bucketKey = "vegoogzcavcbkithyvlrsvrcth6ttwyh-202302_ibms";//forge上傳平台-資料夾
var objectKey = urn;
jQuery.post({
@ -969,6 +970,7 @@
contentType: 'application/json',
data: JSON.stringify({ 'bucketKey': bucketKey, 'objectName': objectKey }),
success: function (res) {
console.log("@@973", res)
//$("#forgeViewer").html('Translation started! Please try again in a moment.');
},
});

View File

@ -16,8 +16,8 @@
"MySqlDBConfig": {
"Server": "FYlY+w0XDIz+jmF2rlZWJw==", //0.201
"Port": "js2LutKe+rdjzdxMPQUrvQ==",
//"Database": "VJB2XC+lAtzuHObDGMVOAA==", //30
"Database": "IgYBsgG2VLKKxFb64j7LOA==", //wsp
"Database": "VJB2XC+lAtzuHObDGMVOAA==", //30
//"Database": "IgYBsgG2VLKKxFb64j7LOA==", //wsp
"Root": "SzdxEgaJJ7tcTCrUl2zKsA==",
"Password": "FVAPxztxpY4gJJKQ/se4bQ=="
}

View File

@ -16,8 +16,8 @@
"MySqlDBConfig": {
"Server": "FYlY+w0XDIz+jmF2rlZWJw==", //0.201
"Port": "js2LutKe+rdjzdxMPQUrvQ==",
// "Database": "VJB2XC+lAtzuHObDGMVOAA==", //
"Database": "IgYBsgG2VLKKxFb64j7LOA==", //wsp
"Database": "VJB2XC+lAtzuHObDGMVOAA==", //
//"Database": "IgYBsgG2VLKKxFb64j7LOA==", //wsp
"Root": "SzdxEgaJJ7tcTCrUl2zKsA==",
"Password": "FVAPxztxpY4gJJKQ/se4bQ=="
}

View File

@ -255,7 +255,9 @@
/*launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDJUU5JTlCJTk5JUU2JUE4JUExJUU1JUJDJThGK01FUCVFNiU4QiU4NiVFNyVCMyVCQiVFNyVCNSVCMV8wMTE5Lm53ZA")*/
/* 0201 更換好電梯順序 */
launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDJUU5JTlCJTk5JUU2JUE4JUExJUU1JUJDJThGK01FUCVFNiU4QiU4NiVFNyVCMyVCQiVFNyVCNSVCMV8wMjAxLm53ZA")
/* launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDJUU5JTlCJTk5JUU2JUE4JUExJUU1JUJDJThGK01FUCVFNiU4QiU4NiVFNyVCMyVCQiVFNyVCNSVCMV8wMjAxLm53ZA")*/
// 0202 將感測器新增到電梯內
launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dmVnb29nemNhdmNia2l0aHl2bHJzdnJjdGg2dHR3eWgtMjAyMzAyX2libXMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDJUU5JTlCJTk5JUU2JUE4JUExJUU1JUJDJThGK01FUCVFNiU4QiU4NiVFNyVCMyVCQiVFNyVCNSVCMV8wMjAyLm53ZA==")
//launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlFX2ZvcmdlX3Rlc3QvJUUzJFTgwJTkwQVJDJUUzJTgwJTkxXzIwMjJfMTJfMTMubndk');//new ARC
//launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlX2ZvcmdlX3Rlc3QvJUUzJTgwJTkwTUVQJUUzJTgwJTkxXzIwMjJfMTJfMTMubndj');//new MEP
//launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlX2ZvcmdlX3Rlc3QvJUUzJTgwJTkwQVJDJUUzJTgwJTkxJUU1JTg1JUE4JUU2JUEzJTlGXzIwMjJfMTJfMTMubndj');//全棟 ARC

View File

@ -260,38 +260,40 @@
// 左上方 系統小類卡片區塊
function getSubSysList(type = 0) {
subSysList = [];
let url = baseApiUrl + "/api/Device/GetMainSub";
let sendData = {
building_tag: pageAct.buiTag,
};
objSendData.Data = sendData;
ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
let url = baseApiUrl + "/api/Energe/GetElecBySubSysTag";
// let sendData = {
// building_tag: pageAct.buiTag,
// };
// objSendData.Data = sendData;
ytAjax = new YourTeam.Ajax(
url,
null,
function (res) {
if (!res || res.code != "0000" || !res.data) {
} else {
let strHtml = '';
$.each(res.data.history_Main_Systems, (index, mainSysObj) => {
$.each(mainSysObj.history_Sub_systems, (index2, subSysObj) => {
subSysList.push(subSysObj);
if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNotShowSysSub.indexOf(subSysObj.sub_system_tag) == -1) {
let strHtml = "";
$.each(res.data, (index, mainSysObj) => {
if ((type == 0 || (type == 3 && mainSysObj.mainSubTag == "ELEV_EL"))
// && filNotShowSysSub.indexOf(subSysObj.sub_system_tag) == -1
) {
const full_name = mainSysObj.system_remark.split("-")[1];
strHtml += `<div class="col-sm-12 col-xl-4 mb-2">
<div class="card elecCard cur-poi" data-id="${mainSysObj.main_system_tag}_${subSysObj.sub_system_tag}" data-name="${subSysObj.full_name}">
<div class="card elecCard cur-poi" data-id="${mainSysObj.mainSubTag}" data-name="${mainSysObj.mainSubTag}">
<div class="card-body">
<h4 class="card-title color-white">${subSysObj.full_name}用電</h4>
<h4 class="card-title color-white">${full_name}用電</h4>
<p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
<span>${elecCardConText[type]?.text1}</span>
<span id="insPow${mainSysObj.main_system_tag}_${subSysObj.sub_system_tag}"></span>
<span id="insPow${mainSysObj.mainSubTag}"></span>
</p>
<p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
<span>${elecCardConText[type]?.text2}</span>
<span id="insPowPer${mainSysObj.main_system_tag}_${subSysObj.sub_system_tag}"></span>
<span id="insPowPer${mainSysObj.mainSubTag}"></span>
</p>
</div>
</div>
</div>`;
}
})
})
});
if (type == 3) {
strHtml += `<div class="col-sm-12 col-xl-4 mb-2">
<div class="card elecCard cur-poi">
@ -309,11 +311,12 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
</div>
</div>`;
}
console.log(strHtml)
$("#eneSubSysList").html(strHtml);
}
}, null, "POST").send();
},
null,
"POST",
).send();
}
// 取得 對應系統小類的總電錶
@ -420,7 +423,6 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
$.each(subSysElecList, (idx, elecObj) => {
let devPath
devPath = elecObj.system_device_tag?.split("_").slice(0, 8).join("/");
console.log(424, devPath)
getElectricMeterNoweDataByBaja(devPath, (data) => {
data = data.data;
let result = 0;
@ -428,8 +430,7 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
result = data.filter(x => x.name == "P_rec")[0]?.value?.roundDecimal(2);
$(`#insPow${elecObj.mainSubTag}`).text(result);
result = data.filter(x => x.name == "KWH_rec")[0]?.value?.roundDecimal(2);
console.log(429, data, result)
$(`#insPowPer${elecObj.mainSubTag}`).text((result / totalPow * 100).roundDecimal(2) + " %");
$(`#insPowPer${elecObj.mainSubTag}`).text((result / result * 100).roundDecimal(2) + " %");
} else {
/* result = result ? result.roundDecimal(2) : 0;*/
result = data.filter(x => x.name == "P")[0]?.value?.roundDecimal(2);
@ -471,7 +472,6 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
todayElecChart?.destroy();
return;
}
getElectricMeterHourDataByBaja(tarDevNum + "_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"));
chartTodaysElec(todayData);
@ -552,6 +552,7 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
// 圖表 - 今天用電量 (折線圖)
function chartTodaysElec(todayData) {
todayElecChart?.destroy();
let todayElecChartCanvas = $('#todayElecChart').get(0).getContext('2d');
let curHour = (new Date()).getHours();
todayData.data = todayData.filter(x => x.timestamp.$time.$hour < curHour);
@ -618,7 +619,7 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
// 圖表 - 今日與30日內平均用電量比較 (長條圖)
function chartEveWeeksElec(curWeekData, avgData) {
elecCompChart?.destroy()
let elecCompChartCanvas = $('#elecCompChart').get(0).getContext('2d');
let elecCompChartData = {
labels: curWeekData.map(x => dayToChiDay(strToDate(x.timestamp.$cEncStr, "day"))),

View File

@ -1099,14 +1099,15 @@
devices: devices,
}
if (pageAct.sysMainTag !== "LT") {
heatMap = new ADHeatMaps(option);
heatMap.onComplete = () => {
$.each(currentData, (idx, dev) => {
heatMap.changeTemp(dev.device_number, dev._temp || 0);
})
}
}
}
function getHotspotPoint(callback = null) {
let url = baseApiUrl + "/api/GetDevForCor";

View File

@ -49,8 +49,8 @@ namespace FrontendWebApi.ApiControllers
TwoLeggedApi oauth = new TwoLeggedApi();
string grantType = "client_credentials";
dynamic bearer = await oauth.AuthenticateAsync(
"TA3hqsFfzQbNOUXKpldKUKSew4SJ21w5",
"D002f92d839144f8",
"VeGoOgZcAVCBkiThYvLRSVrCTH6TTwyh",
"Rl1KHJIAI8GSAfhK",
grantType,
scopes);
return bearer;

View File

@ -13,7 +13,7 @@ namespace FrontendWebApi.ApiControllers
{
private IWebHostEnvironment _env;
public OSSController(IWebHostEnvironment env) { _env = env; }
string id = "TA3hqsFfzQbNOUXKpldKUKSew4SJ21w5";
string id = "VeGoOgZcAVCBkiThYvLRSVrCTH6TTwyh";
public string ClientId { get { return id.ToLower(); } }
/// <summary>

View File

@ -15,8 +15,8 @@
"ASPNETCORE_ENVIRONMENT": "Development",
"ASPNETCORE_HOSTINGSTARTUPASSEMBLIES": "Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation",
"FORGE_CALLBACK_URL": "http://localhost:3000/api/forge/callback/oauth",
"FORGE_CLIENT_ID": "TA3hqsFfzQbNOUXKpldKUKSew4SJ21w5",
"FORGE_CLIENT_SECRET": "D002f92d839144f8",
"FORGE_CLIENT_ID": "VeGoOgZcAVCBkiThYvLRSVrCTH6TTwyh",
"FORGE_CLIENT_SECRET": "Rl1KHJIAI8GSAfhK",
"ASPNETCORE_URLS": "http://localhost:5500"
},
"applicationUrl": "https://localhost:5001;http://localhost:5000"

View File

@ -4,10 +4,17 @@
<JavaScriptTestRoot>src\</JavaScriptTestRoot>
<JavaScriptTestFramework>Jest</JavaScriptTestFramework>
<!-- Command to run on project build -->
<BuildCommand></BuildCommand>
<BuildCommand>
</BuildCommand>
<!-- Command to create an optimized build of the project that's ready for publishing -->
<ProductionBuildCommand>npm run build</ProductionBuildCommand>
<!-- Folder where production build objects will be placed -->
<BuildOutputFolder>$(MSBuildProjectDirectory)\build</BuildOutputFolder>
</PropertyGroup>
<ItemGroup>
<None Remove="src\utils\baja\bajaUtil.js" />
</ItemGroup>
<ItemGroup>
<None Remove="src\utils\baja\bajaUtil.js" />
</ItemGroup>
</Project>

View File

@ -1,38 +0,0 @@
.App {
text-align: center;
}
.App-logo {
height: 40vmin;
pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-link {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}

View File

@ -1,4 +1,4 @@
import { useMemo, useEffect, useState } from "react";
import { useMemo, useEffect, useState, useCallback } from "react";
import { Outlet, NavLink } from "react-router-dom";
import { useSelector, useDispatch } from "react-redux";
import { Container, Nav, Navbar, NavDropdown } from "react-bootstrap";
@ -49,6 +49,16 @@ function App() {
dispatch(fetchSysMainSub(selectedBuiTag));
}
}, [selectedBuiTag]);
// 離開頁面就清除所有 cookie
//const removeAllCookie = useCallback(() => {
// console.log("關閉分頁時,清除所有 cookie")
// window.addEventListener("beforeunload",() => {
// document.cookie.match(/[^ =;]+(?=\=)/g).forEach(key => {
// document.cookie = `${key}=""; max-age=0`;
// }) })
//}, [])
return (
<div className="App">
{/* 主選單 */}

View File

@ -1,8 +0,0 @@
import { render, screen } from '@testing-library/react';
import App from './App';
test('renders learn react link', () => {
render(<App />);
const linkElement = screen.getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
});

View File

@ -1,17 +1,29 @@
import React, { useEffect, useRef, useState } from "react";
import React, { useEffect, useRef, useMemo } from "react";
import { useDispatch, useSelector } from "react-redux";
import * as THREE from "three";
import { fetchForge, shutdownForge } from "@STORE/forgeSlice";
import { SubscribeDeviceTempByBaja } from "@UTIL"
import hotspot from "@ASSET/img/hotspot.svg";
function ForgeModel({ forgeHeight, sprites = [] }) {
function ForgeModel({ forgeHeight, deviceList = [] }) {
const dispatch = useDispatch();
const viewerEl = useRef(null);
const {
buildingInfo: { urn_3D },
forgeViewer: { viewer, dataVizExtn, DataVizCore },
forgeViewer: { viewer, model,dataVizExtn, DataVizCore, structureInfo },
device: { selectedDeviceSysTag,selectedDeviceNameTag,tempsensorDevList }
} = useSelector((store) => store);
const deviceArray = useMemo(()=> deviceList.map(({ device_number, device_coordinate_3d, room_dbid }) => {
return {
id: device_number, // An ID to identify this device
position: JSON.parse(device_coordinate_3d), // World coordinates of this device
roomId: room_dbid,
sensorTypes: ["temperature", "humidity"], // The types/properties this device exposes
temp: 0,
}
}), [selectedDeviceNameTag])
// 載入 Forge Viewer
useEffect(() => {
if (urn_3D) {
@ -21,9 +33,9 @@ function ForgeModel({ forgeHeight, sprites = [] }) {
urn: urn_3D,
}),
);
};
return () => {
dispatch(shutdownForge());
};
}
}, [urn_3D]);
@ -38,7 +50,7 @@ function ForgeModel({ forgeHeight, sprites = [] }) {
// 熱點點擊事件
const onSpriteClicked = (event) => {
const targetDbIds = [event.dbId];
spriteUpdate(event, targetDbIds, { scale: 1.3, color: { r: 1, g: 0, b: 0 } });
spriteUpdate(event, targetDbIds, { scale: 1.3, color: { r: 1.0, g: 0, b: 0 } });
console.log(`Sprite clicked:${targetDbIds}`);
};
@ -51,10 +63,9 @@ function ForgeModel({ forgeHeight, sprites = [] }) {
// 進入系統監控頁面,出現熱點
useEffect(() => {
if (sprites.length !== 0 && viewer && dataVizExtn) {
// const filterSprites = sprites.map;
if (deviceList.length !== 0 && viewer && dataVizExtn) {
dataVizExtn.removeAllViewables();
sprites.forEach(async ({ device_coordinate_3d, forge_dbid }, index) => {
deviceList.forEach(async ({ device_coordinate_3d, forge_dbid }, index) => {
const viewableType = DataVizCore.ViewableType.SPRITE;
const spriteColor = new THREE.Color(0xffffff);
const spriteIconUrl = hotspot;
@ -78,12 +89,84 @@ function ForgeModel({ forgeHeight, sprites = [] }) {
}
return () => {
if (sprites.length !== 0 && viewer && dataVizExtn) {
if (deviceList.length !== 0 && viewer && dataVizExtn) {
viewer.removeEventListener(DataVizCore.MOUSE_CLICK, onSpriteClicked);
viewer.removeEventListener(DataVizCore.MOUSE_CLICK_OUT, onSpriteClickedOut);
}
};
}, [sprites, dataVizExtn, viewer]);
}, [deviceList, dataVizExtn]);
// 熱圖
const getSensorValue = (surfaceShadingPoint) => {
// The `SurfaceShadingPoint.id` property matches one of the identifiers passed to `generateSurfaceShadingData`
const { temp } = surfaceShadingPoint;
return temp / 40;
}
// 構建熱圖
const establishHeatMaps = async (deviceList, dataVizExtn) => {
// 不重複的房間值
const uniqueRoomIds = [...new Set(deviceArray.map(r => r.roomId))]; // 房間唯一值
const {
SurfaceShadingData,
SurfaceShadingPoint,
SurfaceShadingNode,
} = DataVizCore;
const heatmapData = new SurfaceShadingData();
uniqueRoomIds.forEach(room_Id => {
// 為每個房間都建立一個 Node
const shadingNode = new SurfaceShadingNode("TemperatureSensor", room_Id);
deviceArray.forEach(({ id, position, roomId, sensorTypes }) => {
// 設備對應的 roomId 用來判斷要加入哪個 Node
if (room_Id === roomId) {
const pt = new SurfaceShadingPoint(id, position, sensorTypes);
shadingNode.addPoint(pt);
}
})
heatmapData.addChild(shadingNode);
heatmapData.initialize(viewer.model);
})
await dataVizExtn.setupSurfaceShading(viewer.model, heatmapData, {
type: "PlanarHeatmap",
slicingPosition: 0.5, // Slicing happens at the vertical mid-point of the geometry
placementPosition: 1.0, // The sliced planar heatmap placed at the base of geometry
minOpacity: 0.0, // The default value if this option is omitted
maxOpacity: 0.5, // The default value if this option is omitted
});
// 對 "temperature" 的溫度設定兩種顏色:紅色和藍色
dataVizExtn.registerSurfaceShadingColors("temperature", [0x0000ff, 0x00ff00, 0xffff00, 0xff0000]);
if (deviceArray.length !== 0) {
const sensorType = "temperature";
deviceArray.forEach(({ id }) => {
dataVizExtn.renderSurfaceShading(id, sensorType, getSensorValue);
})
}
}
useEffect(() => {
if (deviceList && structureInfo && dataVizExtn && selectedDeviceSysTag == "ME") {
// 訂閱有 Temp 的設備
deviceList.forEach(({ device_number }) => {
SubscribeDeviceTempByBaja(device_number, dispatch)
})
establishHeatMaps(deviceList, dataVizExtn, structureInfo);
}
return () => { }
}, [selectedDeviceNameTag]);
useEffect(() => {
if (tempsensorDevList.length !== 0) {
deviceArray.forEach((device) => {
if (tempsensorDevList.findIndex(({ device_number }) => device_number === device.id) !== -1) {
const newTempObj = tempsensorDevList.find(({ device_number }) => device_number === device.id)
device.temp = newTempObj.temp;
dataVizExtn.updateSurfaceShading(getSensorValue);
}
})
}
}, [tempsensorDevList])
return <div ref={viewerEl} id="forgeViewer" style={{ height: forgeHeight }}></div>;
}

View File

@ -1,13 +0,0 @@
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}

View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>

Before

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -3,26 +3,49 @@ import { useParams } from "react-router-dom";
import { useSelector, useDispatch } from "react-redux";
import { Container, Row, Col, Card, ButtonGroup, Button } from "react-bootstrap";
import ForgeModel from "@COM/forges/ForgeModel";
import { fetchSelectedDeviceMenu, fetchSelectedDeviceList, fetchSelectedDevFlTags } from "@STORE";
import { fetchSelectedDeviceMenu, fetchSelectedDeviceList, fetchSelectedDevFlTags, changeMainSubSys } from "@STORE";
import defdev from "@ASSET/img/defdev.png";
function Monitor() {
const params = useParams().systemId; // main_sub
const [main_system_tag, sub_system_tag] = params.split("_");
const dispatch = useDispatch();
const {
buildingInfo: { selectedBuiTag },
device: { selectedDeviceMenu, selectedDeviceList, selectedDeviceFloorTags },
system: { mainSub },
forgeViewer: { viewer, model },
} = useSelector((state) => state);
useEffect(() => {
if (selectedBuiTag && main_system_tag && sub_system_tag) {
if (main_system_tag && sub_system_tag) {
dispatch(changeMainSubSys({ main_system_tag, sub_system_tag }))
dispatch(fetchSelectedDeviceMenu({ main_system_tag, sub_system_tag }));
dispatch(fetchSelectedDeviceList({ sub_system_tag }));
dispatch(fetchSelectedDevFlTags({ sub_system_tag }));
}
// 載入資料
}, [main_system_tag, sub_system_tag, selectedBuiTag]);
}, [main_system_tag, sub_system_tag]);
// 只顯示指定的設備
// 取得所有 forge dbid
const getAllDbIds = (model) => {
const instanceTree = model.getInstanceTree();
const allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
return allDbIdsStr.map(id => parseInt(id));
}
useEffect(() => {
if (model && selectedDeviceList.length !== 0) {
console.log(model)
const allDbIds = getAllDbIds(model)
viewer.hide(allDbIds)
const showDbIds = selectedDeviceList.map((d) => parseInt(d.forge_dbid))
let showNodeDbId = [];
selectedDeviceList.forEach(({ device_nodes }) => {
showNodeDbId = [...showNodeDbId, ...device_nodes.map(({ forge_dbid }) => forge_dbid)]
})
viewer.show([...showDbIds, ...showNodeDbId])
}
}, [model, selectedDeviceList])
return (
<>
<Container
@ -60,12 +83,13 @@ function Monitor() {
<Col md={1}>
<Button className="px-4 py-2 text-white">{floor_tag}</Button>
</Col>
<Col className="d-flex justify-content-evenly align-items-center flex-wrap">
{selectedDeviceList.map(({ device_guid, full_name, forge_dbid }) => (
<Col className="d-flex justify-content-start align-items-center flex-wrap">
{selectedDeviceList.map(({ device_guid, full_name, forge_dbid, device_floor }) => (
device_floor === floor_tag ?
<Card
bg="dark"
key={device_guid}
className="mb-3"
className="mb-3 ms-4"
style={{ maxWidth: "45%" }}
>
<Card.Body>
@ -77,13 +101,14 @@ function Monitor() {
<span className="text-secondary me-4">功率 kW</span>
<Card.Link
className="text-white text-decoration-none"
data-forgeId={forge_dbid}
data-forgeid={forge_dbid}
>
詳細內容
</Card.Link>
</Card.Text>
</Card.Body>
</Card>
</Card> :
<></>
))}
</Col>
</Row>
@ -91,7 +116,7 @@ function Monitor() {
)}
</Col>
<Col md={6}>
<ForgeModel forgeHeight="90vh" sprites={selectedDeviceList} />
<ForgeModel forgeHeight="90vh" deviceList={ selectedDeviceList } />
</Col>
</Row>
</Container>

View File

@ -1,13 +0,0 @@
const reportWebVitals = onPerfEntry => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;

View File

@ -20,8 +20,8 @@ const routes = [
/(?:(?:^|.*;\s*)JWT-Authorization\s*\=\s*([^;]*).*$)|^.*$/,
"$1",
);
if (window.location.href.includes("localhost:3000") && !JWT_Authorization) {
console.log(JWT_Authorization);
if (window.location.href.includes("localhost:3000") && !JWT_Authorization) {
return redirect("/login");
} else if (window.location.href.includes("http://220.132.206.5") && !JWT_Authorization) {
const account = await setUserAccountByBaja();

View File

@ -1,5 +0,0 @@
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom';

View File

@ -16,7 +16,7 @@ const buildingSlice = createSlice({
buildingList: ["中凌大樓"],
urn_3D: "",
selectedBuiArea: "TPE",
selectedBuiTag: "",
selectedBuiTag: "B1",
selectedBuiFullName: "",
errMsg: "",
},

View File

@ -3,6 +3,7 @@ import axios from "axios";
import { deviceBuiMenuBaseUrl, deviceListBaseUrl, deviceFloorBaseUrl } from "@CON";
import { ajaxRes } from "@UTIL";
// 獲取小類中總覽資料
export const fetchSelectedDeviceMenu = createAsyncThunk(
"deviceList/fetchSelectedDeviceMenu",
async ({ main_system_tag, sub_system_tag }, thunkAPI) => {
@ -29,14 +30,12 @@ export const fetchSelectedDeviceList = createAsyncThunk(
if (code !== "0000" || !data) {
return rejectWithValue(msg);
} else {
console.log(data)
let results=[];
data.forEach((p) => {
p.device_list.forEach((d) => {
results.push({ ...d, device_floor: p.full_name });
});
});
console.log("v", [...results]);
return fulfillWithValue([...results]);
}
},
@ -66,16 +65,30 @@ const deviceListSlice = createSlice({
selectedDeviceMaster: "", // BANK1
selectedDeviceLastName: "", // ELEV
selectedDeviceSerialTag: "", // N1
tempsensorDevList: [],
},
reducers: {
getAllDevice: (state, action) => { },
getCurDeviceTemp: (state, { payload }) => {
const { device_number, temp } = payload;
state.tempsensorDevList = state.tempsensorDevList.map((sensor) => {
if (sensor.some(s => s.device_number == device_number)) {
return { ...sensor, temp }
}
return sensor
})
},
changeMainSubSys: (state, { payload }) => {
const { main_system_tag, sub_system_tag } = payload;
state.selectedDeviceSysTag = main_system_tag;
state.selectedDeviceNameTag = sub_system_tag;
}
},
extraReducers: (builder) => {
builder.addCase(fetchSelectedDeviceMenu.fulfilled, (state, { payload }) => {
state.selectedDeviceMenu = payload;
});
builder.addCase(fetchSelectedDeviceList.fulfilled, (state, { payload }) => {
console.log("de", payload);
state.selectedDeviceList = payload;
});
@ -88,5 +101,5 @@ const deviceListSlice = createSlice({
});
const { reducer, actions } = deviceListSlice;
export const { getAllDevice } = actions;
export const { getCurDeviceTemp, changeMainSubSys } = actions;
export default reducer;

View File

@ -6,7 +6,7 @@ export const fetchForge = createAsyncThunk(
async ({ viewerEl, urn }, { dispatch, fulfillWithValue, rejectWithValue }) => {
const res = await forgeInit(viewerEl);
if (res.ok) {
modelLoad(res.viewer, urn, dispatch);
await modelLoad(res.viewer, urn, dispatch);
return fulfillWithValue(res.viewer);
} else {
return rejectWithValue(res.errCode);
@ -18,8 +18,10 @@ const forgeSlice = createSlice({
name: "forge",
initialState: {
viewer: null,
model: null,
dataVizExtn: null,
DataVizCore: null,
structureInfo: null,
errCode: 0,
urn_3D: "",
},
@ -27,6 +29,14 @@ const forgeSlice = createSlice({
loadDataVizExtn: (state, { payload }) => {
state.dataVizExtn = payload;
state.DataVizCore = window.Autodesk.DataVisualization.Core;
// heatmap
state.structureInfo = new window.Autodesk.DataVisualization.Core.ModelStructureInfo(state.model);
},
loadStructureInfo: (state, { payload }) => {
state.structureInfo = payload
},
loadModel: (state, { payload }) => {
state.model = payload
},
shutdownForge: (state, action) => {
state.viewer?.finish();
@ -46,5 +56,5 @@ const forgeSlice = createSlice({
});
const { reducer, actions } = forgeSlice;
export const { shutdownForge, loadDataVizExtn } = actions;
export const { shutdownForge, loadDataVizExtn, loadModel } = actions;
export default reducer;

View File

@ -5,8 +5,10 @@ import device, {
fetchSelectedDeviceList,
fetchSelectedDeviceMenu,
fetchSelectedDevFlTags,
getCurDeviceTemp,
changeMainSubSys,
} from "./deviceListSlice";
import forgeViewer, { fetchForge, loadDataVizExtn, shutdownForge } from "./forgeSlice";
import forgeViewer, { fetchForge, loadDataVizExtn, loadModel, shutdownForge } from "./forgeSlice";
import system, { fetchSysMainSub } from "./systemSlice";
import user, { fetchUserInfo, fetchUserAuthPages } from "./userSlice";
import alarm, { fetchBuiAlarmStateByBaja } from "./alarmSlice";
@ -40,16 +42,25 @@ export default store;
export {
fetchBuiList,
changeBuilding,
fetchSelectedDeviceList,
fetchSelectedDeviceMenu,
fetchSelectedDevFlTags,
getCurDeviceTemp,
changeMainSubSys,
fetchForge,
loadDataVizExtn,
loadModel,
shutdownForge,
fetchSysMainSub,
fetchUserInfo,
fetchUserAuthPages,
fetchBuiAlarmStateByBaja,
fetchInitElecMeterByBaja,
getElectricMeter,
getHourElectricMeter,

View File

@ -14,7 +14,8 @@ export async function getBuiAlarmStateByBaja(area_tag, building_tag) {
const { msgText, sourceName } = this.get("alarmData").$map.$map;
const { $enc: ackState } = this.get("ackState").getType();
const { $enc: sourceState } = this.get("sourceState").getType();
if (ackState !== "acked" && sourceState !== "normal") {
// 在選單上的顯示警告,只須出現在緊急的 offnormal 設備
if (sourceState !== "normal") {
result.push({
msgText,
sourceName,

View File

@ -0,0 +1,12 @@
export function PointSubscribe(baja, sub, ordPath, pointName) {
// ord 為要訂閱的點位
baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}`)
.get()
.then(folder => {
folder.getSlots().is("control:NumericWritable").eachValue((point) => {
if (point.getDisplayName() === pointName) {
baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}/${pointName}`).get({ subscriber: sub })
}
})
})
}

View File

@ -1,26 +1,35 @@
import { getCurDeviceTemp } from "@STORE"
import { roundDecimal } from "@UTIL";
// 訂閱設備
// 針對數值的點位
export function SubscribeDeviceByBaja(ord) {
export function SubscribeDeviceTempByBaja(ordPath, dispatch) {
window.require &&
window.requirejs(["baja!"], (baja) => {
console.log("進入 bajaSubscriber 準備執行BQL訂閱");
const sub = new baja.subscriber();
sub.attach("changed", (prop, cx) => {
console.log(prop, cx);
});
// ord 為要訂閱的點位
baja.Ord.make(ord)
.get({
subscriber: sub,
// cursor 對返回的數據做處理
cursor: {
before: function () {},
each: function () {},
after: function () {},
},
})
.then((point) => {
console.log(point);
});
});
const sub = new baja.Subscriber();
function passValueToFront(temp) {
dispatch(getCurDeviceTemp({ device_number: ordPath, temp }))
}
sub.attach("changed", (prop) => {
if (prop && prop.$displayName === "Out") {
passValueToFront(prop.$getValue().getValueDisplay())
}
})
sub.attach("subscribed", (prop) => {
if (prop && prop.$displayName === "Out") {
passValueToFront(prop.$getValue().getValueDisplay())
}
})
// ord 為要訂閱的點位
// ord 為要訂閱的點位
baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}`)
.get()
.then(folder => {
folder.getSlots().is("control:NumericWritable").eachValue((point) => {
if (point.getDisplayName() === "Temp" || point.getDisplayName() === "TEMP") {
baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}/${point.getDisplayName()}`).get({ subscriber: sub })
}
})
})
})
}

View File

@ -89,30 +89,34 @@ export async function getCurPower(ordPath, dispatch) {
window.require &&
window.require(["baja!"], function (baja) {
const sub = new baja.Subscriber();
sub.attach("changed", function (prop) {
const value = roundDecimal(this.get("out").getValue());
function passValueToFront(value) {
const newValue = roundDecimal(value);
dispatch(
getCurElectricity([
{ data: value, text: "即時功率 " },
{ data: roundDecimal(value / 4), text: "即時契約容量占比 " },
{ data: newValue, text: "即時功率 " },
{ data: roundDecimal(newValue / 4), text: "即時契約容量占比 " },
]),
);
}
sub.attach("changed", function (prop) {
if (prop && prop.$displayName === "Out") {
passValueToFront(prop.$getValue().getValueDisplay())
}
})
sub.attach("subscribed", function (prop) {
if (prop && prop.$displayName === "Out") {
passValueToFront(prop.$getValue().getValueDisplay())
}
});
// ord 為要訂閱的點位
baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}`)
.get()
.then((folder) => {
folder
.getSlots()
.is("control:NumericWritable")
.eachValue((point) => {
.then(folder => {
folder.getSlots().is("control:NumericWritable").eachValue((point) => {
if (point.getDisplayName() === "P") {
baja.Ord.make(
`local:|foxs:|station:|slot:/TPE/B1/EE/E4/R2F/NA/WHT/N1/${point.getDisplayName()}`,
).get({
subscriber: sub,
});
}
});
});
baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}/${point.getDisplayName() }`).get({ subscriber: sub })
}
})
})
});
}

View File

@ -1,5 +1,5 @@
import { getBuiAlarmStateByBaja, getDeviceAlarmByBaja } from "./alarmBaja";
import { SubscribeDeviceByBaja } from "./deviceBaja";
import { SubscribeDeviceTempByBaja } from "./deviceBaja";
import { getTotalElectricByBaja, getCurPower } from "./electricityBaja";
// 下載 N4 內置requireJS
function loadRequireJS() {
@ -25,10 +25,14 @@ function setUserAccountByBaja(callBackFunc = null) {
export {
loadRequireJS,
// 使用者
setUserAccountByBaja,
// alarm
getBuiAlarmStateByBaja,
getDeviceAlarmByBaja,
SubscribeDeviceByBaja,
// device
SubscribeDeviceTempByBaja,
// eletricity
getTotalElectricByBaja,
getCurPower,
};

View File

@ -1,5 +1,5 @@
import { forgeTokenBaseUrl } from "@CON";
import { loadDataVizExtn } from "@STORE";
import { loadDataVizExtn, loadModel } from "@STORE";
// 載入 forgeCss 樣式
function loadForgeCss(src) {
const link = document.createElement("link");
@ -72,15 +72,19 @@ export function modelLoad(viewer, urn, dispatch) {
const documentId = `urn:${urn}`;
window.Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
function onDocumentLoadSuccess(viewerDocument) {
async function onDocumentLoadSuccess(viewerDocument) {
var defaultModel = viewerDocument.getRoot().getDefaultGeometry();
viewer.loadDocumentNode(viewerDocument, defaultModel);
viewer.addEventListener(window.Autodesk.Viewing.GEOMETRY_LOADED_EVENT, async function () {
// 取得所有 forge dbid
const allDbIds = getAllDbIds(this);
viewer.addEventListener(window.Autodesk.Viewing.GEOMETRY_LOADED_EVENT, async ()=> {
console.log(viewer.model)
dispatch(loadModel(viewer.model))
// sprites
const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
dispatch(loadDataVizExtn(dataVizExtn));
// heatmap
//const structureInfo = new window.Autodesk.DataVisualization.Core.ModelStructureInfo(viewer.model);
//dispatch(loadStructureInfo(structureInfo));
});
}
@ -89,13 +93,4 @@ export function modelLoad(viewer, urn, dispatch) {
}
}
// 取得 forge dbid
function getAllDbIds(viewer) {
var instanceTree = viewer.model?.getData().instanceTree;
var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
return allDbIdsStr.map(function (id) {
return parseInt(id);
});
}

View File

@ -1,9 +1,13 @@
import {
loadRequireJS,
// 使用者
setUserAccountByBaja,
// alarm
getBuiAlarmStateByBaja,
getDeviceAlarmByBaja,
SubscribeDeviceByBaja,
// device
SubscribeDeviceTempByBaja,
// eletricity
getTotalElectricByBaja,
getCurPower,
} from "./baja/index";
@ -14,10 +18,14 @@ import { userLogin } from "./login";
import { roundDecimal } from "./math";
export {
loadRequireJS,
// 使用者
setUserAccountByBaja,
// alarm
getBuiAlarmStateByBaja,
getDeviceAlarmByBaja,
SubscribeDeviceByBaja,
// device
SubscribeDeviceTempByBaja,
// eletricity
getTotalElectricByBaja,
getCurPower,
forgeInit,