Feat:New changes

This commit is contained in:
2024-09-24 13:02:13 +05:30
parent 43fb643d9f
commit da96f2ea7d
3 changed files with 149 additions and 71 deletions

View File

@@ -1,46 +1,49 @@
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="variableCal">
<form [formGroup]="formGroup">
<div class="form-group" formArrayName="items" *ngFor="let item of items.controls; let i = index">
<div class="row" [formGroupName]="i">
<div class="col-md-3">
<select formControlName="type" (change)="onTypeChange(i)" class="form-control">
<option value="" selected disabled > Select </option>
<option value="variable">Variable</option>
<option value="text">Text</option>
</select>
</div>
<div class="col-md-3" *ngIf="item.get('type')?.value === 'variable'">
<select formControlName="variable" class="form-control">
<option value="" selected disabled > Select </option>
<option *ngFor="let v of variableList" [value]="v">{{ v }}</option>
</select>
<div>
<p>Variable Calculation: {{ calculateVariable(i) }}</p>
<div class="row">
<div class="col-md-12">
<div class="variableCal">
<form [formGroup]="form" (ngSubmit)="onSubmit()">
<div formArrayName="rows">
<div *ngFor="let row of rows.controls; let rowIndex = index" [formGroupName]="rowIndex">
<div formArrayName="columns" class="add-col-section">
<div *ngFor="let column of getColumns(row).controls; let colIndex = index" [formGroupName]="colIndex">
<div class="row">
<div class="col-md-2">
<div class="form-group">
<select formControlName="type" class="form-control" >
<option value="text">Text</option>
<option value="variable">Variable</option>
</select>
</div>
</div>
<div class="col-md-2" *ngIf="isText(row, colIndex)">
<div class="form-group" >
<input type="text" formControlName="textValue" placeholder="Enter text" class="form-control" >
</div>
</div>
<div class="col-md-2" *ngIf="isVariable(row, colIndex)">
<div class="form-group" >
<select formControlName="variableValue" class="form-control" >
<option *ngFor="let variable of variableList" [value]="variable">{{ variable }}</option>
</select>
</div>
</div>
</div>
</div>
<div *ngIf="item.get('type')?.value === 'text'" class="col-md-3">
<input formControlName="text" placeholder="Enter text here" class="form-control" />
</div>
<div class="col-md-3">
<button class="btn btn-danger" (click)="removeRow(i)" *ngIf="items.length > 1">Remove Row</button>
<button class="btn btn-primary ml-2" (click)="addRow()" *ngIf="i === items.length - 1">Add Row</button>
</div>
</div>
<!-- Button to add a new column in the same row -->
<button type="button" class="mb-4" (click)="addColumn(rowIndex)">Add Column</button>
</div>
<div class="row">
<div class="col-md-12">
<button type="submit" class="btn btn-primary" (click)="onSubmit()" >Submit</button>
</div>
</div>
</div>
</form>
</div>
<!-- Button to add a new row -->
<button type="button" (click)="addRow()">Add Row</button>
<button type="submit">Submit</button>
</form>
</div>
</div>
</div>
</div>