| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352 | Partials.Goal = function (params) {    var tabs = [{ text: "월" }, { text: "년" }];    var selectedTab = ko.observable(0);    var dateBoxValue = ko.observable(new Date());    var initialized = false;    var dataSource;    var chartDataSource = ko.observable();    function createDaily() {        return new DevExpress.data.DataSource({            store: Partials.odata.ConsumeDaily,            paginate: false,            select: ['Year', 'Month', 'Day', 'Cooler', 'Boiler', 'Goal'],            map: function (item) {                item.Consume = item.Cooler + item.Boiler;                return item;            },            filter: [                ["SiteId", "=", 1],                ["BuildingId", "=", 1],                ["Year", "=", dateBoxValue().getFullYear()],                ["Month", "=", dateBoxValue().getMonth() + 1],            ]        });    }    function createMonthly() {        return new DevExpress.data.DataSource({            store: Partials.odata.ConsumeMonthly,            paginate: false,            select: ['Year', 'Month', 'Cooler', 'Boiler', 'Goal'],            map: function (item) {                item.Consume = item.Cooler + item.Boiler;                return item;            },            filter: [                ["SiteId", "=", 1],                ["BuildingId", "=", 1],                ["Year", "=", dateBoxValue().getFullYear()]            ]        });    }    function load(result) {        chartDataSource(result);        viewModel.summary.load(result);        $("#graphContainer").dxChart("instance").option({            commonSeriesSettings: {                argumentField: ["Day", "Month"][selectedTab()],                type: "bar",                hoverMode: "allArgumentPoints",                selectionMode: "allArgumentPoints",            },            argumentAxis: {                label: {                    customizeText: function () {                        return this.value + ['일', '월'][selectedTab()];                    }                },                type: 'discreate',                axisDivisionFactor: [31, 100][selectedTab()]            },            valueAxis: {                label: {                    format: 'fixedPoint thousands',                    customizeText: function () {                        return this.valueText + ' toe';                    }                }            },            series: [                { name: "예측", color: "#F6BC21", valueField: "Consume", },                { name: "목표", color: "#5EAC40", valueField: "Goal" }            ],            legend: {                verticalAlignment: "top",                horizontalAlignment: "right",                position: "inside",                border: { visible: true }            },            onPointClick: function (e) {                e.target.select();            },            tooltip: {                enabled: true,                location: "edge",                format: 'fixedPoint',                customizeText: function () {                    return this.seriesName + " : " + this.valueText;                }            }        });    }    dateBoxValue.subscribe(function (e) {        switch (selectedTab()) {            case 0:                dataSource = createDaily();                break;            case 1:                dataSource = createMonthly();                break;        }        handleViewShown();    });    selectedTab.subscribe(function (e) {        switch (selectedTab()) {            case 0:                dataSource = createDaily();                $("#dateBox").dxDateBox("instance").option({ formatString: "yyyy년 MM월", maxZoomLevel: 'year' });                editGoalPopup.editable(true);                break;            case 1:                dataSource = createMonthly();                $("#dateBox").dxDateBox("instance").option({ formatString: "yyyy년", maxZoomLevel: 'decade' });                editGoalPopup.editable(false);                break;        }        handleViewShown();    });    var handleViewShown = function () {        if (initialized == false) {            switch (selectedTab()) {                case 0:                    dataSource = createDaily();                    break;                case 1:                    dataSource = createMonthly();                    break;            }            initialized = true;        }        dataSource.load().done(function (result) {            load(result);        });    };    var dataViewPopup = {        width: 800,        height: 'auto',        showTitle: true,        title: ko.computed({            read: function () {                switch (selectedTab()) {                    case 0: return moment(dateBoxValue()).format("YYYY년 MM월");                    case 1: return moment(dateBoxValue()).format("YYYY년");                }            }        }),        visible: ko.observable(false),        dragEnabled: false,        closeOnOutsideClick: false,        show: function () {            dataViewPopup.visible(true);        },        shownAction: function () {            var dataGrid = $("#dataGrid").dxDataGrid("instance");            switch (selectedTab()) {                case 0:                    dataGrid.option({                        "export": {                            enabled: true,                            fileName: "GoalDaily"                        },                        columns: [                            { dataField: 'Day', caption: '일', width: '10%', },                            { dataField: 'Consume', caption: '예측 소비량', format: 'fixedPoint' },                            { dataField: 'Goal', caption: '목표 소비량', format: 'fixedPoint' },                            { caption: '1차알람', format: 'fixedPoint', calculateCellValue: function (data) { return data.Goal * 0.9; } },                            { caption: '2차알람', format: 'fixedPoint', calculateCellValue: function (data) { return data.Goal * 1; } }]                    });                    break;                case 1:                    dataGrid.option({                        "export": {                            enabled: true,                            fileName: "GoalMonthly"                        },                        columns: [                            { dataField: 'Month', caption: '월', width: '10%', },                            { dataField: 'Consume', caption: '예측 소비량', format: 'fixedPoint' },                            { dataField: 'Goal', caption: '목표 소비량', format: 'fixedPoint' },                            { caption: '1차알람', format: 'fixedPoint', calculateCellValue: function (data) { return data.Goal * 0.9; } },                            { caption: '2차알람', format: 'fixedPoint', calculateCellValue: function (data) { return data.Goal * 1; } }]                    });                    break;            }        }    };    var applyPopup = {        width: 360,        height: 220,        showTitle: true,        rateOf: ko.observable(80),        dragEnabled: false,        visible: ko.observable(false),        showCloseButton: false,        show: function () {            applyPopup.visible(true);        },        title: '일괄적용',        buttons: [            {                toolbar: 'bottom', location: 'center', widget: 'button', options: {                    text: '확인', clickAction: function () {                        var newArray = chartDataSource().map(function (obj) {                            obj.Goal = parseInt(obj.Consume * (applyPopup.rateOf() / 100));                            var date = moment(new Date(obj.Year, obj.Month - 1, obj.Day)).format('YYYY-MM-DD');                            Partials.db.BemsEnergyGoalDaily.update({ SiteId: 1, BuildingId: 1, CreatedDate: date }, { Goal: obj.Goal } );                            return obj;                        });                        chartDataSource(newArray);                        applyPopup.visible(false);                    }                }            },            { toolbar: 'bottom', location: 'center', widget: 'button', options: { text: '취소', clickAction: function () { applyPopup.visible(false); } } },        ]    };    var editGoalPopup = {        width: 600,        height: 'auto',        showTitle: true,        editable: ko.observable(true),        buttons: [            {                toolbar: 'top', location: 'after', widget: 'button', options: {                    text: '일괄적용', clickAction: function () {                        applyPopup.show();                    }                }            }        ],        title: ko.computed({            read: function () {                switch (selectedTab()) {                    case 0: return moment(dateBoxValue()).format("YYYY년 MM월") + ' - 목표량 설정';                    case 1: return moment(dateBoxValue()).format("YYYY년") + ' - 목표량 설정';                }            }        }),        visible: ko.observable(false),        dragEnabled: false,        closeOnOutsideClick: false,        show: function () {            if (selectedTab() == 0) {                editGoalPopup.visible(true);            }        },        shownAction: function () {            var dataGrid = $("#editGoalGrid").dxDataGrid("instance");            switch (selectedTab()) {                case 0:                    dataGrid.option({                        "export": {                            enabled: true,                            fileName: "SettingGoalDaily"                        },                        rowUpdating: function (rowInfo) {                            rowInfo.newData.Goal = parseInt(rowInfo.newData.Goal);                            var date = moment(new Date(rowInfo.key.Year, rowInfo.key.Month - 1, rowInfo.key.Day)).format('YYYY-MM-DD');                            Partials.db.BemsEnergyGoalDaily.update({ SiteId: 1, BuildingId: 1, CreatedDate: date }, rowInfo.newData);                        },                        columns: [                            { dataField: 'Day', caption: '일', width: '10%', allowEditing: false},                            { dataField: 'Consume', caption: '예측 소비량', format: 'fixedPoint', allowEditing: false },                            { dataField: 'Goal', caption: '목표 소비량', format: 'fixedPoint' }]                    });                    break;            }        }    };    var viewModel = {        dateBoxValue: dateBoxValue,        dataSource: chartDataSource,        tabs: tabs,        selectedTab: selectedTab,        dataViewPopup: dataViewPopup,        editGoalPopup: editGoalPopup,        viewShown: handleViewShown,        dataViewOption: dataViewPopup,        applyPopup: applyPopup,        editGoalOption: {},        summary: {            load: function (data) {                switch (selectedTab()) {                    case 0:                        viewModel.summary.pred.max(data.reduce(function (p, c) { return p.value > c.Consume ? p : { title: c.Day + '일', value: c.Consume } }));                        viewModel.summary.pred.min(data.reduce(function (p, c) { return p.value <= c.Consume ? p : { title: c.Day + '일', value: c.Consume } }));                        viewModel.summary.goal.max(data.reduce(function (p, c) { return p.value > c.Goal ? p : { title: c.Day + '일', value: c.Goal } }));                        viewModel.summary.goal.min(data.reduce(function (p, c) { return p.value <= c.Goal ? p : { title: c.Day + '일', value: c.Goal } }));                        break;                    case 1:                        viewModel.summary.pred.max(data.reduce(function (p, c) { return p.value > c.Consume ? p : { title: c.Month + '월', value: c.Consume } }));                        viewModel.summary.pred.min(data.reduce(function (p, c) { return p.value <= c.Consume ? p : { title: c.Month + '월', value: c.Consume } }));                        viewModel.summary.goal.max(data.reduce(function (p, c) { return p.value > c.Goal ? p : { title: c.Month + '월', value: c.Goal } }));                        viewModel.summary.goal.min(data.reduce(function (p, c) { return p.value <= c.Goal ? p : { title: c.Month + '월', value: c.Goal } }));                        break;                }            },            pred: {                min: ko.observable({title:'', value: Infinity} ),                max: ko.observable({title:'', value: -Infinity} ),            },            goal: {                min: ko.observable({ title: '', value: Infinity }),                max: ko.observable({ title: '', value: -Infinity }),            }        },        onPrevious: function (e) {            var date = new Date(dateBoxValue());            (selectedTab() == 0) ? date.setMonth(date.getMonth() - 1) : date.setFullYear(date.getFullYear() - 1)            dateBoxValue(date);        },        onNext: function (e) {            var date = new Date(dateBoxValue());            (selectedTab() == 0) ? date.setMonth(date.getMonth() + 1) : date.setFullYear(date.getFullYear() + 1)            dateBoxValue(date);        }    };    return viewModel;};
 |