123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439 |
- BemsWebApplication.WeekEnergyConsumption = function (params, viewInfo) {
- "use strict";
- var BUILDING_DEPTH = 1,
- FLOOR_DEPTH = 2,
- ZONE_DEPTH = 3;
- var CODE = $Code,
- FuelType = CODE.FuelType,
- FT = CODE.FacilityType,
- FC = CODE.FacilityCode,
- F = CODE.Formula,
- TIT = CODE.TimeIntervalType;
- var visiblePopup = ko.observable(false);
- var initialized = false,
- shouldReload = false,
- dataSource;
- var pointHistoryGet = new BWA.Chart.PointHistoryGet(BWA.UserInfo.SiteId()),
- timeBoxForSearch = BWA.SearchView.createDateTimeBox($G.TimeTypesForDayMonth),
- //timeBoxForSearch = BWA.SearchView.createDateTimeBox(),
- formulaGet = new BWA.Chart.FormulaGet(BWA.UserInfo.SiteId());
- //var buildingDataSource = BemsWebApplication.db.createDataSource('CmBuilding', true, true),
- var buildingDataSource = BemsWebApplication.db.createDataSource('CmBuilding', true),
- floorDataSource = BemsWebApplication.db.createDataSource('CmFloor'),
- zoneDataSource = BemsWebApplication.db.createDataSource('CmZone'),
- fuelTypesDataSource = BemsWebApplication.db.createDataSource('BemsFuelType'),
- //check_input = ko.observable(false),
- //check_input2 = ko.observable(false),
- buildings = ko.observableArray(),
- timeTypesForSearch = ko.observableArray(),
- timeTypeIdForSearch = ko.observable(0),
- floorsForSearch = ko.observableArray(),
- zonesForSearch = ko.observableArray(),
- fuelTypesForSearch = ko.observableArray(),
- buildingIdForSearch = ko.observable(),
- buildingNameForSearch = ko.observable(),
- floorIdForSearch = ko.observable(),
- floorNameForSearch = ko.observable(),
- zoneIdForSearch = ko.observable(),
- zoneNameForSearch = ko.observable(),
- fuelTypeIdForSearch = ko.observable(),
- deferredForSearch = new $.Deferred();
- var deferredForLoadData = new $.Deferred();
- var chart = BWA.Chart.Instance('chartWEEKA', 'dxChart');
- var locationEnableForSearch = ko.observable(false);
- var chartDataArray = ko.observableArray();
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- // 팝업창뷰 보이기 속성 제어용 변수 선언
- var DataGridPopup_Visible = ko.observable(false);
- // 그래프 출력 이후 엑셀출력을 위한 팝업창을 위해 임시 저장용 배열 선언
- var dataArrayresult = ko.observableArray();
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- chartDataArray([
- { DateTime: new Date(2014, 11, 16, 0), OutdoorTemperature: -3.4, OutdoorHumidity: 40, Value: 30 },
- { DateTime: new Date(2014, 11, 16, 0, 15), OutdoorTemperature: -1.1, OutdoorHumidity: 44, Value: 32 },
- { DateTime: new Date(2014, 11, 16, 0, 30), OutdoorTemperature: 3, OutdoorHumidity: 48, Value: 33 },
- { DateTime: new Date(2014, 11, 16, 0, 45), OutdoorTemperature: 4, OutdoorHumidity: 55, Value: 34 },
- { DateTime: new Date(2014, 11, 16, 1), OutdoorTemperature: 8, OutdoorHumidity: 54, Value: 50 },
- { DateTime: new Date(2014, 11, 16, 2), OutdoorTemperature: 10, OutdoorHumidity: 53, Value: 60 },
- { DateTime: new Date(2014, 11, 16, 3), OutdoorTemperature: 11, Value: 80 },
- { DateTime: new Date(2014, 11, 16, 4), OutdoorTemperature: 12, OutdoorHumidity: 48, Value: 100 },
- { DateTime: new Date(2014, 11, 16, 5), OutdoorTemperature: 12, OutdoorHumidity: 40 },
- { DateTime: new Date(2014, 11, 16, 6), Value: 120 }
- ]);
- var goalUpperBound = ko.observable(40);
- function handleClickTreeItem(element, data) {
- var eq = BWA.DataUtil.constructEqualFilter;
- var depth = data.depth;
- //data = data.data;
- switch (depth) {
- case BUILDING_DEPTH: // building
- data = data.data;
- buildingIdForSearch(data.BuildingId());
- buildingNameForSearch(data.Name());
- floorIdForSearch(null);
- floorNameForSearch('');
- zoneIdForSearch(null);
- zoneNameForSearch('');
- break;
- case FLOOR_DEPTH: // floor
- buildingNameForSearch(data.parentData.data.Name());
- //alert(buildingIdForSearch());
- data = data.data;
- buildingIdForSearch(data.BuildingId());
- floorIdForSearch(data.FloorId());
- floorNameForSearch(data.Name());
- zoneIdForSearch(null);
- zoneNameForSearch('');
- break;
- case ZONE_DEPTH: // zone
- floorNameForSearch(data.parentData.data.Name());
- buildingNameForSearch(data.parentData.parentData.data.Name());
- data = data.data;
- buildingIdForSearch(data.BuildingId());
- //alert(buildingIdForSearch());
- //buildingNameForSearch(data.Name());
- floorIdForSearch(data.FloorId());
- //alert(floorIdForSearch());
- //floorNameForSearch(data.parent.data.Name());
- zoneIdForSearch(data.ZoneId());
- zoneNameForSearch(data.Name());
- break;
- }
- }
- function handleSearchViewInitializeUpdate() {
- //alert('handleSearchViewInitializeUpdate');
- $('#locationTreeViewInSearchViewW').cwTreeView({
- width: '40%',
- height: '480px',
- onClickTreeItem: handleClickTreeItem,
- delegateDataSource: BWA.DataUtil.getLocationDataSourceDelegateForTreeView(
- buildingDataSource,
- floorDataSource,
- zoneDataSource
- )
- });
- }
- function handleViewShown() {
- //alert('handleViewShown'); // 2
- if (initialized === false) {
- //alert('handleViewShown1'); // 3
- chart = chart(BWA.ChartOptions.WeekEnergyConsumption.getChartOptions(timeBoxForSearch.type(), goalUpperBound));
- //chart = chart(BWA.ChartOptions.LocEnergyConsumption.getSeriesOptions(timeBoxForSearch.type(), fuelTypeIdForSearch(), goalUpperBound));
- floorNameForSearch('');
- zoneNameForSearch('');
- initialized = true;
- }
- if (shouldReload) {
- //shouldReload = false;
- //dataSource.pageIndex(0);
- //dataSource.load();
- }
- }
- function handleViewHidden() {
- $SearchView.visibleObservable(false); // hcLee 2015 03 23
- visiblePopup(false);
- //hideOverlay();
- // var dataGrid = $('#gridContainer').dxDataGrid('instance');
- // dataGrid.clearSelection();
- }
- function handleViewShowing() {
- //alert('handleViewShowing'); // 1
- $.when(fuelTypesDataSource.load(), buildingDataSource.load()).done(function (fuelTypes, dbBuildings) {
- fuelTypes = fuelTypes[0];
- dbBuildings = dbBuildings[0];
- fuelTypesForSearch(_.rest(fuelTypes));
- deferredForSearch.resolve();
- if (_.isEmpty(dbBuildings) === false) {
- buildingIdForSearch(dbBuildings[0].BuildingId());
- buildingNameForSearch(dbBuildings[0].Name());
- handleSearchInSearchView();
- }
- });
- }
- function refreshList() {
- //dataSource.pageIndex(0);
- //dataSource.load();
- }
- var searchViewOptions = {
- searchViewItems: [
- //{ id: 'TimeTypeId', defaultValue: 3, value: timeTypeIdForSearch, dataSource: $G.TimeTypes},
- { id: 'FuelTypeId', ignoreValue: 0, defaultValue: $Code.FuelType.ELECTRICITY, value: fuelTypeIdForSearch, dataSource: fuelTypesForSearch }
- ],
- promiseDataInSearchView: deferredForSearch.promise()
- };
- function handleSearchInSearchView() {
- visiblePopup(true);
- $("#large-indicator").dxLoadIndicator({
- height: 60,
- width: 60
- });
- var date = timeBoxForSearch.getDate(),
- timeType = timeBoxForSearch.type();
- //alert('handleSearchInSearchView');
- var commonParameters = {
- //TimeIntervalType: $Code.TimeIntervalType.QUARTERMIN,
- TimeIntervalType: $Code.TimeType.DAY,//timeBoxForSearch.type(),
- StartDate: date.startDate,
- EndDate: date.endDate
- };
- var pointHistoryParameters = {
- BuildingId: buildingIdForSearch(),
- FloorId: floorIdForSearch(),
- ZoneId: zoneIdForSearch(),
- FuelTypeId: fuelTypeIdForSearch()
- //FuelTypeId: $Code.FuelType.ELECTRICITY,
- };
- var temperatureParameters = {
- FacilityTypeId: FT.OUTDOOR,
- FacilityCode: FC.OUTDOOR,
- FormulaId: F[FT.OUTDOOR].TEMPERATURE,
- };
- var humidityParameters = _.extend({}, temperatureParameters, {
- FormulaId: F[FT.OUTDOOR].HUMIDITY,
- });
- $.when(
- pointHistoryGet.apiGet(_.extend(pointHistoryParameters, commonParameters)))
- /*
- pointHistoryGet.apiGet(_.extend(pointHistoryParameters, commonParameters)),
- formulaGet.apiGet(_.extend(temperatureParameters, commonParameters))) */
- //.done(function(values, temperatures, humidities) {
- //.done(function (values, temperatures) {
- .done(function (values) {
- var values7 = new Array(0, 0, 0, 0, 0, 0, 0);
- var values7Cnt = new Array(0, 0, 0, 0, 0, 0, 0);
- //_.each(values[0], function(x) {
- _.each(values, function (x) {
- values7[moment(x.DateTime).toDate().getDay()] += x.Value;
- values7Cnt[moment(x.DateTime).toDate().getDay()]++;
- });
- var days7 = new Array('일요일', '월요일', '화요일', '수요일', '목요일', '금요일', '토요일');
- var dataArray = [];
- for (var i = 0; i < 7; i++) {
- dataArray.push({ week: days7[i], Value: (values7Cnt[i] == 0) ? 0 : values7[i] / values7Cnt[i] });
- //dataArray.push({ week: days7[i], Value: values7[i] });
- }
- dataArrayresult = dataArray;
- //chart2 = chart(BWA.ChartOptions.LocEnergyConsumption.getSeriesOptions(timeBoxForSearch.type(), goalUpperBound));
- var options = BWA.ChartOptions.WeekEnergyConsumption.getSeriesOptions(timeBoxForSearch.type(), fuelTypeIdForSearch(), goalUpperBound());
- chart().option('argumentAxis', null); // 2015 05 21 결국 이 코드가 필요 함 (시간 축 에러 해결)
- //chart().cle
- //chart().option(null);
- //options.dataSource = null;
- //chart().option(options);
- options.dataSource = dataArray;
- chart().option(options);
- //chart().option('dataSource', dataArray);
- // chart().option('dataSource', dataArray);
- // chart().option('dataSource', chartDataArray());
- // chartDataArray(values);
- $('#st').text('' + "" + buildingNameForSearch() + " - " +
- floorNameForSearch() + " - " + zoneNameForSearch() + "(" + date.startDate.getFullYear() + "년 " + (date.startDate.getMonth() + 1) + "월 " + date.startDate.getDate() + "일 ~ " +
- date.endDate.getFullYear() + "년 " + (date.endDate.getMonth() + 1) + "월 " + date.endDate.getDate() + "일)");
- visiblePopup(false);
- })
- .fail(function (error) {
- //alert(error);
- visiblePopup(false);
- });
- //buildingNameForSearch
- }
- function handleMenuItemClick(e) {
- var chartIntance = chart();
- var chartOptions = chartIntance._options;
- var series = chartIntance.getAllSeries();
- var table = [];
- var columns = [chartOptions.argumentAxis.title];
- var values = {};
- _.each(chartOptions.valueAxis, function (a) {
- columns.push(a.title.text);
- });
- _.each(series, function (s, i) {
- _.each(s.pointsByArgument, function (point, argument) {
- var array = values[argument];
- if (_.isArray(array) === false) {
- array = values[argument] = [];
- }
- array[i] = point.value;
- });
- });
- var csvRows = [columns.join(',')];
- _.each(values, function (values, argument) {
- csvRows.push([$G.dateTime(moment(Number(argument))), values.join(',')].join(','));
- });
- var csvContent = csvRows.join("\r\n");
- var agent = navigator.userAgent.toLowerCase();
- if (window.navigator.msSaveOrOpenBlob) {
- var fileData = ['\uFEFF' + csvContent];
- var blobObject = new Blob(fileData);
- window.navigator.msSaveOrOpenBlob(blobObject, 'export.csv');
- }
- else {
- var csvString = 'data:text/csv;utf-8,\uFEFF' + encodeURI(csvContent);
- var a = $('#csvExporter');
- a.attr({
- 'href': csvString,
- 'target': '_blank',
- 'download': 'export.csv'
- });
- // a.trigger('click');
- var aa = document.getElementById('csvExporter');
- aa.click();
- }
- }
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- function DataGridPopup_ButtonClick() {
- DataGridPopup_Visible(true);
- }
- function handlePopupShown() {
- // 컬럼명 업데이트
- var ColumnCaptionName = "";
- switch (fuelTypeIdForSearch()) {
- case $Code.FuelType.ELECTRICITY:
- ColumnCaptionName = "전기";
- break;
- case $Code.FuelType.GAS:
- ColumnCaptionName = "가스";
- break;
- case $Code.FuelType.WATER:
- ColumnCaptionName = "수도";
- break;
- }
- viewModel.WeekEnergyConsumptionDataGridOptions.columns[1].caption = ColumnCaptionName;
- // 데이타소스 업데이트
- $("#WeekEnergyConsumptionDataGrid_Container").dxDataGrid("instance").option("dataSource", dataArrayresult);
- // 팝업창 갱신
- DataGridPopup_Visible(true);
- }
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- var viewModel = $.extend(BWA.CommonView.create(
- params, viewInfo, searchViewOptions, ko.observable(null), handleViewShown, null,
- handleSearchInSearchView, handleSearchViewInitializeUpdate), {
- refreshList: refreshList,
- viewShowing: handleViewShowing,
- viewHidden: handleViewHidden, // hcLee 2015 03 23
- locationEnableForSearch: locationEnableForSearch,
- handleMenuItemClick: handleMenuItemClick,
- menuItems: [{
- text: '엑셀(csv) 내보내기'
- }]
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- , WeekEnergyConsumptionDataGridPopup_ButtonClicked: DataGridPopup_ButtonClick
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- });
- viewModel.timeBoxForSearch = timeBoxForSearch;
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- viewModel.WeekEnergyConsumptionDataGridPopupOptions = {
- width: '480px',
- height: '400px', // 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()
- };
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- viewModel.popupOptions = {
- width: 300,
- height: 100,
- contentTemplate: "info",
- showTitle: false,
- title: "메세지",
- visible: visiblePopup,
- dragEnabled: false,
- shading: false,
- closeOnOutsideClick: false
- };
- //viewModel.check_input = check_input;
- //viewModel.check_input2 = check_input2;
- //var dd = new Date(2015, 4, 0);
- //var selectedDay = document.form1.JLDAY.value;
- //var lastDay = dd.getDate();
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- // 주석이 너무 없음. 나중에 변경 작업을 진행하는 누군가가 시간 소비를 하지 않기 위해...남김
- // 시간 포맷은 그래프에 귀속해야 되므로 포맷은 변경하지 않는 것이 유리함
- // 전기,가스,수도 와 같이 선택적으로 변경해야 된다면 아래와 같이 캡션은 고정하지 말것
- viewModel.WeekEnergyConsumptionDataGridOptions = {
- dataSource: dataArrayresult,
- paging: { pageSize: 17 },
- columns: [
- { dataField: 'week', caption: "날짜", width: '33%', alignment: 'center', },// dataType: 'date', format: 'yyyy-MM-dd HH:mm' },
- { dataField: 'Value', width: '33%', alignment: 'center', format: 'fixedPoint', precision: 2 },
- ],
- // 엑셀 출력
- "export": {
- enabled: true,
- fileName: '에너지 사용량(요일별)'
- }
- };
- // 2017.09.08 : 그리드 도표 작업 : 팝업창 추가
- return viewModel;
- };
|