BemsWebApplication.PriceCompare2 = function (params, viewInfo) {

    var energySelectButton = "power";
    var priceDataSource;
    var init = false;

    var endpointSelector = "";
    if (BemsWebApplication.config.mode == "production") {
        endpointSelector = new DevExpress.EndpointSelector(BemsWebApplication.config.endpoints).config.db.production;
    } else {
        endpointSelector = new DevExpress.EndpointSelector(BemsWebApplication.config.endpoints).config.db.local;
    }

    //탭 표시 요금제 Array 데이터 초기화
    var tabsData = [
    {
        id: "0",
        text: "test1"
    },
    {
        id: "1",
        text: "test2"
    },
    {
        id: "2",
        text: "test3"
    }
    ];

    var powerDataSource = [{
        PriceCode: 'P038',
        PriceCodeDesc: "청구요금"
    },
    {
        PriceCode: 'P022',
        PriceCodeDesc: "기본요금"
    },
    {
        PriceCode: 'P048',
        PriceCodeDesc: "총사용량"
    }];
    var gasDataSource = [{
        PriceCode: 'G005',
        PriceCodeDesc: "사용요금"
    },
    {
        PriceCode: 'G004',
        PriceCodeDesc: "기본요금"
    },
    {
        PriceCode: 'G001',
        PriceCodeDesc: "사용량"
    }];
    var waterDataSource = [{
        PriceCode: 'W006',
        PriceCodeDesc: "합계요금"
    },
    {
        PriceCode: 'W001',
        PriceCodeDesc: "상수도요금"
    },
    {
        PriceCode: 'W002',
        PriceCodeDesc: "하수도요금"
    },
    {
        PriceCode: 'W007',
        PriceCodeDesc: "총사용량"
    }];

    var factorDataSource = [{
        PriceCode: 'P038',
        PriceCodeDesc: "청구요금"
    },
    {
        PriceCode: 'P022',
        PriceCodeDesc: "기본요금"
    },
    {
        PriceCode: 'P048',
        PriceCodeDesc: "총사용량"
    }];

    var compareDataSource = [{
        dateTime: "1",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "2",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "3",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "4",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "5",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "6",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "7",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "8",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "9",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "10",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "11",
        curYear: 0,
        preYear: 0
    }, {
        dateTime: "12",
        curYear: 0,
        preYear: 0
    }];

    function getcompareData(SiteId, FuelTypeId,PayDate) {
        var tmpDate = $("#startDatePicker").dxDateBox("instance").option('value');
        var curYear = tmpDate.getFullYear();
        var tmpDate2 = $("#endDatePicker").dxDateBox("instance").option('value');
        var curYear2 = tmpDate2.getFullYear();

        for (var i = 0; i < compareDataSource.length; i++) {
            compareDataSource[i].dateTime = i + 1;
            compareDataSource[i].curYear = 0;
            compareDataSource[i].preYear = 0;
        }
        $("#compareChart").dxChart("instance").option('dataSource', compareDataSource);

        var opt;
        if (FuelTypeId == 1) {
            opt = [
                    { valueField: "curYear", name: tmpDate.getFullYear(), color: '#007994' },
                        { valueField: "preYear", name: tmpDate2.getFullYear() , color: '#72A7B3' }
            ];
        } else if (FuelTypeId == 2) {
            opt = [
                    { valueField: "curYear", name: tmpDate.getFullYear(), color: '#03C700' },
                        { valueField: "preYear", name: tmpDate2.getFullYear(), color: '#90E68E' }
            ];
        } else if (FuelTypeId == 3) {
            opt = [
                    { valueField: "curYear", name: tmpDate.getFullYear(), color: '#FC6D00' },
                        { valueField: "preYear", name: tmpDate2.getFullYear(), color: '#FAE0D4' }
            ];
        } else {
            utils.toast.show("에너지원이 선택되지 않았습니다.");
        }
        $("#compareChart").dxChart("instance").option('series', opt);

        var dataSource = new DevExpress.data.DataSource({
            store: {
                type: "odata",
                url: endpointSelector + "/BemsSitePriceHistory"
            },
            map: function (itemData) {
                return {
                    SiteId: itemData.siteId,
                    FuelTypeId: itemData.fuelTypeId,
                    PriceTypeId: itemData.PriceTypeId,
                    PayDate: itemData.PayDate,
                    PayCharge: itemData.PayCharge,
                    PriceValue: itemData.PriceValue
                }
            },
            requireTotalCount: true,
            pageSize: 12
        });
        if (parseInt($("#tabOptions").dxTabs("instance").option('selectedIndex')) == -1)
            parseInt($("#tabOptions").dxTabs("instance").option('selectedIndex', 0))
        var priceCode = $("#factorSelect").dxSelectBox("instance").option('value');
        if (FuelTypeId == 1 && priceCode == "P048") {
            dataSource.filter([
                    ["SiteId", "=", SiteId],
                    "and",
                    ["FuelTypeId", "=", FuelTypeId],
                    "and",
                    //["PayDate", ">=", (parseInt(PayDate) - 1).toString() + "01"],
                    ["PayDate", ">=", curYear.toString() + "01"],
                    "and",
                    ["PayDate", "<=", curYear.toString() + "12"],
                    "and",
                    ["PriceTypeId", "=", parseInt($("#tabOptions").dxTabs("instance").option('selectedItem').id)],
                    "and",
                    [["PriceCode", "=", "P003"]
                    ]
            ]);
        } else {
            dataSource.filter([
                    ["SiteId", "=", SiteId],
                    "and",
                    ["FuelTypeId", "=", FuelTypeId],
                    "and",
                    //["PayDate", ">=", (parseInt(PayDate) - 1).toString() + "01"],
                    ["PayDate", ">=", curYear.toString() + "01"],
                    "and",
                    ["PayDate", "<=", curYear.toString() + "12"],
                    "and",
                    ["PriceTypeId", "=", parseInt($("#tabOptions").dxTabs("instance").option('selectedItem').id)],
                    "and",
                    ["PriceCode", "=", priceCode]
            ]);
        }
        dataSource.group("PayDate");
        dataSource.sort({ getter: "PayDate", asc: true });
        dataSource.load()
        .done(function (result) {
            for (var i = 0; i < result.length; i++) {
                var month;
                if (result[i].items[0].PayDate.substr(4, 1) == "0") {
                    month = result[i].items[0].PayDate.substr(5, 1);
                } else {
                    month = result[i].items[0].PayDate.substr(4, 2);
                }
                //if (curYear == result[i].key.substr(0, 4)) {
                if (FuelTypeId == 1 && priceCode == "P048") {
                    if (result[i].items[0].PriceValue == "")
                        result[i].items[0].PriceValue = "0";
                    compareDataSource[month - 1].curYear = parseInt(result[i].items[0].PriceValue.replace(/,/gi, ""));
                } else {
                    compareDataSource[month - 1].curYear = result[i].items[0].PriceValue.replace(/,/gi, "");
                }
                //compareDataSource[month - 1].curYear = result[0].PayCharge.replace(/,/gi, "");;
                //} else if (curYear - 1 == result[i].key.substr(0, 4)) {
                //    compareDataSource[month - 1].preYear = result[i].items[0].PayCharge.replace(/,/gi, "");;
                //}
            }

            var dataSource2 = new DevExpress.data.DataSource({
                store: {
                    type: "odata",
                    url: endpointSelector + "/BemsSitePriceHistory"
                },
                map: function (itemData) {
                    return {
                        SiteId: itemData.siteId,
                        FuelTypeId: itemData.fuelTypeId,
                        PriceTypeId: itemData.PriceTypeId,
                        PayDate: itemData.PayDate,
                        PayCharge: itemData.PayCharge,
                        PriceValue: itemData.PriceValue
                    }
                },
                requireTotalCount: true,
                pageSize: 12
            });
            if (FuelTypeId == 1 && priceCode == "P048") {
                dataSource2.filter([
                        ["SiteId", "=", SiteId],
                        "and",
                        ["FuelTypeId", "=", FuelTypeId],
                        "and",
                        //["PayDate", ">=", (parseInt(PayDate) - 1).toString() + "01"],
                        ["PayDate", ">=", curYear2.toString() + "01"],
                        "and",
                        ["PayDate", "<=", curYear2.toString() + "12"],
                        "and",
                        ["PriceTypeId", "=", parseInt($("#tabOptions").dxTabs("instance").option('selectedItem').id)],
                        "and",
                        [["PriceCode", "=", "P003"]
                        ]
                ]);
            } else {
                dataSource2.filter([
                        ["SiteId", "=", SiteId],
                        "and",
                        ["FuelTypeId", "=", FuelTypeId],
                        "and",
                        //["PayDate", ">=", (parseInt(PayDate) - 1).toString() + "01"],
                        ["PayDate", ">=", curYear2.toString() + "01"],
                        "and",
                        ["PayDate", "<=", curYear2.toString() + "12"],
                        "and",
                        ["PriceTypeId", "=", parseInt($("#tabOptions").dxTabs("instance").option('selectedItem').id)],
                        "and",
                        ["PriceCode", "=", priceCode]
                ]);
            }
            dataSource2.group("PayDate");
            dataSource2.sort({ getter: "PayDate", asc: true });
            dataSource2.load()
            .done(function (result2) {
                for (var i = 0; i < result2.length; i++) {
                    var month;
                    if (result2[i].items[0].PayDate.substr(4, 1) == "0") {
                        month = result2[i].items[0].PayDate.substr(5, 1);
                    } else {
                        month = result2[i].items[0].PayDate.substr(4, 2);
                    }
                    //if (curYear == result[i].key.substr(0, 4)) {
                    if (FuelTypeId == 1 && priceCode == "P048") {
                        if (result2[i].items[0].PriceValue == "")
                            result2[i].items[0].PriceValue = "0";
                        compareDataSource[month - 1].preYear = parseInt(result2[i].items[0].PriceValue.replace(/,/gi, ""));
                    } else {
                        compareDataSource[month - 1].preYear = result2[i].items[0].PriceValue.replace(/,/gi, "");
                    }
                    //compareDataSource[month - 1].preYear = result2[0].PayCharge.replace(/,/gi, "");
                    //} else if (curYear - 1 == result[i].key.substr(0, 4)) {
                    //    compareDataSource[month - 1].preYear = result[i].items[0].PayCharge.replace(/,/gi, "");;
                    //}
                }
                $("#compareChart").dxChart("instance").option('dataSource', compareDataSource);
                var maxValue = 0;
                for (var i = 0; i < compareDataSource.length; i++) {
                    if (parseFloat(compareDataSource[i].curYear) > maxValue) {
                        maxValue = compareDataSource[i].curYear;
                    }
                    if (parseFloat(compareDataSource[i].preYear) > maxValue) {
                        maxValue = compareDataSource[i].preYear;
                    }
                }
                var valAxis = $("#compareChart").dxChart("instance").option('valueAxis');
                valAxis.max = parseInt(maxValue * 1.10);
                var tmp = valAxis.max.toString().length - 2;
                var zero = "";
                for(var i =0; i < tmp;i++){
                    zero = zero + "0";
                }
                valAxis.max = parseInt(valAxis.max.toString().substr(0, 2) + zero);
                //valAxis.tickInterval = Math.floor(parseInt(maxValue * 1.10)) / 10;
                valAxis.tickInterval = valAxis.max / 10;
                $("#compareChart").dxChart("instance").option('valueAxis', valAxis);
                // $("#compareChart").dxChart({dataSource: compareDataSource});
            })
            .fail(function (error) {
                utils.toast.show(error);
            });
        })
        .fail(function (error) {
            utils.toast.show(error);
        });
    }

    function DataDistinct(data) {
        var tmpArray = data;
        var resultArray;
        for (var i = 0; i < tmpArray.length; i++) {
            //if(tmpArray[i].){

            //}
        }

    }

    function setTabData(SiteID, FuelTypeId, InitPriceCode) {
        var tmpDate = $("#startDatePicker").dxDateBox("instance").option('value');
        var dataSource = new DevExpress.data.DataSource({
            store: new DevExpress.data.ODataStore({
                url: endpointSelector + "/BemsSitePrice"
            }),
            expand: ['BemsPriceType'],
            requireTotalCount: true,
            pageSize: 1000
        });
        dataSource.filter([
                ["SiteID", "=", SiteID],
                "and",
                ["FuelTypeId", "=", FuelTypeId]
        ]);
        dataSource.sort({ getter: "FuelTypeId", asc: true });
        dataSource.load()
        .done(function (result) {
            var tmp = [];
            tmp.push({ id: result[0].BemsPriceType.PriceTypeId, text: result[0].BemsPriceType.PriceTypeIdDesc});
            for (var i = 0; i < result.length; i++) {
                var resultCnt;
                for (var j = 0; j < tmp.length; j++) {
                    if (tmp[j].text.indexOf(result[i].BemsPriceType.PriceTypeIdDesc) != -1) {
                        resultCnt++;
                    }
                }
                if (resultCnt == 0)
                    tmp.push({ id: result[i].BemsPriceType.PriceTypeId, text: result[i].BemsPriceType.PriceTypeIdDesc});
                resultCnt = 0;
            }
            tabsData = tmp;
            $("#tabOptions").dxTabs("instance").option('dataSource', tabsData);
            if (!init) {
                $("#tabOptions").dxTabs("instance").option('selectedIndex', 0);
                init = true;
            } else {

            }
            //getPriceData(BWA.UserInfo.SiteId(), FuelTypeId);
            
            if (InitPriceCode == null)
                InitPriceCode = 'P038'; //초기 PriceCode 전력 P038 청구요금
            setFactorSelect(InitPriceCode);
            getcompareData(BWA.UserInfo.SiteId(), FuelTypeId, tmpDate.getFullYear());
        });
    }

    function setFactorSelect(PriceCode) {
        $("#factorSelect").dxSelectBox("instance").option('dataSource', factorDataSource);
        $("#factorSelect").dxSelectBox("instance").option('displayExpr', 'PriceCodeDesc');
        $("#factorSelect").dxSelectBox("instance").option('valueExpr', "PriceCode");
        $("#factorSelect").dxSelectBox("instance").option('value', PriceCode);
    }

    function numberWithCommas(x) {
        return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    }

    function handleViewShown() {
        setTabData(BWA.UserInfo.SiteId(), 1, 'P038');   //초기화 전력 P038 청구요금
        //setFactorSelect('P038');
        //getPriceData(BWA.UserInfo.SiteId(), 1);
        //getcompareData(BWA.UserInfo.SiteId(), 1, tmpDate.getFullYear());
    }

    var searchViewOptions = {

    };

    function handleSearchInSearchView() {

    }
    
    var now = new Date();
    var beforeNow = now;
    tmpYear = now.getFullYear();
    beforeNow.setFullYear(tmpYear - 1);
    now = new Date();
    var selectEnergy = "전력";
    //var tmpDate = $("#startDatePicker").dxDateBox("instance").option('value');

    /*var CustomTheme = {
        name: 'CustomTheme'
    };
    DevExpress.viz.registerTheme(CustomTheme, 'generic.light');*/
    //DevExpress.ui.themes.current('generic.dark');

    var viewModel = $.extend(BWA.CommonView.create(params, viewInfo, searchViewOptions, ko.observable(null), handleViewShown, null, handleSearchInSearchView),  
        {
        startDatePicker : {
            pickerType: "calendar",
            value: now,
            formatString: "yyyy년",
            maxZoomLevel: "decade",
            width: "9%",
            onValueChanged: function () {
                var tmpDate = $("#startDatePicker").dxDateBox("instance").option('value');
                var chartSeries = $("#compareChart").dxChart("instance").option('series');
                chartSeries[0].name = tmpDate.getFullYear();
                //chartSeries[1].name = tmpDate.getFullYear() - 1;
                $("#compareChart").dxChart("instance").option('series', chartSeries);
                /*for (var i = 0; i < compareDataSource.length; i++) {
                    compareDataSource[i].curYear = compareDataSource[i].curYear + 1000;
                    compareDataSource[i].preYear = compareDataSource[i].preYear + 1000;
                }
                $("#compareChart").dxChart("instance").option('dataSource', compareDataSource);*/
                //if ($("#powerBtn").css("background-image") == "linear-gradient(180deg, rgb(155, 171, 195) 0%, rgb(65, 97, 140) 100%)") {
                if (energySelectButton == "power") {
                    //getPriceData(BWA.UserInfo.SiteId(), 1);
                    //getcompareData(BWA.UserInfo.SiteId(), 1, tmpDate.getFullYear());
                    init = false;
                    setTabData(BWA.UserInfo.SiteId(), 1, $("#factorSelect").dxSelectBox("instance").option('value'));
                    //setFactorSelect('P038');
                //} else if ($("#gasBtn").css("background-image") == "linear-gradient(180deg, rgb(155, 171, 195) 0%, rgb(65, 97, 140) 100%)") {
                } else if (energySelectButton == "gas") {
                    //getPriceData(BWA.UserInfo.SiteId(), 2);
                    //getcompareData(BWA.UserInfo.SiteId(), 2, tmpDate.getFullYear());
                    init = false;
                    setTabData(BWA.UserInfo.SiteId(), 2, $("#factorSelect").dxSelectBox("instance").option('value'));
                    //setFactorSelect('P038');
                //} else if ($("#waterBtn").css("background-image") == "linear-gradient(180deg, rgb(155, 171, 195) 0%, rgb(65, 97, 140) 100%)") {
                } else if (energySelectButton == "water") {
                    //getPriceData(BWA.UserInfo.SiteId(), 3);
                    //getcompareData(BWA.UserInfo.SiteId(), 3, tmpDate.getFullYear());
                    init = false;
                    setTabData(BWA.UserInfo.SiteId(), 3, $("#factorSelect").dxSelectBox("instance").option('value'));
                    //setFactorSelect('P038');
                } else {
                    utils.toast.show("에너지원이 선택되지 않았습니다.");
                }
            }
        },
        endDatePicker: {
            pickerType: "calendar",
            value: beforeNow,
            formatString: "yyyy년",
            maxZoomLevel: "decade",
            width: "9%",
            onValueChanged: function () {
                var tmpDate = $("#endDatePicker").dxDateBox("instance").option('value');
                var chartSeries = $("#compareChart").dxChart("instance").option('series');
                //chartSeries[0].name = tmpDate.getFullYear();
                chartSeries[1].name = tmpDate.getFullYear();
                $("#compareChart").dxChart("instance").option('series', chartSeries);
                /*for (var i = 0; i < compareDataSource.length; i++) {
                    compareDataSource[i].curYear = compareDataSource[i].curYear + 1000;
                    compareDataSource[i].preYear = compareDataSource[i].preYear + 1000;
                }
                $("#compareChart").dxChart("instance").option('dataSource', compareDataSource);*/
                //if ($("#powerBtn").css("background-image") == "linear-gradient(180deg, rgb(155, 171, 195) 0%, rgb(65, 97, 140) 100%)") {
                if (energySelectButton == "power") {
                    //getPriceData(BWA.UserInfo.SiteId(), 1);
                    //getcompareData(BWA.UserInfo.SiteId(), 1, tmpDate.getFullYear());
                    init = false;
                    setTabData(BWA.UserInfo.SiteId(), 1, $("#factorSelect").dxSelectBox("instance").option('value'));
                    //setFactorSelect('P038');
                    //} else if ($("#gasBtn").css("background-image") == "linear-gradient(180deg, rgb(155, 171, 195) 0%, rgb(65, 97, 140) 100%)") {
                } else if (energySelectButton == "gas") {
                    //getPriceData(BWA.UserInfo.SiteId(), 2);
                    //getcompareData(BWA.UserInfo.SiteId(), 2, tmpDate.getFullYear());
                    init = false;
                    setTabData(BWA.UserInfo.SiteId(), 2, $("#factorSelect").dxSelectBox("instance").option('value'));
                    //setFactorSelect('P038');
                    //} else if ($("#waterBtn").css("background-image") == "linear-gradient(180deg, rgb(155, 171, 195) 0%, rgb(65, 97, 140) 100%)") {
                } else if (energySelectButton == "water") {
                    //getPriceData(BWA.UserInfo.SiteId(), 3);
                    //getcompareData(BWA.UserInfo.SiteId(), 3, tmpDate.getFullYear());
                    init = false;
                    setTabData(BWA.UserInfo.SiteId(), 3, $("#factorSelect").dxSelectBox("instance").option('value'));
                    //setFactorSelect('P038');
                } else {
                    utils.toast.show("에너지원이 선택되지 않았습니다.");
                }
            }
        },
        compareChart: {
            dataSource: compareDataSource,
            barWidth: 0.5,
            commonSeriesSettings: {
                argumentField: "dateTime",
                type: "bar"
            },
            series: ko.observable([
                { valueField: "curYear", name: new Date().getFullYear(), color: '#5F8B95' },
                { valueField: "preYear", name: new Date().getFullYear() - 1, color: '#007994' }
            ]),
            legend: {
                verticalAlignment: "top",
                horizontalAlignment: "center",
                position: "outside",
                border: { visible: false }
            },
            valueAxis: ko.observable({
                visible: true,
                label: {
                    customizeText: function () {
                        return numberWithCommas(this.value).toString() + '원';
                    }
                },
                min: 0,
                max: 100000000,
                valueType: 'numeric',
                tickInterval: 5000000
            }),
            argumentAxis: ko.observable({
                visible: true,
                label: {
                    customizeText: function () {
                        return this.value + '월';
                    }
                },
                min: 1,
                max: 12,
                valueType: 'numeric',
                tickInterval: 1
            }),
            "export": {
                enabled: true
            },
            tooltip: {
                enabled: true,
                //format: 'largeNumber',
                customizeTooltip: function (point) {
                    return {
                        text: numberWithCommas(point.value.toFixed(2))
                    };
                }
            }
        },
        powerButtonClicked: function () {
            energySelectButton = "power";
            $("#powerBtn").css("background-image", "linear-gradient(180deg,#9babc3 0%,#41618c 100%)");
            $("#gasBtn").css("background-image", "linear-gradient(rgb(56,88,130) 0%, rgb(44,68,101)100%)");
            $("#waterBtn").css("background-image", "linear-gradient(rgb(56,88,130) 0%, rgb(44,68,101)100%)");
            selectEnergy = "전력";
            /*priceDataSource = [
                { text: "일반용전력(을)", icon: 'check'},
                { text: "산업용전력(을)"},
                { text: "심야전력(을)2"}
            ];*/
            //$("#priceTab").dxTabs("instance").option('items', priceDataSource);
            //$("#priceTab").dxTabs("instance").option('selectedIndex', ko.observable(0));
            //$("#priceTab").dxTabs("instance").option('tabIndex', ko.observable(0));
            //getPriceData(BWA.UserInfo.SiteId(), 1);
            //getcompareData(BWA.UserInfo.SiteId(), 1, tmpDate.getFullYear());
            init = false;
            factorDataSource = powerDataSource;
            setTabData(BWA.UserInfo.SiteId(), 1, 'P038');   //P038 전력 청구요금
            //setFactorSelect('P038');
        },
        gasButtonClicked: function () {
            energySelectButton = "gas";
            $("#gasBtn").css("background-image", "linear-gradient(180deg,#9babc3 0%,#41618c 100%)");
            $("#powerBtn").css("background-image", "linear-gradient(rgb(56,88,130) 0%, rgb(44,68,101)100%)");
            $("#waterBtn").css("background-image", "linear-gradient(rgb(56,88,130) 0%, rgb(44,68,101)100%)");
            selectEnergy = "가스";
            /*priceDataSource = [
                { text: "가스요금1", icon: 'check' },
                { text: "가스요금2" }
            ];*/
            //$("#priceTab").dxTabs("instance").option('items', priceDataSource);
            //$("#priceTab").dxTabs("instance").option('selectedIndex', ko.observable(0));
            //$("#priceTab").dxTabs("instance").option('tabIndex', ko.observable(0));
            //getPriceData(BWA.UserInfo.SiteId(), 2);
            //getcompareData(BWA.UserInfo.SiteId(), 2, tmpDate.getFullYear());
            init = false;
            factorDataSource = gasDataSource;
            setTabData(BWA.UserInfo.SiteId(), 2, 'G005');   //G005 가스 사용요금
            //setFactorSelect('P038');
        },
        waterButtonClicked: function () {
            energySelectButton = "water";
            $("#waterBtn").css("background-image", "linear-gradient(180deg,#9babc3 0%,#41618c 100%)");
            $("#gasBtn").css("background-image", "linear-gradient(rgb(56,88,130) 0%, rgb(44,68,101)100%)");
            $("#powerBtn").css("background-image", "linear-gradient(rgb(56,88,130) 0%, rgb(44,68,101)100%)");
            selectEnergy = "수도";
            /*priceDataSource = [
                { text: "수도요금1", icon: 'check' }
            ];*/
            //$("#priceTab").dxTabs("instance").option('items', priceDataSource);
            //$("#priceTab").dxTabs("instance").option('selectedIndex', ko.observable(0));
            //$("#priceTab").dxTabs("instance").option('tabIndex', ko.observable(0));
            //getPriceData(BWA.UserInfo.SiteId(), 3);
            //getcompareData(BWA.UserInfo.SiteId(), 3, tmpDate.getFullYear());
            init = false;
            factorDataSource = waterDataSource;
            setTabData(BWA.UserInfo.SiteId(), 3, 'W006');   //수도 W006 합계요금
            //setFactorSelect('P038');
        },
        tabOptions: {
            //theme: 'CustomTheme',
            dataSource: tabsData,
            height: 20,
            //selectedIndex: 0,
            onSelectionChanged: function (e) {
                //$("#priceSelect").dxSelectBox("instance").option('value', e.addedItems[0].id);
                //selectedItem = e.addedItems[0];
                if (init) {
                    var FuelTypeId;
                    if (selectEnergy == "전력") {
                        FuelTypeId = 1;
                    } else if (selectEnergy == "가스") {
                        FuelTypeId = 2;
                    } else if (selectEnergy == "수도") {
                        FuelTypeId = 3;
                    } else {
                        utils.toast.show("에너지원이 선택되지 않았습니다.");
                    }
                    var tmpDate = $("#startDatePicker").dxDateBox("instance").option('value');
                    var month = tmpDate.getMonth() + 1;
                    if (month < 10) {
                        month = "0" + month.toString();
                    }
                    var endDay = 32 - new Date(tmpDate.getFullYear(), tmpDate.getMonth(), 32).getDate();
                    //$("#tabOptions").dxTabs("instance").option('selectedIndex', 0);
                    getcompareData(BWA.UserInfo.SiteId(), FuelTypeId, tmpDate.getFullYear());
                }
            }
        },
        factorSelect: {
            dataSource: factorDataSource,
            onValueChanged: function (e) {
                var selectFactor = $("#factorSelect").dxSelectBox("instance").option('value');
                var FuelTypeId;
                if (selectEnergy == "전력") {
                    FuelTypeId = 1;
                    if (selectFactor == 'P048') {
                        var tmp = $("#compareChart").dxChart("instance").option('valueAxis');
                        tmp.label = {
                            customizeText: function () {
                                return numberWithCommas(this.value).toString() + 'kWh';
                            }
                        }
                        $("#compareChart").dxChart("instance").option('valueAxis', tmp);
                    } else {
                        var tmp = $("#compareChart").dxChart("instance").option('valueAxis');
                        tmp.label = {
                            customizeText: function () {
                                return numberWithCommas(this.value).toString() + '원';
                            }
                        }
                        $("#compareChart").dxChart("instance").option('valueAxis', tmp);
                    }
                } else if (selectEnergy == "가스") {
                    FuelTypeId = 2;
                    if (selectFactor == 'G001') {
                        var tmp = $("#compareChart").dxChart("instance").option('valueAxis');
                        tmp.label = {
                            customizeText: function () {
                                return numberWithCommas(this.value).toString() + 'm3';
                            }
                        }
                        $("#compareChart").dxChart("instance").option('valueAxis', tmp);
                    } else {
                        var tmp = $("#compareChart").dxChart("instance").option('valueAxis');
                        tmp.label = {
                            customizeText: function () {
                                return numberWithCommas(this.value).toString() + '원';
                            }
                        }
                        $("#compareChart").dxChart("instance").option('valueAxis', tmp);
                    }
                } else if (selectEnergy == "수도") {
                    FuelTypeId = 3;
                    if (selectFactor == 'W007') {
                        var tmp = $("#compareChart").dxChart("instance").option('valueAxis');
                        tmp.label = {
                            customizeText: function () {
                                return numberWithCommas(this.value).toString() + 'm3';
                            }
                        }
                        $("#compareChart").dxChart("instance").option('valueAxis', tmp);
                    } else {
                        var tmp = $("#compareChart").dxChart("instance").option('valueAxis');
                        tmp.label = {
                            customizeText: function () {
                                return numberWithCommas(this.value).toString() + '원';
                            }
                        }
                        $("#compareChart").dxChart("instance").option('valueAxis', tmp);
                    }
                } else {
                    utils.toast.show("에너지원이 선택되지 않았습니다.");
                }

                var tmpDate = $("#startDatePicker").dxDateBox("instance").option('value');
                var month = tmpDate.getMonth() + 1;
                if (month < 10) {
                    month = "0" + month.toString();
                }
                var endDay = 32 - new Date(tmpDate.getFullYear(), tmpDate.getMonth(), 32).getDate();
                var test = $("#tabOptions").dxTabs("instance").option('selectedIndex');
                getcompareData(BWA.UserInfo.SiteId(), FuelTypeId, tmpDate.getFullYear());
            }
        }
    });

    return viewModel;
};