messages.js 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179
  1. "use strict";
  2. var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
  3. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  4. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  5. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  6. return c > 3 && r && Object.defineProperty(target, key, r), r;
  7. };
  8. var __metadata = (this && this.__metadata) || function (k, v) {
  9. if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
  10. };
  11. var __param = (this && this.__param) || function (paramIndex, decorator) {
  12. return function (target, key) { decorator(target, key, paramIndex); }
  13. };
  14. Object.defineProperty(exports, "__esModule", { value: true });
  15. var core_1 = require("@angular/core");
  16. var common_1 = require("@angular/common");
  17. var animations_1 = require("@angular/animations");
  18. var messageservice_1 = require("../common/messageservice");
  19. var Messages = /** @class */ (function () {
  20. function Messages(messageService) {
  21. this.messageService = messageService;
  22. this.closable = true;
  23. this.enableService = true;
  24. this.showTransitionOptions = '300ms ease-out';
  25. this.hideTransitionOptions = '250ms ease-in';
  26. this.valueChange = new core_1.EventEmitter();
  27. }
  28. Messages.prototype.ngOnInit = function () {
  29. var _this = this;
  30. if (this.messageService && this.enableService) {
  31. this.messageSubscription = this.messageService.messageObserver.subscribe(function (messages) {
  32. if (messages) {
  33. if (messages instanceof Array) {
  34. var filteredMessages = messages.filter(function (m) { return _this.key === m.key; });
  35. _this.value = _this.value ? _this.value.concat(filteredMessages) : filteredMessages.slice();
  36. }
  37. else if (_this.key === messages.key) {
  38. _this.value = _this.value ? _this.value.concat([messages]) : [messages];
  39. }
  40. }
  41. });
  42. this.clearSubscription = this.messageService.clearObserver.subscribe(function (key) {
  43. if (key) {
  44. if (_this.key === key) {
  45. _this.value = null;
  46. }
  47. }
  48. else {
  49. _this.value = null;
  50. }
  51. });
  52. }
  53. };
  54. Messages.prototype.hasMessages = function () {
  55. return this.value && this.value.length > 0;
  56. };
  57. Messages.prototype.getSeverityClass = function () {
  58. return this.value[0].severity;
  59. };
  60. Messages.prototype.clear = function (event) {
  61. this.value = [];
  62. this.valueChange.emit(this.value);
  63. event.preventDefault();
  64. };
  65. Object.defineProperty(Messages.prototype, "icon", {
  66. get: function () {
  67. var icon = null;
  68. if (this.hasMessages()) {
  69. var msg = this.value[0];
  70. switch (msg.severity) {
  71. case 'success':
  72. icon = 'pi-check';
  73. break;
  74. case 'info':
  75. icon = 'pi-info-circle';
  76. break;
  77. case 'error':
  78. icon = 'pi-times';
  79. break;
  80. case 'warn':
  81. icon = 'pi-exclamation-triangle';
  82. break;
  83. default:
  84. icon = 'pi-info-circle';
  85. break;
  86. }
  87. }
  88. return icon;
  89. },
  90. enumerable: true,
  91. configurable: true
  92. });
  93. Messages.prototype.ngOnDestroy = function () {
  94. if (this.messageSubscription) {
  95. this.messageSubscription.unsubscribe();
  96. }
  97. if (this.clearSubscription) {
  98. this.clearSubscription.unsubscribe();
  99. }
  100. };
  101. __decorate([
  102. core_1.Input(),
  103. __metadata("design:type", Array)
  104. ], Messages.prototype, "value", void 0);
  105. __decorate([
  106. core_1.Input(),
  107. __metadata("design:type", Boolean)
  108. ], Messages.prototype, "closable", void 0);
  109. __decorate([
  110. core_1.Input(),
  111. __metadata("design:type", Object)
  112. ], Messages.prototype, "style", void 0);
  113. __decorate([
  114. core_1.Input(),
  115. __metadata("design:type", String)
  116. ], Messages.prototype, "styleClass", void 0);
  117. __decorate([
  118. core_1.Input(),
  119. __metadata("design:type", Boolean)
  120. ], Messages.prototype, "enableService", void 0);
  121. __decorate([
  122. core_1.Input(),
  123. __metadata("design:type", String)
  124. ], Messages.prototype, "key", void 0);
  125. __decorate([
  126. core_1.Input(),
  127. __metadata("design:type", String)
  128. ], Messages.prototype, "showTransitionOptions", void 0);
  129. __decorate([
  130. core_1.Input(),
  131. __metadata("design:type", String)
  132. ], Messages.prototype, "hideTransitionOptions", void 0);
  133. __decorate([
  134. core_1.Output(),
  135. __metadata("design:type", core_1.EventEmitter)
  136. ], Messages.prototype, "valueChange", void 0);
  137. Messages = __decorate([
  138. core_1.Component({
  139. selector: 'p-messages',
  140. template: "\n <div *ngIf=\"hasMessages()\" class=\"ui-messages ui-widget ui-corner-all\"\n [ngClass]=\"{'ui-messages-info':(value[0].severity === 'info'),\n 'ui-messages-warn':(value[0].severity === 'warn'),\n 'ui-messages-error':(value[0].severity === 'error'),\n 'ui-messages-success':(value[0].severity === 'success')}\"\n [ngStyle]=\"style\" [class]=\"styleClass\" [@messageAnimation]=\"{value: 'visible', params: {showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions}}\">\n <a tabindex=\"0\" class=\"ui-messages-close\" (click)=\"clear($event)\" (keydown.enter)=\"clear($event)\" *ngIf=\"closable\">\n <i class=\"pi pi-times\"></i>\n </a>\n <span class=\"ui-messages-icon pi\" [ngClass]=\"icon\"></span>\n <ul>\n <li *ngFor=\"let msg of value\">\n <span *ngIf=\"msg.summary\" class=\"ui-messages-summary\" [innerHTML]=\"msg.summary\"></span>\n <span *ngIf=\"msg.detail\" class=\"ui-messages-detail\" [innerHTML]=\"msg.detail\"></span>\n </li>\n </ul>\n </div>\n ",
  141. animations: [
  142. animations_1.trigger('messageAnimation', [
  143. animations_1.state('visible', animations_1.style({
  144. transform: 'translateY(0)',
  145. opacity: 1
  146. })),
  147. animations_1.transition('void => *', [
  148. animations_1.style({ transform: 'translateY(-25%)', opacity: 0 }),
  149. animations_1.animate('{{showTransitionParams}}')
  150. ]),
  151. animations_1.transition('* => void', [
  152. animations_1.animate(('{{hideTransitionParams}}'), animations_1.style({
  153. opacity: 0,
  154. transform: 'translateY(-25%)'
  155. }))
  156. ])
  157. ])
  158. ]
  159. }),
  160. __param(0, core_1.Optional()),
  161. __metadata("design:paramtypes", [messageservice_1.MessageService])
  162. ], Messages);
  163. return Messages;
  164. }());
  165. exports.Messages = Messages;
  166. var MessagesModule = /** @class */ (function () {
  167. function MessagesModule() {
  168. }
  169. MessagesModule = __decorate([
  170. core_1.NgModule({
  171. imports: [common_1.CommonModule],
  172. exports: [Messages],
  173. declarations: [Messages]
  174. })
  175. ], MessagesModule);
  176. return MessagesModule;
  177. }());
  178. exports.MessagesModule = MessagesModule;
  179. //# sourceMappingURL=messages.js.map