ngx-academia-uniandes-library
Version:
This library is used for Academia-Uniandes system.
190 lines • 13.9 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 api_1 = require("api-angular-academia-dto/api");
var crud_compact_component_1 = require("../crud-compact.component");
var forms_1 = require("@angular/forms");
var academia_pagination_1 = require("../../academia-pagination/academia-pagination");
var api_2 = require("api-angular-academia-dto/api");
var core_2 = require("@ngx-translate/core");
var util_1 = require("util");
var crud_compact_service_1 = require("../crud-compact.service");
var sweetalert2_1 = require("sweetalert2");
var AdvisorCompactComponent = /** @class */ (function (_super) {
__extends(AdvisorCompactComponent, _super);
/**
* Constructor for the advisor-compact component
* @param _formBuilder Form Builder for creating Reactive Forms group.
* @param paginationService Academia Pagination Service for client pagination.
* @param translate Translate service for translating keys inside component
*/
function AdvisorCompactComponent(_formBuilder, paginationService, translate, crudCompactService) {
var _this = _super.call(this, _formBuilder, paginationService, translate, crudCompactService) || this;
_this._formBuilder = _formBuilder;
_this.paginationService = paginationService;
_this.translate = translate;
_this.crudCompactService = crudCompactService;
/**
* input inner advisors to component
*/
_this.advisors = [];
_this.debugFlag = false;
/**
* output external advisors to parent component
*/
_this.updatedAdvisors = new core_1.EventEmitter();
return _this;
}
AdvisorCompactComponent.prototype.ngOnInit = function () {
_super.prototype.ngOnInit.call(this);
this.listWithAvatar = true;
this.showListAttribute = 'completeName';
this.indexAttribute = 'id';
this.selectMode = { 'nameId': 'advisor', 'queryParams': [{ 'name': 'personType', 'value': '[1,3]' }, { 'name': 'facultyState', 'value': true }, { 'name': 'limit', 'value': 5 }] };
this.addAdvisors(this.advisors);
};
AdvisorCompactComponent.prototype.addAdvisors = function (advisors) {
if (advisors.length > 0) {
this.sortAdvisors();
}
_super.prototype.ngOnChanges.call(this);
};
AdvisorCompactComponent.prototype.setNewItem = function () {
if (this.advisorCategory === api_1.AdvisorCategory_type.PRINCIPAL.nameid) {
var main = this.advisors.some(function (advisor) { return advisor.advisorType === api_1.AdvisorCategory_type.PRINCIPAL.nameid; });
if (main) {
sweetalert2_1.default(this.translate.instant('justOneAdvisor'), this.translate.instant('advisorAdded'), 'error');
return;
}
}
_super.prototype.setObjectFromEvent.call(this, {
item: {
advisorType: this.advisorCategory,
advisor: this.advisorInfo
}
});
_super.prototype.setNewItem.call(this);
if (!this.exitsElementInList(this.newItem, this.advisors)) {
this.advisors.push(this.newItem);
this.sortAdvisors();
this.updatedAdvisors.emit(this.advisors);
}
this.formGroup.reset();
this.showAddForm = false;
};
AdvisorCompactComponent.prototype.cancelSetNewItem = function () {
this.formGroup.reset();
this.showAddForm = false;
};
AdvisorCompactComponent.prototype.deleteItem = function (itemForDeleting) {
this.superDeleteItem(itemForDeleting);
var index = this.advisors.findIndex(function (item) { return itemForDeleting.advisor.id === item.advisor.id; });
if (index > -1) {
this.advisors.splice(index, 1);
this.sortAdvisors();
this.updatedAdvisors.emit(this.advisors);
}
};
AdvisorCompactComponent.prototype.getPersonType = function (item) {
var _this = this;
if (item.advisor.types && item.advisor.types.length) {
var typesTranslated = item.advisor.types.map(function (element) {
if (util_1.isString(element)) {
return _this.translate.instant(element);
}
else {
var typeObj = api_2.Person_Type.getAllEnumValues().find(function (e) { return e.type === element; });
return _this.translate.instant(typeObj ? typeObj.nameid : 'notInformation');
}
});
return typesTranslated.join(', ');
}
return this.translate.instant('notInformation');
};
AdvisorCompactComponent.prototype.onCategoryChanges = function (event) {
this.advisorCategory = event ? event.nameid : undefined;
};
AdvisorCompactComponent.prototype.setAdvisorInfo = function (event) {
this.advisorInfo = event ? event.item : event;
};
Object.defineProperty(AdvisorCompactComponent.prototype, "isAdvisorFormValid", {
get: function () {
return !!this.advisorCategory && !!this.advisorInfo;
},
enumerable: true,
configurable: true
});
AdvisorCompactComponent.prototype.exitsElementInList = function (item, list) {
var exist = false;
if (list) {
list.forEach(function (element) {
if (element.advisor &&
item.advisor &&
element.advisor.id === item.advisor.id &&
element.advisorType === item.advisorType) {
exist = true;
}
});
}
return exist;
};
AdvisorCompactComponent.prototype.sortAdvisors = function () {
this.advisors.sort(function (a, b) {
if (a.advisorType === api_1.AdvisorCategory_type.PRINCIPAL.nameid)
return -1;
if (b.advisorType === api_1.AdvisorCategory_type.PRINCIPAL.nameid)
return 1;
return 0;
});
this.inputItems = this.advisors.slice();
this.inputItems.sort(function (a, b) {
if (a.advisorType === api_1.AdvisorCategory_type.PRINCIPAL.nameid)
return -1;
if (b.advisorType === api_1.AdvisorCategory_type.PRINCIPAL.nameid)
return 1;
return 0;
});
_super.prototype.setPaginatedItems.call(this);
};
AdvisorCompactComponent.prototype.superDeleteItem = function (itemForDeleting) {
var index = this.inputItems.findIndex(function (item) { return itemForDeleting.advisor.id === item.advisor.id; });
this.inputItems.splice(index, 1);
this.updatedItems.emit(this.inputItems);
this.setPaginatedItems();
this.crudCompactService.updateState(true);
this.listModified.emit(true);
};
AdvisorCompactComponent.decorators = [
{ type: core_1.Component, args: [{
selector: 'advisor-compact',
template: "\n <div class=\"container-fluid\">\n <div class=\"btn-add\" *ngIf=\"!readOnly\">\n <button type=\"button\" *ngIf=\"!showAddForm; else showHideButton\" class=\"btn btn-sm btn-default\" (click)=\"showAddForm = !showAddForm;\">\n <span class=\"oi oi-plus\"></span> {{ 'add' | translate}}\n </button>\n <ng-template #showHideButton>\n <button type=\"button\" class=\"btn btn-sm btn-default\" (click)=\"showAddForm = !showAddForm;\">\n <span class=\"oi oi-minus\"></span> {{ 'hide' | translate}}\n </button>\n </ng-template>\n </div>\n\n <div *ngIf=\"showAddForm\" class=\"details-create-container\">\n <form [formGroup]=\"formGroup\" class=\"main-form\" (ngSubmit)=\"setNewItem()\">\n <div class=\"form-group\">\n <search-person-combo-box [debugFlag]=\"debugFlag\" [placeHolder]=\"'selectPerson'\" [queryParams]=\"selectMode.queryParams ? selectMode.queryParams :[{'name':'limit','value': 5}]\"\n (itemSelected)=\"setAdvisorInfo($event)\" [itemControl]=\"formGroup.controls.itemCtrl\" id=\"form-advisor\"></search-person-combo-box>\n </div>\n <div class=\"form-group\">\n <app-advisor-category-type-combobox #advisorcategorycombo\n [preSelect]=\"currentState ? currentState : ['SIN_ASIGNAR']\"\n [compact]=\"true\" [selectFirst]=\"false\" [multiSelect]=\"false\"\n (onSelection)=\"onCategoryChanges($event)\"></app-advisor-category-type-combobox>\n </div>\n <div class=\"saveButton\">\n <button class=\"btn btn-defult\" (click)=\"cancelSetNewItem()\">{{'cancel' | translate}}</button>\n <button type=\"submit\" class=\"btn btn-primary\" [disabled]=\"!isAdvisorFormValid\">{{'add' | translate}}</button>\n </div>\n </form>\n </div>\n <div *ngIf=\"isModified\" class=\"alert alert-custom\" role=\"alert\">\n {{ 'changesWithoutSave' | translate }}\n </div>\n\n <table class=\"table\" *ngIf=\"(inputItems && inputItems.length > 0); else noInput\">\n <thead class=\"thead-light\">\n <tr align=\"center\">\n <th>#</th>\n <th class=\"responsive-avatar\">--</th>\n <th>{{ 'advisor' | translate }}</th>\n <th>{{ 'advisorCategory' | translate }}</th>\n <th>{{ 'category' | translate }}</th>\n <th *ngIf=\"!readOnly\">{{ 'actions' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n <ng-container *ngFor=\"let item of paginatedItems; let idx = index; \">\n <tr align=\"center\">\n <td>{{ idx + (pageSize*(page-1)) + 1 }}</td>\n <td class=\"responsive-avatar\"><img class=\"img-profile\" alt=\"\" height=\"85px\" width=\"auto\" onerror=\"this.src='https://academia.uniandes.edu.co/WebAcademy/academyResources/images/nophoto.png'\"\n src=\"/WebServicesAcademy/api/AcademyImages/photos/{{item.advisor.id}}.JPG\"></td>\n <td>{{(item[showListAttribute] | titleCaseAcademia) || (item.advisor.lastName + ' ' + item.advisor.name | titlecase)}}</td>\n <td>{{ item.advisorType | translate }}</td>\n <td>{{ getPersonType(item) }}</td>\n <td *ngIf=\"!readOnly\">\n <a (click)=\"deleteItem(item)\" class=\"btn btn-default btn-md\" role=\"button\">\n <span class=\"oi oi-trash button-delete\"></span>\n </a>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n <div *ngIf=\"inputItems && inputItems.length > 0\" style=\"display:flex;justify-content: center;margin-top:30px;\">\n <academia-pagination [collectionSize]=\"inputItems.length\" [pageSize]=\"pageSize\" [page]=\"page\" (pageChanged)=\"pageChanged($event)\"></academia-pagination>\n </div>\n <ng-template #noInput>\n <div align=\"center\">\n <h5>{{'notInformation' | translate}}</h5>\n </div>\n </ng-template>\n </div>\n ",
styles: ["\n\n .container-fluid .table-responsive{\n margin-top: 20px;\n }\n\n .btn-add{\n padding-bottom: 10px; \n }\n\n .container-fluid > button{\n margin-top:20px;\n }\n\n .responsive-avatar{\n display: none;\n }\n\n .saveButton{\n display: flex;\n justify-content: flex-end;\n }\n\n\n .img-profile {\n max-width: 100%;\n margin-top: -10px;\n background-color: white;\n }\n\n .details-create-container{\n margin-top: 20px;\n }\n\n .saveButton > button{\n margin: 5px;\n }\n\n .alert-custom {\n background-color: #536dfe;\n border-color: white;\n color: #fff;\n }\n\n @media (min-width: 715px){\n\n .responsive-avatar{\n display: table-cell;\n }\n\n } \n "],
providers: [crud_compact_service_1.CrudCompactService]
},] },
];
/** @nocollapse */
AdvisorCompactComponent.ctorParameters = function () { return [
{ type: forms_1.FormBuilder, },
{ type: academia_pagination_1.AcademiaPaginationService, },
{ type: core_2.TranslateService, },
{ type: crud_compact_service_1.CrudCompactService, },
]; };
AdvisorCompactComponent.propDecorators = {
"advisors": [{ type: core_1.Input },],
"debugFlag": [{ type: core_1.Input },],
"updatedAdvisors": [{ type: core_1.Output },],
};
return AdvisorCompactComponent;
}(crud_compact_component_1.CrudCompactComponent));
exports.AdvisorCompactComponent = AdvisorCompactComponent;
//# sourceMappingURL=advisor-compact.component.js.map