(#35)Add mask modular event.

This commit is contained in:
MrKBear 2022-01-21 10:37:40 +08:00
parent 96b3414d22
commit 58d8d74158
2 changed files with 70 additions and 12 deletions

View File

@ -1,6 +1,35 @@
import { Modular, Manager } from "../../core/Module";
class Mask<M extends Manager> extends Modular<M> {
/**
*
*/
type IMaskEvent = {
/**
*
*/
show: void;
/**
*
*/
hide: void;
/**
*
*/
change: boolean;
/**
*
*/
click: void;
}
/**
* Modular
*/
class Mask<M extends Manager> extends Modular<M, {}, IMaskEvent> {
/**
*
@ -25,22 +54,41 @@ class Mask<M extends Manager> extends Modular<M> {
isShow: false
};
/**
*
*/
public autoCloseOnClick: boolean = true;
/**
*
*/
private disappearTimer?: number;
public override onLoad() {
this.setFunc(this.handleClickMask, "handleClickMask");
this.on("show", this.showMask);
this.on("hide", this.hideMask);
}
/**
*
*/
public showMask() {
private showMask = () => {
this.disappearTimer && clearTimeout(this.disappearTimer);
this.setData({
isShow: true,
isDisplay: true
});
this.emit("change", true);
}
/**
*
*/
public hideMask() {
private hideMask = () => {
this.setData({
isShow: false
});
@ -50,15 +98,16 @@ class Mask<M extends Manager> extends Modular<M> {
isDisplay: false
});
}, Mask.animateTime);
}
public override onLoad() {
this.setFunc(this.handleClickMask, "handleClickMask");
// Do something
}
this.emit("change", false);
}
/**
*
*/
private handleClickMask() {
this.hideMask();
if (this.autoCloseOnClick) this.emit("hide", void 0);
this.emit("click", void 0);
}
}

View File

@ -5,7 +5,15 @@ type IUserCardDependent<M extends Manager> = {
mask: Mask<M>
}
class UserCard<M extends Manager> extends Modular<M, IUserCardDependent<M>> {
type IUserCardEvent = {
/**
*
*/
clickChangeTheme: void;
}
class UserCard<M extends Manager> extends Modular<M, IUserCardDependent<M>, IUserCardEvent> {
public override onLoad() {
this.setFunc(this.handleChangeTheme, "changeTheme")
@ -15,7 +23,8 @@ class UserCard<M extends Manager> extends Modular<M, IUserCardDependent<M>> {
*
*/
private handleChangeTheme() {
this.depends?.mask.showMask();
this.depends?.mask.emit("show", void 0);
this.emit("clickChangeTheme", void 0);
}
}