All files / src/app/components/campaign campaign.component.html

98.36% Statements 120/122
93.75% Branches 15/16
75% Functions 3/4
100% Lines 57/57

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101                  1556x 16x 16x 16x   1556x 3x   1556x 13x   16x 16x 1556x 6x 428x 3x 3x   1556x 13x 350x   1556x 13x 350x 13x 13x     16x   1556x   16x 16x 16x   16x   16x 16x 16x   16x 1556x 350x   188x   188x     7x 7x 7x 7x 7x 7x 7x   7x   678x 678x 678x 678x 678x 10x 10x     7x   700x     700x   13x                     16x  
<section class="container">
  <div class="columns is-multiline">
    <div class="column is-10 is-offset-1 profile">
      <div class="columns">
        <div class="column right has-text-centered">
 
          <div>
            <div class="level">
              <div class="level-left">
                <button [routerLink]="['/campaigns']" class="button is-rounded">
                  <i class="pi pi-chevron-left"></i>
                  <span>Campaigns</span>
                </button>
 
                @if (this.campaignId === null) {
                  <h1 class="title is-4">Add New Campaign</h1>
                }
                @if (this.campaignId !== null) {
                  <h1 class="title is-4">Edit Campaign</h1>
                }
              </div>
              <div class="level-right">
                @if (this.campaignId === null) {
                  <button (click)="addCampaign()" class="button" id="addCampaign"
                    [disabled]="campaignForm.invalid">
                    Add new Campaign
                  </button>
                }
                @if (this.campaignId !== null) {
                  <button (click)="editCampaign()" class="button is-primary" id="editCampaign"
                  [disabled]="campaignForm.invalid">Save Campaign</button>
                }
                @if (this.campaignId !== null) {
                  <button (click)="deleteCampaign()" class="button is-danger" id="deleteCampaign"
                    [disabled]="campaignForm.invalid">
                    Delete Campaign
                  </button>
                }
              </div>
            </div>
            <div>
              <form [formGroup]="campaignForm">
                <div class="field">
                  <label class="label" htmlFor="campaignName">Name</label>
                  <div class="control has-icons-right">
                    <input class="input" formControlName="campaignName" type="text" id="campaignName">
                  </div>
                </div>
                <div class="field">
                  <label class="label" htmlFor="campaignDescription">Description</label>
                  <div class="control has-icons-right">
                    <textarea class="input" formControlName="campaignDescription" id="campaignDescription"></textarea>
                  </div>
                </div>
                @if (this.campaignId !== null) {
                  @if (phases !== null && phases.length > 0) {
                    <div class="container">
                      <p-table [value]="phases" [paginator]="true" [rows]="5" [rowsPerPageOptions]="[5, 10, 20]"
                        [showCurrentPageReport]="true" currentPageReportTemplate="{first} - {last} of {totalRecords} phases"
                        [rowHover]="true" sortField="start_at">
                        <ng-template pTemplate="header">
                          <tr>
                            <th pSortableColumn="id">id <p-sortIcon field="id"></p-sortIcon></th>
                            <th pSortableColumn="name">Phase name <p-sortIcon field="name"></p-sortIcon></th>
                            <th>Phase description</th>
                            <th pSortableColumn="start_at">Phase starting Date <p-sortIcon field="start_at"></p-sortIcon></th>
                            <th pSortableColumn="end_at">Phase ending Date <p-sortIcon field="end_at"></p-sortIcon></th>
                            <th></th>
                          </tr>
                        </ng-template>
                        <ng-template pTemplate="body" let-phase let-i="rowIndex">
                          <tr>
                            <td [routerLink]="['/phases', phase.id]">{{ phase.id.substr(-4) }}</td>
                            <td [routerLink]="['/phases', phase.id]">{{ phase.name }}</td>
                            <td [routerLink]="['/phases', phase.id]">{{ phase.description }}</td>
                            <td [routerLink]="['/phases', phase.id]">{{ phase.start_at | date: 'dd/MM/yyyy HH:mm' }}</td>
                            <td [routerLink]="['/phases', phase.id]">{{ phase.end_at | date: 'dd/MM/yyyy HH:mm' }}</td>
                            <td><button (click)="deletePhase(phase.id, phase.name)" class="button is-inline-flex is-warning is-small" id="deletePhase">Delete Phase</button></td>
                          </tr>
                        </ng-template>
                      </p-table>
                    </div>
                  }
                  @if (this.campaignId !== null) {
                    <div class="field row">
                      <div class="column">
                        <button [routerLink]="['/campaigns', this.campaignId,  'phases', 'new']" class="button" id="addPhase">Add new Phase</button>
                      </div>
                    </div>
                  }
                }
 
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>