mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 12:29:55 +08:00
refactor(action-sheet): adds proper TS types
This commit is contained in:
@ -1,5 +1,6 @@
|
||||
import { Component, ElementRef, HostListener, Renderer, ViewEncapsulation } from '@angular/core';
|
||||
|
||||
import { ActionSheetOptions, ActionSheetButton } from './action-sheet-options';
|
||||
import { assert } from '../../util/util';
|
||||
import { BlockerDelegate, GestureController, BLOCK_ALL } from '../../gestures/gesture-controller';
|
||||
import { Config } from '../../config/config';
|
||||
@ -26,10 +27,10 @@ import { ViewController } from '../../navigation/view-controller';
|
||||
'{{b.text}}' +
|
||||
'</button>' +
|
||||
'</div>' +
|
||||
'<div class="action-sheet-group" *ngIf="d.cancelButton">' +
|
||||
'<button ion-button="action-sheet-button" (click)="click(d.cancelButton)" class="action-sheet-cancel disable-hover" [attr.icon-left]="d.cancelButton.icon ? \'\' : null" [ngClass]="d.cancelButton.cssClass">' +
|
||||
'<ion-icon [name]="d.cancelButton.icon" *ngIf="d.cancelButton.icon" class="action-sheet-icon"></ion-icon>' +
|
||||
'{{d.cancelButton.text}}' +
|
||||
'<div class="action-sheet-group" *ngIf="cancelButton">' +
|
||||
'<button ion-button="action-sheet-button" (click)="click(cancelButton)" class="action-sheet-cancel disable-hover" [attr.icon-left]="cancelButton.icon ? \'\' : null" [ngClass]="cancelButton.cssClass">' +
|
||||
'<ion-icon [name]="cancelButton.icon" *ngIf="cancelButton.icon" class="action-sheet-icon"></ion-icon>' +
|
||||
'{{cancelButton.text}}' +
|
||||
'</button>' +
|
||||
'</div>' +
|
||||
'</div>' +
|
||||
@ -41,15 +42,11 @@ import { ViewController } from '../../navigation/view-controller';
|
||||
},
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
})
|
||||
|
||||
export class ActionSheetCmp {
|
||||
d: {
|
||||
title?: string;
|
||||
subTitle?: string;
|
||||
cssClass?: string;
|
||||
buttons?: Array<any>;
|
||||
enableBackdropDismiss?: boolean;
|
||||
cancelButton: any;
|
||||
};
|
||||
|
||||
d: ActionSheetOptions;
|
||||
cancelButton: ActionSheetButton;
|
||||
descId: string;
|
||||
enabled: boolean;
|
||||
hdrId: string;
|
||||
@ -89,30 +86,26 @@ export class ActionSheetCmp {
|
||||
|
||||
ionViewDidLoad() {
|
||||
// normalize the data
|
||||
let buttons: any[] = [];
|
||||
|
||||
this.d.buttons.forEach((button: any) => {
|
||||
this.d.buttons = this.d.buttons.map(button => {
|
||||
if (typeof button === 'string') {
|
||||
button = { text: button };
|
||||
}
|
||||
if (!button.cssClass) {
|
||||
button.cssClass = '';
|
||||
}
|
||||
|
||||
if (button.role === 'cancel') {
|
||||
this.d.cancelButton = button;
|
||||
|
||||
} else {
|
||||
if (button.role === 'destructive') {
|
||||
switch (button.role) {
|
||||
case 'cancel':
|
||||
this.cancelButton = button;
|
||||
return null;
|
||||
case 'destructive':
|
||||
button.cssClass = (button.cssClass + ' ' || '') + 'action-sheet-destructive';
|
||||
} else if (button.role === 'selected') {
|
||||
break;
|
||||
case 'selected':
|
||||
button.cssClass = (button.cssClass + ' ' || '') + 'action-sheet-selected';
|
||||
}
|
||||
buttons.push(button);
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
this.d.buttons = buttons;
|
||||
return button;
|
||||
}).filter(button => button !== null);
|
||||
}
|
||||
|
||||
ionViewWillEnter() {
|
||||
@ -141,7 +134,7 @@ export class ActionSheetCmp {
|
||||
}
|
||||
}
|
||||
|
||||
click(button: any) {
|
||||
click(button: ActionSheetButton) {
|
||||
if (!this.enabled) {
|
||||
return;
|
||||
}
|
||||
@ -163,8 +156,8 @@ export class ActionSheetCmp {
|
||||
|
||||
bdClick() {
|
||||
if (this.enabled && this.d.enableBackdropDismiss) {
|
||||
if (this.d.cancelButton) {
|
||||
this.click(this.d.cancelButton);
|
||||
if (this.cancelButton) {
|
||||
this.click(this.cancelButton);
|
||||
|
||||
} else {
|
||||
this.dismiss('backdrop');
|
||||
@ -172,7 +165,7 @@ export class ActionSheetCmp {
|
||||
}
|
||||
}
|
||||
|
||||
dismiss(role: any): Promise<any> {
|
||||
dismiss(role: string): Promise<any> {
|
||||
const opts: NavOptions = {
|
||||
minClickBlockDuration: 400
|
||||
};
|
||||
@ -181,7 +174,7 @@ export class ActionSheetCmp {
|
||||
|
||||
ngOnDestroy() {
|
||||
assert(this.gestureBlocker.blocked === false, 'gesture blocker must be already unblocked');
|
||||
this.d = null;
|
||||
this.d = this.cancelButton = null;
|
||||
this.gestureBlocker.destroy();
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user