BemsWebApplication.UsageByEnergy = function (params, viewInfo) { "use strict"; var initialized = false, shouldReload = false, dataSource; var formulaGet = new BWA.Chart.FormulaGet(BWA.UserInfo.SiteId()); var CO2 = $Code.FuelType.WATER + 1; var UnionfuelType = $Code.FuelType.WATER + 2, UnionfuelName = "전기+가스"; var visiblePopup = ko.observable(false); var fuelTypesDataSource = BemsWebApplication.db.createDataSource('BemsFuelType'), factorCo2DataSource = BemsWebApplication.db.createDataSource('BemsFactorCo2'), fuelTypesForSearch = ko.observableArray(), timeTypesForSearch = ko.observableArray(), timeTypeIdForSearch = ko.observable(0), fuelTypeIdForSearch = ko.observable(), deferredForSearch = new $.Deferred(); var factorCo2 = null; var energyUsageStatusGet = new BWA.Chart.EnergyUsageStatusGet(BWA.UserInfo.SiteId()), timeBoxForSearch = BWA.SearchView.createDateTimeBox(), dataArray = ko.observableArray(); // 2017.11.27 : 그리드 도표 작업 : 팝업창 추가 // 팝업창뷰 보이기 속성 제어용 변수 선언 var DataGridPopup_Visible = ko.observable(false); var DataGridPopup_Visible1 = ko.observable(false); var DataGridPopup_Visible2 = ko.observable(false); var DataGridPopup_Visible3 = ko.observable(false); // 그래프 출력 이후 엑셀출력을 위한 팝업창을 위해 임시 저장용 배열 선언 var dataArrayresult = ko.observableArray(); var dataArrayresult1 = ko.observableArray(); var dataArrayresult2 = ko.observableArray(); var dataArrayresult3 = ko.observableArray(); // 2017.11.27 : 그리드 도표 작업 : 팝업창 추가 var chart = BWA.Chart.Instance('chartU2', 'dxChart'); timeTypesForSearch($G.TimeTypes); var m = moment(); function handleViewShown() { if (initialized === false) { chart = chart(BWA.ChartOptions.UsageByEnergy.getChartOptions($Code.TimeType.HOUR)); initialized = true; } //hcLee 2016 07 12 timeBoxForSearch.setDefaultDate(); if (shouldReload) { } factorCo2DataSource.load().done(function (dbFactorCo2) { factorCo2 = BWA.Bems.refineFactorCo2DataArray(dbFactorCo2); }); } function handleViewHidden() { visiblePopup(false); $SearchView.visibleObservable(false); // hcLee 2015 03 23 } function handleViewShowing() { $.when(fuelTypesDataSource.load()).done(function (fuelTypes) { fuelTypes.push({ FuelTypeId: ko.observable(CO2), Name: ko.observable('CO2') }); fuelTypes.push({ FuelTypeId: ko.observable(UnionfuelType), Name: ko.observable(UnionfuelName) }); fuelTypesForSearch($SearchView.filterObservableArrayForSelectBox('FuelTypeId', fuelTypes)); deferredForSearch.resolve(); handleSearchInSearchView(); }); } function refreshList() { } var searchViewOptions = { searchViewItems: [ { id: 'TimeTypeId', defaultValue: 0, value: timeTypeIdForSearch, dataSource: timeTypesForSearch }, { id: 'FuelTypeId', ignoreValue: 0, defaultValue: 1, value: fuelTypeIdForSearch, dataSource: fuelTypesForSearch }, { id: 'DateForHour', type: 'dateRange', isOnlyDate: true }, { id: 'TimeForHour', type: 'dateRange', isOnlyDate: true }, ], promiseDataInSearchView: deferredForSearch.promise() }; function handleSearchInSearchView() { visiblePopup(true); $("#large-indicator").dxLoadIndicator({ height: 60, width: 60 }); var date = timeBoxForSearch.getDate(), timeType = timeBoxForSearch.type(), fuelTypeId = fuelTypeIdForSearch(); if (fuelTypeId == $Code.FuelType.ELECTRICITY) { var promises = []; for (var fi = 2; fi < 4; fi++) { var p = formulaGet.apiGet({ FacilityTypeId: $Code.FacilityType.ELECTRICITY, FacilityCode: $Code.FacilityCode.ELECTRICITY, FormulaId: fi, TimeIntervalType: timeType, StartDate: date.startDate, EndDate: date.endDate }); promises.push(p); } $.when.apply(this, promises) .done(function (dataArray, dataArray2) { var DataArray = []; var DataArray_temp = []; var DataArray_temp1 = []; var DataArray_temp2 = []; _.each(dataArray[0], function (x) { DataArray.push({ DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()), '심야': x.Value }); }); _.each(dataArray2[0], function (x) { DataArray.push({ DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()), '일반': x.Value }); }); // 2017.11.27: 그리드 도표 작업 : 팝업창 추가 _.each(dataArray[0], function (x) { DataArray_temp.push({ DateTime: BWA.Chart.getCustermTimeArgumentAxisString($Code.TimeType.QUARTERMIN, moment(x.DateTime).toDate()), '심야': x.Value }); }); _.each(dataArray2[0], function (x) { DataArray_temp1.push({ DateTime: moment(x.DateTime).toDate(),//BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()), '일반': x.Value }); }); // 배열을 하나로 합치자 var array_length_size = Math.max(DataArray_temp.length, DataArray_temp1.length); // 크기가 동일한 경우에만 허용함 (예외 방어용) if (DataArray_temp.length == DataArray_temp1.length) { for (var i = 0; i < array_length_size; i++) { DataArray_temp2.push( { DateTime: DataArray_temp[i].DateTime, '심야': DataArray_temp[i].심야, '일반': DataArray_temp1[i].일반 }); } } dataArrayresult = DataArray_temp2; // 2017.11.27: 그리드 도표 작업 : 팝업창 추가 var options1 = BWA.ChartOptions.UsageByEnergy.getSeriesOptions(fuelTypeIdForSearch(), timeBoxForSearch.type()); options1.dataSource = DataArray; chart().option(options1); visiblePopup(false); }) .fail(function (error) { visiblePopup(false); }); return; } var request = energyUsageStatusGet.requestGetForUsgaeStatus.bind(energyUsageStatusGet); // this.apiUri = 'BemsFormula/Calculation'; 이거 사용함.2015 05 15 hcLee if (fuelTypeId == CO2) { var promises = []; var fuelTypes = _.values($Code.FuelType); _.each(fuelTypes, function (fuelTypeId) { promises.push(request(fuelTypeId, timeType)(date.startDate, date.endDate)); }); var calculate = factorCo2.calculate; $.when.apply(this, promises) .done(function (electricityArray, gasArray) { var chartDataSource = []; var chartDataSource_temp = []; var chartDataSource_temp1 = []; var chartDataSource_temp2 = []; var co2Fields = ['ECo2', 'GCo2']; _.each(arguments, function (array, i) { var field = co2Fields[i]; _.each(array[0], function (x) { var data = { DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()), }; data[field] = calculate(x.Value, fuelTypes[i]); chartDataSource.push(data); }); }); _.each(electricityArray[0], function (x) { chartDataSource_temp.push({ DateTime: BWA.Chart.getCustermTimeArgumentAxisString($Code.TimeType.QUARTERMIN, moment(x.DateTime).toDate()), 'ECo2': calculate(x.Value, 1) }); }); _.each(gasArray[0], function (x) { chartDataSource_temp1.push({ DateTime: moment(x.DateTime).toDate(),//BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()), 'GCo2': calculate(x.Value, 2) }); }); // 배열을 하나로 합치자 var array_length_size = Math.max(chartDataSource_temp.length, chartDataSource_temp1.length); // 크기가 동일한 경우에만 허용함 (예외 방어용) if (chartDataSource_temp.length == chartDataSource_temp1.length) { for (var i = 0; i < array_length_size; i++) { chartDataSource_temp2.push( { DateTime: chartDataSource_temp[i].DateTime, 'ECo2': chartDataSource_temp[i].ECo2, 'GCo2': chartDataSource_temp1[i].GCo2 }); } } dataArrayresult2 = chartDataSource_temp2; var options2 = BWA.ChartOptions.UsageByEnergy.getSeriesOptions(fuelTypeId, timeBoxForSearch.type(), date.startDate, date.endDate); chart().option('argumentAxis', null); // 2015 05 21 결국 이 코드가 필요 함 (시간 축 에러 해결) options2.dataSource = chartDataSource; chart().option(options2); visiblePopup(false); }) .fail(function (error) { visiblePopup(false); }); } if (fuelTypeId == UnionfuelType) { var promises = []; var fuelTypes = _.values($Code.FuelType); _.each(fuelTypes, function (fuelTypeId) { promises.push(request(fuelTypeId, timeType)(date.startDate, date.endDate)); }); // var calculate = factorCo2.calculate; $.when.apply(this, promises) .done(function (electricityArray, gasArray) { //var chartDataSource = []; var chartDataSource_temp = []; var chartDataSource_temp1 = []; var chartDataSource_temp2 = []; //var co2Fields = ['UnionE', 'UnionG']; //_.each(arguments, function (array, i) { // var field = co2Fields[i]; // _.each(array[0], function (x) { // var data = { // DateTime: BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()), // }; // data[field] = x.Value // chartDataSource.push(data); // }); //}); _.each(electricityArray[0], function (x) { chartDataSource_temp.push({ DateTime: BWA.Chart.getCustermTimeArgumentAxisString($Code.TimeType.QUARTERMIN, moment(x.DateTime).toDate()), 'UnionE': x.Value }); }); _.each(gasArray[0], function (x) { chartDataSource_temp1.push({ DateTime: moment(x.DateTime).toDate(),//BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()), 'UnionG': x.Value }); }); // 배열을 하나로 합치자 var array_length_size = Math.max(chartDataSource_temp.length, chartDataSource_temp1.length); // 크기가 동일한 경우에만 허용함 (예외 방어용) if (chartDataSource_temp.length == chartDataSource_temp1.length) { for (var i = 0; i < array_length_size; i++) { chartDataSource_temp2.push( { DateTime: chartDataSource_temp[i].DateTime, 'UnionE': chartDataSource_temp[i].UnionE, 'UnionG': chartDataSource_temp1[i].UnionG }); } } dataArrayresult3 = chartDataSource_temp2; var options3 = BWA.ChartOptions.UsageByEnergy.getSeriesOptions(fuelTypeId, timeBoxForSearch.type(), date.startDate, date.endDate); chart().option('argumentAxis', null); // 2015 05 21 결국 이 코드가 필요 함 (시간 축 에러 해결) options3.dataSource = dataArrayresult3; chart().option(options3); visiblePopup(false); }) .fail(function (error) { visiblePopup(false); }); } if (fuelTypeId == $Code.FuelType.GAS || fuelTypeId == $Code.FuelType.WATER) { request(fuelTypeId, timeType)(date.startDate, date.endDate) .done(function (dataArray) { var list = _.map(dataArray, function (x) { x.DateTime = BWA.Chart.getCustermTimeArgumentAxisString(timeBoxForSearch.type(), moment(x.DateTime).toDate()); return x; }); if (list.length == 0) utils.toast.show('데이터가 없습니다.'); var options3 = BWA.ChartOptions.UsageByEnergy.getSeriesOptions(fuelTypeId, timeBoxForSearch.type(), date.startDate, date.endDate); chart().option('argumentAxis', null); options3.dataSource = list; chart().option(options3); visiblePopup(false); }) .fail(function (error) { visiblePopup(false); }); request(fuelTypeId, timeType)(date.startDate, date.endDate) .done(function (dataArray) { var list1 = _.map(dataArray, function (x) { x.DateTime = BWA.Chart.getCustermTimeArgumentAxisString($Code.TimeType.QUARTERMIN, moment(x.DateTime).toDate()); return x; }); dataArrayresult1 = list1; }) .fail(function (error) { visiblePopup(false); }); } } // 2017.11.27: 그리드 도표 작업 : 팝업창 추가 function DataGridPopup_ButtonClick() { if (fuelTypeIdForSearch() == $Code.FuelType.ELECTRICITY) DataGridPopup_Visible(true); else if (fuelTypeIdForSearch() == $Code.FuelType.GAS || fuelTypeIdForSearch() == $Code.FuelType.WATER) DataGridPopup_Visible1(true); else if (fuelTypeIdForSearch() == CO2) DataGridPopup_Visible2(true); else DataGridPopup_Visible3(true); } function handlePopupShown() { // 컬럼명 업데이트 var ColumnCaptionName = ""; switch (fuelTypeIdForSearch()) { case $Code.FuelType.ELECTRICITY: $("#UsageByEnergyDataGrid_Container").dxDataGrid("instance").option("dataSource", dataArrayresult); DataGridPopup_Visible(true); break; case $Code.FuelType.GAS: ColumnCaptionName = "가스"; viewModel.UsageByEnergyDataGridOptions1.columns[1].caption = ColumnCaptionName; $("#UsageByEnergyDataGrid_Container1").dxDataGrid("instance").option("dataSource", dataArrayresult1); DataGridPopup_Visible1(true); break; case $Code.FuelType.WATER: ColumnCaptionName = "수도"; viewModel.UsageByEnergyDataGridOptions1.columns[1].caption = ColumnCaptionName; $("#UsageByEnergyDataGrid_Container1").dxDataGrid("instance").option("dataSource", dataArrayresult1); DataGridPopup_Visible1(true); break; case CO2: $("#UsageByEnergyDataGrid_Container2").dxDataGrid("instance").option("dataSource", dataArrayresult2); DataGridPopup_Visible2(true); break; case UnionfuelType: $("#UsageByEnergyDataGrid_Container3").dxDataGrid("instance").option("dataSource", dataArrayresult3); DataGridPopup_Visible3(true); break; } // 2017.11.27: 그리드 도표 작업 : 팝업창 추가 } var viewModel = $.extend(BWA.CommonView.create(params, viewInfo, searchViewOptions, ko.observable(null), handleViewShown, null, handleSearchInSearchView), { refreshList: refreshList, viewHidden: handleViewHidden, // hcLee 2015 03 23 viewShowing: handleViewShowing, UsageByEnergyDataGridPopup_ButtonClicked: DataGridPopup_ButtonClick }); // 2017.11.27: 그리드 도표 작업 : 팝업창 추가 // 그래프 도표 팝업창 viewModel.UsageByEnergyDataGridPopupOptions = { width: '480px', height: '830px', // cyim 2017.05.30 : 테스트 결과 Devextreme 버그임. px 로 지정하면 초기 출력시 정확하게 가운데에 있지만, auto 설정시 화면아래에 위치하게 됨 contentTemplate: "content", showTitle: true, title: "도표", visible: DataGridPopup_Visible, dragEnabled: true, closeOnOutsideClick: true, shownAction: handlePopupShown, animation: window.utils.popup.createAnimation(), shading: false }; viewModel.UsageByEnergyDataGridPopupOptions1 = { width: '300px', height: '830px', // cyim 2017.05.30 : 테스트 결과 Devextreme 버그임. px 로 지정하면 초기 출력시 정확하게 가운데에 있지만, auto 설정시 화면아래에 위치하게 됨 contentTemplate: "content", showTitle: true, title: "도표", visible: DataGridPopup_Visible1, dragEnabled: true, closeOnOutsideClick: true, shownAction: handlePopupShown, animation: window.utils.popup.createAnimation(), shading: false }; viewModel.UsageByEnergyDataGridPopupOptions2 = { width: '480px', height: '830px', // cyim 2017.05.30 : 테스트 결과 Devextreme 버그임. px 로 지정하면 초기 출력시 정확하게 가운데에 있지만, auto 설정시 화면아래에 위치하게 됨 contentTemplate: "content", showTitle: true, title: "도표", visible: DataGridPopup_Visible2, dragEnabled: true, closeOnOutsideClick: true, shownAction: handlePopupShown, animation: window.utils.popup.createAnimation(), shading: false }; viewModel.UsageByEnergyDataGridPopupOptions3 = { width: '480px', height: '830px', // cyim 2017.05.30 : 테스트 결과 Devextreme 버그임. px 로 지정하면 초기 출력시 정확하게 가운데에 있지만, auto 설정시 화면아래에 위치하게 됨 contentTemplate: "content", showTitle: true, title: "도표", visible: DataGridPopup_Visible3, dragEnabled: true, closeOnOutsideClick: true, shownAction: handlePopupShown, animation: window.utils.popup.createAnimation(), shading: false }; // 2017.11.27: 그리드 도표 작업 : 팝업창 추가 viewModel.timeBoxForSearch = timeBoxForSearch; viewModel.popupOptions = { width: 300, height: 160, contentTemplate: "info", showTitle: false, title: "메세지", visible: visiblePopup, dragEnabled: false, shading: false, closeOnOutsideClick: false }; viewModel.UsageByEnergyDataGridOptions = { dataSource: dataArrayresult, columns: [ { dataField: 'DateTime', caption: "날짜", width: '33%', alignment: 'center', },// dataType: 'date', format: 'yyyy-MM-dd HH:mm' }, { dataField: '일반', caption: "일반", width: '33%', alignment: 'center', format: 'fixedPoint', precision: 2 }, { dataField: '심야', caption: "심야", width: '33%', alignment: 'center', format: 'fixedPoint', precision: 2 } ], "export": { enabled: true, fileName: '에너지사용량 분석(전력)' } }; //가스, 수도 viewModel.UsageByEnergyDataGridOptions1 = { dataSource: dataArrayresult1, columns: [ { dataField: 'DateTime', caption: "날짜", width: '50%', alignment: 'center', },// dataType: 'date', format: 'yyyy-MM-dd HH:mm' }, { dataField: 'Value', width: '33%', alignment: 'center', format: 'fixedPoint', precision: 2 } ], "export": { enabled: true, fileName: '에너지사용량 분석' } }; viewModel.UsageByEnergyDataGridOptions2 = { dataSource: dataArrayresult2, columns: [ { dataField: 'DateTime', caption: "날짜", width: '33%', alignment: 'center', },// dataType: 'date', format: 'yyyy-MM-dd HH:mm' }, { dataField: 'ECo2', caption: "전력 CO2", width: '33%', alignment: 'center', format: 'fixedPoint', precision: 2 }, { dataField: 'GCo2', caption: "가스 CO2", width: '33%', alignment: 'center', format: 'fixedPoint', precision: 2 } ], "export": { enabled: true, fileName: '에너지사용량 분석(CO2)' } }; viewModel.UsageByEnergyDataGridOptions3 = { dataSource: dataArrayresult3, columns: [ { dataField: 'DateTime', caption: "날짜", width: '33%', alignment: 'center', }, { dataField: 'UnionE', caption: "전력", width: '33%', alignment: 'center', format: 'fixedPoint', precision: 2 }, { dataField: 'UnionG', caption: "가스", width: '33%', alignment: 'center', format: 'fixedPoint', precision: 2 } ], "export": { enabled: true, fileName: '에너지사용량 분석(전기+가스)' } }; // 2017.11.27: 그리드 도표 작업 : 팝업창 추가 return viewModel; };