| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329 | Partials.Price = function (params) {    var selectedTab = ko.observable(0);    var selectedValue = ko.observable('');    var dataSource = new DevExpress.data.DataSource({        store: Partials.db.BemsNoticePriceBase,        expand: ["BemsNoticePriceDetail", "BemsNoticePriceContractType"],        paginate: false,        map: function (item) {            return item;        },        filter: [            ["SiteId", "=", 1],            ["FuelTypeId", "=", selectedTab() + 1],        ]    });    var gridOptions = [    {        dataSource: dataSource,        showColumnHeaders: false,        columns: [            {                dataField: 'BemsNoticePriceContractType', caption: '계약명', allowEditing:false, width: 200, cellTemplate: function (e, v) {                    $("<div style='width:100%; font-size: 28px; text-align:right; margin-bottom:10px;' />").text(v.value.Name).appendTo(e);                    if (v.data.PrimaryPrice) {                        $("<div style='width:100%; text-align:right' />").text('기본요금').appendTo(e);                    }                    $("<div style='width:100%; font-size: 22px;text-align:right' />").text(Globalize.format(v.data.PrimaryPrice, 'c')).appendTo(e);                }            },            {                dataField: 'BemsNoticePriceDetail', caption: '상세정보', allowEditing: false, cellTemplate: function (e, v) {                    $("<div class='focused' />").dxDataGrid({                        dataSource: v.value,                        showRowLines: true,                        showColumnHeaders: (v.rowIndex == 0) ? true : false,                        height: (v.value.length > 10) ? 236 : 110,                        paging: { enabled: false },                        showColumnLines: false,                        hoverStateEnabled:true,                        sorting: { mode: 'none' },                        loadPanel: null,                        editing: { editMode: 'cell', editEnabled: true, },                        rowUpdating: function (cellInfo) {                            Partials.db.BemsNoticePriceDetail.update(cellInfo.key, cellInfo.newData);                        },                        columns: [                            { dataField: 'DataId', caption: '시간', allowEditing:false, },                            { dataField: 'P01', caption: '1월', format:'currency', precision: 1 },                            { dataField: 'P02', caption: '2월', format: 'currency', precision: 1},                            { dataField: 'P03', caption: '3월', format: 'currency', precision: 1 },                            { dataField: 'P04', caption: '4월', format: 'currency',  precision: 1},                            { dataField: 'P05', caption: '5월', format: 'currency', precision:1 },                            { dataField: 'P06', caption: '6월', format: 'currency', precision:1 },                            { dataField: 'P07', caption: '7월', format: 'currency',  precision: 1},                            { dataField: 'P08', caption: '8월', format: 'currency',  precision: 1 },                            { dataField: 'P09', caption: '9월', format: 'currency', precision: 1 },                            { dataField: 'P10', caption: '10월', format: 'currency', precision: 1 },                            { dataField: 'P11', caption: '11월', format: 'currency', precision: 1 },                            { dataField: 'P12', caption: '12월', format: 'currency', precision: 1 },                        ]                    }).appendTo(e);;                }            }        ]    }, {        dataSource: dataSource,        showColumnHeaders: false,        showBorders: false,        columns: [            {                dataField: 'BemsNoticePriceContractType', caption: '계약명', width: 200, cellTemplate: function (e, v) {                    $("<div style='width:100%; font-size: 28px; text-align:right; margin-bottom:10px;' />").text(v.value.Name).appendTo(e);                    if (v.data.PrimaryPrice) {                        $("<div style='width:100%; text-align:right' />").text('기본요금').appendTo(e);                    }                    $("<div style='width:100%; font-size: 22px;text-align:right' />").text(Globalize.format(v.data.PrimaryPrice, 'c')).appendTo(e);                }            },            {                dataField: 'BemsNoticePriceDetail', caption: '상세정보', cellTemplate: function (e, v) {                    $("<div class='focused' />").dxDataGrid({                        dataSource: v.value,                        showRowLines: true,                        showColumnHeaders: (v.rowIndex == 0) ? true : false,                        height: (v.value.length > 10) ? 236 : 110,                        paging: { pageSize: 24 },                        showColumnLines: false,                        sorting: { mode: 'none' },                        loadPanel: null,                        editing: { editMode: 'cell', editEnabled: true, },                        rowUpdating: function (cellInfo) {                            Partials.db.BemsNoticePriceDetail.update(cellInfo.key, cellInfo.newData);                        },                        columns: [                            { dataField: 'P01', caption: '1월', format: 'currency', precision: 4 },                            { dataField: 'P02', caption: '2월', format: 'currency', precision: 4 },                            { dataField: 'P03', caption: '3월', format: 'currency', precision: 4 },                            { dataField: 'P04', caption: '4월', format: 'currency', precision: 4 },                            { dataField: 'P05', caption: '5월', format: 'currency', precision: 4 },                            { dataField: 'P06', caption: '6월', format: 'currency', precision: 4 },                            { dataField: 'P07', caption: '7월', format: 'currency', precision: 4 },                            { dataField: 'P08', caption: '8월', format: 'currency', precision: 4 },                            { dataField: 'P09', caption: '9월', format: 'currency', precision: 4 },                            { dataField: 'P10', caption: '10월', format: 'currency', precision: 4 },                            { dataField: 'P11', caption: '11월', format: 'currency', precision: 4 },                            { dataField: 'P12', caption: '12월', format: 'currency', precision: 4 },                        ]                    }).appendTo(e);;                }            }        ]    }, {        dataSource: dataSource,        showColumnHeaders: false,        showBorders: false,        columns: [            {                dataField: 'BemsNoticePriceContractType', caption: '계약명', width: 200, cellTemplate: function (e, v) {                    $("<div style='width:100%; font-size: 28px; text-align:right; margin-bottom:10px;' />").text(v.value.Name).appendTo(e);                    if (v.data.SecondaryPrice) {                        var container = $("<div style='width:50%; float:left; display:inline' />").appendTo(e);                        $("<div style='width:100%; text-align:right' />").text('물이용부담금').appendTo(container);                        $("<div style='width:100%; font-size: 22px;text-align:right' />").text(Globalize.format(v.data.SecondaryPrice, 'c')).appendTo(container);                    }                    if (v.data.PrimaryPrice) {                        var container = $("<div style='width:50%; float:right; display:inline' />").appendTo(e);                        $("<div style='width:100%; text-align:right' />").text('기본요금').appendTo(container);                        $("<div style='width:100%; font-size: 22px;text-align:right' />").text(Globalize.format(v.data.PrimaryPrice, 'c')).appendTo(container);                    }                }            },            {                dataField: 'BemsNoticePriceDetail', caption: '상세정보', cellTemplate: function (e, v) {                    $("<div class='focused' />").dxDataGrid({                        dataSource: v.value,                        showRowLines: true,                        showColumnHeaders: (v.rowIndex == 0) ? true : false,                        height: 150,                        paging: { pageSize: 24 },                        showColumnLines: false,                        sorting: { mode: 'none' },                        loadPanel: null,                        editing: { editMode: 'cell', editEnabled: true, },                        rowUpdating: function (cellInfo) {                            Partials.db.BemsNoticePriceDetail.update(cellInfo.key, cellInfo.newData);                        },                        columns: [                            {                                 dataField: 'DataId', caption: '구분', customizeText: function (cellInfo) {                                    switch (cellInfo.value) {                                        case 0: return '상수도';                                        case 1: return '하수도';                                    }                                    return '-';                                }                            },                            { dataField: 'P01', caption: '1 ~ 15㎥', format: 'currency', precision: 1 },                            { dataField: 'P02', caption: '16 ~ 30㎥', format: 'currency', precision: 1 },                            { dataField: 'P03', caption: '31 ~ 50㎥', format: 'currency', precision: 1 },                            { dataField: 'P04', caption: '51 ~ 100㎥', format: 'currency', precision: 1 },                            { dataField: 'P05', caption: '101 ~ 200㎥', format: 'currency', precision: 1 },                            { dataField: 'P06', caption: '201 ~ 300㎥', format: 'currency', precision: 1 },                            { dataField: 'P07', caption: '301 ~ 1000㎥', format: 'currency', precision: 1 },                            { dataField: 'P08', caption: '1000㎥ ~', format: 'currency', precision: 1 },                        ]                    }).appendTo(e);;                }            }        ]    } ];    var applyDataSource = new DevExpress.data.DataSource({        store: Partials.db.BemsNoticePrice,        paginate: false,        map: function (item) {            item.DisplayDate = moment(item.ApplyDate).format('YYYY년 MM월 DD일');            return item;        },        filter: [            ["SiteId", "=", 1],            ["FuelTypeId", "=", selectedTab() + 1]        ],        sort: { field: 'ApplyDate', desc: true }    });    selectedTab.subscribe(function (e) {        applyDataSource.filter([            ["SiteId", "=", 1],            ["FuelTypeId", "=", selectedTab() + 1]        ]);        applyDataSource.load().done(function (result) {            $("#applyDate").dxSelectBox("instance").option({                dataSource: result            });            selectedValue(result[0].ApplyDate);            var date = result[0].ApplyDate            dataSource.filter([                ["SiteId", "=", 1],                ["FuelTypeId", "=", e + 1],                ["year(ApplyDate)", "=", date.getFullYear()],                ["month(ApplyDate)", "=", date.getMonth() + 1],                ["day(ApplyDate)", "=", date.getDate()],            ]);            $("#gridContainer").dxDataGrid("instance").option(gridOptions[e]);        })    });    var viewModel = {        selectedValue: selectedValue,        selectedTab: selectedTab,        viewShown: function () {            applyDataSource.load().done(function (result) {                $("#applyDate").dxSelectBox("instance").option({                    dataSource: result,                });                selectedValue(result[0].ApplyDate);                var date = result[0].ApplyDate;                dataSource.filter([                    ["SiteId", "=", 1],                    ["FuelTypeId", "=", selectedTab() + 1],                    ["year(ApplyDate)", "=", date.getFullYear()],                    ["month(ApplyDate)", "=", date.getMonth() + 1],                    ["day(ApplyDate)", "=", date.getDate()],                ]);                $("#gridContainer").dxDataGrid("instance").option(gridOptions[selectedTab()]);            })        },        applyOption: {            displayExpr: 'DisplayDate',            valueExpr: 'ApplyDate',            value: selectedValue,            onSelectionChanged: function (e) {                if (e.selectedItem) {                    var date = e.selectedItem.ApplyDate;                    dataSource.filter([                        ["SiteId", "=", 1],                        ["FuelTypeId", "=", selectedTab() + 1],                        ["year(ApplyDate)", "=", date.getFullYear()],                        ["month(ApplyDate)", "=", date.getMonth() + 1],                        ["day(ApplyDate)", "=", date.getDate()],                    ]);                    $("#gridContainer").dxDataGrid("instance").option(gridOptions[selectedTab()]);                }            }        },        createOption: {            dataSource: [{ value: 0, subject: "복사하여 생성" }, { value: 1, subject: '새롭게 생성' }],            visible: ko.observable(false),            width: 300,            height: 'auto',            title: '어떻게 생성 하시겠습니까?',            shading: true,            showTitle: true,            target: '#create',            itemClick: function (e) {                this.createOption.visible(false);                this.createPopupOption.howTo = e.itemData;                this.createPopupOption.visible(true);            }        },        createPopupOption: {            visible: ko.observable(false),            howTo: {},            date: ko.observable(new Date()),            width: 400,            height:180,            shading: true,            showTitle: true,            dragEnabled: false,            title: '시행일자를 선택해 주세요.',            buttons: [                {                    toolbar: 'bottom', location: 'after', widget: 'button', options: {                        text: '확인', clickAction: function () {                            viewModel.createPopupOption.visible(false);                            var applyDate = viewModel.createPopupOption.date();                            var fuelTypeId = selectedTab() + 1;                            // 데이터 생성                            switch (viewModel.createPopupOption.howTo.value) {                                case 0:                                    var refDate = moment(selectedValue()).format('YYYY-MM-DD');                                    Partials.api.post("BemsNoticePrice", { SiteId: 1, FuelTypeId: fuelTypeId, ApplyDate: applyDate }, { ref: refDate }).done(function (result) {                                        viewModel.viewShown();                                    });                                    break;                                case 1:                                    Partials.api.post("BemsNoticePrice", { SiteId: 1, FuelTypeId: fuelTypeId, ApplyDate: applyDate }).done(function (result) {                                        viewModel.viewShown();                                    });                                    break;                            }                        }                    }                }            ],            shownAction: function () {            }        }    };    return viewModel;};
 |