ngx-academia-uniandes-library
Version:
This library is used for Academia-Uniandes system.
51 lines • 9.3 kB
JavaScript
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var combo_box_1 = require("../../../../combo-box/combo-box");
var combo_box_modeldata_1 = require("../../../../combo-box/model-data/combo-box.modeldata");
var api_1 = require("api-angular-academia-dto/api");
var DependencyOptionComboboxComponent = /** @class */ (function (_super) {
__extends(DependencyOptionComboboxComponent, _super);
function DependencyOptionComboboxComponent() {
return _super.call(this) || this;
}
DependencyOptionComboboxComponent.prototype.setData = function () {
var _this = this;
this.data = [];
var bruteData = api_1.Academia_Dependency_Option.getAllEnumValues();
this.selectionParamsBeforeReset();
bruteData.forEach(function (element) {
var nmodeldata = new combo_box_modeldata_1.ComboBoxModelData(false, false, true, element.nameid, element);
_this.data.push(nmodeldata);
});
this.selectionParamsAfterReset();
};
DependencyOptionComboboxComponent.prototype.ngOnInit = function () {
this.setData();
};
DependencyOptionComboboxComponent.decorators = [
{ type: core_1.Component, args: [{
selector: 'app-dependency-option-combobox',
template: "\n <ng-template [ngIf]=\"(compact && !multiSelect)\">\n <div>\n <select [disabled]=\"disabled\" id=\"combobox1\" class=\"combobox form-control\" [(ngModel)]=\"selectedSingle\" (change)=\"onSelectionChange()\">\n <option [(hidden)]=\"element.hidden\" *ngFor=\"let element of data\" [ngValue]=\"element\">{{(element.object == null?\"UNASIGNED\":element.object.nameid)| translate }}</option>\n </select>\n </div>\n </ng-template>\n\n <ng-template #checkactiveoption [ngIf]=\"(!compact && multiSelect)\">\n <div class=\"comboselectlist\">\n <div>\n <div [(hidden)]=\"element.hidden\" *ngFor=\"let element of data;let i = index\">\n <label for=\"{{'checkactiveoption'+(element.object!=null?element.object.description+num[i]:'-1')}}\" class=\"b-contain\">\n <span>{{(element.object != null?element.object.nameid:\"selectAll\")| translate }}</span>\n <input (change)=\"onMultipleListElementClicked(element)\" [disabled]=\"disabled\" [checked]=\"element.selected\" type=\"checkbox\" name=\"{{'checkactiveoption'+(element.object!=null?element.object.description+num[i]:'-1')}}\" id=\"{{'checkactiveoption'+(element.object!=null?element.object.description+num[i]:'-1')}}\"\n />\n <div class=\"b-input\"></div>\n </label>\n </div>\n </div>\n </div>\n </ng-template>\n\n <ng-template #optionactiveoption [ngIf]=\"(!compact && !multiSelect)\">\n <div class=\"comboradiolist\">\n <div [(hidden)]=\"element.hidden\" *ngFor=\"let element of data\">\n <label (click)=\"onSelectSingleElement(element)\" for=\"{{'radiodepenoptactiveoption'+(element.object!=null?element.object.description:'-1')+optionInstance}}\" class=\"b-contain\">\n <span>{{(element.object != null?element.object.nameid:\"UNASIGNED\")| translate }}</span>\n <input [disabled]=\"disabled\" [checked]=\"element.selected\" type=\"radio\" name=\"{{'radiogroupdepenoptactiveoption'+optionInstance}}\" id=\"{{'radiodepenoptactiveoption'+(element.object!=null?element.object.description:'-1')+optionInstance}}\"\n />\n <div class=\"b-input\"></div>\n </label>\n </div>\n </div>\n </ng-template>\n ",
styles: ["\n .comboselectlist,\n .comboradiolist {\n display: flex;\n justify-content: space-around;\n }\n\n .b-contain *,\n .b-contain *::before,\n .b-contain *::after {\n box-sizing: content-box !important;\n }\n\n .b-contain input {\n position: absolute;\n z-index: -1;\n opacity: 0;\n }\n\n .b-contain span {\n line-height: 1.49;\n font-size: 1rem;\n font-family: inherit;\n }\n\n .b-contain {\n display: table;\n position: relative;\n padding-left: 1.8rem;\n cursor: pointer;\n margin-bottom: 0.5rem;\n }\n\n .b-contain input[type=\"checkbox\"] ~ .b-input {\n position: absolute;\n top: 0;\n left: 0;\n height: 1.25rem;\n width: 1.25rem;\n background: rgba(241, 245, 248, 1);\n transition: background 250ms;\n border: 1px solid rgba(184, 194, 204, 1);\n border-radius: 0.125rem;\n }\n\n .b-contain input[type=\"radio\"] ~ .b-input {\n position: absolute;\n top: 0;\n left: 0;\n height: 1.25rem;\n width: 1.25rem;\n background: rgba(241, 245, 248, 1);\n transition: background 250ms;\n border: 1px solid rgba(184, 194, 204, 1);\n border-radius: 2rem;\n }\n\n .b-contain input[type=\"checkbox\"] ~ .b-input::after {\n content: \"\";\n position: absolute;\n display: none;\n left: 0.45rem;\n top: 0.18rem;\n width: 0.25rem;\n height: 0.6rem;\n border: solid rgba(255, 255, 255, 1);\n border-width: 0 2px 2px 0;\n transition: background 250ms;\n transform: rotate(45deg);\n }\n\n .b-contain input[type=\"radio\"] ~ .b-input::after {\n content: \"\";\n position: absolute;\n display: none;\n left: 0.25rem;\n top: 0.25rem;\n width: 0.75rem;\n height: 0.75rem;\n border-radius: 2rem;\n background: rgba(255, 255, 255, 1);\n transition: background 250ms;\n }\n\n .b-contain input:disabled ~ .b-input::after {\n border-color: rgba(135, 149, 161, 1);\n }\n\n .b-contain input:checked ~ .b-input::after {\n display: block;\n }\n\n .b-contain:hover input ~ .b-input,\n .b-contain input:focus ~ .b-input {\n background: rgb(231, 238, 243);\n }\n\n .b-contain input:focus ~ .b-input {\n box-shadow: 0 0 0 2px rgba(220, 194, 52, 0.5);\n }\n\n .b-contain input:checked ~ .b-input {\n background: rgba(255, 178, 41, 1);\n border-color: rgba(255, 178, 41, 1);\n }\n\n .b-contain input[type=\"checkbox\"]:disabled ~ .b-input {\n background: rgba(241, 245, 248, 1);\n border-color: rgba(184, 194, 204, 1);\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n .b-contain input[type=\"radio\"]:disabled ~ .b-input {\n background: rgba(241, 245, 248, 1);\n border-color: rgba(184, 194, 204, 1);\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n .b-contain input[type=\"radio\"]:disabled ~ .b-input::after {\n background: rgba(135, 149, 161, 1);\n }\n\n .b-contain input:checked:focus ~ .b-input,\n .b-contain:hover input:not([disabled]):checked ~ .b-input {\n background: rgba(255, 178, 41, 1);\n border-color: rgba(255, 178, 41, 1);\n }\n\n .b-contain .b-input::before {\n content: \"\";\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n width: 3rem;\n height: 3rem;\n margin-left: -0.85rem;\n margin-top: -0.85rem;\n background: rgba(255, 178, 41, 1);\n border-radius: 2rem;\n opacity: 0.6;\n z-index: 99999;\n transform: scale(0);\n }\n\n @keyframes b-ripple {\n 0% {\n transform: scale(0);\n }\n\n 20% {\n transform: scale(1);\n }\n\n 100% {\n opacity: 0;\n transform: scale(1);\n }\n }\n\n @keyframes b-ripple-duplicate {\n 0% {\n transform: scale(0);\n }\n\n 30% {\n transform: scale(1);\n }\n\n 60% {\n transform: scale(1);\n }\n\n 100% {\n opacity: 0;\n transform: scale(1);\n }\n }\n\n .b-contain input + .b-input::before {\n animation: b-ripple 250ms ease-out;\n }\n\n .b-contain input:checked + .b-input::before {\n animation-name: b-ripple-duplicate;\n }\n\n .b-contain .b-input::before {\n visibility: hidden;\n }\n\n .b-contain input:focus + .b-input::before {\n visibility: visible;\n }\n\n .b-contain:first-child .b-input::before {\n visibility: hidden;\n }\n "]
},] },
];
/** @nocollapse */
DependencyOptionComboboxComponent.ctorParameters = function () { return []; };
DependencyOptionComboboxComponent.propDecorators = {
"num": [{ type: core_1.Input },],
};
return DependencyOptionComboboxComponent;
}(combo_box_1.ComboBox));
exports.DependencyOptionComboboxComponent = DependencyOptionComboboxComponent;
//# sourceMappingURL=dependency-option-combobox.component.js.map