ngx-bit
Version:
A flexible NG-ZORRO helper library
404 lines (388 loc) • 20.4 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/router'), require('rxjs'), require('rxjs/operators'), require('@ngx-pwa/local-storage'), require('@ngx-pwa/local-storage/public-api'), require('ngx-bit'), require('@angular/common'), require('ng-zorro-antd/menu'), require('ng-zorro-antd/icon'), require('ngx-bit/pipe'), require('ngx-bit/directive'), require('ng-zorro-antd/layout'), require('ng-zorro-antd/page-header'), require('ng-zorro-antd/breadcrumb'), require('ng-zorro-antd/space')) :
typeof define === 'function' && define.amd ? define('ngx-bit/router', ['exports', '@angular/core', '@angular/router', 'rxjs', 'rxjs/operators', '@ngx-pwa/local-storage', '@ngx-pwa/local-storage/public-api', 'ngx-bit', '@angular/common', 'ng-zorro-antd/menu', 'ng-zorro-antd/icon', 'ngx-bit/pipe', 'ngx-bit/directive', 'ng-zorro-antd/layout', 'ng-zorro-antd/page-header', 'ng-zorro-antd/breadcrumb', 'ng-zorro-antd/space'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global['ngx-bit'] = global['ngx-bit'] || {}, global['ngx-bit'].router = {}), global.ng.core, global.ng.router, global.rxjs, global.rxjs.operators, global.localStorage, global.i2, global['ngx-bit'], global.ng.common, global.menu, global.icon, global['ngx-bit'].pipe, global['ngx-bit'].directive, global.layout, global.pageHeader, global.breadcrumb, global.space));
}(this, (function (exports, i0, i1, rxjs, operators, localStorage, i2, ngxBit, common, menu, icon, pipe, directive, layout, pageHeader, breadcrumb, space) { 'use strict';
function _interopNamespace(e) {
if (e && e.__esModule) return e;
var n = Object.create(null);
if (e) {
Object.keys(e).forEach(function (k) {
if (k !== 'default') {
var d = Object.getOwnPropertyDescriptor(e, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function () {
return e[k];
}
});
}
});
}
n['default'] = e;
return Object.freeze(n);
}
var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
var BitRouterService = /** @class */ (function () {
function BitRouterService(router, storage) {
this.router = router;
this.storage = storage;
/**
* 被激活的导航
* Activated navigation
*/
this.navActive = [];
/**
* 允许返回
* Allow back
*/
this.back = false;
/**
* Title
*/
this.title = null;
/**
* SubTitle
*/
this.subTitle = null;
/**
* default breadcrumb Root
*/
this.breadcrumbRoot = 0;
/**
* Header actions
*/
this.actions = [];
/**
* Status
*/
this.changed = new rxjs.Subject();
}
/**
* 初始化平行路由
* Initialize parallel routing
*/
BitRouterService.prototype.setup = function () {
var _this = this;
if (this.events$) {
return;
}
if (this.router.url !== '/') {
this.match(this.router, this.router.url);
}
this.events$ = this.router.events.pipe(operators.filter(function (e) { return e instanceof i1.NavigationEnd; })).subscribe(function (event) {
if (event.url !== '/') {
_this.match(_this.router, event.url);
}
else {
_this.clearBreadcrumb();
}
});
};
/**
* 设置平行路由数据，同步导航与页头
* Set parallel routing data, synchronize navigation and page header
*/
BitRouterService.prototype.setData = function (data) {
this.storage.set('resource', data.resource).subscribe(function (_) { return _; });
this.storage.set('router', data.router).subscribe(function (_) { return _; });
};
/**
* 取消平行路由逻辑
* Cancel parallel routing logic
*/
BitRouterService.prototype.uninstall = function () {
if (this.events$) {
this.events$.unsubscribe();
}
};
BitRouterService.prototype.match = function (router, url) {
var _this = this;
var primary = router.parseUrl(url).root.children[i1.PRIMARY_OUTLET];
var segments = primary.segments;
this.storage.get('router').pipe(operators.map(function (data) {
if (data) {
for (var i = 0; i < segments.length; i++) {
var key = segments.slice(0, i + 1).map(function (v) { return v.path; }).join('/');
if (data.hasOwnProperty(key)) {
return key;
}
}
}
return null;
})).subscribe(function (maybeKey) {
if (!maybeKey) {
router.navigate(['/empty']);
_this.clearBreadcrumb();
}
else {
_this.dynamicBreadcrumb(maybeKey);
}
});
};
BitRouterService.prototype.dynamicBreadcrumb = function (key) {
var _this = this;
this.storage.get('resource').subscribe(function (data) {
var queue = [];
var breadcrumb = [];
var navActive = [];
if (data.hasOwnProperty(key)) {
var node = data[key];
var name = JSON.parse(node.name);
_this.title = name;
navActive.unshift(node.key);
breadcrumb.unshift({
name: name,
key: node.key,
router: node.router
});
if (node.parent !== _this.breadcrumbRoot) {
queue.push(node.parent);
}
}
while (queue.length !== _this.breadcrumbRoot) {
var parentKey = queue.pop();
if (data.hasOwnProperty(parentKey)) {
var next = data[parentKey];
navActive.unshift(next.key);
breadcrumb.unshift({
name: JSON.parse(next.name),
key: next.key,
router: next.router
});
if (next.parent !== _this.breadcrumbRoot) {
queue.push(next.parent);
}
}
}
_this.navActive = navActive;
_this.breadcrumb = breadcrumb;
});
};
BitRouterService.prototype.clearBreadcrumb = function () {
this.navActive = [];
this.breadcrumb = [];
this.title = null;
};
return BitRouterService;
}());
BitRouterService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function BitRouterService_Factory() { return new BitRouterService(i0__namespace.ɵɵinject(i1__namespace.Router), i0__namespace.ɵɵinject(i2__namespace.StorageMap)); }, token: BitRouterService, providedIn: "root" });
BitRouterService.decorators = [
{ type: i0.Injectable, args: [{ providedIn: 'root' },] }
];
BitRouterService.ctorParameters = function () { return [
{ type: i1.Router },
{ type: localStorage.StorageMap }
]; };
var BitSiderComponent = /** @class */ (function () {
function BitSiderComponent(bit, router) {
this.bit = bit;
this.router = router;
this.collapsed = false;
this.data = [];
}
/**
* 返回层级
*/
BitSiderComponent.prototype.level = function (data) {
var deep = 0;
while (data.hasOwnProperty('parentNode')) {
deep++;
data = data.parentNode;
}
return deep * 24;
};
return BitSiderComponent;
}());
BitSiderComponent.decorators = [
{ type: i0.Component, args: [{
selector: 'bit-sider',
template: "<nz-sider nzCollapsible [(nzCollapsed)]=\"collapsed\" [nzBreakpoint]=\"'lg'\">\n <div class=\"scroll-bar\">\n <ul\n nz-menu\n [nzTheme]=\"'dark'\"\n [nzInlineCollapsed]=\"collapsed\"\n [nzMode]=\"collapsed ? 'vertical' : 'inline'\"\n >\n <ng-container *ngTemplateOutlet=\"navTemplate; context: { $implicit: data }\"></ng-container>\n <ng-template #navTemplate let-navs>\n <ng-container *ngFor=\"let nav of navs\">\n <ng-container *ngIf=\"nav.router; else notRouter\">\n <li\n nz-menu-item\n [nzPaddingLeft]=\"level(nav)\"\n [bitOpen]=\"[nav.key]\"\n [nzSelected]=\"router.navActive.includes(nav.key)\"\n >\n <i nz-icon [nzType]=\"nav.icon\"></i>\n <span class=\"nav-text\">{{ nav.name | object: bit.locale }}</span>\n </li>\n </ng-container>\n <ng-template #notRouter>\n <li\n nz-submenu\n [nzOpen]=\"router.navActive.includes(nav.key)\"\n [nzPaddingLeft]=\"level(nav)\"\n >\n <span title>\n <i nz-icon [nzType]=\"nav.icon\"></i>\n <span>{{ nav.name | object: bit.locale }}</span>\n </span>\n <ul>\n <ng-container\n *ngTemplateOutlet=\"navTemplate; context: { $implicit: nav.children }\"\n ></ng-container>\n </ul>\n </li>\n </ng-template>\n </ng-container>\n </ng-template>\n </ul>\n </div>\n</nz-sider>\n",
styles: ["nz-sider{overflow:hidden;height:100%;position:fixed;left:0}nz-sider .scroll-bar{height:calc(100% - 48px);overflow:auto}"]
},] }
];
BitSiderComponent.ctorParameters = function () { return [
{ type: ngxBit.BitService },
{ type: BitRouterService }
]; };
BitSiderComponent.propDecorators = {
collapsed: [{ type: i0.Input }],
data: [{ type: i0.Input }]
};
var BitPageHeaderComponent = /** @class */ (function () {
function BitPageHeaderComponent(bit, router) {
this.bit = bit;
this.router = router;
}
return BitPageHeaderComponent;
}());
BitPageHeaderComponent.decorators = [
{ type: i0.Component, args: [{
selector: 'bit-page-header',
template: "<ng-container *ngTemplateOutlet=\"router.banner\"></ng-container>\n<nz-page-header [nzGhost]=\"false\" [nzBackIcon]=\"!router.back ? null : ''\" (nzBack)=\"bit.back()\">\n <nz-breadcrumb [nzSeparator]=\"breadcrumbIcon\" nz-page-header-breadcrumb>\n <ng-template #breadcrumbIcon>\n <i nz-icon nzType=\"right\"></i>\n </ng-template>\n <nz-breadcrumb-item>\n <a routerLink=\"/\">{{ bit.l[\"dashboard\"] }}</a>\n </nz-breadcrumb-item>\n <nz-breadcrumb-item *ngFor=\"let x of router.breadcrumb; index as i; last as islast\">\n <ng-container *ngIf=\"islast; else notLast\">\n {{ x.name | object: bit.locale }}\n </ng-container>\n <ng-template #notLast>\n <a *ngIf=\"x.router; else notRouterlink\" [bitHistory]=\"x.key\">\n {{ x.name | object: bit.locale }}\n </a>\n <ng-template #notRouterlink>{{ x.name | object: bit.locale }}</ng-template>\n </ng-template>\n </nz-breadcrumb-item>\n </nz-breadcrumb>\n <nz-page-header-title>{{ router.title | object: bit.locale }}</nz-page-header-title>\n <nz-page-header-subtitle>{{ router.subTitle | object: bit.locale }}</nz-page-header-subtitle>\n <nz-page-header-tags>\n <ng-container *ngTemplateOutlet=\"router.tags\"></ng-container>\n </nz-page-header-tags>\n <nz-page-header-extra>\n <nz-space>\n <ng-container *ngFor=\"let action of router.actions\">\n <ng-container *nzSpaceItem>\n <ng-container *ngTemplateOutlet=\"action\"></ng-container>\n </ng-container>\n </ng-container>\n </nz-space>\n </nz-page-header-extra>\n <nz-page-header-content>\n <ng-container *ngTemplateOutlet=\"router.content\"></ng-container>\n </nz-page-header-content>\n <nz-page-header-footer>\n <ng-container *ngTemplateOutlet=\"router.footer\"></ng-container>\n </nz-page-header-footer>\n</nz-page-header>\n",
styles: ["::ng-deep .ant-page-header-footer{margin-top:0}"]
},] }
];
BitPageHeaderComponent.ctorParameters = function () { return [
{ type: ngxBit.BitService },
{ type: BitRouterService }
]; };
var BitHeaderTagsDirective = /** @class */ (function () {
function BitHeaderTagsDirective(ref) {
this.ref = ref;
}
return BitHeaderTagsDirective;
}());
BitHeaderTagsDirective.decorators = [
{ type: i0.Directive, args: [{
selector: '[bitHeaderTags]'
},] }
];
BitHeaderTagsDirective.ctorParameters = function () { return [
{ type: i0.TemplateRef }
]; };
var BitHeaderBannerDirective = /** @class */ (function () {
function BitHeaderBannerDirective(ref) {
this.ref = ref;
}
return BitHeaderBannerDirective;
}());
BitHeaderBannerDirective.decorators = [
{ type: i0.Directive, args: [{
selector: '[bitHeaderBanner]'
},] }
];
BitHeaderBannerDirective.ctorParameters = function () { return [
{ type: i0.TemplateRef }
]; };
var BitHeaderActionDirective = /** @class */ (function () {
function BitHeaderActionDirective(ref) {
this.ref = ref;
}
return BitHeaderActionDirective;
}());
BitHeaderActionDirective.decorators = [
{ type: i0.Directive, args: [{
selector: '[bitHeaderAction]'
},] }
];
BitHeaderActionDirective.ctorParameters = function () { return [
{ type: i0.TemplateRef }
]; };
var BitHeaderFooterDirective = /** @class */ (function () {
function BitHeaderFooterDirective(ref) {
this.ref = ref;
}
return BitHeaderFooterDirective;
}());
BitHeaderFooterDirective.decorators = [
{ type: i0.Directive, args: [{
selector: '[bitHeaderFooter]'
},] }
];
BitHeaderFooterDirective.ctorParameters = function () { return [
{ type: i0.TemplateRef }
]; };
var BitHeaderComponent = /** @class */ (function () {
function BitHeaderComponent(router) {
this.router = router;
}
BitHeaderComponent.prototype.ngOnInit = function () {
this.router.subTitle = this.subTitle;
this.router.back = this.back !== undefined;
};
BitHeaderComponent.prototype.ngAfterViewInit = function () {
var _a, _b, _c, _d;
this.router.banner = (_a = this.banner) === null || _a === void 0 ? void 0 : _a.ref;
this.router.actions = (_b = this.actions) === null || _b === void 0 ? void 0 : _b.map(function (v) { return v.ref; });
this.router.tags = (_c = this.tags) === null || _c === void 0 ? void 0 : _c.ref;
this.router.content = this.content;
this.router.footer = (_d = this.footer) === null || _d === void 0 ? void 0 : _d.ref;
this.router.changed.next(true);
};
BitHeaderComponent.prototype.ngOnDestroy = function () {
this.router.subTitle = null;
this.router.back = false;
this.router.banner = undefined;
this.router.actions = [];
this.router.tags = undefined;
this.router.content = undefined;
this.router.footer = undefined;
};
return BitHeaderComponent;
}());
BitHeaderComponent.decorators = [
{ type: i0.Component, args: [{
selector: 'bit-header',
template: "\n <ng-template #ContentTpl>\n <ng-content></ng-content>\n </ng-template>\n "
},] }
];
BitHeaderComponent.ctorParameters = function () { return [
{ type: BitRouterService }
]; };
BitHeaderComponent.propDecorators = {
subTitle: [{ type: i0.Input }],
back: [{ type: i0.Input }],
content: [{ type: i0.ViewChild, args: ['ContentTpl',] }],
banner: [{ type: i0.ContentChild, args: [BitHeaderBannerDirective,] }],
tags: [{ type: i0.ContentChild, args: [BitHeaderTagsDirective,] }],
actions: [{ type: i0.ContentChildren, args: [BitHeaderActionDirective,] }],
footer: [{ type: i0.ContentChild, args: [BitHeaderFooterDirective,] }]
};
var BitRouterModule = /** @class */ (function () {
function BitRouterModule() {
}
return BitRouterModule;
}());
BitRouterModule.decorators = [
{ type: i0.NgModule, args: [{
imports: [
menu.NzMenuModule,
icon.NzIconModule,
directive.BitDirectiveModule,
pipe.BitPipeModule,
layout.NzLayoutModule,
pageHeader.NzPageHeaderModule,
breadcrumb.NzBreadCrumbModule,
i1.RouterModule,
common.CommonModule,
space.NzSpaceModule
],
declarations: [
BitSiderComponent,
BitPageHeaderComponent,
BitHeaderComponent,
BitHeaderActionDirective,
BitHeaderBannerDirective,
BitHeaderTagsDirective,
BitHeaderFooterDirective
],
exports: [
BitSiderComponent,
BitPageHeaderComponent,
BitHeaderComponent,
BitHeaderActionDirective,
BitHeaderBannerDirective,
BitHeaderTagsDirective,
BitHeaderFooterDirective
],
providers: [BitRouterService]
},] }
];
/**
* Generated bundle index. Do not edit.
*/
exports.BitHeaderActionDirective = BitHeaderActionDirective;
exports.BitHeaderBannerDirective = BitHeaderBannerDirective;
exports.BitHeaderComponent = BitHeaderComponent;
exports.BitHeaderFooterDirective = BitHeaderFooterDirective;
exports.BitHeaderTagsDirective = BitHeaderTagsDirective;
exports.BitPageHeaderComponent = BitPageHeaderComponent;
exports.BitRouterModule = BitRouterModule;
exports.BitRouterService = BitRouterService;
exports.BitSiderComponent = BitSiderComponent;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=ngx-bit-router.umd.js.map