ngx-pluto
Version:
169 lines • 12.8 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, ViewEncapsulation, Input, Output, EventEmitter, forwardRef, ChangeDetectorRef } from "@angular/core";
import { NG_VALUE_ACCESSOR } from "@angular/forms";
/**
* 复选框
*
* <example-url>https://stackblitz.com/edit/np-checkbox-sample?embed=1&file=src/app/app.component.html</example-url>
*/
export class NpCheckbox {
/**
* @param {?} cdf
*/
constructor(cdf) {
this.cdf = cdf;
/**
* 是否禁用复选框
*/
this.isDisabled = false;
/**
* 当复选框选中状态改变时，触发此事件
*/
this.inputModelChange = new EventEmitter();
this.emitChange = (/**
* @param {?} _
* @return {?}
*/
(_) => { });
}
/**
* @return {?}
*/
get ischecked() {
if (this.trueValue || this.falseValue) {
if (this.val === this.trueValue) {
return true;
}
if (this.val === this.falseValue) {
return false;
}
}
else {
return this.val ? true : false;
}
}
/**
* @return {?}
*/
ngOnInit() {
// 转换下传入的值
this.forbiddenColor = this.forbiddenColor !== undefined ? true : false;
}
/**
* @param {?} e
* @return {?}
*/
onChange(e) {
e.stopPropagation();
e.preventDefault();
if (this.forbiddenColor || this.isDisabled) {
return;
}
if (this.ischecked) {
this.val = this.falseValue || false;
this.emitChange(this.val);
this.inputModelChange.emit(this.val);
return;
}
if (!this.ischecked) {
this.val = this.trueValue || true;
this.emitChange(this.val);
this.inputModelChange.emit(this.val);
return;
}
}
/**
* @param {?} obj
* @return {?}
*/
writeValue(obj) {
if (obj !== undefined) {
this.val = obj;
this.emitChange(this.val);
}
}
/**
* @param {?} fn
* @return {?}
*/
registerOnChange(fn) {
this.emitChange = fn;
}
/**
* @param {?} fn
* @return {?}
*/
registerOnTouched(fn) { }
}
NpCheckbox.decorators = [
{ type: Component, args: [{
selector: `np-checkbox`,
template: "<div class=\"np-checkbox-button-wrapper\" ngDefaultControl [(ngModel)]=\"val\" (click)=\"onChange($event)\"\r\n [ngStyle]=\"{'cursor': (forbiddenColor || isDisabled)? 'not-allowed':'pointer'}\">\r\n <span class=\"checkbox\" [class.checkbox-checked]=\"ischecked\"\r\n [class.checkbox-forbiddenColor]=\"forbiddenColor || isDisabled\"></span>\r\n <span class=\"input-helper\" [class.checkbox-forbiddenColor]=\"forbiddenColor || isDisabled\"></span>\r\n <span style=\"line-height: 28px;\">\r\n <ng-content></ng-content>\r\n </span>\r\n</div>\r\n",
encapsulation: ViewEncapsulation.None,
providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef((/**
* @return {?}
*/
() => NpCheckbox)),
multi: true,
}
],
styles: [".flex-wrap{display:flex}.col-flex{flex-direction:column}.row-flex{flex-direction:row}.middle-flex{justify-content:center;align-items:center}.np-row{display:flex;flex-direction:row;flex-wrap:wrap;width:100%}.np-column{display:flex;flex-direction:column;flex-basis:100%;flex:1}.backdrop-transparent{opacity:0}.np-checkbox-button-wrapper{font-size:14px;padding-left:25px;position:relative;font-weight:400;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;align-items:baseline}.np-checkbox-button-wrapper .checkbox{opacity:0;z-index:1;left:1px;top:1px;position:absolute;width:14px;height:14px;margin:0;display:block}.np-checkbox-button-wrapper .checkbox.checkbox-checked+span::after{position:absolute;content:'';width:12px;height:12px;top:1px;left:1px;border-radius:4px}.np-checkbox-button-wrapper span.input-helper{position:absolute;left:2px;top:6px;width:16px;height:16px;box-sizing:border-box}.np-checkbox-button-wrapper .checkbox+span.input-helper{border-radius:4px}"]
}] }
];
/** @nocollapse */
NpCheckbox.ctorParameters = () => [
{ type: ChangeDetectorRef }
];
NpCheckbox.propDecorators = {
trueValue: [{ type: Input }],
falseValue: [{ type: Input }],
forbiddenColor: [{ type: Input }],
isDisabled: [{ type: Input }],
inputModelChange: [{ type: Output }]
};
if (false) {
/** @type {?} */
NpCheckbox.prototype.val;
/**
* 复选框选中后的值由默认布尔的true改为此值。
* @type {?}
*/
NpCheckbox.prototype.trueValue;
/**
* 复选框选中后的值由默认布尔的false改为此值。
* @type {?}
*/
NpCheckbox.prototype.falseValue;
/**
* 设置此变量后，复选框颜色变为灰色，类似禁用的颜色
* @type {?}
*/
NpCheckbox.prototype.forbiddenColor;
/**
* 是否禁用复选框
* @type {?}
*/
NpCheckbox.prototype.isDisabled;
/**
* 当复选框选中状态改变时，触发此事件
* @type {?}
*/
NpCheckbox.prototype.inputModelChange;
/**
* @type {?}
* @private
*/
NpCheckbox.prototype.emitChange;
/**
* @type {?}
* @private
*/
NpCheckbox.prototype.cdf;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3guY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vbmd4LXBsdXRvLyIsInNvdXJjZXMiOlsibGliL2NoZWNrYm94L2NoZWNrYm94LmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxpQkFBaUIsRUFBMkIsS0FBSyxFQUFVLE1BQU0sRUFBRSxZQUFZLEVBQUUsVUFBVSxFQUE0QixpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNwTCxPQUFPLEVBQUUsaUJBQWlCLEVBQXdCLE1BQU0sZ0JBQWdCLENBQUM7Ozs7OztBQW9CekUsTUFBTSxPQUFPLFVBQVU7Ozs7SUE0QnJCLFlBQW9CLEdBQXNCO1FBQXRCLFFBQUcsR0FBSCxHQUFHLENBQW1COzs7O1FBbkJqQyxlQUFVLEdBQUcsS0FBSyxDQUFDOzs7O1FBRWxCLHFCQUFnQixHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7UUFleEMsZUFBVTs7OztRQUFhLENBQUMsQ0FBTSxFQUFFLEVBQUUsR0FBRyxDQUFDLEVBQUM7SUFFRCxDQUFDOzs7O0lBZi9DLElBQUksU0FBUztRQUNYLElBQUksSUFBSSxDQUFDLFNBQVMsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQ3JDLElBQUksSUFBSSxDQUFDLEdBQUcsS0FBSyxJQUFJLENBQUMsU0FBUyxFQUFFO2dCQUMvQixPQUFPLElBQUksQ0FBQzthQUNiO1lBQ0QsSUFBSSxJQUFJLENBQUMsR0FBRyxLQUFLLElBQUksQ0FBQyxVQUFVLEVBQUU7Z0JBQ2hDLE9BQU8sS0FBSyxDQUFDO2FBQ2Q7U0FDRjthQUFNO1lBQ0wsT0FBTyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQztTQUNoQztJQUNILENBQUM7Ozs7SUFNRCxRQUFRO1FBQ04sVUFBVTtRQUNWLElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDLGNBQWMsS0FBSyxTQUFTLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDO0lBQ3pFLENBQUM7Ozs7O0lBRUQsUUFBUSxDQUFDLENBQU07UUFDYixDQUFDLENBQUMsZUFBZSxFQUFFLENBQUM7UUFDcEIsQ0FBQyxDQUFDLGNBQWMsRUFBRSxDQUFDO1FBQ25CLElBQUksSUFBSSxDQUFDLGNBQWMsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQzFDLE9BQU87U0FDUjtRQUVELElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUNsQixJQUFJLENBQUMsR0FBRyxHQUFHLElBQUksQ0FBQyxVQUFVLElBQUksS0FBSyxDQUFDO1lBQ3BDLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO1lBQzFCLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO1lBQ3JDLE9BQU87U0FDUjtRQUVELElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxFQUFFO1lBQ25CLElBQUksQ0FBQyxHQUFHLEdBQUcsSUFBSSxDQUFDLFNBQVMsSUFBSSxJQUFJLENBQUM7WUFDbEMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7WUFDMUIsSUFBSSxDQUFDLGdCQUFnQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7WUFDckMsT0FBTztTQUNSO0lBQ0gsQ0FBQzs7Ozs7SUFFRCxVQUFVLENBQUMsR0FBUTtRQUNqQixJQUFJLEdBQUcsS0FBSyxTQUFTLEVBQUU7WUFDckIsSUFBSSxDQUFDLEdBQUcsR0FBRyxHQUFHLENBQUM7WUFDZixJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztTQUMzQjtJQUNILENBQUM7Ozs7O0lBRUQsZ0JBQWdCLENBQUMsRUFBTztRQUN0QixJQUFJLENBQUMsVUFBVSxHQUFHLEVBQUUsQ0FBQztJQUN2QixDQUFDOzs7OztJQUVELGlCQUFpQixDQUFDLEVBQU8sSUFBVSxDQUFDOzs7WUFqRnJDLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsYUFBYTtnQkFDdkIsb2pCQUFzQztnQkFFdEMsYUFBYSxFQUFFLGlCQUFpQixDQUFDLElBQUk7Z0JBQ3JDLFNBQVMsRUFBRTtvQkFDVDt3QkFDRSxPQUFPLEVBQUUsaUJBQWlCO3dCQUMxQixXQUFXLEVBQUUsVUFBVTs7O3dCQUFDLEdBQUcsRUFBRSxDQUFDLFVBQVUsRUFBQzt3QkFDekMsS0FBSyxFQUFFLElBQUk7cUJBQ1o7aUJBQUM7O2FBQ0w7Ozs7WUFuQjBJLGlCQUFpQjs7O3dCQXdCekosS0FBSzt5QkFFTCxLQUFLOzZCQUVMLEtBQUs7eUJBRUwsS0FBSzsrQkFFTCxNQUFNOzs7O0lBVlAseUJBQXNCOzs7OztJQUV0QiwrQkFBd0I7Ozs7O0lBRXhCLGdDQUF5Qjs7Ozs7SUFFekIsb0NBQWlDOzs7OztJQUVqQyxnQ0FBNEI7Ozs7O0lBRTVCLHNDQUFnRDs7Ozs7SUFlaEQsZ0NBQStDOzs7OztJQUVuQyx5QkFBOEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIFZpZXdFbmNhcHN1bGF0aW9uLCBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIsIGZvcndhcmRSZWYsIFNpbXBsZUNoYW5nZXMsIE9uQ2hhbmdlcywgQ2hhbmdlRGV0ZWN0b3JSZWYgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xyXG5pbXBvcnQgeyBOR19WQUxVRV9BQ0NFU1NPUiwgQ29udHJvbFZhbHVlQWNjZXNzb3IgfSBmcm9tIFwiQGFuZ3VsYXIvZm9ybXNcIjtcclxuXHJcbi8qKlxyXG4gKiDlpI3pgInmoYZcclxuICogXHJcbiAqIDxleGFtcGxlLXVybD5odHRwczovL3N0YWNrYmxpdHouY29tL2VkaXQvbnAtY2hlY2tib3gtc2FtcGxlP2VtYmVkPTEmZmlsZT1zcmMvYXBwL2FwcC5jb21wb25lbnQuaHRtbDwvZXhhbXBsZS11cmw+XHJcbiAqL1xyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogYG5wLWNoZWNrYm94YCxcclxuICB0ZW1wbGF0ZVVybDogJ2NoZWNrYm94LmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnY2hlY2tib3guY29tcG9uZW50LnNjc3MnXSxcclxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxyXG4gIHByb3ZpZGVyczogW1xyXG4gICAge1xyXG4gICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcclxuICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gTnBDaGVja2JveCksXHJcbiAgICAgIG11bHRpOiB0cnVlLFxyXG4gICAgfV1cclxufSlcclxuXHJcbmV4cG9ydCBjbGFzcyBOcENoZWNrYm94IGltcGxlbWVudHMgT25Jbml0LCBDb250cm9sVmFsdWVBY2Nlc3NvciB7XHJcbiAgdmFsOiBzdHJpbmcgfCBib29sZWFuO1xyXG4gIC8qKuWkjemAieahhumAieS4reWQjueahOWAvOeUsem7mOiupOW4g+WwlOeahHRydWXmlLnkuLrmraTlgLzjgIIgKi9cclxuICBASW5wdXQoKSB0cnVlVmFsdWU6IGFueTtcclxuICAvKirlpI3pgInmoYbpgInkuK3lkI7nmoTlgLznlLHpu5jorqTluIPlsJTnmoRmYWxzZeaUueS4uuatpOWAvOOAgiAqL1xyXG4gIEBJbnB1dCgpIGZhbHNlVmFsdWU6IGFueTtcclxuICAvKirorr7nva7mraTlj5jph4/lkI7vvIzlpI3pgInmoYbpopzoibLlj5jkuLrngbDoibLvvIznsbvkvLznpoHnlKjnmoTpopzoibIgKi9cclxuICBASW5wdXQoKSBmb3JiaWRkZW5Db2xvcjogYm9vbGVhbjtcclxuICAvKirmmK/lkKbnpoHnlKjlpI3pgInmoYYgKi9cclxuICBASW5wdXQoKSBpc0Rpc2FibGVkID0gZmFsc2U7XHJcbiAgLyoq5b2T5aSN6YCJ5qGG6YCJ5Lit54q25oCB5pS55Y+Y5pe277yM6Kem5Y+R5q2k5LqL5Lu2ICovXHJcbiAgQE91dHB1dCgpIGlucHV0TW9kZWxDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XHJcblxyXG4gIGdldCBpc2NoZWNrZWQoKTogYm9vbGVhbiB7XHJcbiAgICBpZiAodGhpcy50cnVlVmFsdWUgfHwgdGhpcy5mYWxzZVZhbHVlKSB7XHJcbiAgICAgIGlmICh0aGlzLnZhbCA9PT0gdGhpcy50cnVlVmFsdWUpIHtcclxuICAgICAgICByZXR1cm4gdHJ1ZTtcclxuICAgICAgfVxyXG4gICAgICBpZiAodGhpcy52YWwgPT09IHRoaXMuZmFsc2VWYWx1ZSkge1xyXG4gICAgICAgIHJldHVybiBmYWxzZTtcclxuICAgICAgfVxyXG4gICAgfSBlbHNlIHtcclxuICAgICAgcmV0dXJuIHRoaXMudmFsID8gdHJ1ZSA6IGZhbHNlO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSBlbWl0Q2hhbmdlOiBGdW5jdGlvbiA9IChfOiBhbnkpID0+IHsgfTtcclxuXHJcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBjZGY6IENoYW5nZURldGVjdG9yUmVmKSB7IH1cclxuXHJcbiAgbmdPbkluaXQoKSB7XHJcbiAgICAvLyDovazmjaLkuIvkvKDlhaXnmoTlgLxcclxuICAgIHRoaXMuZm9yYmlkZGVuQ29sb3IgPSB0aGlzLmZvcmJpZGRlbkNvbG9yICE9PSB1bmRlZmluZWQgPyB0cnVlIDogZmFsc2U7XHJcbiAgfVxyXG5cclxuICBvbkNoYW5nZShlOiBhbnkpIHtcclxuICAgIGUuc3RvcFByb3BhZ2F0aW9uKCk7XHJcbiAgICBlLnByZXZlbnREZWZhdWx0KCk7XHJcbiAgICBpZiAodGhpcy5mb3JiaWRkZW5Db2xvciB8fCB0aGlzLmlzRGlzYWJsZWQpIHtcclxuICAgICAgcmV0dXJuO1xyXG4gICAgfVxyXG5cclxuICAgIGlmICh0aGlzLmlzY2hlY2tlZCkge1xyXG4gICAgICB0aGlzLnZhbCA9IHRoaXMuZmFsc2VWYWx1ZSB8fCBmYWxzZTtcclxuICAgICAgdGhpcy5lbWl0Q2hhbmdlKHRoaXMudmFsKTtcclxuICAgICAgdGhpcy5pbnB1dE1vZGVsQ2hhbmdlLmVtaXQodGhpcy52YWwpO1xyXG4gICAgICByZXR1cm47XHJcbiAgICB9XHJcblxyXG4gICAgaWYgKCF0aGlzLmlzY2hlY2tlZCkge1xyXG4gICAgICB0aGlzLnZhbCA9IHRoaXMudHJ1ZVZhbHVlIHx8IHRydWU7XHJcbiAgICAgIHRoaXMuZW1pdENoYW5nZSh0aGlzLnZhbCk7XHJcbiAgICAgIHRoaXMuaW5wdXRNb2RlbENoYW5nZS5lbWl0KHRoaXMudmFsKTtcclxuICAgICAgcmV0dXJuO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgd3JpdGVWYWx1ZShvYmo6IGFueSk6IHZvaWQge1xyXG4gICAgaWYgKG9iaiAhPT0gdW5kZWZpbmVkKSB7XHJcbiAgICAgIHRoaXMudmFsID0gb2JqO1xyXG4gICAgICB0aGlzLmVtaXRDaGFuZ2UodGhpcy52YWwpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgcmVnaXN0ZXJPbkNoYW5nZShmbjogYW55KTogdm9pZCB7XHJcbiAgICB0aGlzLmVtaXRDaGFuZ2UgPSBmbjtcclxuICB9XHJcblxyXG4gIHJlZ2lzdGVyT25Ub3VjaGVkKGZuOiBhbnkpOiB2b2lkIHsgfVxyXG59XHJcblxyXG5cclxuIl19