b299b191e98c63fd33eae2c9f1a783212677f17a.svn-base 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329
  1. Partials.Price = function (params) {
  2. var selectedTab = ko.observable(0);
  3. var selectedValue = ko.observable('');
  4. var dataSource = new DevExpress.data.DataSource({
  5. store: Partials.db.BemsNoticePriceBase,
  6. expand: ["BemsNoticePriceDetail", "BemsNoticePriceContractType"],
  7. paginate: false,
  8. map: function (item) {
  9. return item;
  10. },
  11. filter: [
  12. ["SiteId", "=", 1],
  13. ["FuelTypeId", "=", selectedTab() + 1],
  14. ]
  15. });
  16. var gridOptions = [
  17. {
  18. dataSource: dataSource,
  19. showColumnHeaders: false,
  20. columns: [
  21. {
  22. dataField: 'BemsNoticePriceContractType', caption: '계약명', allowEditing:false, width: 200, cellTemplate: function (e, v) {
  23. $("<div style='width:100%; font-size: 28px; text-align:right; margin-bottom:10px;' />").text(v.value.Name).appendTo(e);
  24. if (v.data.PrimaryPrice) {
  25. $("<div style='width:100%; text-align:right' />").text('기본요금').appendTo(e);
  26. }
  27. $("<div style='width:100%; font-size: 22px;text-align:right' />").text(Globalize.format(v.data.PrimaryPrice, 'c')).appendTo(e);
  28. }
  29. },
  30. {
  31. dataField: 'BemsNoticePriceDetail', caption: '상세정보', allowEditing: false, cellTemplate: function (e, v) {
  32. $("<div class='focused' />").dxDataGrid({
  33. dataSource: v.value,
  34. showRowLines: true,
  35. showColumnHeaders: (v.rowIndex == 0) ? true : false,
  36. height: (v.value.length > 10) ? 236 : 110,
  37. paging: { enabled: false },
  38. showColumnLines: false,
  39. hoverStateEnabled:true,
  40. sorting: { mode: 'none' },
  41. loadPanel: null,
  42. editing: { editMode: 'cell', editEnabled: true, },
  43. rowUpdating: function (cellInfo) {
  44. Partials.db.BemsNoticePriceDetail.update(cellInfo.key, cellInfo.newData);
  45. },
  46. columns: [
  47. { dataField: 'DataId', caption: '시간', allowEditing:false, },
  48. { dataField: 'P01', caption: '1월', format:'currency', precision: 1 },
  49. { dataField: 'P02', caption: '2월', format: 'currency', precision: 1},
  50. { dataField: 'P03', caption: '3월', format: 'currency', precision: 1 },
  51. { dataField: 'P04', caption: '4월', format: 'currency', precision: 1},
  52. { dataField: 'P05', caption: '5월', format: 'currency', precision:1 },
  53. { dataField: 'P06', caption: '6월', format: 'currency', precision:1 },
  54. { dataField: 'P07', caption: '7월', format: 'currency', precision: 1},
  55. { dataField: 'P08', caption: '8월', format: 'currency', precision: 1 },
  56. { dataField: 'P09', caption: '9월', format: 'currency', precision: 1 },
  57. { dataField: 'P10', caption: '10월', format: 'currency', precision: 1 },
  58. { dataField: 'P11', caption: '11월', format: 'currency', precision: 1 },
  59. { dataField: 'P12', caption: '12월', format: 'currency', precision: 1 },
  60. ]
  61. }).appendTo(e);;
  62. }
  63. }
  64. ]
  65. }, {
  66. dataSource: dataSource,
  67. showColumnHeaders: false,
  68. showBorders: false,
  69. columns: [
  70. {
  71. dataField: 'BemsNoticePriceContractType', caption: '계약명', width: 200, cellTemplate: function (e, v) {
  72. $("<div style='width:100%; font-size: 28px; text-align:right; margin-bottom:10px;' />").text(v.value.Name).appendTo(e);
  73. if (v.data.PrimaryPrice) {
  74. $("<div style='width:100%; text-align:right' />").text('기본요금').appendTo(e);
  75. }
  76. $("<div style='width:100%; font-size: 22px;text-align:right' />").text(Globalize.format(v.data.PrimaryPrice, 'c')).appendTo(e);
  77. }
  78. },
  79. {
  80. dataField: 'BemsNoticePriceDetail', caption: '상세정보', cellTemplate: function (e, v) {
  81. $("<div class='focused' />").dxDataGrid({
  82. dataSource: v.value,
  83. showRowLines: true,
  84. showColumnHeaders: (v.rowIndex == 0) ? true : false,
  85. height: (v.value.length > 10) ? 236 : 110,
  86. paging: { pageSize: 24 },
  87. showColumnLines: false,
  88. sorting: { mode: 'none' },
  89. loadPanel: null,
  90. editing: { editMode: 'cell', editEnabled: true, },
  91. rowUpdating: function (cellInfo) {
  92. Partials.db.BemsNoticePriceDetail.update(cellInfo.key, cellInfo.newData);
  93. },
  94. columns: [
  95. { dataField: 'P01', caption: '1월', format: 'currency', precision: 4 },
  96. { dataField: 'P02', caption: '2월', format: 'currency', precision: 4 },
  97. { dataField: 'P03', caption: '3월', format: 'currency', precision: 4 },
  98. { dataField: 'P04', caption: '4월', format: 'currency', precision: 4 },
  99. { dataField: 'P05', caption: '5월', format: 'currency', precision: 4 },
  100. { dataField: 'P06', caption: '6월', format: 'currency', precision: 4 },
  101. { dataField: 'P07', caption: '7월', format: 'currency', precision: 4 },
  102. { dataField: 'P08', caption: '8월', format: 'currency', precision: 4 },
  103. { dataField: 'P09', caption: '9월', format: 'currency', precision: 4 },
  104. { dataField: 'P10', caption: '10월', format: 'currency', precision: 4 },
  105. { dataField: 'P11', caption: '11월', format: 'currency', precision: 4 },
  106. { dataField: 'P12', caption: '12월', format: 'currency', precision: 4 },
  107. ]
  108. }).appendTo(e);;
  109. }
  110. }
  111. ]
  112. }, {
  113. dataSource: dataSource,
  114. showColumnHeaders: false,
  115. showBorders: false,
  116. columns: [
  117. {
  118. dataField: 'BemsNoticePriceContractType', caption: '계약명', width: 200, cellTemplate: function (e, v) {
  119. $("<div style='width:100%; font-size: 28px; text-align:right; margin-bottom:10px;' />").text(v.value.Name).appendTo(e);
  120. if (v.data.SecondaryPrice) {
  121. var container = $("<div style='width:50%; float:left; display:inline' />").appendTo(e);
  122. $("<div style='width:100%; text-align:right' />").text('물이용부담금').appendTo(container);
  123. $("<div style='width:100%; font-size: 22px;text-align:right' />").text(Globalize.format(v.data.SecondaryPrice, 'c')).appendTo(container);
  124. }
  125. if (v.data.PrimaryPrice) {
  126. var container = $("<div style='width:50%; float:right; display:inline' />").appendTo(e);
  127. $("<div style='width:100%; text-align:right' />").text('기본요금').appendTo(container);
  128. $("<div style='width:100%; font-size: 22px;text-align:right' />").text(Globalize.format(v.data.PrimaryPrice, 'c')).appendTo(container);
  129. }
  130. }
  131. },
  132. {
  133. dataField: 'BemsNoticePriceDetail', caption: '상세정보', cellTemplate: function (e, v) {
  134. $("<div class='focused' />").dxDataGrid({
  135. dataSource: v.value,
  136. showRowLines: true,
  137. showColumnHeaders: (v.rowIndex == 0) ? true : false,
  138. height: 150,
  139. paging: { pageSize: 24 },
  140. showColumnLines: false,
  141. sorting: { mode: 'none' },
  142. loadPanel: null,
  143. editing: { editMode: 'cell', editEnabled: true, },
  144. rowUpdating: function (cellInfo) {
  145. Partials.db.BemsNoticePriceDetail.update(cellInfo.key, cellInfo.newData);
  146. },
  147. columns: [
  148. {
  149. dataField: 'DataId', caption: '구분', customizeText: function (cellInfo) {
  150. switch (cellInfo.value) {
  151. case 0: return '상수도';
  152. case 1: return '하수도';
  153. }
  154. return '-';
  155. }
  156. },
  157. { dataField: 'P01', caption: '1 ~ 15㎥', format: 'currency', precision: 1 },
  158. { dataField: 'P02', caption: '16 ~ 30㎥', format: 'currency', precision: 1 },
  159. { dataField: 'P03', caption: '31 ~ 50㎥', format: 'currency', precision: 1 },
  160. { dataField: 'P04', caption: '51 ~ 100㎥', format: 'currency', precision: 1 },
  161. { dataField: 'P05', caption: '101 ~ 200㎥', format: 'currency', precision: 1 },
  162. { dataField: 'P06', caption: '201 ~ 300㎥', format: 'currency', precision: 1 },
  163. { dataField: 'P07', caption: '301 ~ 1000㎥', format: 'currency', precision: 1 },
  164. { dataField: 'P08', caption: '1000㎥ ~', format: 'currency', precision: 1 },
  165. ]
  166. }).appendTo(e);;
  167. }
  168. }
  169. ]
  170. } ];
  171. var applyDataSource = new DevExpress.data.DataSource({
  172. store: Partials.db.BemsNoticePrice,
  173. paginate: false,
  174. map: function (item) {
  175. item.DisplayDate = moment(item.ApplyDate).format('YYYY년 MM월 DD일');
  176. return item;
  177. },
  178. filter: [
  179. ["SiteId", "=", 1],
  180. ["FuelTypeId", "=", selectedTab() + 1]
  181. ],
  182. sort: { field: 'ApplyDate', desc: true }
  183. });
  184. selectedTab.subscribe(function (e) {
  185. applyDataSource.filter([
  186. ["SiteId", "=", 1],
  187. ["FuelTypeId", "=", selectedTab() + 1]
  188. ]);
  189. applyDataSource.load().done(function (result) {
  190. $("#applyDate").dxSelectBox("instance").option({
  191. dataSource: result
  192. });
  193. selectedValue(result[0].ApplyDate);
  194. var date = result[0].ApplyDate
  195. dataSource.filter([
  196. ["SiteId", "=", 1],
  197. ["FuelTypeId", "=", e + 1],
  198. ["year(ApplyDate)", "=", date.getFullYear()],
  199. ["month(ApplyDate)", "=", date.getMonth() + 1],
  200. ["day(ApplyDate)", "=", date.getDate()],
  201. ]);
  202. $("#gridContainer").dxDataGrid("instance").option(gridOptions[e]);
  203. })
  204. });
  205. var viewModel = {
  206. selectedValue: selectedValue,
  207. selectedTab: selectedTab,
  208. viewShown: function () {
  209. applyDataSource.load().done(function (result) {
  210. $("#applyDate").dxSelectBox("instance").option({
  211. dataSource: result,
  212. });
  213. selectedValue(result[0].ApplyDate);
  214. var date = result[0].ApplyDate;
  215. dataSource.filter([
  216. ["SiteId", "=", 1],
  217. ["FuelTypeId", "=", selectedTab() + 1],
  218. ["year(ApplyDate)", "=", date.getFullYear()],
  219. ["month(ApplyDate)", "=", date.getMonth() + 1],
  220. ["day(ApplyDate)", "=", date.getDate()],
  221. ]);
  222. $("#gridContainer").dxDataGrid("instance").option(gridOptions[selectedTab()]);
  223. })
  224. },
  225. applyOption: {
  226. displayExpr: 'DisplayDate',
  227. valueExpr: 'ApplyDate',
  228. value: selectedValue,
  229. onSelectionChanged: function (e) {
  230. if (e.selectedItem) {
  231. var date = e.selectedItem.ApplyDate;
  232. dataSource.filter([
  233. ["SiteId", "=", 1],
  234. ["FuelTypeId", "=", selectedTab() + 1],
  235. ["year(ApplyDate)", "=", date.getFullYear()],
  236. ["month(ApplyDate)", "=", date.getMonth() + 1],
  237. ["day(ApplyDate)", "=", date.getDate()],
  238. ]);
  239. $("#gridContainer").dxDataGrid("instance").option(gridOptions[selectedTab()]);
  240. }
  241. }
  242. },
  243. createOption: {
  244. dataSource: [{ value: 0, subject: "복사하여 생성" }, { value: 1, subject: '새롭게 생성' }],
  245. visible: ko.observable(false),
  246. width: 300,
  247. height: 'auto',
  248. title: '어떻게 생성 하시겠습니까?',
  249. shading: true,
  250. showTitle: true,
  251. target: '#create',
  252. itemClick: function (e) {
  253. this.createOption.visible(false);
  254. this.createPopupOption.howTo = e.itemData;
  255. this.createPopupOption.visible(true);
  256. }
  257. },
  258. createPopupOption: {
  259. visible: ko.observable(false),
  260. howTo: {},
  261. date: ko.observable(new Date()),
  262. width: 400,
  263. height:180,
  264. shading: true,
  265. showTitle: true,
  266. dragEnabled: false,
  267. title: '시행일자를 선택해 주세요.',
  268. buttons: [
  269. {
  270. toolbar: 'bottom', location: 'after', widget: 'button', options: {
  271. text: '확인', clickAction: function () {
  272. viewModel.createPopupOption.visible(false);
  273. var applyDate = viewModel.createPopupOption.date();
  274. var fuelTypeId = selectedTab() + 1;
  275. // 데이터 생성
  276. switch (viewModel.createPopupOption.howTo.value) {
  277. case 0:
  278. var refDate = moment(selectedValue()).format('YYYY-MM-DD');
  279. Partials.api.post("BemsNoticePrice", { SiteId: 1, FuelTypeId: fuelTypeId, ApplyDate: applyDate }, { ref: refDate }).done(function (result) {
  280. viewModel.viewShown();
  281. });
  282. break;
  283. case 1:
  284. Partials.api.post("BemsNoticePrice", { SiteId: 1, FuelTypeId: fuelTypeId, ApplyDate: applyDate }).done(function (result) {
  285. viewModel.viewShown();
  286. });
  287. break;
  288. }
  289. }
  290. }
  291. }
  292. ],
  293. shownAction: function () {
  294. }
  295. }
  296. };
  297. return viewModel;
  298. };