This commit is contained in:
dev02 2022-11-18 16:08:53 +08:00
commit 040295429d
7 changed files with 1442 additions and 42 deletions

1
.gitignore vendored
View File

@ -361,3 +361,4 @@ MigrationBackup/
# Fody - auto-generated XML schema # Fody - auto-generated XML schema
FodyWeavers.xsd FodyWeavers.xsd
/Backend/wwwroot/upload/floor_map.zip

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 105 KiB

View File

@ -1,42 +1,39 @@
<style> <style>
[id^=yt_tooltip] { [id^=yt_tooltip] {
width: 450px; width: 600px;
}
.circle-light {
width: 25px;
height: 25px;
border-radius: 50px;
} }
</style> </style>
<div class="row"> <div class="row">
<div class="col-sm-12 col-xl-5" id="floDevList"> <div class="col-sm-12 col-xl-5">
<!--<div class="d-flex justify-content-start mb-6"> <div class="d-flex mb-4" style="gap:15px">
<button type="button" class="btn btn-primary waves-effect waves-themed mr-5">19 F</button> <div class="row m-0 align-items-center">
<div id="floor19" class="mr-5 cur-poi"> <span class="circle-light bg-success mr-2"></span>
<span class="status status-success d-inline-block"> <label class="mb-0">正常</label>
<img src="img/demo/avatars/avatar-c.png" class="profile-image rounded-circle" alt="...">
</span> 19F 門口東
</div> </div>
<div class="mr-5"> <div class="row m-0 align-items-center">
<span class="status status-danger d-inline-block"> <span class="circle-light bg-secondary mr-2"></span>
<img src="img/demo/avatars/avatar-c.png" class="profile-image rounded-circle" alt="..."> <label class="mb-0">關機</label>
</span> 19F 戶外門口中間 </div>
<div class="row m-0 align-items-center">
<span class="circle-light bg-danger mr-2"></span>
<label class="mb-0">異常</label>
</div> </div>
</div> </div>
<div class="d-flex justify-content-start mb-6"> <div class="col-12 p-0" id="floDevList">
<button type="button" class="btn btn-primary waves-effect waves-themed mr-5">21 F</button>
<div class=" mr-5">
<span class="status status-success d-inline-block">
<img src="img/demo/avatars/avatar-c.png" class="profile-image rounded-circle" alt="...">
</span> 21F 電錶01
</div>
<div class="mr-5">
<span class="status status-danger d-inline-block">
<img src="img/demo/avatars/avatar-c.png" class="profile-image rounded-circle" alt="...">
</span> 21F 電錶02
</div>
</div>-->
</div>
</div> </div>
<div class="col-sm-12 col-xl-7"> <div class="col-sm-12 col-xl-7">
<img src="img/clouds.png" class="img-fluid" style="min-height: 520px;"> <!--<img src="img/clouds.png" class="img-fluid" style="min-height: 520px;">-->
<!--<a href="javascript:;" data-toggle="modal" data-target=".default-example-modal-right-lg"> <!--<a href="javascript:;" data-toggle="modal" data-target=".default-example-modal-right-lg">
<span class="badge border border-light bg-primary-700 position-absolute pos-top pos-left"><i class="fal fa-image fa-3x"></i></span></a>--> <span class="badge border border-light bg-primary-700 position-absolute pos-top pos-left"><i class="fal fa-image fa-3x"></i></span></a>-->
</div> </div>
@ -68,12 +65,12 @@
} else { } else {
let strHtml = ``; let strHtml = ``;
$.each(res.data, (index, floObj) => { $.each(res.data, (index, floObj) => {
strHtml += "<div class='d-flex justify-content-start mb-6'>" strHtml += `<div class='d-flex justify-content-start mb-5' style="height:60px">`
strHtml += `<button id="floItemBtn${floObj.full_name}" type="button" class="btn btn-primary waves-effect waves-themed mr-5">${floObj.full_name}</button>` strHtml += `<button id="floItemBtn${floObj.full_name}" type="button" class="btn btn-primary waves-effect waves-themed mr-5 align-self-center" >${floObj.full_name}</button>`
$.each(floObj.device_list, (index2, devObj) => { $.each(floObj.device_list, (index2, devObj) => {
console.log(">>>> url: " + baseImgUrl + " , img: " + varPathImg + ", icon: " + devObj.device_master_icon); console.log(">>>> url: " + baseImgUrl + " , img: " + varPathImg + ", icon: " + devObj.device_master_icon);
strHtml += `<div name="devItem" data-id="${devObj.device_guid}" data-number="${devObj.device_number}" class="mr-5 cur-poi"> strHtml += `<div name="devItem" data-id="${devObj.device_guid}" data-number="${devObj.device_number}" data-name="${devObj.full_name}" class="mr-5 cur-poi">
<span class="status status-success d-inline-block"> <span class="status status-success d-inline-block">
<img src="${baseImgUrl + varPathImg + devObj.device_master_icon}" class="profile-image rounded-circle" onerror="defDev(this)" alt="..."> <img src="${baseImgUrl + varPathImg + devObj.device_master_icon}" class="profile-image rounded-circle" onerror="defDev(this)" alt="...">
</span> ${devObj.full_name} </span> ${devObj.full_name}
@ -144,9 +141,13 @@
$("[name=devItem]").each((index, ele) => { $("[name=devItem]").each((index, ele) => {
let devNum = $(ele).data("number"); //設備編號 let devNum = $(ele).data("number"); //設備編號
let devGuid = $(ele).data("id"); //guid let devGuid = $(ele).data("id"); //guid
let devName = $(ele).data("name"); //full_name
$(ele).YTTooltip({ $(ele).YTTooltip({
html: `<div class="card m-1 border device-wrap"> html: `<div class="card m-1 border device-wrap">
<div class="card-header p-2 px-3"> <div class="card-header p-2 px-3">
<div class="position-absolute w-50" style="word-break: break-all;">
<label class="m-0 mt-2">${devName}</label>
</div>
<div id="card-tab" class="row justify-content-end nav nav-tabs" role="tablist"> <div id="card-tab" class="row justify-content-end nav nav-tabs" role="tablist">
<button type="button" id="state-tab" class="btn btn-icon nav-link active" role="tab" data-tabname="cardTab" data-target="#state"><i class="fa fa-desktop icon"></i></button> <button type="button" id="state-tab" class="btn btn-icon nav-link active" role="tab" data-tabname="cardTab" data-target="#state"><i class="fa fa-desktop icon"></i></button>
<button type="button" id="info-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#info"><i class="fa fa-cog icon"></i></button> <button type="button" id="info-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#info"><i class="fa fa-cog icon"></i></button>
@ -177,7 +178,7 @@
var tab = new YT.Tab({ tabName: "cardTab" }) var tab = new YT.Tab({ tabName: "cardTab" })
console.log($(oriEle).data("number")) console.log($(oriEle).data("number"))
//基本資料tab block //基本資料tab block
$("#info").append(drawInfoTabBlo(devGuid)) $("#info").html(drawInfoTabBlo(devGuid));
loadOpeRecTable(devGuid); loadOpeRecTable(devGuid);
//loadErrRecTable2($(oriEle).data("number")); //loadErrRecTable2($(oriEle).data("number"));
loadErrRecTable(); loadErrRecTable();
@ -200,7 +201,7 @@
let columns = [ let columns = [
{ {
"title": "類型", "title": "類型",
"data": "work_type", "data": "work_type_name",
}, },
{ {
"title": "項目", "title": "項目",
@ -213,7 +214,7 @@
{ {
"title": "發生/完成時間", "title": "發生/完成時間",
"data": "finishTime", "data": "finishTime",
"render": function (data,type,row) { "render": function (data, type, row) {
return row.createdAt + "<br>" + data; return row.createdAt + "<br>" + data;
}, },
}, },
@ -228,7 +229,7 @@
// api.columns.adjust(); // api.columns.adjust();
//} //}
let opeRecTable = new YourTeam.JqDataTables.getTableByAjax(url, tag, null, columns, column_defs,null, null, null, null, null, null, "tpi"); let opeRecTable = new YourTeam.JqDataTables.getTableByAjax(url, tag, null, columns, column_defs, null, null, null, null, null, null, "tpi");
} }
function loadErrRecTable() { function loadErrRecTable() {
@ -269,7 +270,7 @@
let result = '{"count": 2,"data":[{ "uuid": "43dc7846-bd96-4be2-ab35-f11aec729c60","msgText": "","ackState": "1","timestamp": "2022-Nov-16 10:30:24.951 AM UTC+08:00"},{"uuid": "7c309846-d862-4a8b-803b-cdc8e0efa092","msgText": "","ackState": "1","timestamp": "2022-Nov-16 10:00:24.893 AM UTC+08:00"}]}'; let result = '{"count": 2,"data":[{ "uuid": "43dc7846-bd96-4be2-ab35-f11aec729c60","msgText": "","ackState": "1","timestamp": "2022-Nov-16 10:30:24.951 AM UTC+08:00"},{"uuid": "7c309846-d862-4a8b-803b-cdc8e0efa092","msgText": "","ackState": "1","timestamp": "2022-Nov-16 10:00:24.893 AM UTC+08:00"}]}';
let json_object = JSON.parse(result); let json_object = JSON.parse(result);
datas = json_object['data']; datas = json_object['data'];
errRecTable = new YourTeam.JqDataTables.getTableByStatic(tag, datas, columns, column_defs); errRecTable = new YourTeam.JqDataTables.getTableByStatic(tag, datas, columns, column_defs, null, null, null, null, "tpi");
} }
//function loadErrRecTable2(allPath) { //function loadErrRecTable2(allPath) {

View File

@ -15,6 +15,7 @@
var currentData = []; var currentData = [];
var allDeviceRowData = []; //所有設備原始資料 var allDeviceRowData = []; //所有設備原始資料
var global_emergency_alarm_device_number = []; var global_emergency_alarm_device_number = [];
var zoomToggle = 3;
$(function () { $(function () {
initChart(); initChart();
getFloData(); getFloData();
@ -132,7 +133,7 @@
function initChart() { function initChart() {
let chartDom = $("#floChart")[0]; let chartDom = $("#floChart")[0];
floChart = echarts.init(chartDom, null, { width: 'auto' }); floChart = echarts.init(chartDom, null, { width: 'auto'});
} }
function chartHandler(url) { function chartHandler(url) {
@ -168,11 +169,11 @@
roam: true, roam: true,
scaleLimit: { //限制放大縮小倍數 scaleLimit: { //限制放大縮小倍數
max: 32, max: 32,
min: 2.5 min: 1
}, },
layoutSize: '100%', layoutSize: '100%',
layoutCenter: [], layoutCenter: [],
zoom: 2.5, zoom: 1.2,
silent: true silent: true
}, },
series: [ series: [
@ -565,7 +566,7 @@
obj.symbolSize = 60 obj.symbolSize = 60
} }
console.log(item.zoom) console.log(item.zoom)
if (item.zoom > 8) { if (item.zoom > zoomToggle) {
obj.symbolSize = 10 obj.symbolSize = 10
} }
res.push(obj); res.push(obj);
@ -771,7 +772,7 @@
zoom = floChart.getOption().geo[0].zoom; zoom = floChart.getOption().geo[0].zoom;
} }
if (zoom <= 8) { if (zoom <= zoomToggle) {
floChart.setOption({ floChart.setOption({
series: [{ series: [{
symbolOffset: [0, 0], symbolOffset: [0, 0],

View File

@ -4,6 +4,7 @@
} }
/* ================================================================ */ /* ================================================================ */
/* 單一方法 */ /* 單一方法 */
/* ================================================================ */ /* ================================================================ */

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 18 KiB

View File

@ -144,6 +144,9 @@ function fnInitJqDataTablesAjax(apiUrl, tag, sendData = null, columns, columns_d
if (sendData == null) { if (sendData == null) {
sendData = function (json) { sendData = function (json) {
console.log("讀取列表", json) console.log("讀取列表", json)
if (json.code && json.code == "0000") {
return json.data;
}
return json; return json;
} }
} }