accountInfo.component.html 7.46 KB
Newer Older
rajkumar's avatar
rajkumar committed
1 2 3 4 5
<div class="body">
  <div>
    <div class="mat-h3 mat-tittle">Account Management</div>
  </div>
  <mat-divider></mat-divider>
rajkumar's avatar
rajkumar committed
6 7 8 9 10 11
  <form (ngSubmit)="submitAccount(f)" #f="ngForm" [appMatchPassword]="['webinPassword', 'confirmPassword']"
    autocomplete="off">
    <div class="container">
      <mat-card>
        <div class="row">
          <mat-card-subtitle>Account Details</mat-card-subtitle>
rajkumar's avatar
rajkumar committed
12

rajkumar's avatar
rajkumar committed
13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32
          <div class="column">
            <mat-form-field class="app-field-padding" *ngIf="editMode">
              <input name="id" [readonly]="true" matInput placeholder="Submission Account Id" required
                [(ngModel)]="id" />
            </mat-form-field>
            <mat-form-field class="app-field-padding">
              <input name="centerName" matInput placeholder="Center Name" required [(ngModel)]="centerName" />
              <mat-hint *ngIf="editMode">
                Changing Center Name will not affect existing submissions
              </mat-hint>
            </mat-form-field>

            <mat-form-field class="app-field-padding">
              <input matInput placeholder="Laboratory Name" [(ngModel)]="laboratoryName" name="laboratoryName" />
            </mat-form-field>
            <mat-form-field class="app-field-padding">
              <input matInput placeholder="Address" required [(ngModel)]="address" name="address" />
            </mat-form-field>
            <mat-form-field class="app-field-padding">
              <input matInput placeholder="Country" [matAutocomplete]="auto" name="country" #countryVal="ngModel"
Rajkumar-D's avatar
Rajkumar-D committed
33 34
                [(ngModel)]="country" (ngModelChange)="getCountries(country)" (blur)="selectCountryOption($event)" />

rajkumar's avatar
rajkumar committed
35 36 37 38 39 40
            </mat-form-field>
            <mat-autocomplete #auto="matAutocomplete">
              <mat-option *ngFor="let country of countries" [value]="country">
                {{ country }}
              </mat-option>
            </mat-autocomplete>
Rajkumar-D's avatar
Rajkumar-D committed
41 42 43
            <mat-error class="mat-body" *ngIf="countryErr">
              Invalid country. Please select a country from the provided list.
            </mat-error>
rajkumar's avatar
rajkumar committed
44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67
          </div>
          <div class="column" *ngIf="!editMode">
            <mat-form-field class="app-field-padding">
              <input matInput [disabled]="editMode" type="password" placeholder="Password" required
                [(ngModel)]="webinPassword" name="webinPassword" autocomplete="new-password" />
            </mat-form-field>
            <mat-form-field class="app-field-padding">
              <input matInput [disabled]="editMode" type="password" placeholder="Confirm Password" required
                [(ngModel)]="confirmPassword" name="confirmPassword" autocomplete="new-c-password" />
              <mat-error *ngIf="f.controls['confirmPassword']?.errors?.passwordMismatch">
                Passwords do not match
              </mat-error>
            </mat-form-field>
          </div>

          <div class="column" *ngIf="editMode" style="padding-top: 20px">
            <a (click)="
                openResetPasswordRequestDialog({
                  submissionAccountId: id,
                  loggedIn: true
                })
              ">Change Password
            </a>
          </div>
rajkumar's avatar
rajkumar committed
68
        </div>
69 70


rajkumar's avatar
rajkumar committed
71
      </mat-card>
rajkumar's avatar
rajkumar committed
72

rajkumar's avatar
rajkumar committed
73 74 75 76 77
      <mat-card class="mat-body">
        <div class="row">
          <mat-card-subtitle>Contact Information</mat-card-subtitle>
          <a (click)="openDialog('Add', { submissionAccountId: id })">Add At Least One Contact<mat-icon>add_circle
            </mat-icon></a>
rajkumar's avatar
rajkumar committed
78

rajkumar's avatar
rajkumar committed
79 80 81 82 83
          <table mat-table *ngIf="dataSource" #table [dataSource]="dataSource" class="mat-elevation-z8">
            <ng-container matColumnDef="firstName">
              <th mat-header-cell *matHeaderCellDef>Name</th>
              <td mat-cell *matCellDef="let element">{{ element.name }}</td>
            </ng-container>
rajkumar's avatar
rajkumar committed
84

rajkumar's avatar
rajkumar committed
85 86 87 88 89 90
            <ng-container matColumnDef="emailAddress">
              <th mat-header-cell *matHeaderCellDef>Email</th>
              <td mat-cell *matCellDef="let element">
                {{ element.emailAddress }}
              </td>
            </ng-container>
rajkumar's avatar
rajkumar committed
91

rajkumar's avatar
rajkumar committed
92 93 94 95 96 97 98 99 100
            <ng-container matColumnDef="mainContact">
              <th mat-header-cell *matHeaderCellDef>Primary Contact</th>
              <td mat-cell *matCellDef="let element">
                <mat-checkbox *ngIf="element.mainContact" matInput [checked]="true" disabled style="padding-left: 20px">
                </mat-checkbox>
                <mat-checkbox *ngIf="!element.mainContact" matInput [checked]="false" disabled
                  style="padding-left: 20px"></mat-checkbox>
              </td>
            </ng-container>
rajkumar's avatar
rajkumar committed
101

rajkumar's avatar
rajkumar committed
102 103 104 105 106 107
            <ng-container matColumnDef="edit">
              <th mat-header-cell *matHeaderCellDef>Edit</th>
              <td mat-cell *matCellDef="let element">
                <mat-icon (click)="openDialog('Update', element)">edit</mat-icon>
              </td>
            </ng-container>
rajkumar's avatar
rajkumar committed
108

rajkumar's avatar
rajkumar committed
109 110 111 112 113 114
            <ng-container matColumnDef="remove">
              <th mat-header-cell *matHeaderCellDef>Remove</th>
              <td mat-cell *matCellDef="let element">
                <mat-icon (click)="openDialog('Delete', element)">delete</mat-icon>
              </td>
            </ng-container>
rajkumar's avatar
rajkumar committed
115

rajkumar's avatar
rajkumar committed
116 117 118
            <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
            <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
          </table>
rajkumar's avatar
rajkumar committed
119

rajkumar's avatar
rajkumar committed
120
          <!--<mat-error *ngIf="mainContact <= 0 ">
rajkumar's avatar
rajkumar committed
121
      Please enter atlease one primary contact to save the account.
rajkumar's avatar
rajkumar committed
122
   </mat-error>-->
123

rajkumar's avatar
rajkumar committed
124 125
        </div>
      </mat-card>
rajkumar's avatar
rajkumar committed
126

rajkumar's avatar
rajkumar committed
127 128
      <mat-card class="mat-body">
        <div class="row">
129 130 131 132 133 134 135 136 137 138 139
          <mat-card-subtitle>No Sensitive Data</mat-card-subtitle>
          <mat-checkbox matInput name="noEffectCheckbox" [(ngModel)]="noEffectCheckbox" style="padding-left: 20px"
            [checked]="true" [disabled]="editMode">I
            confirm that the data
            submitted through this account is NOT sensitive,
            restricted-access or human-identifiable.</mat-checkbox>
        </div>
      </mat-card>
      <mat-card class="mat-body">
        <div class="row">

rajkumar's avatar
rajkumar committed
140 141 142 143 144 145 146 147 148 149 150 151 152 153 154
          <mat-card-subtitle>Metagenomics Consent</mat-card-subtitle>
          <p>
            By keeping this box checked you give consent to the EBI Metagenomics
            team to analyse those data for which you have requested a
            pre-publication confidential hold. Note that the data as well as the
            analysis results will remain confidential until the specified
            release date of the associated sequencing study. This service
            provides pre-publication state-of-the-art analysis results, along
            with visualisations, that you may use in subsequent publications.
            The service is described in
            http://europepmc.org/abstract/MED/29069476 and we kindly request,
            should you use these analyes in your publications, that you cite
            this paper.
          </p>
          <mat-checkbox matInput name="metagenomicsConsented" [(ngModel)]="metagenomicsConsented"
155 156 157
            style="padding-left: 20px">I give consent that EBI MGnify team can analyse my pre-publication confidential
            data.</mat-checkbox>

rajkumar's avatar
rajkumar committed
158 159
        </div>
      </mat-card>
rajkumar's avatar
rajkumar committed
160
    </div>
rajkumar's avatar
rajkumar committed
161

rajkumar's avatar
rajkumar committed
162
    <div style="text-align: Center">
Rajkumar-D's avatar
Rajkumar-D committed
163 164
      <button mat-raised-button color="accent"
        [disabled]="f.invalid || countryErr || mainContact <= 0 || noEffectCheckbox==false">
rajkumar's avatar
rajkumar committed
165 166 167 168 169 170 171
        Save
      </button>
      <button mat-raised-button style="margin-left: 5px" routerLink="">
        Cancel
      </button>
    </div>
  </form>
172
</div>