gitadmin/sk_fems_ui
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases Wiki Activity

Remove mockdata screen 5

Browse Source
This commit is contained in:
Michael
2025-07-30 15:35:41 +09:00
parent 2338bbf2ec
commit 6077dddb74
1 changed files with 540 additions and 727 deletions
Download Patch File Download Diff File Expand all files Collapse all files

315
pages/ems/effc/EnrgUseEqpmDetlMntrPage.vue
View File

@ -1,7 +1,6 @@
<template> <template>
<div ref="mainDiv" class="l-layout"> <div ref="mainDiv" class="l-layout">
<PageTitle text="에너지 사용량 이력" /> <CommonPageTitle />
<v-row ref="searchFilter"> <v-row ref="searchFilter">
<v-col :cols="12"> <v-col :cols="12">
<v-card class="searchFilter"> <v-card class="searchFilter">
@ -76,6 +75,7 @@
:parentPrgmId="myPrgmId" :parentPrgmId="myPrgmId"
:isRangeOption="false" :isRangeOption="false"
:textCols="12" :textCols="12"
:customClass="'datepicker-large'"
/> />
</v-col> </v-col>
<v-col :cols="6" class="text-right"> <v-col :cols="6" class="text-right">
@ -270,7 +270,6 @@ export default {
DatePicker, DatePicker,
Grid, Grid,
Chart, Chart,
PageTitle,
}, },
data() { data() {
return { return {
@ -363,10 +362,9 @@ export default {
setChartOption: "setChartOption", setChartOption: "setChartOption",
}), }),
async init() { async init() {
await this.search();
await this.getSelectValueList(); await this.getSelectValueList();
await this.setQueryParams(); await this.setQueryParams();
await this.search();
this.initedFlag = true; this.initedFlag = true;
}, },
@ -522,11 +520,6 @@ export default {
await this.setContentData01(); await this.setContentData01();
await this.setContentData02(); await this.setContentData02();
await this.setContentData03(); await this.setContentData03();
await this.setContentData04();
// await this.setContentData01();
// await this.setContentData02();
// await this.setContentData03();
// await this.setContentData04(); // await this.setContentData04();
}, },
async setContentData01() { async setContentData01() {
@ -540,47 +533,16 @@ export default {
apiKey = "selectMonthlyEnrgUseMainGuideIdx"; apiKey = "selectMonthlyEnrgUseMainGuideIdx";
} }
// res = await this.postApiReturn({ res = await this.postApiReturn({
// apiKey: apiKey, apiKey: apiKey,
// resKey: "enrgUseEqpmDetlMntrData", resKey: 'enrgUseEqpmDetlMntrData',
// sendParam: { sendParam: {
// eqpmGrpId: this.selectValue03, eqpmGrpId: this.selectValue03,
// eqpmId: this.selectValue04, eqpmId: this.selectValue04,
// fromDt: this.fromDt, fromDt: this.fromDt,
// },
// });
res = [
{
gdIdxId: "A01",
gdIdxNm: "Temperature",
dataNum: 0,
totVal: 23.5,
timestamp: "2025-07-15T10:00:00Z",
}, },
{ });
gdIdxId: "C03", console.log('res 01:',res)
gdIdxNm: "Power Usage",
dataNum: 1,
totVal: 24.1,
timestamp: "2025-07-15T11:00:00Z",
},
{
gdIdxId: "B02",
gdIdxNm: "Humidity",
dataNum: 0,
totVal: 60,
timestamp: "2025-07-15T10:00:00Z",
},
{
gdIdxId: "B03",
gdIdxNm: "Test",
dataNum: 0,
totVal: 50,
timestamp: "2025-07-19T10:00:00Z",
},
];
this.contentData01 = await this.makeContentData01(res); this.contentData01 = await this.makeContentData01(res);
console.log("content", this.contentData01); console.log("content", this.contentData01);
await this.setChartGroup01(this.contentData01); await this.setChartGroup01(this.contentData01);
@ -615,42 +577,16 @@ export default {
this.loadGrid01 = false; this.loadGrid01 = false;
// res = await this.postApiReturn({ res = await this.postApiReturn({
// apiKey: "selectEnrgUseGuideAlarmInfo", apiKey: 'selectEnrgUseGuideAlarmInfo',
// resKey: "enrgUseEqpmDetlMntrData", resKey: 'enrgUseEqpmDetlMntrData',
// sendParam: { sendParam: {
// cmCycle: this.pageData.cmCycle, cmCycle: this.pageData.cmCycle,
// eqpmId: this.selectValue04, eqpmId: this.selectValue04,
// fromDt: this.fromDt, fromDt: this.fromDt,
// alrmKind: ["WARN", "CARE"], alrmKind: ['WARN', 'CARE'],
// },
// });
res = [
{
gdIdxId: "PQ001",
totDttm: "TEMP",
totDt: "Temperature",
totTm: "Analog",
gdIdxNm: "PQ001",
totVal: "TEMP",
caseStndVal: "Temperature",
warnStndVal: "Analog",
alrmKind: "PQ001",
alrmMsg: "TEMP",
}, },
{ });
gdIdxId: "PQ001",
totDttm: "TEMP",
totDt: "Temperature",
totTm: "Analog",
gdIdxNm: "PQ001",
totVal: "TEMP",
caseStndVal: "Temperature",
warnStndVal: "Analog",
alrmKind: "PQ001",
alrmMsg: "TEMP",
},
];
for (var i = 0; i < res.length; i++) { for (var i = 0; i < res.length; i++) {
newRes.push({ newRes.push({
@ -697,33 +633,13 @@ export default {
this.loadGrid02 = false; this.loadGrid02 = false;
// res = await this.postApiReturn({ res = await this.postApiReturn({
// apiKey: "selectEnrgUseEqpmDescInfo", apiKey: 'selectEnrgUseEqpmDescInfo',
// resKey: "enrgUseEqpmDetlMntrData", resKey: 'enrgUseEqpmDetlMntrData',
// sendParam: { sendParam: {
// eqpmGrpId: this.selectValue03, eqpmGrpId: this.selectValue03,
// },
// });
res = [
{
pysclQtyId: "PQ001",
pysclQtyCd: "TEMP",
pysclQtyNm: "Temperature",
pysclQtyTp: "Analog",
}, },
{ });
pysclQtyId: "PQ002",
pysclQtyCd: "PRESS",
pysclQtyNm: "Pressure",
pysclQtyTp: "Analog",
},
{
pysclQtyId: "PQ003",
pysclQtyCd: "FLOW",
pysclQtyNm: "Flow Rate",
pysclQtyTp: "Digital",
},
];
for (var i = 0; i < res.length; i++) { for (var i = 0; i < res.length; i++) {
newRes.push({ newRes.push({
@ -748,11 +664,11 @@ export default {
this.loadGrid02 = true; this.loadGrid02 = true;
await this.$nextTick(); await this.$nextTick();
// this.$refs[this.gridName02].focus({ this.$refs[this.gridName02].focus({
// rowKey: 0, rowKey: 0,
// columnName: "no", columnName: 'no',
// setScroll: true, setScroll: true,
// }); });
}, },
async setContentData04(selectedData) { async setContentData04(selectedData) {
var res = null; var res = null;
@ -764,31 +680,23 @@ export default {
this.loadTrendChart = false; this.loadTrendChart = false;
xAxisData = this.makeTrendChartXaxisData(); xAxisData = this.makeTrendChartXaxisData();
console.log("x axis :", xAxisData);
if (this.pageData.cmCycle == "CYC_MONTH") { if (this.pageData.cmCycle == "CYC_MONTH") {
sliderHandleSize = ((24 / xAxisData.length) * 100 * 24) / 25; sliderHandleSize = ((24 / xAxisData.length) * 100 * 24) / 25;
} }
// res = await this.postApiReturn({ res = await this.postApiReturn({
// apiKey: "selectEnrgUseHourlyTrendInfo", apiKey: 'selectEnrgUseHourlyTrendInfo',
// resKey: "enrgUseEqpmDetlMntrData", resKey: 'enrgUseEqpmDetlMntrData',
// sendParam: { sendParam: {
// pysclQtyId: selectedData.pysclQtyId, pysclQtyId: selectedData.pysclQtyId,
// eqpmId: this.selectValue04, eqpmId: this.selectValue04,
// fromDt: this.fromDt, fromDt: this.fromDt,
// cmCycle: this.pageData.cmCycle, cmCycle: this.pageData.cmCycle,
// }, },
// }); });
res = [ seriesData = new Array(xAxisData.length).fill(NaN);
{ monthCnt: 0, totVal: 120 },
{ monthCnt: 1, totVal: 150 },
{ monthCnt: 2, totVal: 180 },
{ monthCnt: 3, totVal: 200 },
];
seriesData = new Array(xAxisData.length).fill(300);
for (var i = 0; i < res.length; i++) { for (var i = 0; i < res.length; i++) {
if (this.pageData.cmCycle == "CYC_MONTH") { if (this.pageData.cmCycle == "CYC_MONTH") {
@ -798,8 +706,6 @@ export default {
} }
} }
var seriesData2 = new Array(xAxisData.length).fill(100);
var chartOption = { var chartOption = {
grid: { grid: {
top: "3%", top: "3%",
@ -845,14 +751,14 @@ export default {
color: "#D32029", color: "#D32029",
}, },
}, },
{ // {
type: "line", // type: "line",
data: seriesData2, // data: seriesData2,
symbol: "none", // symbol: "none",
itemStyle: { // itemStyle: {
color: "#FAAD14", // color: "#FAAD14",
}, // },
}, // },
], ],
dataZoom: [ dataZoom: [
{ {
@ -898,40 +804,13 @@ export default {
} }
} }
// var idxData = await this.postApiReturn({ var idxData = await this.postApiReturn({
// apiKey: "selectEnrgUseMainIdxDesc", apiKey: 'selectEnrgUseMainIdxDesc',
// resKey: "eqpmIndMntrData", resKey: 'eqpmIndMntrData',
// sendParam: { sendParam: {
// eqpmGrpId: this.selectValue03, eqpmGrpId: this.selectValue03,
// },
// });
var idxData = [
{
gdIdxId: "A01",
gdIdxNm: "Temperature",
unit: "°C",
description: "Average temperature reading",
}, },
{ });
gdIdxId: "B02",
gdIdxNm: "Humidity",
unit: "%",
description: "Relative humidity level",
},
{
gdIdxId: "C03",
gdIdxNm: "Power Usage",
unit: "kWh",
description: "Total power consumption",
},
{
gdIdxId: "B03",
gdIdxNm: "Test",
unit: "%",
description: "Relative humidity level test",
},
];
for (var i = 0; i < idxData.length; i++) { for (var i = 0; i < idxData.length; i++) {
if (!result.hasOwnProperty(idxData[i]["gdIdxId"])) { if (!result.hasOwnProperty(idxData[i]["gdIdxId"])) {
@ -956,11 +835,10 @@ export default {
var dataKeyList = Object.keys(data); var dataKeyList = Object.keys(data);
var currentChartData = null; var currentChartData = null;
var chartKey = null; var chartKey = null;
for (var i = 0; i < dataKeyList.length; i++) { for (var i = 0; i < dataKeyList.length; i++) {
currentChartData = data[dataKeyList[i]]; currentChartData = data[dataKeyList[i]];
console.log("curr:", currentChartData); chartKey = 'chartGroup01_' + currentChartData['gdIdxId'];
chartKey = "chartGroup01_" + currentChartData["gdIdxId"];
this.setPageData({ this.setPageData({
[chartKey]: this.getGroup01ChartOption(), [chartKey]: this.getGroup01ChartOption(),
@ -975,10 +853,9 @@ export default {
var seriesData = null; var seriesData = null;
xAxisData = this.makeChartGroup01XaxisData(); xAxisData = this.makeChartGroup01XaxisData();
console.log("text xaxis", xAxisData);
for (var i = 0; i < dataKeyList.length; i++) { for (var i = 0; i < dataKeyList.length; i++) {
seriesData = new Array(xAxisData.length).fill(10); seriesData = new Array(xAxisData.length).fill(NaN);
currentChartData = data[dataKeyList[i]]; currentChartData = data[dataKeyList[i]];
chartKey = "chartGroup01_" + currentChartData["gdIdxId"]; chartKey = "chartGroup01_" + currentChartData["gdIdxId"];
@ -1006,8 +883,6 @@ export default {
color: "#D32029", color: "#D32029",
}; };
// chartOption["series"][0]["symbol"] = "none";
console.log("chartOption: ", chartOption);
return chartOption; return chartOption;
}, },
makeChartGroup01XaxisData() { makeChartGroup01XaxisData() {
@ -1097,76 +972,14 @@ const defaultData = {
fromDt: Utility.setFormatDate(new Date(), "YYYYMM"), // 조회 시작일 fromDt: Utility.setFormatDate(new Date(), "YYYYMM"), // 조회 시작일
grid01: { grid01: {
data: [ data: [],
{ column: [],
gdIdxId: "PQ001",
totDttm: "TEMP",
totDt: "Temperature",
totTm: "Analog",
gdIdxNm: "PQ001",
totVal: "TEMP",
caseStndVal: "Temperature",
warnStndVal: "Analog",
alrmKind: "PQ001",
alrmMsg: "TEMP",
},
{
gdIdxId: "PQ001",
totDttm: "TEMP",
totDt: "Temperature",
totTm: "Analog",
gdIdxNm: "PQ001",
totVal: "TEMP",
caseStndVal: "Temperature",
warnStndVal: "Analog",
alrmKind: "PQ001",
alrmMsg: "TEMP",
},
],
column: [
{ header: "NO", name: "no", width: 40, align: "right" },
{ header: "gdIdxId", name: "gdIdxId", hidden: true, align: "left" },
{ header: "totDttm", name: "totDttm", hidden: true, align: "left" },
{ header: "발생일", name: "totDt", width: 150, align: "left" },
{ header: "발생시간대", name: "totTm", width: 100, align: "left" },
{ header: "가이드지표명", name: "gdIdxNm", width: 200, align: "left" },
{ header: "가이드값", name: "totVal", hidden: true, align: "left" },
{ header: "주의값", name: "caseStndVal", hidden: true, align: "left" },
{ header: "경고값", name: "warnStndVal", hidden: true, align: "left" },
{ header: "알람종류", name: "alrmKind", hidden: true, align: "left" },
{ header: "알람내용", name: "alrmMsg", align: "left" },
],
option: {}, option: {},
}, },
grid02: { grid02: {
data: [ data: [],
{ column: [],
pysclQtyId: "PQ001",
pysclQtyCd: "TEMP",
pysclQtyNm: "Temperature",
pysclQtyTp: "Analog",
},
{
pysclQtyId: "PQ002",
pysclQtyCd: "PRESS",
pysclQtyNm: "Pressure",
pysclQtyTp: "Analog",
},
{
pysclQtyId: "PQ003",
pysclQtyCd: "FLOW",
pysclQtyNm: "Flow Rate",
pysclQtyTp: "Digital",
},
],
column: [
{ header: "NO", name: "no", align: "right", width: 40 },
{ header: "물리량ID", name: "pysclQtyId", width: 100, align: "left" },
{ header: "물리량코드", name: "pysclQtyCd", align: "left" },
{ header: "물리량명", name: "pysclQtyNm", width: 190, align: "left" },
{ header: "물리량타입", name: "pysclQtyTp", width: 100, align: "left" },
],
option: {}, option: {},
}, },