@ohayojp.com/components/bundles/sidebarNav.umd.min.js

Common business components of ohayojp.

/**
 * @license ohayojp(cipchk@qq.com) v1.0.0
 * (c) 2020 cipchk https://ohayojp.com/
 * License: MIT
 */
!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("@ohayojp.com/theme"), require("@ohayojp.com/util"), require("rxjs"), require("rxjs/operators"), require("ng-zorro-antd/icon"), require("ng-zorro-antd/tooltip")) : "function" == typeof define && define.amd ? define("@ohayojp.com/components/sidebar-nav", ["exports", "@angular/common", "@angular/core", "@angular/platform-browser", "@angular/router", "@ohayojp.com/theme", "@ohayojp.com/util", "rxjs", "rxjs/operators", "ng-zorro-antd/icon", "ng-zorro-antd/tooltip"], t) : t(((e = "undefined" != typeof globalThis ? globalThis : e || self).ohayo = e.ohayo || {}, e.ohayo.components = e.ohayo.components || {}, e.ohayo.components["sidebar-nav"] = {}), e.ng.common, e.ng.core, e.ng.platformBrowser, e.ng.router, e.ohayo.theme, e.ohayo.util, e.rxjs, e.rxjs.operators, e["ng-zorro-antd/icon"], e["ng-zorro-antd/tooltip"]) }(this, (function (e, t, n, i, o, a, r, l, s, c, p) {
    "use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation.

    Permission to use, copy, modify, and/or distribute this software for any
    purpose with or without fee is hereby granted.

    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
    PERFORMANCE OF THIS SOFTWARE.
    ***************************************************************************** */function d(e, t, n, i) { var o, a = arguments.length, r = a < 3 ? t : null === i ? i = Object.getOwnPropertyDescriptor(t, n) : i; if ("object" == typeof Reflect && "function" == typeof Reflect.decorate) r = Reflect.decorate(e, t, n, i); else for (var l = e.length - 1; l >= 0; l--)(o = e[l]) && (r = (a < 3 ? o(r) : a > 3 ? o(t, n, r) : o(t, n)) || r); return a > 3 && r && Object.defineProperty(t, n, r), r } function u(e, t) { if ("object" == typeof Reflect && "function" == typeof Reflect.metadata) return Reflect.metadata(e, t) } Object.create; Object.create; var g = "sidebar-nav__floating-show", h = "sidebar-nav__floating", f = function () { function e(e, t, i, o, a, r, s, c, p) { this.menuSrv = e, this.settings = t, this.router = i, this.render = o, this.cdr = a, this.ngZone = r, this.sanitizer = s, this.doc = c, this.win = p, this.unsubscribe$ = new l.Subject, this.list = [], this.disabledAcl = !1, this.autoCloseUnderPad = !0, this.recursivePath = !0, this.openStrictly = !1, this.maxLevelIcon = 3, this.select = new n.EventEmitter } return Object.defineProperty(e.prototype, "collapsed", { get: function () { return this.settings.layout.collapsed }, enumerable: !1, configurable: !0 }), e.prototype.getLinkNode = function (e) { return "A" !== (e = "A" === e.nodeName ? e : e.parentNode).nodeName ? null : e }, e.prototype.floatingClickHandle = 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.clearFloating = function () { this.floatingEl && (this.floatingEl.removeEventListener("click", this.floatingClickHandle.bind(this)), this.floatingEl.hasOwnProperty("remove") ? this.floatingEl.remove() : this.floatingEl.parentNode && this.floatingEl.parentNode.removeChild(this.floatingEl)) }, e.prototype.genFloating = function () { this.clearFloating(), this.floatingEl = this.render.createElement("div"), this.floatingEl.classList.add(h + "-container"), this.floatingEl.addEventListener("click", this.floatingClickHandle.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(h), i.addEventListener("mouseleave", (function () { i.classList.remove(g) }), !1), this.floatingEl.appendChild(i), i }, e.prototype.hideAll = function () { for (var e = this.floatingEl.querySelectorAll("." + h), 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 = -5; o < n.top + t.clientHeight && (a = n.top + t.clientHeight - o + 5), 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.genFloating(); 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, n = t.menuSrv, i = t.recursivePath, o = t.openStrictly, a = n.getHit(this.menuSrv.menus, e, i, (function (e) { e._selected = !1, o || (e._open = !1) })); if (null != a) do { a._selected = !0, o || (a._open = !0), a = a._parent } while (a) }, e.prototype.ngOnInit = function () { var e = this, t = this, n = t.doc, i = t.router, a = t.unsubscribe$, r = t.menuSrv, l = t.settings, c = t.cdr; this.bodyEl = n.querySelector("body"), this.openedByUrl(i.url), this.ngZone.runOutsideAngular((function () { return e.genFloating() })), r.change.pipe(s.takeUntil(a)).subscribe((function (t) { r.visit(t, (function (t, n, i) { t._text = e.sanitizer.bypassSecurityTrustHtml(t.text), t._needIcon = i <= e.maxLevelIcon && !!t.icon, t._aclResult || (e.disabledAcl ? t.disabled = !0 : t._hidden = !0), e.openStrictly && (t._open = null != t.open && t.open) })), e.list = r.menus.filter((function (e) { return !0 !== e._hidden })), c.detectChanges() })), i.events.pipe(s.takeUntil(a)).subscribe((function (t) { t instanceof o.NavigationEnd && (e.openedByUrl(t.urlAfterRedirects), e.underPad(), e.cdr.detectChanges()) })), l.notify.pipe(s.takeUntil(a), s.filter((function (e) { return "layout" === e.type && "collapsed" === e.name }))).subscribe((function () { return e.clearFloating() })), this.underPad() }, e.prototype.ngOnDestroy = function () { var e = this.unsubscribe$; e.next(), e.complete(), this.clearFloating() }, Object.defineProperty(e.prototype, "isPad", { get: function () { return window.innerWidth < 768 }, enumerable: !1, 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 }(); f.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\n      *ngSwitchCase="\'icon\'"\n      class="sidebar-nav__item-icon"\n      nz-icon\n      [nzType]="i.value"\n      [nzTheme]="i.theme"\n      [nzSpin]="i.spin"\n      [nzTwotoneColor]="i.twoToneColor"\n      [nzIconfont]="i.iconfont"\n      [nzRotate]="i.rotate"\n    ></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 #tree let-ls>\n  <ng-container *ngFor="let i of ls">\n    <li *ngIf="i._hidden !== true" class="sidebar-nav__item" [class.sidebar-nav__selected]="i._selected" [class.sidebar-nav__open]="i._open">\n      \x3c!-- link --\x3e\n      <a\n        *ngIf="i.children.length === 0"\n        (click)="to(i)"\n        [attr.data-id]="i._id"\n        class="sidebar-nav__item-link"\n        [ngClass]="{ \'sidebar-nav__item-disabled\': i.disabled }"\n      >\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" [attr.title]="i.text"></span>\n      </a>\n      \x3c!-- has children link --\x3e\n      <a *ngIf="i.children.length > 0" (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" [attr.title]="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      <ul *ngIf="i.children.length > 0" class="sidebar-nav sidebar-nav__sub sidebar-nav__depth{{ i._depth }}">\n        <ng-template [ngTemplateOutlet]="tree" [ngTemplateOutletContext]="{ $implicit: i.children }"></ng-template>\n      </ul>\n    </li>\n  </ng-container>\n</ng-template>\n<ul class="sidebar-nav">\n  <ng-container *ngFor="let group of list">\n    <li class="sidebar-nav__item sidebar-nav__group-title" *ngIf="group.group">\n      <span [innerHTML]="group._text"></span>\n    </li>\n    <ng-template [ngTemplateOutlet]="tree" [ngTemplateOutletContext]="{ $implicit: group.children }"></ng-template>\n  </ng-container>\n</ul>\n', host: { "(click)": "_click()", "(document:click)": "_docClick()" }, preserveWhitespaces: !1, changeDetection: n.ChangeDetectionStrategy.OnPush, encapsulation: n.ViewEncapsulation.None }] }], f.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] }] }] }, f.propDecorators = { disabledAcl: [{ type: n.Input }], autoCloseUnderPad: [{ type: n.Input }], recursivePath: [{ type: n.Input }], openStrictly: [{ type: n.Input }], maxLevelIcon: [{ type: n.Input }], select: [{ type: n.Output }] }, d([r.InputBoolean(), u("design:type", Object)], f.prototype, "disabledAcl", void 0), d([r.InputBoolean(), u("design:type", Object)], f.prototype, "autoCloseUnderPad", void 0), d([r.InputBoolean(), u("design:type", Object)], f.prototype, "recursivePath", void 0), d([r.InputBoolean(), u("design:type", Object)], f.prototype, "openStrictly", void 0), d([r.InputNumber(), u("design:type", Object)], f.prototype, "maxLevelIcon", void 0); var m = function () { }; m.decorators = [{ type: n.NgModule, args: [{ imports: [t.CommonModule, o.RouterModule, c.NzIconModule, p.NzToolTipModule, r.OhayoUtilModule], declarations: [f], exports: [f] }] }], e.SidebarNavComponent = f, e.SidebarNavModule = m, Object.defineProperty(e, "__esModule", { value: !0 })
}));
//# sourceMappingURL=sidebarNav.umd.min.js.map