Untitled
unknown
plain_text
4 months ago
7.9 kB
2
Indexable
<div class="container-fluid" id="sidebar-wrapper"> <div class="row"> <div class="side-nav"> <app-side-nav></app-side-nav> <div> <div class="min-header"> <app-header></app-header> </div> <div> <p aria-hidden="true" class="reports barlow-semibold"> <img src="/assets/images/backbutton.svg" (click)="navigateToDashboard()" alt="backbutton" class="img-fluid" style="width: 20px; height: 18px;">Reports </p> </div> <div class="d-flex justify-content-end"> <button type="button" class="run-button barlow-semibold" (click)="toggleForm()" title="run diagnostics">Run Diagnostics</button> </div> </div> <div class="row"> <div class="col-md-4 col-sm-8 "> <div class="row h-100" > <div class="card card1 col-md-9 offset-md-3 "> <div class="card-body"> <h5 class="card-title">{{ equipment?.vehicleName }}</h5> <img [src]="getImageSource(equipment?.vehicleType)" alt="{{ equipment?.vehicleType }} Logo" class="card-img-top mt-5" [ngStyle]="{ 'width': equipment?.vehicleType === 'ChipSpreader' ? '17rem' : '20rem', 'height': 'auto', 'margin-left': equipment?.vehicleType === 'ChipSpreader' ? '20px' : '0' }" > <div class="row mt-5"> <div class="col-6 mt-5"> <p class="card-text barlow-regular">Purchase Year</p> </div> <div class="col-6 mt-5 text-end"> <p class="card-text barlow-medium">{{ equipment?.manufactureYear | date:'yyyy' }}</p> </div> </div> </div> <div class="row"> <div class="col-6 mt-2"> <p class="card-text barlow-regular">Last Maintenance</p> </div> <div class="col-6 text-end mt-2"> <p class="card-text barlow-medium">{{ equipment?.lastMaintananceDate | date:'MMM dd, yyyy'}}</p> </div> </div> <div class="row"> <div class="col-6 mt-2"> <p class="card-text barlow-regular">Next Maintenance</p> </div> <div class="col-6 text-end mt-2"> <p class="card-text barlow-medium">{{ equipment?.nextMaintananceDate | date:'MMM dd,yyyy' }}</p> </div> </div> <div class="row"> <div> <p class="card-text barlow-regular mt-2 pb-2">Configuration Details<span class="ms-5 barlow-medium config mt-2">{{ equipment?.configurationDetail }}</span></p> </div> </div> </div> </div> </div> <div class="col-md-8 h-100 col-sm-8"> <div class="card card2"> <div class="card-body"> <div class="row"> <h5 class="card-title col-6">Pump Flow Rate</h5> <div class="col-6 "> <i class="calendar"> <input type="text" ngxDaterangepickerMd [(ngModel)]="selected" (ngModelChange)="onDateRangeChange($event)" class="form-control date" [locale]="{ displayFormat: 'MMM YY' }" /> <img src="/assets/images/calendar.svg" alt="Etnyre Logo" class="input-icon"> </i> </div> </div> <div class="charts"> <div [chart]="lineChart"></div> <div [chart]="barChart"></div> </div> </div> </div> </div> </div> <div *ngIf="showForm" class="overlay"> <form (ngSubmit)="onSubmit()" class="reportsUploadform uploadform1"> <div> <p class="barlow-semibold ms-3">Run Diagnostics</p> </div> <div *ngIf="step === 1"> <div class="row"> <div class="col d-flex justify-content-between align-items-center"> <p class="select-data-point ms-3">Select Data Point(s)</p> <div class="form-check justify-content-end move-left"> <input class="form-check-input" type="checkbox" (change)="toggleSelectAll($event)" [checked]="selectAll"> <label>Select All</label> </div> </div> </div> <div class="form-check"> <div class="checkbox-grid"> <div *ngFor="let parameter of filteredParameters"> <div class="form-check"> <input class="form-check-input" type="checkbox" [value]="parameter.parameter" (change)="onCheckboxChange(parameter.parameter, $event, parameter.id)" [checked]="selectedOptions.includes(parameter.parameter)"> {{ parameter.parameter }} </div> </div> </div> </div> <div class="buttons mt-2"> <button type="button" (click)="toggleForm()" class="btn cancel-btn barlow-semibold">Cancel</button> <button type="button" class="btn upload-btn barlow-semibold ms-4" (click)="nextStep()">Next</button> </div> </div> <div *ngIf="step === 2"> <p class="ms-3 barlow-regular">Selected Data Points:</p> <div class="selected-grid-container"> <div class="selected-grid"> <div *ngFor="let selected of selectedOptions; let i = index" class="ms-3 barlow-regular"> <img src="/assets/images/close.svg" alt="backbutton" class="img-fluid" style="width: 16px; height: 16px;" (click)="removeSelectedOption(selected, filteredParameters[i].id)"> {{ selected }} </div> </div> </div> <div class="row time"> <div class="col-sm-3 mt-4 ms-3"> <label for="EquipmentType">Time interval(s)</label> <div class="custom-input-container"> <input type="number" id="time-interval" name="interval1-end" [value]="timeInterval" class="custom-input"> <div class="increment-button" (click)="increment('time-interval')"></div> <div class="decrement-button" (click)="decrement('time-interval')"></div> </div> </div> <div class="col-sm-3 mt-4 ms-4"> <label for="selectEcu">Time Span(mins)</label> <div class="custom-input-container"> <input type="number" id="time-span" name="interval1-end" [value]="timeSpan" class="custom-input"> <div class="increment-button" (click)="increment('time-span')"></div> <div class="decrement-button" (click)="decrement('time-span')"></div> </div> </div> </div> <div class="buttons mt-4"> <button type="button" class="btn cancel-btn barlow-semibold" (click)="toggleForm()">Cancel</button> <button type="button" class="btn cancel-btn ms-4 barlow-semibold" (click)="previousStep()">Back</button> <button type="submit" class="btn upload-btn ms-4 barlow-semibold">Submit</button> </div> </div> </form> </div> <div *ngIf="loading" class="overlay"> <div class="uploadform loadingform"> <div> <p class="barlow-semibold">Run Diagnostics</p> </div> <div class="loading-icon"> <img src="/assets/images/Loading_icon.svg" alt="Etnyre Logo" class="img-fluid"> </div> <p class="loading-msg">Please wait for the file to generate</p> </div> </div> <div *ngIf="showAlert" class="alert-window"> <div class="alertbox barlow-regular"> <div> <p class="barlow-semibold titleheader">Alert</p> </div> <p class="messageSize">Are you sure you want to cancel?</p> <div class="alert-buttons"> <button type="button" class="btn no-btn" (click)="closeAlert()">No</button> <button type="button" class="btn yes-btn" (click)="confirmCancel()">Yes</button> </div> </div> </div>
Editor is loading...
Leave a Comment