@lxlib/seed
Version:
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.1.
16 lines (14 loc) • 12.1 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/common"),require("@angular/core"),require("@angular/platform-browser"),require("@angular/router"),require("@lxlib/theme"),require("@lxlib/util"),require("rxjs"),require("rxjs/operators"),require("ng-zorro-antd/icon"),require("ng-zorro-antd/tooltip")):"function"==typeof define&&define.amd?define("@lxlib/seed/sidebar-nav",["exports","@angular/common","@angular/core","@angular/platform-browser","@angular/router","@lxlib/theme","@lxlib/util","rxjs","rxjs/operators","ng-zorro-antd/icon","ng-zorro-antd/tooltip"],t):t(((e=e||self).lxlib=e.lxlib||{},e.lxlib.seed=e.lxlib.seed||{},e.lxlib.seed["sidebar-nav"]={}),e.ng.common,e.ng.core,e.ng.platformBrowser,e.ng.router,e.lxlib.theme,e.lxlib.util,e.rxjs,e.rxjs.operators,e["ng-zorro-antd/icon"],e["ng-zorro-antd/tooltip"])}(this,(function(e,t,n,i,o,a,l,r,s,c,d){"use strict";
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */function p(e,t,n,i){var o,a=arguments.length,l=a<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,n,i);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(l=(a<3?o(l):a>3?o(t,n,l):o(t,n))||l);return a>3&&l&&Object.defineProperty(t,n,l),l}function u(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}var g="sidebar-nav__floating-show",h=function(){function e(e,t,i,o,a,l,s,c,d){this.menuSrv=e,this.settings=t,this.router=i,this.render=o,this.cdr=a,this.ngZone=l,this.sanitizer=s,this.doc=c,this.win=d,this.unsubscribe$=new r.Subject,this.list=[],this.disabledAcl=!1,this.autoCloseUnderPad=!0,this.recursivePath=!0,this.openStrictly=!1,this.select=new n.EventEmitter}return Object.defineProperty(e.prototype,"collapsed",{get:function(){return this.settings.layout.collapsed},enumerable:!0,configurable:!0}),e.prototype.getLinkNode=function(e){return"A"!==(e="A"===e.nodeName?e:e.parentNode).nodeName?null:e},e.prototype.floatingAreaClickHandle=function(e){e.stopPropagation();var t=this.getLinkNode(e.target);if(null==t)return!1;var n,i=+t.dataset.id;return isNaN(i)||(this.menuSrv.visit(this.list,(function(e){n||e.__id!==i||(n=e)})),this.to(n),this.hideAll(),e.preventDefault()),!1},e.prototype.clearFloatingContainer=function(){this.floatingEl&&(this.floatingEl.removeEventListener("click",this.floatingAreaClickHandle.bind(this)),this.floatingEl.hasOwnProperty("remove")?this.floatingEl.remove():this.floatingEl.parentNode&&this.floatingEl.parentNode.removeChild(this.floatingEl))},e.prototype.genFloatingContainer=function(){this.clearFloatingContainer(),this.floatingEl=this.render.createElement("div"),this.floatingEl.classList.add("sidebar-nav__floating-container"),this.floatingEl.addEventListener("click",this.floatingAreaClickHandle.bind(this),!1),this.bodyEl.appendChild(this.floatingEl)},e.prototype.genSubNode=function(e,t){var n="_sidebar-nav-"+t.__id,i=(t.badge?e.nextElementSibling.nextElementSibling:e.nextElementSibling).cloneNode(!0);return i.id=n,i.classList.add("sidebar-nav__floating"),i.addEventListener("mouseleave",(function(){i.classList.remove(g)}),!1),this.floatingEl.appendChild(i),i},e.prototype.hideAll=function(){for(var e=this.floatingEl.querySelectorAll(".sidebar-nav__floating"),t=0;t<e.length;t++)e[t].classList.remove(g)},e.prototype.calPos=function(e,t){var n=e.getBoundingClientRect(),i=Math.max(this.doc.documentElement.scrollTop,this.bodyEl.scrollTop),o=Math.max(this.doc.documentElement.clientHeight,this.bodyEl.clientHeight),a=0;o<n.top+t.clientHeight&&(a=n.top+t.clientHeight-o),t.style.top=n.top+i-a+"px",t.style.left=n.right+5+"px"},e.prototype.showSubMenu=function(e,t){var n=this;!0===this.collapsed&&this.ngZone.runOutsideAngular((function(){e.preventDefault();var i=e.target;n.genFloatingContainer();var o=n.genSubNode(i,t);n.hideAll(),o.classList.add(g),n.calPos(i,o)}))},e.prototype.to=function(e){var t=this;this.select.emit(e),e.disabled||(e.externalLink?"_blank"===e.target?this.win.open(e.externalLink):this.win.location.href=e.externalLink:this.ngZone.run((function(){return t.router.navigateByUrl(e.link)})))},e.prototype.toggleOpen=function(e){if(!this.openStrictly){this.menuSrv.visit(this.list,(function(t){t!==e&&(t._open=!1)}));for(var t=e.__parent;t;)t._open=!0,t=t.__parent}e._open=!e._open,this.cdr.markForCheck()},e.prototype._click=function(){this.isPad&&this.collapsed&&(this.openAside(!1),this.hideAll())},e.prototype._docClick=function(){this.collapsed&&this.hideAll()},e.prototype.openedByUrl=function(e){var t=this.menuSrv,n=this.recursivePath,i=this.openStrictly,o=t.getHit(this.menuSrv.menus,e,n,(function(e){e._selected=!1,i||(e._open=!1)}));if(null!=o)do{o._selected=!0,i||(o._open=!0),o=o.__parent}while(o)},e.prototype.ngOnInit=function(){var e=this,t=this,n=t.doc,i=t.router,a=t.unsubscribe$,l=t.menuSrv,r=t.cdr;this.bodyEl=n.querySelector("body"),this.openedByUrl(i.url),this.ngZone.runOutsideAngular((function(){return e.genFloatingContainer()})),l.change.pipe(s.takeUntil(a)).subscribe((function(t){l.visit(t,(function(t,n,i){t._text=e.sanitizer.bypassSecurityTrustHtml(t.text),t._needIcon=i<=3&&!!t.icon,t._aclResult||(e.disabledAcl?t.disabled=!0:t._hidden=!0),e.openStrictly&&(t._open=null!=t.open&&t.open)})),e.list=l.menus,r.detectChanges()})),i.events.pipe(s.takeUntil(a)).subscribe((function(t){t instanceof o.NavigationEnd&&(e.openedByUrl(t.urlAfterRedirects),e.underPad(),e.cdr.detectChanges())})),this.underPad()},e.prototype.ngOnDestroy=function(){var e=this.unsubscribe$;e.next(),e.complete(),this.clearFloatingContainer()},Object.defineProperty(e.prototype,"isPad",{get:function(){return window.innerWidth<768},enumerable:!0,configurable:!0}),e.prototype.underPad=function(){var e=this;this.autoCloseUnderPad&&this.isPad&&!this.collapsed&&setTimeout((function(){return e.openAside(!0)}))},e.prototype.openAside=function(e){this.settings.setLayout("collapsed",e)},e.decorators=[{type:n.Component,args:[{selector:"sidebar-nav",exportAs:"sidebarNav",template:'<ng-template #icon let-i>\n <ng-container *ngIf="i" [ngSwitch]="i.type">\n <i *ngSwitchCase="\'icon\'" class="sidebar-nav__item-icon" nz-icon [nzType]="i.value" [nzTheme]="i.theme"\n [nzSpin]="i.spin" [nzTwotoneColor]="i.twoToneColor" [nzIconfont]="i.iconfont"></i>\n <i *ngSwitchCase="\'iconfont\'" class="sidebar-nav__item-icon" nz-icon [nzIconfont]="i.iconfont"></i>\n <img *ngSwitchCase="\'img\'" [src]="i.value" class="sidebar-nav__item-icon sidebar-nav__item-img">\n <i *ngSwitchDefault class="sidebar-nav__item-icon {{ i.value }}"></i>\n </ng-container>\n</ng-template>\n<ng-template #item let-i>\n \x3c!-- link --\x3e\n <a *ngIf="i._type <= 2" (click)="to(i)" [attr.data-id]="i.__id" class="sidebar-nav__item-link"\n [ngClass]="{\'sidebar-nav__item-disabled\': i.disabled}">\n <ng-container *ngIf="i._needIcon">\n <ng-container *ngIf="!collapsed">\n <ng-template [ngTemplateOutlet]="icon" [ngTemplateOutletContext]="{$implicit: i.icon}"></ng-template>\n </ng-container>\n <span *ngIf="collapsed" nz-tooltip nzTooltipPlacement="right" [nzTooltipTitle]="i.text">\n <ng-template [ngTemplateOutlet]="icon" [ngTemplateOutletContext]="{$implicit: i.icon}"></ng-template>\n </span>\n </ng-container>\n <span class="sidebar-nav__item-text" [innerHTML]="i._text"></span>\n </a>\n \x3c!-- has children link --\x3e\n <a *ngIf="i._type === 3" (click)="toggleOpen(i)" (mouseenter)="showSubMenu($event, i)" class="sidebar-nav__item-link">\n <ng-template [ngTemplateOutlet]="icon" [ngTemplateOutletContext]="{$implicit: i.icon}"></ng-template>\n <span class="sidebar-nav__item-text" [innerHTML]="i._text"></span>\n <i class="sidebar-nav__sub-arrow"></i>\n </a>\n \x3c!-- badge --\x3e\n <div *ngIf="i.badge" [attr.title]="i.badge" class="badge badge-{{i.badgeStatus}}" [class.badge-dot]="i.badgeDot">\n <em>{{i.badge}}</em>\n </div>\n</ng-template>\n<ul class="sidebar-nav">\n <ng-container *ngFor="let group of list">\n <ng-container *ngIf="group._hidden !== true">\n <li class="sidebar-nav__item sidebar-nav__group-title" *ngIf="group.group">\n <span [innerHTML]="group._text"></span>\n </li>\n <ng-container *ngFor="let child1 of group.children">\n <li *ngIf="child1._hidden !== true" class="sidebar-nav__item" [class.sidebar-nav__selected]="child1._selected"\n [class.sidebar-nav__open]="child1._open">\n <ng-template [ngTemplateOutlet]="item" [ngTemplateOutletContext]="{$implicit: child1}"></ng-template>\n \x3c!-- Level 2 --\x3e\n <ul *ngIf="child1._type === 3" class="sidebar-nav sidebar-nav__sub sidebar-nav__depth{{child1._depth}}">\n <ng-container *ngFor="let child2 of child1.children">\n <li *ngIf="child2._hidden !== true" class="sidebar-nav__item"\n [class.sidebar-nav__selected]="child2._selected" [class.sidebar-nav__open]="child2._open">\n <ng-template [ngTemplateOutlet]="item" [ngTemplateOutletContext]="{$implicit: child2}"></ng-template>\n \x3c!-- Level 3 --\x3e\n <ul *ngIf="child2._type === 3" class="sidebar-nav sidebar-nav__sub sidebar-nav__depth{{child2._depth}}">\n <ng-container *ngFor="let child3 of child2.children">\n <li *ngIf="child3._hidden !== true" class="sidebar-nav__item"\n [class.sidebar-nav__selected]="child3._selected" [class.sidebar-nav__open]="child3._open">\n <ng-template [ngTemplateOutlet]="item" [ngTemplateOutletContext]="{$implicit: child3}">\n </ng-template>\n </li>\n </ng-container>\n </ul>\n </li>\n </ng-container>\n </ul>\n </li>\n </ng-container>\n </ng-container>\n </ng-container>\n</ul>\n',host:{"(click)":"_click()","(document:click)":"_docClick()"},preserveWhitespaces:!1,changeDetection:n.ChangeDetectionStrategy.OnPush,encapsulation:n.ViewEncapsulation.None}]}],e.ctorParameters=function(){return[{type:a.MenuService},{type:a.SettingsService},{type:o.Router},{type:n.Renderer2},{type:n.ChangeDetectorRef},{type:n.NgZone},{type:i.DomSanitizer},{type:void 0,decorators:[{type:n.Inject,args:[t.DOCUMENT]}]},{type:Window,decorators:[{type:n.Inject,args:[a.WINDOW]}]}]},e.propDecorators={disabledAcl:[{type:n.Input}],autoCloseUnderPad:[{type:n.Input}],recursivePath:[{type:n.Input}],openStrictly:[{type:n.Input}],select:[{type:n.Output}]},p([l.InputBoolean(),u("design:type",Object)],e.prototype,"disabledAcl",void 0),p([l.InputBoolean(),u("design:type",Object)],e.prototype,"autoCloseUnderPad",void 0),p([l.InputBoolean(),u("design:type",Object)],e.prototype,"recursivePath",void 0),p([l.InputBoolean(),u("design:type",Object)],e.prototype,"openStrictly",void 0),e}();var f=function(){function e(){}return e.decorators=[{type:n.NgModule,args:[{imports:[t.CommonModule,o.RouterModule,c.NzIconModule,d.NzToolTipModule,l.LxlibUtilModule],declarations:[h],exports:[h]}]}],e}();e.SidebarNavComponent=h,e.SidebarNavModule=f,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=sidebarNav.umd.min.js.map