UNPKG

@duoduo-oba/ng-devui

Version:

DevUI components based on Angular

275 lines (269 loc) 12.8 kB
(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('ng-devui/auto-complete'), require('ng-devui/i18n'), require('@angular/common'), require('ng-devui/position')) : typeof define === 'function' && define.amd ? define('ng-devui/editable-select', ['exports', '@angular/core', '@angular/forms', 'ng-devui/auto-complete', 'ng-devui/i18n', '@angular/common', 'ng-devui/position'], factory) : (global = global || self, factory((global['ng-devui'] = global['ng-devui'] || {}, global['ng-devui']['editable-select'] = {}), global.ng.core, global.ng.forms, global['ng-devui']['auto-complete'], global['ng-devui'].i18n, global.ng.common, global['ng-devui'].position)); }(this, (function (exports, core, forms, autoComplete, i18n, common, position) { 'use strict'; /** * @fileoverview added by tsickle * Generated from: editable-select.component.ts * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var EditableSelectComponent = /** @class */ (function () { function EditableSelectComponent(changeDetectorRef, i18n) { this.changeDetectorRef = changeDetectorRef; this.i18n = i18n; this.disabled = false; this.placeholder = ''; this.enableLazyLoad = false; this.loadMore = new core.EventEmitter(); this.multiItems = []; this.onChange = (/** * @param {?} _ * @return {?} */ function (_) { return null; }); this.onTouched = (/** * @return {?} */ function () { return null; }); this.i18nCommonText = this.i18n.getI18nText().common; } /** * @param {?} obj * @return {?} */ EditableSelectComponent.prototype.writeValue = /** * @param {?} obj * @return {?} */ function (obj) { /** @type {?} */ var value = obj || ''; this.inputValue = value; this.changeDetectorRef.markForCheck(); }; /** * @return {?} */ EditableSelectComponent.prototype.ngOnInit = /** * @return {?} */ function () { var _this = this; this.i18nSubscription = this.i18n.langChange().subscribe((/** * @param {?} data * @return {?} */ function (data) { _this.i18nCommonText = data.common; })); }; /** * @param {?} changes * @return {?} */ EditableSelectComponent.prototype.ngOnChanges = /** * @param {?} changes * @return {?} */ function (changes) { var _this = this; if (changes && changes['searchFn'] && typeof this.searchFn === 'function') { if (this.subscription) { this.subscription.unsubscribe(); } this.subscription = this.searchFn('').subscribe((/** * @param {?} source * @return {?} */ function (source) { _this.source = source; })); } }; /** * @param {?} fn * @return {?} */ EditableSelectComponent.prototype.registerOnChange = /** * @param {?} fn * @return {?} */ function (fn) { this.onChange = fn; }; /** * @param {?} fn * @return {?} */ EditableSelectComponent.prototype.registerOnTouched = /** * @param {?} fn * @return {?} */ function (fn) { this.onTouched = fn; }; /** * @param {?} value * @return {?} */ EditableSelectComponent.prototype.onTermChange = /** * @param {?} value * @return {?} */ function (value) { this.inputValue = value; this.onChange(this.inputValue); }; /** * @param {?} $event * @return {?} */ EditableSelectComponent.prototype.toggle = /** * @param {?} $event * @return {?} */ function ($event) { this.autoCompleteDirective.popupRef.instance.isOpen = !this.autoCompleteDirective.popupRef.instance.isOpen; }; /** * @param {?} $event * @return {?} */ EditableSelectComponent.prototype.loadMoreEvent = /** * @param {?} $event * @return {?} */ function ($event) { this.loadMore.emit($event); }; /** * @return {?} */ EditableSelectComponent.prototype.ngOnDestroy = /** * @return {?} */ function () { if (this.i18nSubscription) { this.i18nSubscription.unsubscribe(); } }; EditableSelectComponent.decorators = [ { type: core.Component, args: [{ selector: 'd-editable-select', template: "<div\r\n class=\"devui-form-group devui-has-feedback\"\r\n [style.padding-bottom.px]=\"2\"\r\n [style.padding-bottom.px]=\"2\"\r\n [ngClass]=\"{\r\n 'devui-select-open': autoCompleteDirective.popupRef ? !!autoCompleteDirective.popupRef.instance.isOpen : false\r\n }\"\r\n>\r\n <input\r\n (click)=\"toggle($event)\"\r\n style=\"cursor: pointer\"\r\n class=\"devui-form-control\"\r\n type=\"text\"\r\n name=\"autoCompleteControl\"\r\n [source]=\"source\"\r\n (ngModelChange)=\"onTermChange($event)\"\r\n [ngModel]=\"inputValue\"\r\n [searchFn]=\"searchFn\"\r\n [disabled]=\"disabled\"\r\n [disabledKey]=\"disabledKey\"\r\n [placeholder]=\"placeholder\"\r\n [itemTemplate]=\"itemTemplate\"\r\n [noResultItemTemplate]=\"noResultItemTemplate ? noResultItemTemplate : noDataTemplate\"\r\n [maxHeight]=\"maxHeight\"\r\n [sceneType]=\"'select'\"\r\n dAutoComplete\r\n [enableLazyLoad]=\"enableLazyLoad\"\r\n (loadMore)=\"loadMoreEvent($event)\"\r\n />\r\n <span class=\"devui-form-control-feedback\">\r\n <span class=\"devui-select-chevron-icon\">\r\n <svg\r\n width=\"16px\"\r\n height=\"16px\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g id=\"chevron_down\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <polygon id=\"chevron_down\" points=\"4.5 5 8 8.76923077 11.5 5 13 6.61538462 8 12 3 6.61538462\"></polygon>\r\n </g>\r\n </svg>\r\n </span>\r\n </span>\r\n</div>\r\n<ng-template #noDataTemplate>\r\n <div class=\"devui-no-data-tip\">\r\n <ng-container *ngIf=\"!inputValue\">{{ i18nCommonText?.noData }}</ng-container>\r\n <ng-container *ngIf=\"inputValue\">{{ i18nCommonText?.noRecordsFound }}</ng-container>\r\n </div>\r\n</ng-template>\r\n", exportAs: 'editable-select', providers: [{ provide: forms.NG_VALUE_ACCESSOR, useExisting: core.forwardRef((/** * @return {?} */ function () { return EditableSelectComponent; })), multi: true }], styles: [".devui-select-chevron-icon{display:-webkit-inline-box;display:inline-flex;vertical-align:middle;-webkit-transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s}.devui-select-open .devui-select-chevron-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.devui-select-chevron-icon svg>g>polygon{fill:#252b3a}input::-ms-clear{display:none}.devui-no-data-tip{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:not-allowed;padding:5px 12px;opacity:.3}.devui-form-control{outline:0}"] }] } ]; /** @nocollapse */ EditableSelectComponent.ctorParameters = function () { return [ { type: core.ChangeDetectorRef }, { type: i18n.I18nService } ]; }; EditableSelectComponent.propDecorators = { cssClass: [{ type: core.Input }], disabled: [{ type: core.Input }], placeholder: [{ type: core.Input }], source: [{ type: core.Input }], isOpen: [{ type: core.Input }], itemTemplate: [{ type: core.Input }], noResultItemTemplate: [{ type: core.Input }], maxHeight: [{ type: core.Input }], disabledKey: [{ type: core.Input }], searchFn: [{ type: core.Input }], enableLazyLoad: [{ type: core.Input }], loadMore: [{ type: core.Output }], autoCompleteDirective: [{ type: core.ViewChild, args: [autoComplete.AutoCompleteDirective, { static: true },] }] }; return EditableSelectComponent; }()); if (false) { /** @type {?} */ EditableSelectComponent.prototype.cssClass; /** @type {?} */ EditableSelectComponent.prototype.disabled; /** @type {?} */ EditableSelectComponent.prototype.placeholder; /** @type {?} */ EditableSelectComponent.prototype.source; /** @type {?} */ EditableSelectComponent.prototype.isOpen; /** @type {?} */ EditableSelectComponent.prototype.itemTemplate; /** @type {?} */ EditableSelectComponent.prototype.noResultItemTemplate; /** @type {?} */ EditableSelectComponent.prototype.maxHeight; /** @type {?} */ EditableSelectComponent.prototype.disabledKey; /** @type {?} */ EditableSelectComponent.prototype.searchFn; /** @type {?} */ EditableSelectComponent.prototype.enableLazyLoad; /** @type {?} */ EditableSelectComponent.prototype.loadMore; /** @type {?} */ EditableSelectComponent.prototype.autoCompleteDirective; /** @type {?} */ EditableSelectComponent.prototype.multiItems; /** @type {?} */ EditableSelectComponent.prototype.inputValue; /** @type {?} */ EditableSelectComponent.prototype.subscription; /** @type {?} */ EditableSelectComponent.prototype.i18nCommonText; /** @type {?} */ EditableSelectComponent.prototype.i18nSubscription; /** * @type {?} * @private */ EditableSelectComponent.prototype.onChange; /** * @type {?} * @private */ EditableSelectComponent.prototype.onTouched; /** * @type {?} * @private */ EditableSelectComponent.prototype.changeDetectorRef; /** * @type {?} * @private */ EditableSelectComponent.prototype.i18n; } /** * @fileoverview added by tsickle * Generated from: editable-select.module.ts * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var EditableSelectModule = /** @class */ (function () { function EditableSelectModule() { } EditableSelectModule.decorators = [ { type: core.NgModule, args: [{ imports: [common.CommonModule, forms.FormsModule, autoComplete.AutoCompleteModule, position.PositioningModule], exports: [EditableSelectComponent], declarations: [EditableSelectComponent], entryComponents: [EditableSelectComponent] },] } ]; return EditableSelectModule; }()); exports.EditableSelectComponent = EditableSelectComponent; exports.EditableSelectModule = EditableSelectModule; Object.defineProperty(exports, '__esModule', { value: true }); }))); //# sourceMappingURL=ng-devui-editable-select.umd.js.map