|
|
@@ -0,0 +1,745 @@
|
|
|
+<div *ngIf="!summary">
|
|
|
+ <h4 class="card-title">
|
|
|
+ Bonos
|
|
|
+ </h4>
|
|
|
+ <form
|
|
|
+ class="form-auth-small ng-untouched ng-pristine ng-valid"
|
|
|
+ [formGroup]="investmentProposalForm"
|
|
|
+ >
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="cuota_participacion">Cuota de participación: </label>
|
|
|
+ <div class="input-box-container">
|
|
|
+ <p>
|
|
|
+ <i class="fas fa-dollar-sign" aria-hidden="true"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ formControlName="cuota_participacion"
|
|
|
+ class="form-control"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.cuota_participacion.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.cuota_participacion.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.cuota_participacion.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ <div *ngIf="f.cuota_participacion.errors.pattern">
|
|
|
+ Debe ingresar una cifra válida
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="valor_participacion">Valor participación: </label>
|
|
|
+ <div class="input-box-container">
|
|
|
+ <p>
|
|
|
+ <i class="fas fa-dollar-sign"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ formControlName="valor_participacion"
|
|
|
+ class="form-control"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.valor_participacion.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.valor_participacion.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.valor_participacion.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ <div *ngIf="f.valor_participacion.errors.pattern">
|
|
|
+ Debe ingresar una cifra válida
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Comisión casa -->
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="comision_casa_porcentaje">Comisión casa: </label>
|
|
|
+ <div class="input-box-container">
|
|
|
+ <p>
|
|
|
+ <i class="fas fa-percent" aria-hidden="true"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ formControlName="comision_casa_porcentaje"
|
|
|
+ class="form-control"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.comision_casa_porcentaje.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.comision_casa_porcentaje.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.comision_casa_porcentaje.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ <div *ngIf="f.comision_casa_porcentaje.errors.pattern">
|
|
|
+ Debe ingresar una cifra válida
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Comisión bolsa -->
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="comision_bolsa_porcentaje">Comisión bolsa: </label>
|
|
|
+ <div class="input-box-container">
|
|
|
+ <p>
|
|
|
+ <i class="fas fa-percent" aria-hidden="true"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ formControlName="comision_bolsa_porcentaje"
|
|
|
+ class="form-control"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.comision_bolsa_porcentaje.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.comision_bolsa_porcentaje.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.comision_bolsa_porcentaje.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ <div *ngIf="f.comision_bolsa_porcentaje.errors.pattern">
|
|
|
+ Debe ingresar una cifra válida
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Dividendo porcentaje -->
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="dividendo_porcentaje">Dividendo </label>
|
|
|
+ <div class="input-box-container">
|
|
|
+ <p>
|
|
|
+ <i class="fas fa-percent" aria-hidden="true"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ formControlName="dividendo_porcentaje"
|
|
|
+ class="form-control"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.dividendo_porcentaje.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.dividendo_porcentaje.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.dividendo_porcentaje.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ <div *ngIf="f.dividendo_porcentaje.errors.pattern">
|
|
|
+ Debe ingresar una cifra válida
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Rendimiento -->
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="rendimiento_porcentaje">Rendimiento: </label>
|
|
|
+ <div class="input-box-container">
|
|
|
+ <p>
|
|
|
+ <i class="fas fa-percent"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ formControlName="rendimiento_porcentaje"
|
|
|
+ class="form-control"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.rendimiento_porcentaje.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.rendimiento_porcentaje.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.rendimiento_porcentaje.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ <div *ngIf="f.rendimiento_porcentaje.errors.pattern">
|
|
|
+ Debe ingresar una cifra válida
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Días liquidación -->
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="dias_liquidacion">Días liquidación: </label>
|
|
|
+ <div class="input-box-container">
|
|
|
+ <p>
|
|
|
+ <i class="fas fa-calendar-alt"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ formControlName="dias_liquidacion"
|
|
|
+ class="form-control"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.dias_liquidacion.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.dias_liquidacion.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.dias_liquidacion.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ <div *ngIf="f.dias_liquidacion.errors.pattern">
|
|
|
+ Debe ingresar una cifra válida
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Días vencimiento -->
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="dias_vencimiento">Días vencimiento: </label>
|
|
|
+ <div class="input-box-container">
|
|
|
+ <p>
|
|
|
+ <i class="fas fa-calendar-alt"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ formControlName="dias_vencimiento"
|
|
|
+ class="form-control"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.dias_vencimiento.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.dias_vencimiento.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.dias_vencimiento.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ <div *ngIf="f.dias_vencimiento.errors.pattern">
|
|
|
+ Debe ingresar una cifra válida
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Fecha de operación -->
|
|
|
+ <div class="col-lg-6 col-sm-12 pr-xl-3">
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="fecha_operacion">Fecha de operación </label>
|
|
|
+
|
|
|
+ <div class="input-box-container">
|
|
|
+ <div>
|
|
|
+ <p>
|
|
|
+ <i class="far fa-calendar" aria-hidden="true"></i>
|
|
|
+ </p>
|
|
|
+ <input
|
|
|
+ class="input-box form-control"
|
|
|
+ placeholder="Seleccione una fecha"
|
|
|
+ angular-mydatepicker
|
|
|
+ formControlName="fecha_operacion"
|
|
|
+ (click)="dp1.toggleCalendar()"
|
|
|
+ [options]="myDpOptions"
|
|
|
+ #dp1="angular-mydatepicker"
|
|
|
+ [ngClass]="{
|
|
|
+ 'is-invalid': submitted && f.fecha_operacion.errors
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div
|
|
|
+ *ngIf="submitted && f.fecha_operacion.errors"
|
|
|
+ class="invalid-feedback"
|
|
|
+ >
|
|
|
+ <div *ngIf="f.fecha_operacion.errors.required">
|
|
|
+ Campo requerido
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-12 col-sm-12 pr-xl-12">
|
|
|
+ <div class="form-group text-right">
|
|
|
+ <br />
|
|
|
+ <button
|
|
|
+ type="button"
|
|
|
+ class="btn btn-success center-component"
|
|
|
+ (click)="getCalculations(investmentProposalForm, false)"
|
|
|
+ >
|
|
|
+ Realizar cálculos
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <br />
|
|
|
+ <!-- Calculos del instrumento-->
|
|
|
+ <div class="instrument-calcs">
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-12">
|
|
|
+ <span class="badge badge-success badge-custom"
|
|
|
+ >Cálculos del instrumento</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Cuota participación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ $USD {{ cuota_participacion | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Valor participación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ $USD {{ valor_participacion | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Días liquidación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ dias_liquidacion }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Días vencimiento:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ dias_vencimiento }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Valor nominal:</h4>
|
|
|
+ <div class="field">$USD {{ valor_nominal | number: "1.2-4" }}</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Valor transado:</h4>
|
|
|
+ <div class="field">$USD {{ valor_transado | number: "1.2-4" }}</div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Comisión casa (%):</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ comision_casa_porcentaje | number: "1.2-4" }}
|
|
|
+ %
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <div class="field">
|
|
|
+ <h4>Comisión casa:</h4>
|
|
|
+ $USD {{ comision_casa | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Comisión bolsa (%):</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ comision_bolsa_porcentaje | number: "1.2-4" }}
|
|
|
+ %
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <div class="field">
|
|
|
+ <h4>Comisión bolsa:</h4>
|
|
|
+ $USD {{ comision_bolsa | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Rendimiento (%):</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ rendimiento_porcentaje | number: "1.2-4" }}
|
|
|
+ %
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Dividendo (%):</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ dividendo_porcentaje | number: "1.2-4" }}
|
|
|
+ %
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Fecha operación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ fecha_operacion }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Fecha liquidación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ fecha_liquidacion }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <h4>Fecha vencimiento:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ fecha_vencimiento }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <br />
|
|
|
+ <!-- Tabla de proyecciones del instrumento-->
|
|
|
+ <div class="instrument-calcs">
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-12">
|
|
|
+ <span class="badge badge-success badge-custom"
|
|
|
+ >Proyecciones del instrumento</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="cete-table-container">
|
|
|
+ <table mat-table [dataSource]="dataSource" class="example-table">
|
|
|
+ <!-- Name Column -->
|
|
|
+ <ng-container matColumnDef="posicion">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>#</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{ row.posicion }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <!-- Country Column -->
|
|
|
+ <ng-container matColumnDef="plazo">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Plazo</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{ row.plazo }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+
|
|
|
+ <ng-container matColumnDef="fecha_pago">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Fecha pago</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.fecha_pago == "" || row.fecha_pago == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.fecha_pago
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="ingreso_bruto">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Ingreso bruto</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.ingreso_bruto == "" || row.ingreso_bruto == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.ingreso_bruto
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="ingreso_neto">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Ingreso neto</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.ingreso_neto == "" || row.ingreso_neto == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.ingreso_neto
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="dividendo_porcentaje">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Dividendo (%)</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.dividendo_porcentaje == "" ||
|
|
|
+ row.dividendo_porcentaje == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.dividendo_porcentaje
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="rendimiento_porcentaje">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Rendimiento (%)</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.rendimiento_porcentaje == "" ||
|
|
|
+ row.rendimiento_porcentaje == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.rendimiento_porcentaje
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="rendimiento">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Rendimiento ($)</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.rendimiento == "" || row.rendimiento == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.rendimiento
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+
|
|
|
+ <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
|
|
+ <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <br />
|
|
|
+ <div class="form-group text-center space-20">
|
|
|
+ <button
|
|
|
+ type="button"
|
|
|
+ class="btn btn-default center-component margin-right"
|
|
|
+ (click)="goToPrevious()"
|
|
|
+ >
|
|
|
+ Anterior
|
|
|
+ </button>
|
|
|
+ <button
|
|
|
+ type="submit"
|
|
|
+ class="btn btn-primary center-component margin-right"
|
|
|
+ (click)="goToNext(investmentProposalForm)"
|
|
|
+ >
|
|
|
+ Siguiente
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+</div>
|
|
|
+
|
|
|
+<div *ngIf="summary">
|
|
|
+ <div class="timeline-body">
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Cuota participación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ $USD
|
|
|
+ {{ instrument_work_summary.cuota_participacion | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Valor participación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ $USD
|
|
|
+ {{ instrument_work_summary.valor_participacion | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Días liquidación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ instrument_work_summary.dias_liquidacion }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Días vencimiento:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ instrument_work_summary.dias_vencimiento }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Valor nominal:</h4>
|
|
|
+ <div class="field">
|
|
|
+ $USD {{ instrument_work_summary.valor_nominal | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Valor transado:</h4>
|
|
|
+ <div class="field">
|
|
|
+ $USD {{ instrument_work_summary.valor_transado | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Comisión casa (%):</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{
|
|
|
+ instrument_work_summary.comision_casa_porcentaje | number: "1.2-4"
|
|
|
+ }}
|
|
|
+ %
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <div class="field">
|
|
|
+ <h4>Comisión casa:</h4>
|
|
|
+ $USD {{ instrument_work_summary.comision_casa | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Comisión bolsa (%):</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{
|
|
|
+ instrument_work_summary.comision_bolsa_porcentaje | number: "1.2-4"
|
|
|
+ }}
|
|
|
+ %
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <div class="field">
|
|
|
+ <h4>Comisión bolsa:</h4>
|
|
|
+ $USD {{ instrument_work_summary.comision_bolsa | number: "1.2-4" }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Rendimiento (%):</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ instrument_work_summary.rendimiento_porcentaje | number: "1.2-4" }}
|
|
|
+ %
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Dividendo (%):</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ instrument_work_summary.dividendo_porcentaje | number: "1.2-4" }}
|
|
|
+ %
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Fecha operación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ instrument_work_summary.fecha_operacion }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Fecha liquidación:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ instrument_work_summary.fecha_liquidacion }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-lg-3 col-md-4 col-sm-6">
|
|
|
+ <h4>Fecha vencimiento:</h4>
|
|
|
+ <div class="field">
|
|
|
+ {{ instrument_work_summary.fecha_vencimiento }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div *ngIf="hasProjections" class="instrument-calcs-summary">
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-12">
|
|
|
+ <span class="badge-warning badge-custom-instrument"
|
|
|
+ >Proyecciones del instrumento</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="cete-table-container">
|
|
|
+ <table mat-table [dataSource]="dataSource2" class="example-table">
|
|
|
+ <!-- Name Column -->
|
|
|
+ <ng-container matColumnDef="posicion">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>#</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{ row.posicion }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <!-- Country Column -->
|
|
|
+ <ng-container matColumnDef="plazo">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Plazo</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{ row.plazo }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+
|
|
|
+ <ng-container matColumnDef="fecha_pago">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Fecha pago</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.fecha_pago == "" || row.fecha_pago == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.fecha_pago
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="ingreso_bruto">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Ingreso bruto</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.ingreso_bruto == "" || row.ingreso_bruto == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.ingreso_bruto
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="ingreso_neto">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Ingreso neto</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.ingreso_neto == "" || row.ingreso_neto == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.ingreso_neto
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="dividendo_porcentaje">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Dividendo (%)</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.dividendo_porcentaje == "" ||
|
|
|
+ row.dividendo_porcentaje == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.dividendo_porcentaje
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="rendimiento_porcentaje">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Rendimiento (%)</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.rendimiento_porcentaje == "" ||
|
|
|
+ row.rendimiento_porcentaje == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.rendimiento_porcentaje
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+ <ng-container matColumnDef="rendimiento">
|
|
|
+ <th mat-header-cell *matHeaderCellDef>Rendimiento ($)</th>
|
|
|
+ <td mat-cell *matCellDef="let row">
|
|
|
+ {{
|
|
|
+ row.rendimiento == "" || row.rendimiento == undefined
|
|
|
+ ? "-"
|
|
|
+ : row.rendimiento
|
|
|
+ }}
|
|
|
+ </td>
|
|
|
+ </ng-container>
|
|
|
+
|
|
|
+ <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
|
|
+ <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</div>
|