raise-common-lib 0.0.41 → 0.0.43

package/fesm2015/raise-common-lib.js

@@ -3,7 +3,7 @@ import { GridModule, PagerModule, GridAllModule, PageService, SortService, Filte
 import { debounce } from 'lodash';
 import { NavigationEnd, Router, ActivatedRoute, RouteReuseStrategy } from '@angular/router';
 import { filter } from 'rxjs/operators';
-import { BehaviorSubject } from 'rxjs';
+import { Subject, BehaviorSubject } from 'rxjs';
 import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { setCulture, L10n } from '@syncfusion/ej2-base';
 import { DatePipe, CommonModule } from '@angular/common';
@@ -1252,7 +1252,10 @@ if (false) {
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 class CommonFunctionService {
-    constructor() { }
+    constructor() {
+        this.closeTabSubject = new Subject();
+        this.closeTab$ = this.closeTabSubject.asObservable();
+    }
     /**
      * @return {?}
      */
@@ -1313,6 +1316,14 @@ class CommonFunctionService {
         }
         return url;
     }
+    // 删除当前
+    /**
+     * @param {?=} tabIndex
+     * @return {?}
+     */
+    closeTab(tabIndex) {
+        return this.closeTabSubject.next(tabIndex);
+    }
 }
 CommonFunctionService.decorators = [
     { type: Injectable, args: [{
@@ -1321,7 +1332,16 @@ CommonFunctionService.decorators = [
 ];
 /** @nocollapse */
 CommonFunctionService.ctorParameters = () => [];
-/** @nocollapse */ CommonFunctionService.ngInjectableDef = ɵɵdefineInjectable({ factory: function CommonFunctionService_Factory() { return new CommonFunctionService(); }, token: CommonFunctionService, providedIn: "root" });
+/** @nocollapse */ CommonFunctionService.ngInjectableDef = ɵɵdefineInjectable({ factory: function CommonFunctionService_Factory() { return new CommonFunctionService(); }, token: CommonFunctionService, providedIn: "root" });
+if (false) {
+    /**
+     * @type {?}
+     * @private
+     */
+    CommonFunctionService.prototype.closeTabSubject;
+    /** @type {?} */
+    CommonFunctionService.prototype.closeTab$;
+}
 
 /**
  * @fileoverview added by tsickle
@@ -1575,6 +1595,8 @@ class MultiTabComponent {
         this.singleReuseUrls = []; //只能单个缓存的url
         //只能单个缓存的url
         this.noGenerateTabUrls = []; //不生成tab的url
+        //不生成tab的url
+        this.subscriptions = [];
         this.TAB_WIDTH = 164;
         this.GAP_NORMAL = 54;
         this.GAP_SMALL = 30;
@@ -1597,6 +1619,16 @@ class MultiTabComponent {
      * @return {?}
      */
     ngOnInit() {
+        this.subscriptions.push(this.cf.closeTab$.subscribe((/**
+         * @param {?} idx
+         * @return {?}
+         */
+        (idx) => {
+            if (idx === undefined) {
+                idx = this.selectedTab;
+            }
+            this.closeTab(idx);
+        })));
         this.initTab();
         // 解决刷新页面后，选中的 tab 丢失问题
         /** @type {?} */
@@ -1608,7 +1640,7 @@ class MultiTabComponent {
         if (isExistIdx !== -1) {
             this.selectedTab = isExistIdx;
         }
-        this.subscription = this.router.events
+        this.subscriptions.push(this.router.events
             .pipe(filter((/**
          * @param {?} event
          * @return {?}
@@ -1629,17 +1661,20 @@ class MultiTabComponent {
                 // 获取是否跳过 location change
                 /** @type {?} */
                 const currentRoute = this.router.routerState.root.firstChild;
+                /** @type {?} */
+                let title = state && state.title;
                 if (currentRoute && !skipLocationChange) {
-                    if (this.tabList.length === 0 && !state) {
-                        return; // 初始化第一个url不加入multi-tab
-                    }
                     if (this.noGenerateTabUrls.includes(this.router.url)) {
                         return; // 排除不生成tab的url
                     }
-                    this.setTab(this.router.url, currentRoute.snapshot.routeConfig.path, state && state.title);
+                    if (this.tabList.length === 0 && !state) {
+                        title = sessionStorage.getItem("firstTabTitle");
+                        sessionStorage.removeItem("firstTabTitle");
+                    }
+                    this.setTab(this.router.url, currentRoute.snapshot.routeConfig.path, title);
                 }
             }
-        }));
+        })));
     }
     /**
      * @return {?}
@@ -1656,9 +1691,11 @@ class MultiTabComponent {
      * @return {?}
      */
     ngOnDestroy() {
-        if (this.subscription) {
-            this.subscription.unsubscribe();
-        }
+        this.subscriptions.forEach((/**
+         * @param {?} sub
+         * @return {?}
+         */
+        (sub) => sub.unsubscribe()));
     }
     /**
      * @param {?=} title
@@ -1733,11 +1770,12 @@ class MultiTabComponent {
         this.tabList = TabCache || [];
     }
     /**
-     * @param {?} tab
      * @param {?} idx
      * @return {?}
      */
-    closeTab(tab, idx) {
+    closeTab(idx) {
+        /** @type {?} */
+        const tab = this.tabList[idx];
         this.tabList = this.tabList.filter((/**
          * @param {?} ele
          * @return {?}
@@ -1770,7 +1808,7 @@ class MultiTabComponent {
      */
     addTab(url, title) {
         if (this.tabList.length >= this.maxTabs) {
-            this.closeTab(this.tabList[0], 0); // 删除第一个
+            this.closeTab(0); // 删除第一个
         }
         this.tabList.push({
             url: url,
@@ -1845,7 +1883,7 @@ class MultiTabComponent {
 MultiTabComponent.decorators = [
     { type: Component, args: [{
                 selector: "rs-multi-tab",
-                template: "<div class=\"rs-multi-tab\" [ngClass]=\"{ 'b-line': tabList.length > 0 }\">\r\n  <ul>\r\n    <ng-container *ngFor=\"let tab of tabList; let i = index\">\r\n      <li\r\n        [ngClass]=\"selectedTab === i ? 'isSelect' : 'notSelect'\"\r\n        (click)=\"changeTab(tab, i)\"\r\n      >\r\n        <ejs-tooltip\r\n          id=\"notSelectTooltip\"\r\n          [showTipPointer]=\"false\"\r\n          [openDelay]=\"500\"\r\n          *ngIf=\"tab.displayTitle !== tab.title; else originText\"\r\n          style=\"height: 27px\"\r\n        >\r\n          <ng-template #content>\r\n            <div class=\"tooltip-content\">\r\n              {{ tab.title }}\r\n            </div>\r\n          </ng-template>\r\n          <span class=\"tabTitle\">{{ tab.displayTitle }}</span>\r\n        </ejs-tooltip>\r\n        <ng-template #originText>\r\n          <span class=\"tabTitle\">\r\n            {{ tab.displayTitle }}\r\n          </span>\r\n        </ng-template>\r\n        <span class=\"img-block\" *ngIf=\"selectedTab !== i\"></span>\r\n        <img\r\n          *ngIf=\"tabList.length !== 1\"\r\n          src=\"../../../assets/img/close-url.svg\"\r\n          (click)=\"closeTab(tab, i)\"\r\n        />\r\n      </li>\r\n    </ng-container>\r\n  </ul>\r\n  <div class=\"refresh-tab\" (click)=\"refreshTab()\" *ngIf=\"tabList.length > 0\">\r\n    <img\r\n      id=\"loadingIcon\"\r\n      alt\r\n      class=\"refresh-btn\"\r\n      src=\"../../../assets/img/desktop-refresh-btn.svg\"\r\n    />\r\n    <span>Refresh Current Tab</span>\r\n  </div>\r\n</div>\r\n",
+                template: "<div class=\"rs-multi-tab\" [ngClass]=\"{ 'b-line': tabList.length > 0 }\">\r\n  <ul>\r\n    <ng-container *ngFor=\"let tab of tabList; let i = index\">\r\n      <li\r\n        [ngClass]=\"selectedTab === i ? 'isSelect' : 'notSelect'\"\r\n        (click)=\"changeTab(tab, i)\"\r\n      >\r\n        <ejs-tooltip\r\n          id=\"notSelectTooltip\"\r\n          [showTipPointer]=\"false\"\r\n          [openDelay]=\"500\"\r\n          *ngIf=\"tab.displayTitle !== tab.title; else originText\"\r\n          style=\"height: 27px\"\r\n        >\r\n          <ng-template #content>\r\n            <div class=\"tooltip-content\">\r\n              {{ tab.title }}\r\n            </div>\r\n          </ng-template>\r\n          <span class=\"tabTitle\">{{ tab.displayTitle }}</span>\r\n        </ejs-tooltip>\r\n        <ng-template #originText>\r\n          <span class=\"tabTitle\">\r\n            {{ tab.displayTitle }}\r\n          </span>\r\n        </ng-template>\r\n        <span class=\"img-block\" *ngIf=\"selectedTab !== i\"></span>\r\n        <img\r\n          *ngIf=\"tabList.length !== 1\"\r\n          src=\"../../../assets/img/close-url.svg\"\r\n          (click)=\"closeTab(i)\"\r\n        />\r\n      </li>\r\n    </ng-container>\r\n  </ul>\r\n  <div class=\"refresh-tab\" (click)=\"refreshTab()\" *ngIf=\"tabList.length > 0\">\r\n    <img\r\n      id=\"loadingIcon\"\r\n      alt\r\n      class=\"refresh-btn\"\r\n      src=\"../../../assets/img/desktop-refresh-btn.svg\"\r\n    />\r\n    <span>Refresh Current Tab</span>\r\n  </div>\r\n</div>\r\n",
                 styles: [".rs-multi-tab{width:100%;display:flex;justify-content:space-between}.rs-multi-tab.b-line{border-bottom:1px solid #e5eaef}.rs-multi-tab ul{display:flex;margin:0 8px;padding:0;overflow:hidden;height:100%}.rs-multi-tab ul li{max-width:164px;padding:0 12px;display:flex;align-items:center;flex:auto;border:1px solid #e5eaef;border-bottom:none;color:#5f6f81;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:28px;height:28px;background:#f8fafb;vertical-align:top;position:relative;cursor:default}.rs-multi-tab ul li .tabTitle{display:inline-block;white-space:nowrap;font-size:11px;font-family:Arial;font-style:normal;font-weight:400;line-height:16px;transition:width .3s}.rs-multi-tab ul li img{border-radius:4px;padding:4px;margin-left:6px;margin-top:1px;vertical-align:top;cursor:pointer}.rs-multi-tab ul li img:hover{background:#dce8f6}.rs-multi-tab ul li:not(:last-child){border-right:none}.rs-multi-tab ul li:first-of-type{border-top-left-radius:8px}.rs-multi-tab ul li:last-child{border-top-right-radius:8px}.rs-multi-tab ul .isSelect{color:#1f3f5c;background:#fff}.rs-multi-tab ul .notSelect img{display:none}.rs-multi-tab ul .notSelect .img-block{display:inline-block;width:22px}.rs-multi-tab ul .notSelect:hover{color:#1f3f5c;background-color:rgba(31,123,255,.04)}.rs-multi-tab ul .notSelect:hover .img-block{display:none}.rs-multi-tab ul .notSelect:hover img{display:inline-block}.rs-multi-tab .refresh-tab{cursor:pointer;text-align:right;color:#6c7c90;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:28px;padding-right:12px}.rs-multi-tab .refresh-tab img{vertical-align:middle;margin-right:4px}.refresh-tab-loading{-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}@-webkit-keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.tooltip-content{padding:4px;color:#f8fafb;font-family:Arial;font-size:11px;font-style:normal;font-weight:400;line-height:14px}@media (max-width:1400px){.refresh-tab{padding-right:0!important}.refresh-tab span{display:none!important}}@media (max-width:1100px){.rs-multi-tab ul li img{position:absolute;right:3px;background-color:#fff}.notSelect:hover img{position:absolute;right:3px;background-color:#eff5fb}.img-block{display:none!important}}@media (max-width:600px){.rs-multi-tab ul li{padding:0 8px}.rs-multi-tab ul .notSelect .img-block{width:0!important}}"]
             }] }
 ];
@@ -1874,7 +1912,7 @@ if (false) {
      * @type {?}
      * @private
      */
-    MultiTabComponent.prototype.subscription;
+    MultiTabComponent.prototype.subscriptions;
     /** @type {?} */
     MultiTabComponent.prototype.TAB_WIDTH;
     /** @type {?} */