userAge.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175
  1. /**
  2. * admin/userAge
  3. */
  4. var mcare_admin_userAge = function(){
  5. //상속
  6. mcare_admin.call(this);
  7. var self = this;
  8. //변수
  9. var $grid = $("#grid"),
  10. $chart = $("#chart"),
  11. $legend = $("#chart_legend"),
  12. $crudServiceBaseUrl = contextPath + "/admin/stats";
  13. /**
  14. * 초기화
  15. */
  16. this.init = function(){
  17. initGrid();
  18. //initChart();
  19. addEvent();
  20. };
  21. /**
  22. * 이벤트 등록
  23. */
  24. var addEvent = function(){
  25. };
  26. //데이터소스
  27. var ageOrder = [],
  28. dataCnt = [];
  29. /**
  30. * 데이터소스 설정
  31. */
  32. var setDataSource = function(){
  33. var dataSource = new kendo.data.DataSource({
  34. transport: {
  35. read: {
  36. url: $crudServiceBaseUrl + "/getUserAgeList.json",
  37. method: "post",
  38. dataType: "json",
  39. contentType: "application/json"
  40. },
  41. parameterMap: getParameterMap
  42. },
  43. schema: {
  44. data : getSchemaData
  45. },
  46. change: function(e) {
  47. // update chart
  48. }
  49. });
  50. /**
  51. * 데이터소스 파라미터맵
  52. * @private
  53. */
  54. function getParameterMap( options, operation ){
  55. var today = new Date();
  56. today.setDate( today.getDate() - 1 );
  57. var param = $.extend(true, {}, options, {
  58. strDate : new Date( today ).setHours(0, 0, 0, 0),
  59. endDate : new Date( today ).setHours(0, 0, 0, 0),
  60. }, null);
  61. return self.util.stringifyJson( param );
  62. };
  63. /**
  64. * 데이터소스 스키마설정
  65. * @private
  66. */
  67. function getSchemaData(e){
  68. if( e.msg !== undefined ){
  69. alert(e.msg);
  70. return [];
  71. }
  72. var userAgeList = e.aggUserAgeList;
  73. var ageOrderArr = ageOrder = new Array(),
  74. dataCntArr = dataCnt = new Array();
  75. var param = [];
  76. if( userAgeList.length <= 0 ){
  77. ageOrderArr.push( "없음" );
  78. dataCntArr.push( 0 );
  79. param.push({
  80. "ageOrder" : "없음",
  81. "dataCnt" : 0
  82. });
  83. } else {
  84. for( var i = 0 ; i < userAgeList.length; i++ ) {
  85. var item = userAgeList[i];
  86. ageOrderArr.push( item["ageOrder"] );
  87. dataCntArr.push( item["dataCnt"] );
  88. param.push({
  89. "ageOrder" : item["ageOrder"],
  90. "dataCnt" : item["dataCnt"]
  91. });
  92. }
  93. }
  94. return param;
  95. };
  96. return dataSource;
  97. };
  98. var dataSource = setDataSource();
  99. /**
  100. * 그리드 초기화
  101. */
  102. var initGrid = function(){
  103. // 그리드 옵션
  104. var option = {
  105. dataSource: dataSource,
  106. //그리드 데이터 받아온 뒤 차트 초기화
  107. dataBound: initChart,
  108. pageable: false,
  109. selectable: true,
  110. height : 215,
  111. columns : [
  112. {
  113. field : "ageOrder",
  114. title : "연령대",
  115. width: 352,
  116. attributes: {
  117. "class": "table-cell",
  118. style: "text-align: center;"
  119. }
  120. },
  121. {
  122. field : "dataCnt",
  123. title : "인원수",
  124. width: 352,
  125. template: "#= kendo.toString(data.dataCnt,'n0')# 명",
  126. attributes: {
  127. "class": "table-cell",
  128. style: "text-align: center;"
  129. }
  130. }
  131. ]
  132. };
  133. //그리드 초기화 - mcare_admin
  134. self.grid( $grid, option );
  135. };
  136. /**
  137. * 차트 초기화
  138. */
  139. var initChart = function(){
  140. // 차트 옵션 TODO: chartjs로 변경한다
  141. var data = { labels: ageOrder,
  142. datasets: [
  143. {
  144. label: "연령대",
  145. fillColor: "rgba(151,187,205,0.0)",
  146. strokeColor: "rgba(151,187,205,1)",
  147. pointColor: "rgba(151,187,205,1)",
  148. pointStrokeColor: "#fff",
  149. pointHighlightFill: "#fff",
  150. pointHighlightStroke: "rgba(151,187,205,1)",
  151. data: dataCnt
  152. }
  153. ]
  154. };
  155. var option = {
  156. tooltipTemplate: "<%= value %> 명"
  157. };
  158. //차트 초기화 mcare_admin
  159. self.chart( $chart, "line", option, data, $legend );
  160. };
  161. };