Statistics.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  1. define([ "require", "backbone", "hbs!tmpl/site/Statistics_tmpl", "hbs!tmpl/site/Statistics_Notification_table_tmpl", "hbs!tmpl/site/Statistics_Topic_Offset_table_tmpl", "hbs!tmpl/site/entity_tmpl", "modules/Modal", "models/VCommon", "utils/UrlLinks", "collection/VTagList", "utils/CommonViewFunction", "utils/Enums", "moment", "utils/Utils", "utils/Globals", "moment-timezone" ], function(require, Backbone, StatTmpl, StatsNotiTable, TopicOffsetTable, EntityTable, Modal, VCommon, UrlLinks, VTagList, CommonViewFunction, Enums, moment, Utils, Globals) {
  2. "use strict";
  3. var StatisticsView = Backbone.Marionette.LayoutView.extend({
  4. template: StatTmpl,
  5. regions: {},
  6. ui: {
  7. entity: "[data-id='entity']",
  8. classification: "[data-id='classification']",
  9. serverCard: "[data-id='server-card']",
  10. connectionCard: "[data-id='connection-card']",
  11. notificationCard: "[data-id='notification-card']",
  12. statsNotificationTable: "[data-id='stats-notification-table']",
  13. entityCard: "[data-id='entity-card']",
  14. classificationCard: "[data-id='classification-card']",
  15. offsetCard: "[data-id='offset-card']",
  16. osCard: "[data-id='os-card']",
  17. runtimeCard: "[data-id='runtime-card']",
  18. memoryCard: "[data-id='memory-card']",
  19. memoryPoolUsage: "[data-id='memory-pool-usage-card']"
  20. },
  21. events: function() {},
  22. initialize: function(options) {
  23. _.extend(this, options);
  24. var that = this;
  25. this.DATA_MAX_LENGTH = 25;
  26. var modal = new Modal({
  27. title: "统计信息",
  28. content: this,
  29. okCloses: !0,
  30. okText: "Close",
  31. showFooter: !0,
  32. allowCancel: !1,
  33. width: "60%",
  34. headerButtons: [ {
  35. title: "Refresh Data",
  36. btnClass: "fa fa-refresh",
  37. onClick: function() {
  38. modal.$el.find(".header-button .fa-refresh").tooltip("hide").prop("disabled", !0).addClass("fa-spin"),
  39. that.fetchMetricData({
  40. update: !0
  41. });
  42. }
  43. } ]
  44. });
  45. modal.on("closeModal", function() {
  46. modal.trigger("cancel");
  47. }), this.modal = modal, modal.open();
  48. },
  49. bindEvents: function() {
  50. var that = this;
  51. this.modal && this.$el.on("click", ".linkClicked", function() {
  52. that.modal.close();
  53. });
  54. },
  55. fetchMetricData: function(options) {
  56. var that = this;
  57. this.metricCollection.fetch({
  58. success: function(data) {
  59. var data = _.first(data.toJSON());
  60. that.renderStats({
  61. valueObject: data.general.stats,
  62. dataObject: data.general
  63. }), that.renderEntities({
  64. data: data
  65. }), that.renderSystemDeatils({
  66. data: data
  67. }), that.renderClassifications({
  68. data: data
  69. }), that.$(".statsContainer,.statsNotificationContainer").removeClass("hide"), that.$(".statsLoader,.statsNotificationLoader").removeClass("show"),
  70. options && options.update && (that.modal.$el.find(".header-button .fa-refresh").prop("disabled", !1).removeClass("fa-spin"),
  71. Utils.notifySuccess({
  72. content: "Metric data is refreshed"
  73. }));
  74. }
  75. });
  76. },
  77. onRender: function() {
  78. this.bindEvents(), this.fetchMetricData();
  79. },
  80. closePanel: function(options) {
  81. var el = options.el;
  82. el.find(">.panel-heading").attr("aria-expanded", "false"), el.find(">.panel-collapse.collapse").removeClass("in");
  83. },
  84. genrateStatusData: function(stateObject) {
  85. var stats = {};
  86. return _.each(stateObject, function(val, key) {
  87. var keys = key.split(":"), key = keys[0], subKey = keys[1];
  88. stats[key] ? stats[key][subKey] = val : (stats[key] = {}, stats[key][subKey] = val);
  89. }), stats;
  90. },
  91. createTable: function(obj) {
  92. var that = this, tableBody = "", type = obj.type, data = obj.data;
  93. return _.each(data, function(value, key, list) {
  94. var newValue = that.getValue({
  95. value: value
  96. });
  97. "classification" === type && (newValue = "<a title=\"Search for entities associated with '" + key + '\'" class="linkClicked" href="#!/search/searchResult?searchType=basic&tag=' + key + '">' + newValue + "<a>"),
  98. tableBody += "<tr><td>" + key + '</td><td class="">' + newValue + "</td></tr>";
  99. }), tableBody;
  100. },
  101. renderClassifications: function(options) {
  102. var that = this, data = options.data, classificationData = data.tag || {}, tagEntitiesData = classificationData ? classificationData.tagEntities || {} : {}, tagsCount = 0, newTagEntitiesData = {}, tagEntitiesKeys = _.keys(tagEntitiesData);
  103. _.each(_.sortBy(tagEntitiesKeys, function(o) {
  104. return o.toLocaleLowerCase();
  105. }), function(key) {
  106. var val = tagEntitiesData[key];
  107. newTagEntitiesData[key] = val, tagsCount += val;
  108. }), tagEntitiesData = newTagEntitiesData, _.isEmpty(tagEntitiesData) || (this.ui.classificationCard.html(that.createTable({
  109. data: tagEntitiesData,
  110. type: "classification"
  111. })), this.ui.classification.find(".count").html("&nbsp;(" + _.numberFormatWithComma(tagsCount) + ")"),
  112. tagEntitiesKeys.length > this.DATA_MAX_LENGTH && this.closePanel({
  113. el: this.ui.classification
  114. }));
  115. },
  116. renderEntities: function(options) {
  117. var data = options.data, entityData = data.entity, activeEntities = entityData.entityActive || {}, deletedEntities = entityData.entityDeleted || {}, shellEntities = entityData.entityShell || {}, stats = {}, activeEntityCount = 0, deletedEntityCount = 0, shellEntityCount = 0, createEntityData = function(opt) {
  118. var entityData = opt.entityData, type = opt.type;
  119. _.each(entityData, function(val, key) {
  120. var intVal = _.isUndefined(val) ? 0 : val;
  121. "active" == type && (activeEntityCount += intVal), "deleted" == type && (deletedEntityCount += intVal),
  122. "shell" == type && (shellEntityCount += intVal), intVal = _.numberFormatWithComma(intVal),
  123. stats[key] ? stats[key][type] = intVal : (stats[key] = {}, stats[key][type] = intVal);
  124. });
  125. };
  126. if (createEntityData({
  127. entityData: activeEntities,
  128. type: "active"
  129. }), createEntityData({
  130. entityData: deletedEntities,
  131. type: "deleted"
  132. }), createEntityData({
  133. entityData: shellEntities,
  134. type: "shell"
  135. }), !_.isEmpty(stats)) {
  136. var statsKeys = _.keys(stats);
  137. this.ui.entityCard.html(EntityTable({
  138. data: _.pick(stats, _.sortBy(statsKeys, function(o) {
  139. return o.toLocaleLowerCase();
  140. }))
  141. })), this.$('[data-id="activeEntity"]').html("&nbsp;(" + _.numberFormatWithComma(activeEntityCount) + ")"),
  142. this.$('[data-id="deletedEntity"]').html("&nbsp;(" + _.numberFormatWithComma(deletedEntityCount) + ")"),
  143. this.$('[data-id="shellEntity"]').html("&nbsp;(" + _.numberFormatWithComma(shellEntityCount) + ")"),
  144. this.ui.entity.find(".count").html("&nbsp;(" + _.numberFormatWithComma(data.general.entityCount) + ")"),
  145. statsKeys.length > this.DATA_MAX_LENGTH && this.closePanel({
  146. el: this.ui.entity
  147. });
  148. }
  149. },
  150. renderStats: function(options) {
  151. var that = this, data = this.genrateStatusData(options.valueObject), generalData = options.dataObject, createTable = function(obj) {
  152. var tableBody = "", enums = obj.enums, data = obj.data;
  153. return _.each(data, function(value, key, list) {
  154. tableBody += "<tr><td>" + key + '</td><td class="">' + that.getValue({
  155. value: value,
  156. type: enums[key]
  157. }) + "</td></tr>";
  158. }), tableBody;
  159. };
  160. if (data.Notification) {
  161. var tableCol = [ {
  162. label: "Total <br> (from " + that.getValue({
  163. value: data.Server.startTimeStamp,
  164. type: Enums.stats.Server.startTimeStamp
  165. }) + ")",
  166. key: "total"
  167. }, {
  168. label: "Current Hour <br> (from " + that.getValue({
  169. value: data.Notification.currentHourStartTime,
  170. type: Enums.stats.Notification.currentHourStartTime
  171. }) + ")",
  172. key: "currentHour"
  173. }, {
  174. label: "Previous Hour",
  175. key: "previousHour"
  176. }, {
  177. label: "Current Day <br> (from " + that.getValue({
  178. value: data.Notification.currentDayStartTime,
  179. type: Enums.stats.Notification.currentDayStartTime
  180. }) + ")",
  181. key: "currentDay"
  182. }, {
  183. label: "Previous Day",
  184. key: "previousDay"
  185. } ], tableHeader = [ "count", "AvgTime", "EntityCreates", "EntityUpdates", "EntityDeletes", "Failed" ];
  186. that.ui.notificationCard.html(StatsNotiTable({
  187. enums: Enums.stats.Notification,
  188. data: data.Notification,
  189. tableHeader: tableHeader,
  190. tableCol: tableCol,
  191. getTmplValue: function(argument, args) {
  192. var pickValueFrom = argument.key.concat(args);
  193. "total" == argument.key && "EntityCreates" == args ? pickValueFrom = "totalCreates" : "total" == argument.key && "EntityUpdates" == args ? pickValueFrom = "totalUpdates" : "total" == argument.key && "EntityDeletes" == args ? pickValueFrom = "totalDeletes" : "count" == args && (pickValueFrom = argument.key);
  194. var returnVal = data.Notification[pickValueFrom];
  195. return returnVal ? _.numberFormatWithComma(returnVal) : 0;
  196. }
  197. }));
  198. var offsetTableColumn = function(obj) {
  199. var returnObj = [];
  200. return _.each(obj, function(value, key) {
  201. returnObj.push({
  202. label: key,
  203. dataValue: value
  204. });
  205. }), returnObj;
  206. };
  207. that.ui.offsetCard.html(TopicOffsetTable({
  208. data: data.Notification.topicDetails,
  209. tableHeader: [ "offsetStart", "offsetCurrent", "processedMessageCount", "failedMessageCount", "lastMessageProcessedTime" ],
  210. tableCol: offsetTableColumn(data.Notification.topicDetails),
  211. getTmplValue: function(argument, args) {
  212. var returnVal = data.Notification.topicDetails[argument.label][args];
  213. return returnVal ? that.getValue({
  214. value: returnVal,
  215. type: Enums.stats.Notification[args]
  216. }) : 0;
  217. }
  218. }));
  219. }
  220. data.Server && that.ui.serverCard.html(createTable({
  221. enums: _.extend(Enums.stats.Server, Enums.stats.ConnectionStatus, Enums.stats.generalData),
  222. data: _.extend(_.pick(data.Server, "startTimeStamp", "activeTimeStamp", "upTime", "statusBackendStore", "statusIndexStore"), _.pick(generalData, "collectionTime"))
  223. }));
  224. },
  225. renderSystemDeatils: function(options) {
  226. var that = this, data = options.data, systemData = data.system, systemOS = systemData.os || {}, systemRuntimeData = systemData.runtime || {}, systemMemoryData = systemData.memory || {};
  227. if (_.isEmpty(systemOS) || that.ui.osCard.html(that.createTable({
  228. data: systemOS
  229. })), _.isEmpty(systemRuntimeData) || (_.each(systemRuntimeData, function(val, key) {
  230. }), that.ui.runtimeCard.html(that.createTable({
  231. data: systemRuntimeData
  232. }))), !_.isEmpty(systemMemoryData)) {
  233. var memoryTable = CommonViewFunction.propertyTable({
  234. scope: this,
  235. formatStringVal: !0,
  236. valueObject: systemMemoryData,
  237. numberFormat: _.numberFormatWithBytes
  238. });
  239. that.ui.memoryCard.html(memoryTable);
  240. }
  241. },
  242. getValue: function(options) {
  243. var value = options.value, type = options.type;
  244. return "time" == type ? Utils.millisecondsToTime(value) : "day" == type ? Utils.formatDate({
  245. date: value
  246. }) : "number" == type ? _.numberFormatWithComma(value) : "millisecond" == type ? _.numberFormatWithComma(value) + " millisecond/s" : "status-html" == type ? '<span class="connection-status ' + value + '"></span>' : value;
  247. }
  248. });
  249. return StatisticsView;
  250. });