Skip to content

Commit 576100b

Browse files
wangyajuhuaweidevcloud
wangyaju
and
huaweidevcloud
authored
chore(release): release 13.3.0 (#244)
Co-authored-by: huaweidevcloud <[email protected]>
1 parent 289075a commit 576100b

File tree

196 files changed

+3916
-2278
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

196 files changed

+3916
-2278
lines changed

‎devui/auto-complete/auto-complete-popup.component.html

+5-7
Original file line numberDiff line numberDiff line change
@@ -66,15 +66,13 @@
6666
>
6767
</ng-template>
6868
</li>
69-
<li class="devui-no-result-template" *ngIf="!source?.length && noResultItemTemplate != null">
69+
<div class="devui-no-data-tip" *ngIf="!source?.length && noResultItemTemplate">
7070
<ng-template [ngTemplateOutlet]="noResultItemTemplate" [ngTemplateOutletContext]="{ term: term, source: source }"> </ng-template>
71-
</li>
72-
</ng-container>
73-
<ng-container *ngIf="isSearching && searchingTemplate">
74-
<li class="devui-is-searching-template">
75-
<ng-template [ngTemplateOutlet]="searchingTemplate" [ngTemplateOutletContext]="{ term: term }"> </ng-template>
76-
</li>
71+
</div>
7772
</ng-container>
73+
<div class="devui-no-data-tip" *ngIf="isSearching && searchingTemplate">
74+
<ng-template [ngTemplateOutlet]="searchingTemplate" [ngTemplateOutletContext]="{ term: term }"> </ng-template>
75+
</div>
7876
</ul>
7977
</div>
8078
</ng-template>

‎devui/auto-complete/auto-complete-popup.component.scss

-22
Original file line numberDiff line numberDiff line change
@@ -9,28 +9,6 @@
99
position: static;
1010
}
1111

12-
.devui-no-result-template,
13-
.devui-is-searching-template {
14-
display: block;
15-
width: 100%;
16-
padding: 8px 12px;
17-
clear: both;
18-
border: 0;
19-
overflow: hidden;
20-
text-overflow: ellipsis;
21-
white-space: nowrap;
22-
cursor: not-allowed;
23-
background-color: $devui-disabled-bg;
24-
color: $devui-disabled-text;
25-
line-height: 20px;
26-
27-
&:hover,
28-
&:active,
29-
&:hover:active {
30-
background-color: $devui-unavailable;
31-
}
32-
}
33-
3412
ul.devui-list-unstyled {
3513
margin: 0;
3614
}

‎devui/auto-complete/auto-complete.directive.ts

+12-8
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,7 @@ export class AutoCompleteDirective implements OnInit, OnDestroy, OnChanges, Cont
109109
* @deprecated
110110
*/
111111
@Output() changeDropDownStatus = new EventEmitter<any>();
112-
@Output() toggleChange = new EventEmitter<any>();
112+
@Output() toggleChange = new EventEmitter<boolean>();
113113
KEYBOARD_EVENT_NOT_REFRESH = ['escape', 'enter', 'arrowup', 'arrowdown', /* ie 10 edge */ 'esc', 'up', 'down'];
114114
popupRef: ComponentRef<AutoCompletePopupComponent>;
115115

@@ -137,14 +137,11 @@ export class AutoCompleteDirective implements OnInit, OnDestroy, OnChanges, Cont
137137
private i18n: I18nService,
138138
private devConfigService: DevConfigService
139139
) {
140-
this.minLength = this.autoCompleteConfig.autoComplete.minLength;
141-
this.itemTemplate = this.autoCompleteConfig.autoComplete.itemTemplate;
142-
this.noResultItemTemplate = this.autoCompleteConfig.autoComplete.noResultItemTemplate;
143-
this.formatter = this.autoCompleteConfig.autoComplete.formatter;
144-
this.valueParser = this.autoCompleteConfig.autoComplete.valueParser;
140+
145141
}
146142

147143
ngOnInit() {
144+
this.init();
148145
this.setI18nText();
149146
this.valueChanges = this.registerInputEvent(this.elementRef);
150147
// 调用时机：input keyup
@@ -153,12 +150,11 @@ export class AutoCompleteDirective implements OnInit, OnDestroy, OnChanges, Cont
153150
// 动态的创建了popup组件，
154151
const factory = this.componentFactoryResolver.resolveComponentFactory(AutoCompletePopupComponent);
155152
this.popupRef = this.viewContainerRef.createComponent(factory, this.viewContainerRef.length, this.injector);
156-
157153
this.fillPopup(this.source);
158154

159155
if (!this.searchFn) {
160156
this.searchFn = (term) => {
161-
return of(this.source.filter((lang) => this.formatter(lang).toLowerCase().indexOf(term.toLowerCase()) !== -1));
157+
return of(this.source.filter((item) => this.formatter(item).toLowerCase().indexOf(term.toLowerCase()) !== -1));
162158
};
163159
}
164160

@@ -193,6 +189,14 @@ export class AutoCompleteDirective implements OnInit, OnDestroy, OnChanges, Cont
193189
}
194190
}
195191

192+
init() {
193+
this.minLength = this.minLength ?? this.autoCompleteConfig.autoComplete.minLength;
194+
this.itemTemplate = this.itemTemplate || this.autoCompleteConfig.autoComplete.itemTemplate;
195+
this.noResultItemTemplate = this.noResultItemTemplate || this.autoCompleteConfig.autoComplete.noResultItemTemplate;
196+
this.formatter = this.formatter || this.autoCompleteConfig.autoComplete.formatter;
197+
this.valueParser = this.valueParser || this.autoCompleteConfig.autoComplete.valueParser;
198+
}
199+
196200
setPositions() {
197201
if (this.popupRef) {
198202
this.popupRef.instance.overlayPositions =

‎devui/auto-complete/doc/api-cn.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import { AutoCompleteModule } from 'ng-devui/auto-complete';
2424
| appendToBodyDirections | `Array<AppendToBodyDirection \| ConnectedPosition>` | `['rightDown', 'leftDown', 'rightUp', 'leftUp']` | 可选，方向数组优先采用数组里靠前的位置，AppendToBodyDirection 和 ConnectedPosition 请参考 dropdown | [自定义模板展示](demo#auto-custom) |
2525
| disabled | `boolean` | false | 可选，是否禁止指令 | [设置禁用](demo#auto-disable) |
2626
| delay | `number` | 300 | 可选，只有在 delay 时间经过后并且输入新值，才做搜索查询（`ms`） | [自定义模板展示](demo#auto-custom) |
27-
| disabledKey | `string` | -- | 可选，禁用单个选项，当传入资源 source 选项类型为对象，比如设置为'disabled'，则当对象的 disable 属性为 true 时，比如{ label: xxx, disabled: true }，该选项将禁用 | [设置禁用](demo#auto-disable) |
27+
| disabledKey | `string` | -- | 可选，禁用单个选项，当传入资源 source 选项类型为对象，比如设置为'disabled'，则当对象的 disabled 属性为 true 时，比如{ label: xxx, disabled: true }，该选项将禁用 | [设置禁用](demo#auto-disable) |
2828
| itemTemplate | `TemplateRef` | -- | 可选，自定义展示模板 | [自定义模板展示](demo#auto-custom) |
2929
| noResultItemTemplate | `TemplateRef` | -- | 可选，没有匹配项的展示结果 | [自定义模板展示](demo#auto-custom) |
3030
| formatter | `(item: any) => string` | [`defaultFormatter`](#defaultformatter) | 可选，格式化函数 | [设置禁用](demo#auto-disable) |

‎devui/auto-complete/doc/api-en.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ In the page
2424
| appendToBodyDirections | `Array<AppendToBodyDirection \| ConnectedPosition>` | `['rightDown','leftDown',`<br>`'rightUp','leftUp']` | Optional. The first position in the array is preferred for the direction array, for details about AppendToBodyDirection and ConnectedPosition, see dropdown | [Customized template display](demo#auto-custom) |
2525
| disabled | `boolean` | false | Optional. Indicating whether to disable commands. | [Disabled](demo#auto-disable) |
2626
| delay | `number` | 300 | Optional. The search is performed only after the delay time elapses and a new value is entered. (`ms`) | [Customized template display](demo#auto-custom) |
27-
| disabledKey | `string` | -- | Optional. Disable a single option. If the input resource source option type is an object, for example, disabled, and the disable attribute of the object is true, for example, {label: xxx, disabled: true}, this option will be disabled | [Disabled](demo#auto-disable) |
27+
| disabledKey | `string` | -- | Optional. Disable a single option. If the input resource source option type is an object, for example, disabled, and the disabled attribute of the object is true, for example, {label: xxx, disabled: true}, this option will be disabled | [Disabled](demo#auto-disable) |
2828
| itemTemplate | `TemplateRef` | -- | Optional. Customized display template | [Customized template display](demo#auto-custom) |
2929
| noResultItemTemplate | `TemplateRef` | -- | Optional. No matching item is displayed. | [Customized template display](demo#auto-custom) |
3030
| formatter | `(item: any) => string` | [`defaultFormatter`](#defaultformatter) | Optional. Formatting function | [Disabled](demo#auto-disable) |

‎devui/breadcrumb/breadcrumb-item/breadcrumb-item.component.scss

+11-9
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
@import '../../style/core/animation';
44

55
.devui-breadcrumb-font-style {
6-
font-size: $devui-font-size;
6+
font-size: $devui-font-size-sm;
77
color: $devui-aide-text;
88
}
99

@@ -41,12 +41,6 @@
4141
svg g path {
4242
fill: $devui-icon-fill;
4343
}
44-
45-
&:hover {
46-
svg g path {
47-
fill: $devui-icon-fill-hover;
48-
}
49-
}
5044
}
5145

5246
.devui-breadcrumb-item-active {
@@ -120,8 +114,16 @@ d-search {
120114
width: 100%;
121115
}
122116

123-
.devui-breadcrumb-item-with-menu .devui-breadcrumb-item {
124-
cursor: pointer;
117+
.devui-breadcrumb-item-with-menu {
118+
.devui-breadcrumb-item {
119+
cursor: pointer;
120+
}
121+
122+
&:hover {
123+
svg g path {
124+
fill: $devui-icon-fill-hover;
125+
}
126+
}
125127
}
126128

127129
.devui-dropdown-open {

‎devui/breadcrumb/breadcrumb.component.scss

+4
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,10 @@
88
::ng-deep d-breadcrumb-item:last-child {
99
& .devui-breadcrumb-item {
1010
color: $devui-text;
11+
12+
a {
13+
color: $devui-text;
14+
}
1115
}
1216

1317
.devui-breadcrumb-separator {

‎devui/breadcrumb/demo/breadcrumb-demo.component.html

+7
Original file line numberDiff line numberDiff line change
@@ -28,4 +28,11 @@
2828
<d-custom demo></d-custom>
2929
</d-codebox>
3030
</div>
31+
<div class="devui-demo-example" [dAnchor]="'click-block-breadcrumbs'">
32+
<div class="devui-demo-title">{{ 'components.breadcrumb.clickBlockDemo.title' | translate }}</div>
33+
<div class="devui-demo-text"></div>
34+
<d-codebox id="components-breadcrumb-click-block" [sourceData]="ClickBlockSource">
35+
<d-click-block demo></d-click-block>
36+
</d-codebox>
37+
</div>
3138
</div>

‎devui/breadcrumb/demo/breadcrumb-demo.component.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,11 @@ export class BreadCrumbDemoComponent implements OnInit, OnDestroy {
2929
{ title: 'TS', language: 'typescript', code: require('./menu/menu.component.ts?raw') },
3030
];
3131

32+
ClickBlockSource: Array<DevuiSourceData> = [
33+
{ title: 'HTML', language: 'xml', code: require('./click-block/click-block.component.html?raw') },
34+
{ title: 'TS', language: 'typescript', code: require('./click-block/click-block.component.ts?raw') },
35+
];
36+
3237
navItems = [];
3338
subs: Subscription = new Subscription();
3439
constructor(private translate: TranslateService) {}
@@ -53,7 +58,8 @@ export class BreadCrumbDemoComponent implements OnInit, OnDestroy {
5358
{ dAnchorLink: 'basic-breadcrumbs', value: values['basic-breadcrumbs'] },
5459
{ dAnchorLink: 'source-config-breadcrumbs', value: values['source-config-breadcrumbs'] },
5560
{ dAnchorLink: 'drop-down-breadcrumbs', value: values['drop-down-breadcrumbs'] },
56-
{ dAnchorLink: 'self-defined-breadcrumbs', value: values['self-defined-breadcrumbs'] }
61+
{ dAnchorLink: 'self-defined-breadcrumbs', value: values['self-defined-breadcrumbs'] },
62+
{ dAnchorLink: 'click-block-breadcrumbs', value: values['click-block-breadcrumbs'] }
5763
];
5864
}
5965

‎devui/breadcrumb/demo/breadcrumb-demo.module.ts

+7-2
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,15 @@ import { NgModule } from '@angular/core';
33
import { FormsModule } from '@angular/forms';
44
import { RouterModule } from '@angular/router';
55
import { BreadcrumbModule } from 'ng-devui/breadcrumb';
6+
import { DropDownModule } from 'ng-devui/dropdown';
67
import { DevUIApiComponent } from 'ng-devui/shared/devui-api/devui-api.component';
78
import { DevUIApiModule } from 'ng-devui/shared/devui-api/devui-api.module';
89
import { DevUICodeboxModule } from 'ng-devui/shared/devui-codebox';
910
import { TranslateModule } from '@ngx-translate/core';
1011
import { DDemoNavModule } from 'devui-commons/src/demo-nav/d-demo-nav.module';
1112
import { BasicComponent } from './basic/basic.component';
1213
import { BreadCrumbDemoComponent } from './breadcrumb-demo.component';
14+
import { ClickBlockComponent } from './click-block/click-block.component';
1315
import { CustomComponent } from './custom/custom.component';
1416
import { MenuComponent } from './menu/menu.component';
1517
import { SourceConfigComponent } from './source-config/source-config.component';
@@ -23,6 +25,7 @@ import { SourceConfigComponent } from './source-config/source-config.component';
2325
DevUICodeboxModule,
2426
DevUIApiModule,
2527
DDemoNavModule,
28+
DropDownModule,
2629
RouterModule.forChild([
2730
{ path: '', redirectTo: 'demo' },
2831
{ path: 'demo', component: BreadCrumbDemoComponent},
@@ -37,14 +40,16 @@ import { SourceConfigComponent } from './source-config/source-config.component';
3740
BasicComponent,
3841
MenuComponent,
3942
CustomComponent,
40-
SourceConfigComponent
43+
SourceConfigComponent,
44+
ClickBlockComponent
4145
],
4246
declarations: [
4347
BreadCrumbDemoComponent,
4448
BasicComponent,
4549
MenuComponent,
4650
CustomComponent,
47-
SourceConfigComponent
51+
SourceConfigComponent,
52+
ClickBlockComponent
4853
]
4954
})
5055
export class BreadCrumbDemoModule { }

‎devui/breadcrumb/demo/click-block/click-block.component.html

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
<d-breadcrumb>
2+
<d-breadcrumb-item *ngFor="let item of breadItem">
3+
<a rel="noopener" (click)="navigate($event, item)">{{ item.name }}</a>
4+
</d-breadcrumb-item>
5+
</d-breadcrumb>

‎devui/breadcrumb/demo/click-block/click-block.component.ts

+80
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
import { Component, OnInit } from '@angular/core';
2+
import { BreadCrumbService, MenuConfig } from 'ng-devui/breadcrumb';
3+
import { HelperUtils } from 'ng-devui/common';
4+
import { DialogService } from 'ng-devui/modal';
5+
6+
@Component({
7+
selector: 'd-click-block',
8+
templateUrl: './click-block.component.html'
9+
})
10+
export class ClickBlockComponent implements OnInit {
11+
12+
constructor(private breadCrumbService: BreadCrumbService, private dialogService: DialogService) { }
13+
14+
ngOnInit() {
15+
}
16+
breadItem: Array<MenuConfig> = [
17+
{
18+
linkType: 'hrefLink',
19+
link: 'https://angular.cn/',
20+
name: 'Home'
21+
},
22+
{
23+
linkType: 'routerLink',
24+
link: './home',
25+
name: 'DevUI'
26+
},
27+
{
28+
linkType: 'routerLink',
29+
link: '/components/zh-cn/button/demo#button-common',
30+
name: 'Profile'
31+
}
32+
];
33+
34+
navigate($event, item) {
35+
this.canNavigate(item).then((can) => {
36+
if (!can) {
37+
return;
38+
}
39+
if(item.linkType === 'routerLink') {
40+
this.breadCrumbService.navigateTo($event, item);
41+
} else {
42+
HelperUtils.jumpOuterUrl(item.link, '_self');
43+
}
44+
});
45+
}
46+
47+
canNavigate(item) {
48+
return new Promise((resolve) => {
49+
const results = this.dialogService.open({
50+
id: 'dialog-service',
51+
width: '300px',
52+
zIndex: 1050,
53+
maxHeight: '600px',
54+
title: 'Router?',
55+
content: `Are you sure to Router to ${item.name}?`,
56+
backdropCloseable: false,
57+
dialogtype: 'standard',
58+
buttons: [
59+
{
60+
cssClass: 'stress',
61+
text: 'Ok',
62+
handler: ($event: Event) => {
63+
results.modalInstance.hide();
64+
resolve(true);
65+
}
66+
},
67+
{
68+
id: 'btn-cancel',
69+
cssClass: 'common',
70+
text: 'Cancel',
71+
handler: ($event: Event) => {
72+
results.modalInstance.hide();
73+
resolve(false);
74+
}
75+
},
76+
]
77+
});
78+
});
79+
}
80+
}

‎devui/breadcrumb/demo/custom/custom.component.html

+24-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
<h4>Use Custom Template</h4>
12
<d-breadcrumb [separatorIcon]="separatorIcon">
23
<d-breadcrumb-item>
34
<a routerLink="/components/zh-cn/get-start">DevUI</a>
@@ -7,7 +8,7 @@
78
</d-breadcrumb-item>
89
</d-breadcrumb>
910
<ng-template #menuTpl>
10-
<div class="breadcrumb-dropdown-menu">
11+
<ul class="breadcrumb-dropdown-menu">
1112
<li>
1213
<span class="icon-arrow-right"></span>
1314
<a href="/components/zh-cn/anchor/demo">Anchor</a>
@@ -16,8 +17,29 @@
1617
<span class="icon-arrow-right"></span>
1718
<a href="/components/zh-cn/button/demo">Button</a>
1819
</li>
19-
</div>
20+
</ul>
2021
</ng-template>
2122
<ng-template #separatorIcon>
2223
<span class="icon-arrow-right"></span>
2324
</ng-template>
25+
26+
<h4>Use Custom Dropdown Behavior</h4>
27+
<d-breadcrumb>
28+
<ng-container *ngFor="let item of breadData">
29+
<d-breadcrumb-item dDropDown #dropdownInstance="d-dropdown" [disabled]="!item.showMenu">
30+
<a [href]="item.link" dDropDownToggle>
31+
<span>{{ item.label }}</span>
32+
<i
33+
*ngIf="item.showMenu"
34+
class="icon icon-select-arrow devui-icon-rotate"
35+
[style.transform]="dropdownInstance?.isOpen ? 'rotate(180deg)' : 'rotate(0deg)'"
36+
></i>
37+
</a>
38+
<ul dDropDownMenu>
39+
<li *ngFor="let option of item.menuList">
40+
<a [href]="option.link">{{ option.name }}</a>
41+
</li>
42+
</ul>
43+
</d-breadcrumb-item>
44+
</ng-container>
45+
</d-breadcrumb>

0 commit comments

Comments
 (0)