chore(release): release 11.3.0 (#119)

Co-authored-by: huaweidevcloud <[email protected]>

Author: wangyaju

devui-commons/src/devui-commons.service.ts

@@ -18,14 +18,14 @@ export class DevuiCommonsService {
     this._eventBus = new Subject<CommonsEvent>();
   }
 
-  broadcast(key: any, data?: any) {
+  broadcast(key: any, data?: any): void {
     this._eventBus.next({key, data});
   }
 
   on<T>(key: any): Observable<T> {
     return this._eventBus.asObservable().pipe(
       filter(event => event.key === key),
       map(event => <T>event.data)
-    )
+    );
   }
 }

devui-commons/src/header/data-type.interface.ts

@@ -1,9 +1,9 @@
 export interface UserInfo {
     displayNameCn: string;
-    uid?:string;
+    uid?: string;
     employeeNumber: string;
-    iconUrl:string;
-    docCount?:number;
-    questionCount?:number;
-    draftCount?:number;
-};
+    iconUrl: string;
+    docCount?: number;
+    questionCount?: number;
+    draftCount?: number;
+  }

devui-commons/src/header/ecosystem/ecosystem.component.html

@@ -7,6 +7,16 @@
   >
     <span dDropDownToggle class="drop-down-span"
       >{{curLanguage === 'zh-cn' ? '生态' : 'Ecology'}}
+      <span class="devui-header-open-icon">
+        <svg viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+          <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <polygon
+              transform="translate(8.000000, 8.000000) scale(1, -1) rotate(-360.000000) translate(-8.000000, -8.000000) "
+              points="4 5.5 12 5.5 8 10.5"
+            ></polygon>
+          </g>
+        </svg>
+      </span>
     </span>
     <ul dDropDownMenu class="dropdown-menu devui-dropdown-menu devui-scrollbar" role="menu">
       <li role="menuitem" class="menuitem" *ngFor="let nav of navs">

devui-commons/src/header/ecosystem/ecosystem.component.scss

@@ -15,3 +15,32 @@ a {
         color: $devui-list-item-hover-text;
     }
 }
+
+.g-dropdown {
+  .devui-header-open-icon {
+    display: inline-block;
+    text-indent: 0;
+    pointer-events: none; /* 让鼠标穿透 */
+    width: 16px;
+    height: 16px;
+    line-height: 16px;
+    transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+    transform-origin: center;
+    vertical-align: text-top;
+  
+    & > svg {
+      width: 16px;
+      height: 16px;
+  
+      polygon {
+        fill: $devui-text-weak;
+      }
+    }
+  }
+  
+  &:not(.devui-dropdown-open) {
+    .devui-header-open-icon {
+      transform: rotate(-180deg);
+    }
+  }
+}

devui-commons/src/header/ecosystem/ecosystem.component.ts

@@ -1,5 +1,6 @@
 import { Component, Input, OnInit, TemplateRef } from '@angular/core';
 import { DevuiCommonsService } from '../../devui-commons.service';
+import { I18nUtil } from '../../i18n/i18n.util';
 
 @Component({
   selector: 'd-ecosystem',
@@ -12,12 +13,12 @@ export class EcosystemComponent implements OnInit {
 
   constructor(private commonsService: DevuiCommonsService) { }
 
-  ngOnInit() {
-    this.curLanguage = localStorage.getItem('lang') || 'zh-cn';
+  ngOnInit(): void {
+    this.curLanguage = I18nUtil.getCurrentLanguage();
     this.commonsService.on('languageEvent').subscribe(term => this.changeLanguage(term));
   }
 
-  changeLanguage(lang) {
+  changeLanguage(lang): void {
     this.curLanguage = lang;
   }
 

devui-commons/src/header/header.component.html

@@ -8,7 +8,7 @@
       'header-maxwidth': hasMaxWidth
     }">
       <div class="header-left">
-        <div *ngIf="showSlideButton" class="slide-menu-link" (click)="clickSlideMenu($event)">
+        <div *ngIf="showSlideButton" class="slide-menu-link" (click)="clickSlideMenu()">
           <span></span>
         </div>
         <ng-content select="d-header-logo"></ng-content>
@@ -22,7 +22,7 @@
         <ng-content select="d-header-language-switch"></ng-content>
         <div *ngIf="showGitStar">
           <iframe class="header-gitStar"
-            src="https://ghbtns.com/github-btn.html?user=DevCloudFE&repo=ng-devui&type=star&count=true"
+            [attr.src]="repoLink"
           ></iframe>
         </div>  
         <div *ngIf="showAvatar" class="header-avatar">

devui-commons/src/header/header.component.scss

@@ -51,6 +51,8 @@
 .fixed-wapper {
   width: 100%;
   z-index: 1;
+  position: absolute;
+  top: 0;
 }
 
 .header-wapper {
@@ -59,6 +61,7 @@
   display: flex;
   justify-content: space-between;
   background-color: $devui-base-bg;
+  position: relative;
 
   .header-left {
     display: flex;
@@ -114,7 +117,7 @@
 
 .header-fixed {
   position: fixed;
-  z-index: 10;
+  z-index: 1000;
 }
 
 .header-shadow {
@@ -126,14 +129,6 @@
 }
 
 @media (max-width: 1360px) {
-  .header-left {
-    d-search {
-      display: none;
-    }
-  }
-}
-
-@media (max-width: 1180px) {
   .header-wapper {
     flex-direction: column;
     height: 60px;
@@ -145,17 +140,17 @@
 
     .header-left {
       height: 60px;
-      d-search {
-        display: none;
-      }
     }
 
     .header-right {
       display: none;
+      position: absolute;
+      top: 60px;
     }
 
     .header-right.active {
       background-color: $devui-global-bg-normal;
+      box-shadow: $devui-shadow-length-connected-overlay $devui-light-shadow;
       height: 520px;
       z-index: 3;
 

devui-commons/src/header/header.component.ts

@@ -1,6 +1,8 @@
 import { Component, ContentChildren, HostListener, Input, OnInit, QueryList } from '@angular/core';
 import { DevuiCommonsService } from '../devui-commons.service';
 import { LogoComponent } from './logo/logo.component';
+import { DomSanitizer, SafeResourceUrl} from '@angular/platform-browser';
+import { I18nUtil } from '../i18n/i18n.util';
 
 @Component({
   selector: 'd-common-header',
@@ -15,6 +17,9 @@ export class HeaderComponent implements OnInit {
   @Input() showSlideButton = true;
   @Input() showSearch = false;
   @Input() showAvatar = false;
+  @Input() repoName = 'ng-devui';
+
+  repoLink: SafeResourceUrl;
 
   @ContentChildren(LogoComponent) subLogo: QueryList<LogoComponent> = new QueryList<LogoComponent>();
 
@@ -27,45 +32,49 @@ export class HeaderComponent implements OnInit {
 
 
   @HostListener('window:resize')
-  resize() {
+  resize(): void {
     this.showSlideMenu = document.body.clientWidth < 1024 ? false : true;
     this.setSlideBarStyle();
   }
 
-  constructor(private commonsService: DevuiCommonsService) {
+  constructor(private commonsService: DevuiCommonsService, private sanitizer: DomSanitizer) {
   }
 
-  ngOnInit() {
-    this.curLanguage = localStorage.getItem('lang') || 'zh-cn';
+  ngOnInit(): void {
+    this.curLanguage = I18nUtil.getCurrentLanguage();
     this.commonsService.on('languageEvent').subscribe(term => this.changeLanguage(term));
     this.searchPlaceholder = this.curLanguage === 'zh-cn' ? '请输入你想查找的组件' : 'Enter the component';
     this.showSlideMenu = document.body.clientWidth < 1024 ? false : true;
     this.setSlideBarStyle();
+    this.repoLink = this.sanitizer.bypassSecurityTrustResourceUrl(`https://ghbtns.com/github-btn.html?user=DevCloudFE&repo=${this.repoName}&type=star&count=true`);
   }
 
-  onSearch(term) {
+  onSearch(term): void {
     this.commonsService.broadcast('searchEvent', term);
+
+    if (term) {
+      this.clickSlideMenu(true);
+    }
   }
 
   toggleMenu($event): void {
     this.collapseMenuActive = !this.collapseMenuActive;
   }
 
-  clickSlideMenu($event) {
-    this.showSlideMenu = !this.showSlideMenu;
+  clickSlideMenu(showMenu?: boolean): void {
+    this.showSlideMenu = typeof showMenu === 'boolean' ? showMenu : !this.showSlideMenu;
     this.setSlideBarStyle();
   }
 
-  setSlideBarStyle() {
+  setSlideBarStyle(): void {
     const ele = document.querySelector('.sidebar-wrapper');
     if (ele) {
       ele.setAttribute('style', `max-width: ${ this.showSlideMenu ? '260px' : '0'}`);
     }
   }
 
-  changeLanguage(lang) {
+  changeLanguage(lang): void {
     this.curLanguage = lang;
     this.searchPlaceholder = this.curLanguage === 'zh-cn' ? '请输入你想查找的组件' : 'Enter the component';
   }
-
 }

devui-commons/src/header/header.module.ts

@@ -7,6 +7,7 @@ import { HeaderComponent } from './header.component';
 import { LanguageSwitchComponent } from './language-switch/language-switch.component';
 import { LogoComponent } from './logo/logo.component';
 import { MenuComponent } from './menu/menu.component';
+import { ThemePickerComponent } from './theme-picker/theme-picker.component';
 import { ThemeSwitchComponent } from './theme-switch/theme-switch.component';
 import { VersionSwitchComponent } from './version-switch/version-switch.component';
 
@@ -21,6 +22,7 @@ import { VersionSwitchComponent } from './version-switch/version-switch.componen
     LogoComponent,
     MenuComponent,
     VersionSwitchComponent,
+    ThemePickerComponent,
     ThemeSwitchComponent,
     LanguageSwitchComponent,
     EcosystemComponent
@@ -30,6 +32,7 @@ import { VersionSwitchComponent } from './version-switch/version-switch.componen
     LogoComponent,
     MenuComponent,
     VersionSwitchComponent,
+    ThemePickerComponent,
     ThemeSwitchComponent,
     LanguageSwitchComponent,
     EcosystemComponent

devui-commons/src/header/language-switch/language-switch.component.ts

@@ -1,5 +1,6 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { DevuiCommonsService } from '../../devui-commons.service';
+import { I18nUtil } from '../../i18n/i18n.util';
 
 @Component({
   selector: 'd-header-language-switch',
@@ -13,8 +14,8 @@ export class LanguageSwitchComponent implements OnInit {
 
   constructor(private commonsService: DevuiCommonsService) { }
 
-  ngOnInit() {
-    this.currentLang = localStorage.getItem('lang') || 'zh-cn';
+  ngOnInit(): void {
+    this.currentLang = I18nUtil.getCurrentLanguage();
   }
 
   changeLanguage(): void {