@ohayojp.com/components/notice-icon/noticeIcon.metadata.json

Common business components of ohayojp.

{"__symbolic":"module","version":4,"metadata":{"NoticeItem":{"__symbolic":"interface"},"NoticeIconList":{"__symbolic":"interface"},"NoticeIconSelect":{"__symbolic":"interface"},"NoticeIconTcomponentsomponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"notice-icon-tab","exportAs":"noticeIconTab","preserveWhitespaces":false,"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":9,"character":17},"member":"None"},"template":"<div *ngIf=\"data.list?.length === 0; else listTpl\" class=\"notice-icon__notfound\">\n  <img class=\"notice-icon__notfound-img\" *ngIf=\"data.emptyImage\" src=\"{{ data.emptyImage }}\" alt=\"not found\" />\n  <p>{{ data.emptyText || locale.emptyText }}</p>\n</div>\n<ng-template #listTpl>\n  <nz-list [nzDataSource]=\"data.list\" [nzRenderItem]=\"item\">\n    <ng-template #item let-item>\n      <nz-list-item (click)=\"onClick(item)\" [ngClass]=\"{ 'notice-icon__item-read': item.read }\">\n        <nz-list-item-meta [nzTitle]=\"nzTitle\" [nzDescription]=\"nzDescription\" [nzAvatar]=\"item.avatar\">\n          <ng-template #nzTitle>\n            {{ item.title }}\n            <div class=\"notice-icon__item-extra\" *ngIf=\"item.extra\">\n              <nz-tag [nzColor]=\"item.color\">{{ item.extra }}</nz-tag>\n            </div>\n          </ng-template>\n          <ng-template #nzDescription>\n            <div *ngIf=\"item.description\" class=\"notice-icon__item-desc\">{{ item.description }}</div>\n            <div *ngIf=\"item.datetime\" class=\"notice-icon__item-time\">{{ item.datetime }}</div>\n          </ng-template>\n        </nz-list-item-meta>\n      </nz-list-item>\n    </ng-template>\n  </nz-list>\n  <div class=\"notice-icon__clear\" (click)=\"onClear()\">{{ data.clearText || locale.clearText }}</div>\n</ng-template>\n"}]}],"members":{"locale":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"select":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":15,"character":3}}]}],"clear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":16,"character":3}}]}],"onClick":[{"__symbolic":"method"}],"onClear":[{"__symbolic":"method"}]}},"NoticeIconComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":17,"character":1},"arguments":[{"selector":"notice-icon","exportAs":"noticeIcon","host":{"[class.notice-icon__btn]":"true","$quoted$":["[class.notice-icon__btn]"]},"preserveWhitespaces":false,"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":19},"member":"OnPush"},"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":24,"character":17},"member":"None"},"template":"<ng-template #badgeTpl>\n  <nz-badge [nzCount]=\"count\" [ngClass]=\"btnClass\" [nzStyle]=\"{ 'box-shadow': 'none' }\">\n    <i nz-icon nzType=\"bell\" [ngClass]=\"btnIconClass\"></i>\n  </nz-badge>\n</ng-template>\n<div *ngIf=\"data?.length === 0\">\n  <ng-template [ngTemplateOutlet]=\"badgeTpl\"></ng-template>\n</div>\n<div\n  *ngIf=\"data?.length > 0\"\n  nz-dropdown\n  [nzVisible]=\"popoverVisible\"\n  (nzVisibleChange)=\"onVisibleChange($event)\"\n  nzTrigger=\"click\"\n  nzPlacement=\"bottomRight\"\n  [nzOverlayClassName]=\"['header-dropdown', 'notice-icon']\"\n  [nzDropdownMenu]=\"noticeMenu\"\n>\n  <ng-template [ngTemplateOutlet]=\"badgeTpl\"></ng-template>\n</div>\n<nz-dropdown-menu #noticeMenu=\"nzDropdownMenu\">\n  <nz-spin [nzSpinning]=\"loading\" [nzDelay]=\"0\">\n    <nz-tabset nzSelectedIndex=\"0\">\n      <nz-tab *ngFor=\"let i of data\" [nzTitle]=\"i.title\">\n        <notice-icon-tab [locale]=\"locale\" [data]=\"i\" (select)=\"onSelect($event)\" (clear)=\"onClear($event)\"></notice-icon-tab>\n      </nz-tab>\n    </nz-tabset>\n  </nz-spin>\n</nz-dropdown-menu>\n"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"count":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@ohayojp.com/util","name":"InputNumber","line":35,"character":12}}]}],"loading":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@ohayojp.com/util","name":"InputBoolean","line":36,"character":12}}]}],"popoverVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@ohayojp.com/util","name":"InputBoolean","line":37,"character":12}}]}],"btnClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"btnIconClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"select":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":41,"character":3}}]}],"clear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":42,"character":3}}]}],"popoverVisibleChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":43,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@ohayojp.com/theme","name":"OhayoLocaleService","line":45,"character":28},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":45,"character":61}]}],"onVisibleChange":[{"__symbolic":"method"}],"onSelect":[{"__symbolic":"method"}],"onClear":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"NoticeIconModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":17,"character":4},{"__symbolic":"reference","module":"@ohayojp.com/theme","name":"OhayoLocaleModule","line":18,"character":4},{"__symbolic":"reference","module":"ng-zorro-antd/badge","name":"NzBadgeModule","line":19,"character":4},{"__symbolic":"reference","module":"ng-zorro-antd/dropdown","name":"NzDropDownModule","line":20,"character":4},{"__symbolic":"reference","module":"ng-zorro-antd/icon","name":"NzIconModule","line":21,"character":4},{"__symbolic":"reference","module":"ng-zorro-antd/list","name":"NzListModule","line":22,"character":4},{"__symbolic":"reference","module":"ng-zorro-antd/spin","name":"NzSpinModule","line":23,"character":4},{"__symbolic":"reference","module":"ng-zorro-antd/tabs","name":"NzTabsModule","line":24,"character":4},{"__symbolic":"reference","module":"ng-zorro-antd/tag","name":"NzTagModule","line":25,"character":4}],"declarations":[{"__symbolic":"reference","name":"NoticeIconComponent"},{"__symbolic":"reference","name":"NoticeIconTcomponentsomponent"}],"exports":[{"__symbolic":"reference","name":"NoticeIconComponent"}]}]}],"members":{}}},"origins":{"NoticeItem":"./notice-icon.types","NoticeIconList":"./notice-icon.types","NoticeIconSelect":"./notice-icon.types","NoticeIconTcomponentsomponent":"./notice-icon-tab.component","NoticeIconComponent":"./notice-icon.component","NoticeIconModule":"./notice-icon.module"},"importAs":"@ohayojp.com/components/notice-icon"}