sapenlinea-components 0.10.85 → 0.10.86
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -6541,6 +6541,7 @@ class CardHistory {
|
|
|
6541
6541
|
completed: 'Completado',
|
|
6542
6542
|
cancelled: 'Cancelado',
|
|
6543
6543
|
restructured: 'Reestructurado',
|
|
6544
|
+
in_process: 'En proceso',
|
|
6544
6545
|
paid: 'Pagado',
|
|
6545
6546
|
delinquent_30: 'Vencido 30 días',
|
|
6546
6547
|
delinquent_60: 'Vencido 60 días',
|
|
@@ -6578,6 +6579,7 @@ class CardHistory {
|
|
|
6578
6579
|
switch (status) {
|
|
6579
6580
|
case 'Active': return 'agreement-hero__status--active';
|
|
6580
6581
|
case 'Pending': return 'agreement-hero__status--pending';
|
|
6582
|
+
case 'in_process': return 'agreement-hero__status--process';
|
|
6581
6583
|
case 'Defaulted': return 'agreement-hero__status--defaulted';
|
|
6582
6584
|
case 'Completed': return 'agreement-hero__status--completed';
|
|
6583
6585
|
case 'Cancelled': return 'agreement-hero__status--cancelled';
|
|
@@ -6617,11 +6619,11 @@ class CardHistory {
|
|
|
6617
6619
|
}
|
|
6618
6620
|
}
|
|
6619
6621
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CardHistory, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6620
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: CardHistory, isStandalone: true, selector: "lib-card-history", inputs: { DataCard: { classPropertyName: "DataCard", publicName: "DataCard", isSignal: true, isRequired: false, transformFunction: null }, historialEntry: { classPropertyName: "historialEntry", publicName: "historialEntry", isSignal: true, isRequired: false, transformFunction: null }, withResponsible: { classPropertyName: "withResponsible", publicName: "withResponsible", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if(variant() == 'default' && withResponsible()) {\r\n<div class=\"card-history\">\r\n <span class=\"card-date\">{{ formatDate(DataCard()?.date || \"\") }}</span>\r\n <div class=\"event-card\" [class.expanded]=\"isExpanded()\">\r\n <div class=\"event-header\" (click)=\"toggleExpanded()\">\r\n <div class=\"event-info\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"expand-icon icon icon-tabler icons-tabler-outline icon-tabler-chevron-up\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M6 15l6 -6l6 6\" />\r\n </svg>\r\n <span class=\"event-type\">{{ DataCard()?.title }}</span>\r\n <span class=\"event-time\">{{ DataCard()?.time }}</span>\r\n </div>\r\n <div class=\"status-badges\">\r\n <span class=\"badge\" [ngClass]=\"getBadgeClass(DataCard()?.previousStatus || '')\">\r\n {{ DataCard()?.previousStatus }}\r\n </span>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-chevrons-right\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M7 7l5 5l-5 5\" />\r\n <path d=\"M13 7l5 5l-5 5\" />\r\n </svg>\r\n\r\n <span class=\"badge\" [ngClass]=\"getBadgeClass(DataCard()?.currentStatus || '')\">\r\n {{ DataCard()?.currentStatus }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"event-details\">\r\n <div class=\"responsible-info\">\r\n <div class=\"avatar\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-user\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\r\n <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\r\n </svg>\r\n </div>\r\n <div class=\"responsible-details\">\r\n <h4>Responsable</h4>\r\n <div class=\"responsible-name\">{{ DataCard()?.responsible }}</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"technical-description\">\r\n <div class=\"tech-label\">Descripci\u00F3n t\u00E9cnica</div>\r\n <div class=\"tech-content\">\r\n {{ DataCard()?.description }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n}\r\n\r\n@if(variant() == 'default' && !withResponsible()) {\r\n<div class=\"card-history\">\r\n <div class=\"event-card no-responsible\">\r\n <div class=\"nr-header\">\r\n <span class=\"nr-title\">{{ DataCard()?.title }}</span>\r\n <span class=\"nr-type\">({{ DataCard()?.type || 'estado' }})</span>\r\n </div>\r\n <div class=\"nr-body\">\r\n @if (DataCard()?.actionType === 'create') {\r\n <p class=\"nr-description\">\r\n El registro fue creado con los siguientes datos.\r\n </p>\r\n <div class=\"nr-comparison single\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label curr\">VALOR INICIAL</span>\r\n <div class=\"nr-value curr-val\">{{ DataCard()?.currentStatus }}</div>\r\n </div>\r\n </div>\r\n } @else if (DataCard()?.actionType === 'delete') {\r\n <p class=\"nr-description\">\r\n El registro fue eliminado permanentemente.\r\n </p>\r\n <div class=\"nr-comparison single\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label prev\">VALOR ELIMINADO</span>\r\n <div class=\"nr-value prev-val\">{{ DataCard()?.previousStatus }}</div>\r\n </div>\r\n </div>\r\n } @else {\r\n <p class=\"nr-description\">\r\n <span style=\"text-transform: capitalize;\">{{ DataCard()?.type || 'El registro' }}</span> cambi\u00F3 de \"{{\r\n DataCard()?.previousStatus }}\" a \"{{ DataCard()?.currentStatus }}\".\r\n </p>\r\n\r\n <div class=\"nr-comparison\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label prev\">VALOR ANTERIOR</span>\r\n <div class=\"nr-value prev-val\">{{ DataCard()?.previousStatus }}</div>\r\n </div>\r\n\r\n <div class=\"nr-arrow\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrow-right\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M5 12l14 0\" />\r\n <path d=\"M13 18l6 -6\" />\r\n <path d=\"M13 6l6 6\" />\r\n </svg>\r\n </div>\r\n\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label curr\">VALOR NUEVO</span>\r\n <div class=\"nr-value curr-val\">{{ DataCard()?.currentStatus }}</div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</div>\r\n}\r\n\r\n@if (variant() == 'history') {\r\n@let entry = historialEntry();\r\n<!-- Historial y movimientos -->\r\n<article class=\"historial-card\">\r\n <!-- Card Header -->\r\n <div class=\"historial-card__header\">\r\n <div class=\"historial-card__title-area\">\r\n <span class=\"historial-card__icon-wrapper\"\r\n [ngClass]=\"{'state-change': entry?.tipo === 'estado', 'doc-change': entry?.tipo === 'documento'}\">\r\n @if (entry?.tipo === 'documento') {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M14 3v4a1 1 0 0 0 1 1h4\" />\r\n <path d=\"M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z\" />\r\n <path d=\"M9 9l1 0\" />\r\n <path d=\"M9 13l6 0\" />\r\n <path d=\"M9 17l6 0\" />\r\n </svg>\r\n } @else if (entry?.previousState || entry?.currentState) {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M3 9l4 -4l4 4m-4 -4v14\" />\r\n <path d=\"M21 15l-4 4l-4 -4m4 4v-14\" />\r\n </svg>\r\n } @else {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M12 8l.01 0\" />\r\n <path d=\"M12 12l0 9\" />\r\n <path d=\"M12 3a9 9 0 1 0 9 9\" />\r\n </svg>\r\n }\r\n </span>\r\n <h3 class=\"historial-card__title\">{{ entry?.titulo }}</h3>\r\n </div>\r\n @if (entry?.tipo === 'estado') {\r\n <div class=\"historial-card__id\">ID #{{ entry?.id }}</div>\r\n } @else {\r\n <div class=\"historial-card__id historial-card__id--local\">{{ entry?.tipo === 'documento' ? 'Documento' : 'Movimiento' }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Card Body -->\r\n <div class=\"historial-card__body\">\r\n @if (entry?.detalle) {\r\n <div class=\"historial-card__reason-box\">\r\n <span class=\"reason-label\">Detalles</span>\r\n <p class=\"reason-text\">{{ entry?.detalle }}</p>\r\n </div>\r\n }\r\n\r\n @if (entry?.previousState || entry?.currentState) {\r\n <div class=\"historial-card__states-container\">\r\n <span class=\"states-label\">Transici\u00F3n:</span>\r\n <div class=\"historial-item__status-row\">\r\n @if (entry?.previousState) {\r\n <span class=\"status-chip\" [ngClass]=\"getStatusChipClass(entry!.previousState!)\">\r\n {{ statusLabel(entry!.previousState!) }}\r\n </span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"history-arrow\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M7 7l5 5l-5 5\" />\r\n <path d=\"M13 7l5 5l-5 5\" />\r\n </svg>\r\n }\r\n @if (entry?.currentState) {\r\n <span class=\"status-chip\" [ngClass]=\"getStatusChipClass(entry!.currentState!)\">\r\n {{ statusLabel(entry!.currentState!) }}\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Card Footer -->\r\n <div class=\"historial-card__footer\">\r\n <div class=\"historial-card__meta-item\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"me-1\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\r\n <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\r\n </svg>\r\n <span>Usuario: <strong>{{ entry?.createdBy || 'SISTEMA' }}</strong></span>\r\n </div>\r\n <div class=\"historial-card__meta-item\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"me-1\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z\" />\r\n <path d=\"M16 3v4\" />\r\n <path d=\"M8 3v4\" />\r\n <path d=\"M4 11h16\" />\r\n <path d=\"M11 15h1\" />\r\n <path d=\"M12 15v3\" />\r\n </svg>\r\n <span>{{ entry?.creationDate | date:'dd/MM/yyyy h:mm a' }}</span>\r\n </div>\r\n </div>\r\n</article>\r\n}", styles: [".card-history{display:flex;flex-direction:column;gap:15px}.card-date{color:#1c1c12;font-size:1.4rem;font-weight:600}.event-card{background-color:#f0f0db;border-radius:8px;margin-bottom:15px;overflow:hidden;border:1px solid #c7c7ad}.event-header{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.event-header:hover{background-color:#e0e0c8}.event-info{display:flex;align-items:center;gap:8px}.expand-icon{font-size:12px;transform:rotate(180deg);transition:transform .2s}.event-card.expanded .expand-icon{transform:rotate(90deg)}.event-type{font-weight:600;font-size:1.4rem;color:#1c1c12}.event-time{color:#454733;font-size:1.1rem}.status-badges{display:flex;align-items:center;gap:8px}.badge{padding:6px 10px;border-radius:6px;font-size:1.2rem;font-weight:600;border:none}.badge-maintenance{background:#bfd100;color:#4f5700}.badge-operational{background-color:#78db5c;color:#0f5e00}.badge-no-date{background-color:#bfe9ff;color:#004d65}.event-details{max-height:0;overflow:hidden;padding:0 10px;background-color:#f0f0e0;transition:max-height .3s ease-in-out,padding .3s ease-in-out}.event-card.expanded .event-details{max-height:300px;padding:20px 10px}.responsible-info{display:flex;align-items:center;gap:12px;margin-bottom:15px;padding:20px 10px;background-color:#ebe8d6;border-radius:8px}.avatar{width:36px;height:36px;border-radius:50%;background-color:#bfd100;display:flex;align-items:center;justify-content:center;font-weight:700}.avatar img{width:24px;height:24px}.responsible-details h4{font-size:1.2rem;color:#454733;margin-bottom:2px;font-weight:400}.responsible-name{font-size:1.4rem;font-weight:600;color:#1c1c12}.technical-description{padding:20px 10px;background-color:#ebe8d6;border-radius:8px;height:120px}.tech-label{font-size:1.2rem;color:#454733;margin-bottom:5px}.tech-content{font-size:1.4rem;color:#1c1c12;font-weight:600}.badge-active{color:#006d2f;font-weight:600;background-color:#c6f6c1;border-radius:8px;padding:6px 10px}.badge-inactive{color:#454733e7;font-weight:600;background-color:#e0e0e0;border-radius:8px;padding:6px 10px}.badge-retired{color:#ba1a1a;font-weight:600;background-color:#ffe5e5;border-radius:8px;padding:6px 10px}.badge-obsolete{color:#454733;font-weight:600;border:1px solid #c7c7ad;border-radius:8px;padding:6px 10px}.badge-operativo{color:#0f5e00;font-weight:600;background-color:#80ff66;border-radius:8px;padding:6px 10px}.badge-maintenance{color:#4f5700;font-weight:600;background-color:#bfd100;border-radius:8px;padding:6px 10px}.badge-failures{color:#94000a;font-weight:600;background-color:#fcd;border-radius:8px;padding:6px 10px}.badge-deactivated{color:#ba1a1a;font-weight:600;border:1px solid #ba1a1a;border-radius:8px;padding:6px 10px}.badge-default{color:#6b6b47;font-weight:600;border:1px dashed #c7c7ad;border-radius:8px;padding:6px 10px;font-style:italic}.nr-header{padding:12px 16px;border-bottom:1px solid #c7c7ad;display:flex;align-items:center;gap:6px}.nr-title{font-weight:600;font-size:1.4rem;color:#1c1c12}.nr-type{font-size:1.2rem;color:#6b6b47}.nr-body{padding:16px}.nr-description{font-size:1.3rem;color:#454733;margin:0 0 16px}.nr-comparison{display:flex;align-items:center;gap:16px}.nr-col{flex:1;display:flex;flex-direction:column;gap:8px}.nr-label{font-size:1.1rem;font-weight:700;text-transform:uppercase}.nr-label.prev{color:#ba1a1a}.nr-label.curr{color:#006d2f}.nr-value{padding:12px 16px;border-radius:8px;font-size:1.3rem;font-weight:600}.nr-value.prev-val{background-color:#ffe5e5;color:#ba1a1a}.nr-value.curr-val{background-color:#c6f6c1;color:#006d2f}.nr-arrow{display:flex;align-items:center;justify-content:center;color:#6b6b47;padding-top:20px}.historial-card{background-color:#fafae8;border-radius:16px;padding:1.25rem 1.5rem;box-shadow:0 3px 10px #78724d0f;display:flex;flex-direction:column;gap:.8rem;transition:all .22s cubic-bezier(.16,1,.3,1)}.historial-card__header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed rgba(120,114,77,.15);padding-bottom:.65rem}.historial-card__title-area{display:flex;align-items:center;gap:.75rem}.historial-card__icon-wrapper{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background-color:#78724d1a;color:#5a5a46}.historial-card__icon-wrapper.state-change{background-color:#5963001a;color:#596300}.historial-card__icon-wrapper.doc-change{background-color:#3974c01a;color:#3974c0}.historial-card__id--local{background-color:#3974c014;color:#3974c0}.historial-card__title{margin:0;font-size:1.35rem;font-weight:700;color:#2c3016}.historial-card__id{font-size:1rem;font-weight:600;color:#7b7d60;background-color:#78724d14;padding:.2rem .6rem;border-radius:99px}.historial-card__body{display:flex;flex-direction:column;gap:.75rem}.historial-card__reason-box{border-left:3px solid #b2ac88;padding:.75rem 1rem;border-radius:4px 12px 12px 4px}.reason-label{display:flex;align-items:center;font-size:.95rem;font-weight:700;color:#615c3c;margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.03em}.reason-text{margin:0;font-size:1.25rem;font-weight:700;color:#383a30;line-height:1.45;white-space:pre-wrap}.historial-card__states-container{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;padding:.5rem 0;border-radius:8px}.states-label{font-size:1.1rem;font-weight:700;color:#615c3c}.historial-card__footer{display:flex;justify-content:flex-start;align-items:center;gap:1.8rem;border-top:1px solid rgba(120,114,77,.08);padding-top:.75rem;flex-wrap:wrap}.historial-card__meta-item{display:flex;align-items:center;gap:.6rem;font-size:1.15rem;color:#6b6a55}.historial-card__meta-item svg{color:#7b7d60}.historial-item__status-row{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}.history-arrow{color:#6d6a58;display:inline-flex;align-self:center}.status-chip{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.25rem .65rem;border-radius:6px;font-size:1.1rem;text-transform:uppercase;font-weight:600;line-height:1.2;white-space:nowrap;box-sizing:border-box;min-width:max-content;vertical-align:middle}.status-chip--active,.status-chip--restructured{background-color:#9dafd8;color:#0746cf}.status-chip--completed,.status-chip--paid{background-color:#9ed89d;color:#006d2f}.status-chip--pending{background-color:#d8bf9d;color:#cf6507}.status-chip--defaulted{background-color:#c7b0d8;color:#6a1b9a}.status-chip--cancelled{background-color:#d89d9d;color:#cf0707}.status-chip--neutral{background-color:#bac2bb;color:#40484c}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePipe, name: "date" }] });
|
|
6622
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: CardHistory, isStandalone: true, selector: "lib-card-history", inputs: { DataCard: { classPropertyName: "DataCard", publicName: "DataCard", isSignal: true, isRequired: false, transformFunction: null }, historialEntry: { classPropertyName: "historialEntry", publicName: "historialEntry", isSignal: true, isRequired: false, transformFunction: null }, withResponsible: { classPropertyName: "withResponsible", publicName: "withResponsible", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if(variant() == 'default' && withResponsible()) {\r\n<div class=\"card-history\">\r\n <span class=\"card-date\">{{ formatDate(DataCard()?.date || \"\") }}</span>\r\n <div class=\"event-card\" [class.expanded]=\"isExpanded()\">\r\n <div class=\"event-header\" (click)=\"toggleExpanded()\">\r\n <div class=\"event-info\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"expand-icon icon icon-tabler icons-tabler-outline icon-tabler-chevron-up\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M6 15l6 -6l6 6\" />\r\n </svg>\r\n <span class=\"event-type\">{{ DataCard()?.title }}</span>\r\n <span class=\"event-time\">{{ DataCard()?.time }}</span>\r\n </div>\r\n <div class=\"status-badges\">\r\n <span class=\"badge\" [ngClass]=\"getBadgeClass(DataCard()?.previousStatus || '')\">\r\n {{ DataCard()?.previousStatus }}\r\n </span>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-chevrons-right\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M7 7l5 5l-5 5\" />\r\n <path d=\"M13 7l5 5l-5 5\" />\r\n </svg>\r\n\r\n <span class=\"badge\" [ngClass]=\"getBadgeClass(DataCard()?.currentStatus || '')\">\r\n {{ DataCard()?.currentStatus }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"event-details\">\r\n <div class=\"responsible-info\">\r\n <div class=\"avatar\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-user\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\r\n <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\r\n </svg>\r\n </div>\r\n <div class=\"responsible-details\">\r\n <h4>Responsable</h4>\r\n <div class=\"responsible-name\">{{ DataCard()?.responsible }}</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"technical-description\">\r\n <div class=\"tech-label\">Descripci\u00F3n t\u00E9cnica</div>\r\n <div class=\"tech-content\">\r\n {{ DataCard()?.description }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n}\r\n\r\n@if(variant() == 'default' && !withResponsible()) {\r\n<div class=\"card-history\">\r\n <div class=\"event-card no-responsible\">\r\n <div class=\"nr-header\">\r\n <span class=\"nr-title\">{{ DataCard()?.title }}</span>\r\n <span class=\"nr-type\">({{ DataCard()?.type || 'estado' }})</span>\r\n </div>\r\n <div class=\"nr-body\">\r\n @if (DataCard()?.actionType === 'create') {\r\n <p class=\"nr-description\">\r\n El registro fue creado con los siguientes datos.\r\n </p>\r\n <div class=\"nr-comparison single\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label curr\">VALOR INICIAL</span>\r\n <div class=\"nr-value curr-val\">{{ DataCard()?.currentStatus }}</div>\r\n </div>\r\n </div>\r\n } @else if (DataCard()?.actionType === 'delete') {\r\n <p class=\"nr-description\">\r\n El registro fue eliminado permanentemente.\r\n </p>\r\n <div class=\"nr-comparison single\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label prev\">VALOR ELIMINADO</span>\r\n <div class=\"nr-value prev-val\">{{ DataCard()?.previousStatus }}</div>\r\n </div>\r\n </div>\r\n } @else {\r\n <p class=\"nr-description\">\r\n <span style=\"text-transform: capitalize;\">{{ DataCard()?.type || 'El registro' }}</span> cambi\u00F3 de \"{{\r\n DataCard()?.previousStatus }}\" a \"{{ DataCard()?.currentStatus }}\".\r\n </p>\r\n\r\n <div class=\"nr-comparison\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label prev\">VALOR ANTERIOR</span>\r\n <div class=\"nr-value prev-val\">{{ DataCard()?.previousStatus }}</div>\r\n </div>\r\n\r\n <div class=\"nr-arrow\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrow-right\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M5 12l14 0\" />\r\n <path d=\"M13 18l6 -6\" />\r\n <path d=\"M13 6l6 6\" />\r\n </svg>\r\n </div>\r\n\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label curr\">VALOR NUEVO</span>\r\n <div class=\"nr-value curr-val\">{{ DataCard()?.currentStatus }}</div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</div>\r\n}\r\n\r\n@if (variant() == 'history') {\r\n@let entry = historialEntry();\r\n<!-- Historial y movimientos -->\r\n<article class=\"historial-card\">\r\n <!-- Card Header -->\r\n <div class=\"historial-card__header\">\r\n <div class=\"historial-card__title-area\">\r\n <span class=\"historial-card__icon-wrapper\"\r\n [ngClass]=\"{'state-change': entry?.tipo === 'estado', 'doc-change': entry?.tipo === 'documento'}\">\r\n @if (entry?.tipo === 'documento') {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M14 3v4a1 1 0 0 0 1 1h4\" />\r\n <path d=\"M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z\" />\r\n <path d=\"M9 9l1 0\" />\r\n <path d=\"M9 13l6 0\" />\r\n <path d=\"M9 17l6 0\" />\r\n </svg>\r\n } @else if (entry?.previousState || entry?.currentState) {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M3 9l4 -4l4 4m-4 -4v14\" />\r\n <path d=\"M21 15l-4 4l-4 -4m4 4v-14\" />\r\n </svg>\r\n } @else {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M12 8l.01 0\" />\r\n <path d=\"M12 12l0 9\" />\r\n <path d=\"M12 3a9 9 0 1 0 9 9\" />\r\n </svg>\r\n }\r\n </span>\r\n <h3 class=\"historial-card__title\">{{ entry?.titulo }}</h3>\r\n </div>\r\n @if (entry?.tipo === 'estado') {\r\n <div class=\"historial-card__id\">ID #{{ entry?.id }}</div>\r\n } @else {\r\n <div class=\"historial-card__id historial-card__id--local\">{{ entry?.tipo === 'documento' ? 'Documento' : 'Movimiento' }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Card Body -->\r\n <div class=\"historial-card__body\">\r\n @if (entry?.detalle) {\r\n <div class=\"historial-card__reason-box\">\r\n <span class=\"reason-label\">Detalles</span>\r\n <p class=\"reason-text\">{{ entry?.detalle }}</p>\r\n </div>\r\n }\r\n\r\n @if (entry?.previousState || entry?.currentState) {\r\n <div class=\"historial-card__states-container\">\r\n <span class=\"states-label\">Transici\u00F3n:</span>\r\n <div class=\"historial-item__status-row\">\r\n @if (entry?.previousState) {\r\n <span class=\"status-chip\" [ngClass]=\"getStatusChipClass(entry!.previousState!)\">\r\n {{ statusLabel(entry!.previousState!) }}\r\n </span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"history-arrow\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M7 7l5 5l-5 5\" />\r\n <path d=\"M13 7l5 5l-5 5\" />\r\n </svg>\r\n }\r\n @if (entry?.currentState) {\r\n <span class=\"status-chip\" [ngClass]=\"getStatusChipClass(entry!.currentState!)\">\r\n {{ statusLabel(entry!.currentState!) }}\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Card Footer -->\r\n <div class=\"historial-card__footer\">\r\n <div class=\"historial-card__meta-item\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"me-1\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\r\n <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\r\n </svg>\r\n <span>Usuario: <strong>{{ entry?.createdBy || 'SISTEMA' }}</strong></span>\r\n </div>\r\n <div class=\"historial-card__meta-item\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"me-1\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z\" />\r\n <path d=\"M16 3v4\" />\r\n <path d=\"M8 3v4\" />\r\n <path d=\"M4 11h16\" />\r\n <path d=\"M11 15h1\" />\r\n <path d=\"M12 15v3\" />\r\n </svg>\r\n <span>{{ entry?.creationDate | date:'dd/MM/yyyy h:mm a' }}</span>\r\n </div>\r\n </div>\r\n</article>\r\n}", styles: [".card-history{display:flex;flex-direction:column;gap:15px}.card-date{color:#1c1c12;font-size:1.4rem;font-weight:600}.event-card{background-color:#f0f0db;border-radius:8px;margin-bottom:15px;overflow:hidden;border:1px solid #c7c7ad}.event-header{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.event-header:hover{background-color:#e0e0c8}.event-info{display:flex;align-items:center;gap:8px}.expand-icon{font-size:12px;transform:rotate(180deg);transition:transform .2s}.event-card.expanded .expand-icon{transform:rotate(90deg)}.event-type{font-weight:600;font-size:1.4rem;color:#1c1c12}.event-time{color:#454733;font-size:1.1rem}.status-badges{display:flex;align-items:center;gap:8px}.badge{padding:6px 10px;border-radius:6px;font-size:1.2rem;font-weight:600;border:none}.badge-maintenance{background:#bfd100;color:#4f5700}.badge-operational{background-color:#78db5c;color:#0f5e00}.badge-no-date{background-color:#bfe9ff;color:#004d65}.event-details{max-height:0;overflow:hidden;padding:0 10px;background-color:#f0f0e0;transition:max-height .3s ease-in-out,padding .3s ease-in-out}.event-card.expanded .event-details{max-height:300px;padding:20px 10px}.responsible-info{display:flex;align-items:center;gap:12px;margin-bottom:15px;padding:20px 10px;background-color:#ebe8d6;border-radius:8px}.avatar{width:36px;height:36px;border-radius:50%;background-color:#bfd100;display:flex;align-items:center;justify-content:center;font-weight:700}.avatar img{width:24px;height:24px}.responsible-details h4{font-size:1.2rem;color:#454733;margin-bottom:2px;font-weight:400}.responsible-name{font-size:1.4rem;font-weight:600;color:#1c1c12}.technical-description{padding:20px 10px;background-color:#ebe8d6;border-radius:8px;height:120px}.tech-label{font-size:1.2rem;color:#454733;margin-bottom:5px}.tech-content{font-size:1.4rem;color:#1c1c12;font-weight:600}.badge-active{color:#006d2f;font-weight:600;background-color:#c6f6c1;border-radius:8px;padding:6px 10px}.badge-inactive{color:#454733e7;font-weight:600;background-color:#e0e0e0;border-radius:8px;padding:6px 10px}.badge-retired{color:#ba1a1a;font-weight:600;background-color:#ffe5e5;border-radius:8px;padding:6px 10px}.badge-obsolete{color:#454733;font-weight:600;border:1px solid #c7c7ad;border-radius:8px;padding:6px 10px}.badge-operativo{color:#0f5e00;font-weight:600;background-color:#80ff66;border-radius:8px;padding:6px 10px}.badge-maintenance{color:#4f5700;font-weight:600;background-color:#bfd100;border-radius:8px;padding:6px 10px}.badge-failures{color:#94000a;font-weight:600;background-color:#fcd;border-radius:8px;padding:6px 10px}.badge-deactivated{color:#ba1a1a;font-weight:600;border:1px solid #ba1a1a;border-radius:8px;padding:6px 10px}.badge-default{color:#6b6b47;font-weight:600;border:1px dashed #c7c7ad;border-radius:8px;padding:6px 10px;font-style:italic}.nr-header{padding:12px 16px;border-bottom:1px solid #c7c7ad;display:flex;align-items:center;gap:6px}.nr-title{font-weight:600;font-size:1.4rem;color:#1c1c12}.nr-type{font-size:1.2rem;color:#6b6b47}.nr-body{padding:16px}.nr-description{font-size:1.3rem;color:#454733;margin:0 0 16px}.nr-comparison{display:flex;align-items:center;gap:16px}.nr-col{flex:1;display:flex;flex-direction:column;gap:8px}.nr-label{font-size:1.1rem;font-weight:700;text-transform:uppercase}.nr-label.prev{color:#ba1a1a}.nr-label.curr{color:#006d2f}.nr-value{padding:12px 16px;border-radius:8px;font-size:1.3rem;font-weight:600}.nr-value.prev-val{background-color:#ffe5e5;color:#ba1a1a}.nr-value.curr-val{background-color:#c6f6c1;color:#006d2f}.nr-arrow{display:flex;align-items:center;justify-content:center;color:#6b6b47;padding-top:20px}.historial-card{background-color:#fafae8;border-radius:16px;padding:1.25rem 1.5rem;box-shadow:0 3px 10px #78724d0f;display:flex;flex-direction:column;gap:.8rem;transition:all .22s cubic-bezier(.16,1,.3,1)}.historial-card__header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed rgba(120,114,77,.15);padding-bottom:.65rem}.historial-card__title-area{display:flex;align-items:center;gap:.75rem}.historial-card__icon-wrapper{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background-color:#78724d1a;color:#5a5a46}.historial-card__icon-wrapper.state-change{background-color:#5963001a;color:#596300}.historial-card__icon-wrapper.doc-change{background-color:#3974c01a;color:#3974c0}.historial-card__id--local{background-color:#3974c014;color:#3974c0}.historial-card__title{margin:0;font-size:1.35rem;font-weight:700;color:#2c3016}.historial-card__id{font-size:1rem;font-weight:600;color:#7b7d60;background-color:#78724d14;padding:.2rem .6rem;border-radius:99px}.historial-card__body{display:flex;flex-direction:column;gap:.75rem}.historial-card__reason-box{border-left:3px solid #b2ac88;padding:.75rem 1rem;border-radius:4px 12px 12px 4px}.reason-label{display:flex;align-items:center;font-size:.95rem;font-weight:700;color:#615c3c;margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.03em}.reason-text{margin:0;font-size:1.25rem;font-weight:700;color:#383a30;line-height:1.45;white-space:pre-wrap}.historial-card__states-container{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;padding:.5rem 0;border-radius:8px}.states-label{font-size:1.1rem;font-weight:700;color:#615c3c}.historial-card__footer{display:flex;justify-content:flex-start;align-items:center;gap:1.8rem;border-top:1px solid rgba(120,114,77,.08);padding-top:.75rem;flex-wrap:wrap}.historial-card__meta-item{display:flex;align-items:center;gap:.6rem;font-size:1.15rem;color:#6b6a55}.historial-card__meta-item svg{color:#7b7d60}.historial-item__status-row{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}.history-arrow{color:#6d6a58;display:inline-flex;align-self:center}.status-chip{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.25rem .65rem;border-radius:6px;font-size:1.1rem;text-transform:uppercase;font-weight:600;line-height:1.2;white-space:nowrap;box-sizing:border-box;min-width:max-content;vertical-align:middle}.status-chip--active,.status-chip--restructured,.status-chip--process{background-color:#9dafd8;color:#0746cf}.status-chip--completed,.status-chip--paid{background-color:#9ed89d;color:#006d2f}.status-chip--pending{background-color:#d8bf9d;color:#cf6507}.status-chip--defaulted{background-color:#c7b0d8;color:#6a1b9a}.status-chip--cancelled{background-color:#d89d9d;color:#cf0707}.status-chip--neutral{background-color:#bac2bb;color:#40484c}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePipe, name: "date" }] });
|
|
6621
6623
|
}
|
|
6622
6624
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CardHistory, decorators: [{
|
|
6623
6625
|
type: Component,
|
|
6624
|
-
args: [{ selector: 'lib-card-history', imports: [NgClass, DatePipe], template: "@if(variant() == 'default' && withResponsible()) {\r\n<div class=\"card-history\">\r\n <span class=\"card-date\">{{ formatDate(DataCard()?.date || \"\") }}</span>\r\n <div class=\"event-card\" [class.expanded]=\"isExpanded()\">\r\n <div class=\"event-header\" (click)=\"toggleExpanded()\">\r\n <div class=\"event-info\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"expand-icon icon icon-tabler icons-tabler-outline icon-tabler-chevron-up\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M6 15l6 -6l6 6\" />\r\n </svg>\r\n <span class=\"event-type\">{{ DataCard()?.title }}</span>\r\n <span class=\"event-time\">{{ DataCard()?.time }}</span>\r\n </div>\r\n <div class=\"status-badges\">\r\n <span class=\"badge\" [ngClass]=\"getBadgeClass(DataCard()?.previousStatus || '')\">\r\n {{ DataCard()?.previousStatus }}\r\n </span>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-chevrons-right\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M7 7l5 5l-5 5\" />\r\n <path d=\"M13 7l5 5l-5 5\" />\r\n </svg>\r\n\r\n <span class=\"badge\" [ngClass]=\"getBadgeClass(DataCard()?.currentStatus || '')\">\r\n {{ DataCard()?.currentStatus }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"event-details\">\r\n <div class=\"responsible-info\">\r\n <div class=\"avatar\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-user\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\r\n <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\r\n </svg>\r\n </div>\r\n <div class=\"responsible-details\">\r\n <h4>Responsable</h4>\r\n <div class=\"responsible-name\">{{ DataCard()?.responsible }}</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"technical-description\">\r\n <div class=\"tech-label\">Descripci\u00F3n t\u00E9cnica</div>\r\n <div class=\"tech-content\">\r\n {{ DataCard()?.description }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n}\r\n\r\n@if(variant() == 'default' && !withResponsible()) {\r\n<div class=\"card-history\">\r\n <div class=\"event-card no-responsible\">\r\n <div class=\"nr-header\">\r\n <span class=\"nr-title\">{{ DataCard()?.title }}</span>\r\n <span class=\"nr-type\">({{ DataCard()?.type || 'estado' }})</span>\r\n </div>\r\n <div class=\"nr-body\">\r\n @if (DataCard()?.actionType === 'create') {\r\n <p class=\"nr-description\">\r\n El registro fue creado con los siguientes datos.\r\n </p>\r\n <div class=\"nr-comparison single\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label curr\">VALOR INICIAL</span>\r\n <div class=\"nr-value curr-val\">{{ DataCard()?.currentStatus }}</div>\r\n </div>\r\n </div>\r\n } @else if (DataCard()?.actionType === 'delete') {\r\n <p class=\"nr-description\">\r\n El registro fue eliminado permanentemente.\r\n </p>\r\n <div class=\"nr-comparison single\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label prev\">VALOR ELIMINADO</span>\r\n <div class=\"nr-value prev-val\">{{ DataCard()?.previousStatus }}</div>\r\n </div>\r\n </div>\r\n } @else {\r\n <p class=\"nr-description\">\r\n <span style=\"text-transform: capitalize;\">{{ DataCard()?.type || 'El registro' }}</span> cambi\u00F3 de \"{{\r\n DataCard()?.previousStatus }}\" a \"{{ DataCard()?.currentStatus }}\".\r\n </p>\r\n\r\n <div class=\"nr-comparison\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label prev\">VALOR ANTERIOR</span>\r\n <div class=\"nr-value prev-val\">{{ DataCard()?.previousStatus }}</div>\r\n </div>\r\n\r\n <div class=\"nr-arrow\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrow-right\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M5 12l14 0\" />\r\n <path d=\"M13 18l6 -6\" />\r\n <path d=\"M13 6l6 6\" />\r\n </svg>\r\n </div>\r\n\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label curr\">VALOR NUEVO</span>\r\n <div class=\"nr-value curr-val\">{{ DataCard()?.currentStatus }}</div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</div>\r\n}\r\n\r\n@if (variant() == 'history') {\r\n@let entry = historialEntry();\r\n<!-- Historial y movimientos -->\r\n<article class=\"historial-card\">\r\n <!-- Card Header -->\r\n <div class=\"historial-card__header\">\r\n <div class=\"historial-card__title-area\">\r\n <span class=\"historial-card__icon-wrapper\"\r\n [ngClass]=\"{'state-change': entry?.tipo === 'estado', 'doc-change': entry?.tipo === 'documento'}\">\r\n @if (entry?.tipo === 'documento') {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M14 3v4a1 1 0 0 0 1 1h4\" />\r\n <path d=\"M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z\" />\r\n <path d=\"M9 9l1 0\" />\r\n <path d=\"M9 13l6 0\" />\r\n <path d=\"M9 17l6 0\" />\r\n </svg>\r\n } @else if (entry?.previousState || entry?.currentState) {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M3 9l4 -4l4 4m-4 -4v14\" />\r\n <path d=\"M21 15l-4 4l-4 -4m4 4v-14\" />\r\n </svg>\r\n } @else {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M12 8l.01 0\" />\r\n <path d=\"M12 12l0 9\" />\r\n <path d=\"M12 3a9 9 0 1 0 9 9\" />\r\n </svg>\r\n }\r\n </span>\r\n <h3 class=\"historial-card__title\">{{ entry?.titulo }}</h3>\r\n </div>\r\n @if (entry?.tipo === 'estado') {\r\n <div class=\"historial-card__id\">ID #{{ entry?.id }}</div>\r\n } @else {\r\n <div class=\"historial-card__id historial-card__id--local\">{{ entry?.tipo === 'documento' ? 'Documento' : 'Movimiento' }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Card Body -->\r\n <div class=\"historial-card__body\">\r\n @if (entry?.detalle) {\r\n <div class=\"historial-card__reason-box\">\r\n <span class=\"reason-label\">Detalles</span>\r\n <p class=\"reason-text\">{{ entry?.detalle }}</p>\r\n </div>\r\n }\r\n\r\n @if (entry?.previousState || entry?.currentState) {\r\n <div class=\"historial-card__states-container\">\r\n <span class=\"states-label\">Transici\u00F3n:</span>\r\n <div class=\"historial-item__status-row\">\r\n @if (entry?.previousState) {\r\n <span class=\"status-chip\" [ngClass]=\"getStatusChipClass(entry!.previousState!)\">\r\n {{ statusLabel(entry!.previousState!) }}\r\n </span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"history-arrow\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M7 7l5 5l-5 5\" />\r\n <path d=\"M13 7l5 5l-5 5\" />\r\n </svg>\r\n }\r\n @if (entry?.currentState) {\r\n <span class=\"status-chip\" [ngClass]=\"getStatusChipClass(entry!.currentState!)\">\r\n {{ statusLabel(entry!.currentState!) }}\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Card Footer -->\r\n <div class=\"historial-card__footer\">\r\n <div class=\"historial-card__meta-item\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"me-1\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\r\n <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\r\n </svg>\r\n <span>Usuario: <strong>{{ entry?.createdBy || 'SISTEMA' }}</strong></span>\r\n </div>\r\n <div class=\"historial-card__meta-item\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"me-1\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z\" />\r\n <path d=\"M16 3v4\" />\r\n <path d=\"M8 3v4\" />\r\n <path d=\"M4 11h16\" />\r\n <path d=\"M11 15h1\" />\r\n <path d=\"M12 15v3\" />\r\n </svg>\r\n <span>{{ entry?.creationDate | date:'dd/MM/yyyy h:mm a' }}</span>\r\n </div>\r\n </div>\r\n</article>\r\n}", styles: [".card-history{display:flex;flex-direction:column;gap:15px}.card-date{color:#1c1c12;font-size:1.4rem;font-weight:600}.event-card{background-color:#f0f0db;border-radius:8px;margin-bottom:15px;overflow:hidden;border:1px solid #c7c7ad}.event-header{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.event-header:hover{background-color:#e0e0c8}.event-info{display:flex;align-items:center;gap:8px}.expand-icon{font-size:12px;transform:rotate(180deg);transition:transform .2s}.event-card.expanded .expand-icon{transform:rotate(90deg)}.event-type{font-weight:600;font-size:1.4rem;color:#1c1c12}.event-time{color:#454733;font-size:1.1rem}.status-badges{display:flex;align-items:center;gap:8px}.badge{padding:6px 10px;border-radius:6px;font-size:1.2rem;font-weight:600;border:none}.badge-maintenance{background:#bfd100;color:#4f5700}.badge-operational{background-color:#78db5c;color:#0f5e00}.badge-no-date{background-color:#bfe9ff;color:#004d65}.event-details{max-height:0;overflow:hidden;padding:0 10px;background-color:#f0f0e0;transition:max-height .3s ease-in-out,padding .3s ease-in-out}.event-card.expanded .event-details{max-height:300px;padding:20px 10px}.responsible-info{display:flex;align-items:center;gap:12px;margin-bottom:15px;padding:20px 10px;background-color:#ebe8d6;border-radius:8px}.avatar{width:36px;height:36px;border-radius:50%;background-color:#bfd100;display:flex;align-items:center;justify-content:center;font-weight:700}.avatar img{width:24px;height:24px}.responsible-details h4{font-size:1.2rem;color:#454733;margin-bottom:2px;font-weight:400}.responsible-name{font-size:1.4rem;font-weight:600;color:#1c1c12}.technical-description{padding:20px 10px;background-color:#ebe8d6;border-radius:8px;height:120px}.tech-label{font-size:1.2rem;color:#454733;margin-bottom:5px}.tech-content{font-size:1.4rem;color:#1c1c12;font-weight:600}.badge-active{color:#006d2f;font-weight:600;background-color:#c6f6c1;border-radius:8px;padding:6px 10px}.badge-inactive{color:#454733e7;font-weight:600;background-color:#e0e0e0;border-radius:8px;padding:6px 10px}.badge-retired{color:#ba1a1a;font-weight:600;background-color:#ffe5e5;border-radius:8px;padding:6px 10px}.badge-obsolete{color:#454733;font-weight:600;border:1px solid #c7c7ad;border-radius:8px;padding:6px 10px}.badge-operativo{color:#0f5e00;font-weight:600;background-color:#80ff66;border-radius:8px;padding:6px 10px}.badge-maintenance{color:#4f5700;font-weight:600;background-color:#bfd100;border-radius:8px;padding:6px 10px}.badge-failures{color:#94000a;font-weight:600;background-color:#fcd;border-radius:8px;padding:6px 10px}.badge-deactivated{color:#ba1a1a;font-weight:600;border:1px solid #ba1a1a;border-radius:8px;padding:6px 10px}.badge-default{color:#6b6b47;font-weight:600;border:1px dashed #c7c7ad;border-radius:8px;padding:6px 10px;font-style:italic}.nr-header{padding:12px 16px;border-bottom:1px solid #c7c7ad;display:flex;align-items:center;gap:6px}.nr-title{font-weight:600;font-size:1.4rem;color:#1c1c12}.nr-type{font-size:1.2rem;color:#6b6b47}.nr-body{padding:16px}.nr-description{font-size:1.3rem;color:#454733;margin:0 0 16px}.nr-comparison{display:flex;align-items:center;gap:16px}.nr-col{flex:1;display:flex;flex-direction:column;gap:8px}.nr-label{font-size:1.1rem;font-weight:700;text-transform:uppercase}.nr-label.prev{color:#ba1a1a}.nr-label.curr{color:#006d2f}.nr-value{padding:12px 16px;border-radius:8px;font-size:1.3rem;font-weight:600}.nr-value.prev-val{background-color:#ffe5e5;color:#ba1a1a}.nr-value.curr-val{background-color:#c6f6c1;color:#006d2f}.nr-arrow{display:flex;align-items:center;justify-content:center;color:#6b6b47;padding-top:20px}.historial-card{background-color:#fafae8;border-radius:16px;padding:1.25rem 1.5rem;box-shadow:0 3px 10px #78724d0f;display:flex;flex-direction:column;gap:.8rem;transition:all .22s cubic-bezier(.16,1,.3,1)}.historial-card__header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed rgba(120,114,77,.15);padding-bottom:.65rem}.historial-card__title-area{display:flex;align-items:center;gap:.75rem}.historial-card__icon-wrapper{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background-color:#78724d1a;color:#5a5a46}.historial-card__icon-wrapper.state-change{background-color:#5963001a;color:#596300}.historial-card__icon-wrapper.doc-change{background-color:#3974c01a;color:#3974c0}.historial-card__id--local{background-color:#3974c014;color:#3974c0}.historial-card__title{margin:0;font-size:1.35rem;font-weight:700;color:#2c3016}.historial-card__id{font-size:1rem;font-weight:600;color:#7b7d60;background-color:#78724d14;padding:.2rem .6rem;border-radius:99px}.historial-card__body{display:flex;flex-direction:column;gap:.75rem}.historial-card__reason-box{border-left:3px solid #b2ac88;padding:.75rem 1rem;border-radius:4px 12px 12px 4px}.reason-label{display:flex;align-items:center;font-size:.95rem;font-weight:700;color:#615c3c;margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.03em}.reason-text{margin:0;font-size:1.25rem;font-weight:700;color:#383a30;line-height:1.45;white-space:pre-wrap}.historial-card__states-container{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;padding:.5rem 0;border-radius:8px}.states-label{font-size:1.1rem;font-weight:700;color:#615c3c}.historial-card__footer{display:flex;justify-content:flex-start;align-items:center;gap:1.8rem;border-top:1px solid rgba(120,114,77,.08);padding-top:.75rem;flex-wrap:wrap}.historial-card__meta-item{display:flex;align-items:center;gap:.6rem;font-size:1.15rem;color:#6b6a55}.historial-card__meta-item svg{color:#7b7d60}.historial-item__status-row{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}.history-arrow{color:#6d6a58;display:inline-flex;align-self:center}.status-chip{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.25rem .65rem;border-radius:6px;font-size:1.1rem;text-transform:uppercase;font-weight:600;line-height:1.2;white-space:nowrap;box-sizing:border-box;min-width:max-content;vertical-align:middle}.status-chip--active,.status-chip--restructured{background-color:#9dafd8;color:#0746cf}.status-chip--completed,.status-chip--paid{background-color:#9ed89d;color:#006d2f}.status-chip--pending{background-color:#d8bf9d;color:#cf6507}.status-chip--defaulted{background-color:#c7b0d8;color:#6a1b9a}.status-chip--cancelled{background-color:#d89d9d;color:#cf0707}.status-chip--neutral{background-color:#bac2bb;color:#40484c}\n"] }]
|
|
6626
|
+
args: [{ selector: 'lib-card-history', imports: [NgClass, DatePipe], template: "@if(variant() == 'default' && withResponsible()) {\r\n<div class=\"card-history\">\r\n <span class=\"card-date\">{{ formatDate(DataCard()?.date || \"\") }}</span>\r\n <div class=\"event-card\" [class.expanded]=\"isExpanded()\">\r\n <div class=\"event-header\" (click)=\"toggleExpanded()\">\r\n <div class=\"event-info\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"expand-icon icon icon-tabler icons-tabler-outline icon-tabler-chevron-up\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M6 15l6 -6l6 6\" />\r\n </svg>\r\n <span class=\"event-type\">{{ DataCard()?.title }}</span>\r\n <span class=\"event-time\">{{ DataCard()?.time }}</span>\r\n </div>\r\n <div class=\"status-badges\">\r\n <span class=\"badge\" [ngClass]=\"getBadgeClass(DataCard()?.previousStatus || '')\">\r\n {{ DataCard()?.previousStatus }}\r\n </span>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-chevrons-right\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M7 7l5 5l-5 5\" />\r\n <path d=\"M13 7l5 5l-5 5\" />\r\n </svg>\r\n\r\n <span class=\"badge\" [ngClass]=\"getBadgeClass(DataCard()?.currentStatus || '')\">\r\n {{ DataCard()?.currentStatus }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"event-details\">\r\n <div class=\"responsible-info\">\r\n <div class=\"avatar\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-user\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\r\n <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\r\n </svg>\r\n </div>\r\n <div class=\"responsible-details\">\r\n <h4>Responsable</h4>\r\n <div class=\"responsible-name\">{{ DataCard()?.responsible }}</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"technical-description\">\r\n <div class=\"tech-label\">Descripci\u00F3n t\u00E9cnica</div>\r\n <div class=\"tech-content\">\r\n {{ DataCard()?.description }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n}\r\n\r\n@if(variant() == 'default' && !withResponsible()) {\r\n<div class=\"card-history\">\r\n <div class=\"event-card no-responsible\">\r\n <div class=\"nr-header\">\r\n <span class=\"nr-title\">{{ DataCard()?.title }}</span>\r\n <span class=\"nr-type\">({{ DataCard()?.type || 'estado' }})</span>\r\n </div>\r\n <div class=\"nr-body\">\r\n @if (DataCard()?.actionType === 'create') {\r\n <p class=\"nr-description\">\r\n El registro fue creado con los siguientes datos.\r\n </p>\r\n <div class=\"nr-comparison single\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label curr\">VALOR INICIAL</span>\r\n <div class=\"nr-value curr-val\">{{ DataCard()?.currentStatus }}</div>\r\n </div>\r\n </div>\r\n } @else if (DataCard()?.actionType === 'delete') {\r\n <p class=\"nr-description\">\r\n El registro fue eliminado permanentemente.\r\n </p>\r\n <div class=\"nr-comparison single\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label prev\">VALOR ELIMINADO</span>\r\n <div class=\"nr-value prev-val\">{{ DataCard()?.previousStatus }}</div>\r\n </div>\r\n </div>\r\n } @else {\r\n <p class=\"nr-description\">\r\n <span style=\"text-transform: capitalize;\">{{ DataCard()?.type || 'El registro' }}</span> cambi\u00F3 de \"{{\r\n DataCard()?.previousStatus }}\" a \"{{ DataCard()?.currentStatus }}\".\r\n </p>\r\n\r\n <div class=\"nr-comparison\">\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label prev\">VALOR ANTERIOR</span>\r\n <div class=\"nr-value prev-val\">{{ DataCard()?.previousStatus }}</div>\r\n </div>\r\n\r\n <div class=\"nr-arrow\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrow-right\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M5 12l14 0\" />\r\n <path d=\"M13 18l6 -6\" />\r\n <path d=\"M13 6l6 6\" />\r\n </svg>\r\n </div>\r\n\r\n <div class=\"nr-col\">\r\n <span class=\"nr-label curr\">VALOR NUEVO</span>\r\n <div class=\"nr-value curr-val\">{{ DataCard()?.currentStatus }}</div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</div>\r\n}\r\n\r\n@if (variant() == 'history') {\r\n@let entry = historialEntry();\r\n<!-- Historial y movimientos -->\r\n<article class=\"historial-card\">\r\n <!-- Card Header -->\r\n <div class=\"historial-card__header\">\r\n <div class=\"historial-card__title-area\">\r\n <span class=\"historial-card__icon-wrapper\"\r\n [ngClass]=\"{'state-change': entry?.tipo === 'estado', 'doc-change': entry?.tipo === 'documento'}\">\r\n @if (entry?.tipo === 'documento') {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M14 3v4a1 1 0 0 0 1 1h4\" />\r\n <path d=\"M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z\" />\r\n <path d=\"M9 9l1 0\" />\r\n <path d=\"M9 13l6 0\" />\r\n <path d=\"M9 17l6 0\" />\r\n </svg>\r\n } @else if (entry?.previousState || entry?.currentState) {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M3 9l4 -4l4 4m-4 -4v14\" />\r\n <path d=\"M21 15l-4 4l-4 -4m4 4v-14\" />\r\n </svg>\r\n } @else {\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M12 8l.01 0\" />\r\n <path d=\"M12 12l0 9\" />\r\n <path d=\"M12 3a9 9 0 1 0 9 9\" />\r\n </svg>\r\n }\r\n </span>\r\n <h3 class=\"historial-card__title\">{{ entry?.titulo }}</h3>\r\n </div>\r\n @if (entry?.tipo === 'estado') {\r\n <div class=\"historial-card__id\">ID #{{ entry?.id }}</div>\r\n } @else {\r\n <div class=\"historial-card__id historial-card__id--local\">{{ entry?.tipo === 'documento' ? 'Documento' : 'Movimiento' }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Card Body -->\r\n <div class=\"historial-card__body\">\r\n @if (entry?.detalle) {\r\n <div class=\"historial-card__reason-box\">\r\n <span class=\"reason-label\">Detalles</span>\r\n <p class=\"reason-text\">{{ entry?.detalle }}</p>\r\n </div>\r\n }\r\n\r\n @if (entry?.previousState || entry?.currentState) {\r\n <div class=\"historial-card__states-container\">\r\n <span class=\"states-label\">Transici\u00F3n:</span>\r\n <div class=\"historial-item__status-row\">\r\n @if (entry?.previousState) {\r\n <span class=\"status-chip\" [ngClass]=\"getStatusChipClass(entry!.previousState!)\">\r\n {{ statusLabel(entry!.previousState!) }}\r\n </span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"history-arrow\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M7 7l5 5l-5 5\" />\r\n <path d=\"M13 7l5 5l-5 5\" />\r\n </svg>\r\n }\r\n @if (entry?.currentState) {\r\n <span class=\"status-chip\" [ngClass]=\"getStatusChipClass(entry!.currentState!)\">\r\n {{ statusLabel(entry!.currentState!) }}\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Card Footer -->\r\n <div class=\"historial-card__footer\">\r\n <div class=\"historial-card__meta-item\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"me-1\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\r\n <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\r\n </svg>\r\n <span>Usuario: <strong>{{ entry?.createdBy || 'SISTEMA' }}</strong></span>\r\n </div>\r\n <div class=\"historial-card__meta-item\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"me-1\">\r\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\r\n <path d=\"M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z\" />\r\n <path d=\"M16 3v4\" />\r\n <path d=\"M8 3v4\" />\r\n <path d=\"M4 11h16\" />\r\n <path d=\"M11 15h1\" />\r\n <path d=\"M12 15v3\" />\r\n </svg>\r\n <span>{{ entry?.creationDate | date:'dd/MM/yyyy h:mm a' }}</span>\r\n </div>\r\n </div>\r\n</article>\r\n}", styles: [".card-history{display:flex;flex-direction:column;gap:15px}.card-date{color:#1c1c12;font-size:1.4rem;font-weight:600}.event-card{background-color:#f0f0db;border-radius:8px;margin-bottom:15px;overflow:hidden;border:1px solid #c7c7ad}.event-header{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.event-header:hover{background-color:#e0e0c8}.event-info{display:flex;align-items:center;gap:8px}.expand-icon{font-size:12px;transform:rotate(180deg);transition:transform .2s}.event-card.expanded .expand-icon{transform:rotate(90deg)}.event-type{font-weight:600;font-size:1.4rem;color:#1c1c12}.event-time{color:#454733;font-size:1.1rem}.status-badges{display:flex;align-items:center;gap:8px}.badge{padding:6px 10px;border-radius:6px;font-size:1.2rem;font-weight:600;border:none}.badge-maintenance{background:#bfd100;color:#4f5700}.badge-operational{background-color:#78db5c;color:#0f5e00}.badge-no-date{background-color:#bfe9ff;color:#004d65}.event-details{max-height:0;overflow:hidden;padding:0 10px;background-color:#f0f0e0;transition:max-height .3s ease-in-out,padding .3s ease-in-out}.event-card.expanded .event-details{max-height:300px;padding:20px 10px}.responsible-info{display:flex;align-items:center;gap:12px;margin-bottom:15px;padding:20px 10px;background-color:#ebe8d6;border-radius:8px}.avatar{width:36px;height:36px;border-radius:50%;background-color:#bfd100;display:flex;align-items:center;justify-content:center;font-weight:700}.avatar img{width:24px;height:24px}.responsible-details h4{font-size:1.2rem;color:#454733;margin-bottom:2px;font-weight:400}.responsible-name{font-size:1.4rem;font-weight:600;color:#1c1c12}.technical-description{padding:20px 10px;background-color:#ebe8d6;border-radius:8px;height:120px}.tech-label{font-size:1.2rem;color:#454733;margin-bottom:5px}.tech-content{font-size:1.4rem;color:#1c1c12;font-weight:600}.badge-active{color:#006d2f;font-weight:600;background-color:#c6f6c1;border-radius:8px;padding:6px 10px}.badge-inactive{color:#454733e7;font-weight:600;background-color:#e0e0e0;border-radius:8px;padding:6px 10px}.badge-retired{color:#ba1a1a;font-weight:600;background-color:#ffe5e5;border-radius:8px;padding:6px 10px}.badge-obsolete{color:#454733;font-weight:600;border:1px solid #c7c7ad;border-radius:8px;padding:6px 10px}.badge-operativo{color:#0f5e00;font-weight:600;background-color:#80ff66;border-radius:8px;padding:6px 10px}.badge-maintenance{color:#4f5700;font-weight:600;background-color:#bfd100;border-radius:8px;padding:6px 10px}.badge-failures{color:#94000a;font-weight:600;background-color:#fcd;border-radius:8px;padding:6px 10px}.badge-deactivated{color:#ba1a1a;font-weight:600;border:1px solid #ba1a1a;border-radius:8px;padding:6px 10px}.badge-default{color:#6b6b47;font-weight:600;border:1px dashed #c7c7ad;border-radius:8px;padding:6px 10px;font-style:italic}.nr-header{padding:12px 16px;border-bottom:1px solid #c7c7ad;display:flex;align-items:center;gap:6px}.nr-title{font-weight:600;font-size:1.4rem;color:#1c1c12}.nr-type{font-size:1.2rem;color:#6b6b47}.nr-body{padding:16px}.nr-description{font-size:1.3rem;color:#454733;margin:0 0 16px}.nr-comparison{display:flex;align-items:center;gap:16px}.nr-col{flex:1;display:flex;flex-direction:column;gap:8px}.nr-label{font-size:1.1rem;font-weight:700;text-transform:uppercase}.nr-label.prev{color:#ba1a1a}.nr-label.curr{color:#006d2f}.nr-value{padding:12px 16px;border-radius:8px;font-size:1.3rem;font-weight:600}.nr-value.prev-val{background-color:#ffe5e5;color:#ba1a1a}.nr-value.curr-val{background-color:#c6f6c1;color:#006d2f}.nr-arrow{display:flex;align-items:center;justify-content:center;color:#6b6b47;padding-top:20px}.historial-card{background-color:#fafae8;border-radius:16px;padding:1.25rem 1.5rem;box-shadow:0 3px 10px #78724d0f;display:flex;flex-direction:column;gap:.8rem;transition:all .22s cubic-bezier(.16,1,.3,1)}.historial-card__header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed rgba(120,114,77,.15);padding-bottom:.65rem}.historial-card__title-area{display:flex;align-items:center;gap:.75rem}.historial-card__icon-wrapper{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background-color:#78724d1a;color:#5a5a46}.historial-card__icon-wrapper.state-change{background-color:#5963001a;color:#596300}.historial-card__icon-wrapper.doc-change{background-color:#3974c01a;color:#3974c0}.historial-card__id--local{background-color:#3974c014;color:#3974c0}.historial-card__title{margin:0;font-size:1.35rem;font-weight:700;color:#2c3016}.historial-card__id{font-size:1rem;font-weight:600;color:#7b7d60;background-color:#78724d14;padding:.2rem .6rem;border-radius:99px}.historial-card__body{display:flex;flex-direction:column;gap:.75rem}.historial-card__reason-box{border-left:3px solid #b2ac88;padding:.75rem 1rem;border-radius:4px 12px 12px 4px}.reason-label{display:flex;align-items:center;font-size:.95rem;font-weight:700;color:#615c3c;margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.03em}.reason-text{margin:0;font-size:1.25rem;font-weight:700;color:#383a30;line-height:1.45;white-space:pre-wrap}.historial-card__states-container{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;padding:.5rem 0;border-radius:8px}.states-label{font-size:1.1rem;font-weight:700;color:#615c3c}.historial-card__footer{display:flex;justify-content:flex-start;align-items:center;gap:1.8rem;border-top:1px solid rgba(120,114,77,.08);padding-top:.75rem;flex-wrap:wrap}.historial-card__meta-item{display:flex;align-items:center;gap:.6rem;font-size:1.15rem;color:#6b6a55}.historial-card__meta-item svg{color:#7b7d60}.historial-item__status-row{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}.history-arrow{color:#6d6a58;display:inline-flex;align-self:center}.status-chip{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.25rem .65rem;border-radius:6px;font-size:1.1rem;text-transform:uppercase;font-weight:600;line-height:1.2;white-space:nowrap;box-sizing:border-box;min-width:max-content;vertical-align:middle}.status-chip--active,.status-chip--restructured,.status-chip--process{background-color:#9dafd8;color:#0746cf}.status-chip--completed,.status-chip--paid{background-color:#9ed89d;color:#006d2f}.status-chip--pending{background-color:#d8bf9d;color:#cf6507}.status-chip--defaulted{background-color:#c7b0d8;color:#6a1b9a}.status-chip--cancelled{background-color:#d89d9d;color:#cf0707}.status-chip--neutral{background-color:#bac2bb;color:#40484c}\n"] }]
|
|
6625
6627
|
}], propDecorators: { DataCard: [{ type: i0.Input, args: [{ isSignal: true, alias: "DataCard", required: false }] }], historialEntry: [{ type: i0.Input, args: [{ isSignal: true, alias: "historialEntry", required: false }] }], withResponsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "withResponsible", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
|
|
6626
6628
|
|
|
6627
6629
|
class Signature {
|