github.com/readium/readium-lcp-server@v0.0.0-20240101192032-6e95190e99f1/frontend/manage/app/purchase/purchase-form.component.html (about)

     1  <form [formGroup]="form" (ngSubmit)="onSubmit()">
     2    <div *ngIf="!edit" class="form-group">
     3      <label for="publication">Publication</label>
     4      <select
     5          id="publication" class="form-control"
     6          [formControl]="form.controls['publication']">
     7        <option value="">Select a publication</option>
     8        <option *ngFor="let publication of availablePublications"
     9                value="{{publication.id}}">
    10        {{publication.title}} ({{publication.uuid}})
    11        </option>
    12      </select>
    13    </div>
    14  
    15    <div *ngIf="!edit" class="form-group">
    16      <label for="user">User</label>
    17      <select
    18          id="user" class="form-control"
    19          [formControl]="form.controls['user']">
    20        <option value="">Select a user</option>
    21        <option *ngFor="let user of availableUsers"
    22                value="{{user.id}}">
    23        {{user.alias}} ({{user.email}})
    24        </option>
    25      </select>
    26    </div>
    27  
    28     <div *ngIf="!edit" class="form-group">
    29      <label>Type</label>
    30      <div class="form-check">
    31        <label class="form-check-label">
    32          <input type="radio" class="form-check-input" checked="form.value['type'] == 'LOAN'"
    33            value="LOAN" [formControl]="form.controls['type']">
    34          Loan
    35        </label>
    36      </div>
    37      <div class="form-check">
    38        <label class="form-check-label">
    39          <input type="radio" class="form-check-input"
    40            value="BUY" [formControl]="form.controls['type']" >
    41          Buy
    42        </label>
    43      </div>
    44    </div>
    45  
    46    <div *ngIf="edit" class="form-group">
    47      <label>Type of renew</label>
    48      <div class="form-check">
    49        <label class="form-check-label">
    50          <input type="radio" class="form-check-input" checked="form.value['renew_type'] == 'NO_END_DATE'"
    51            value="NO_END_DATE" [formControl]="form.controls['renew_type']">
    52          Renew
    53        </label>
    54      </div>
    55      <div class="form-check">
    56      <label class="form-check-label">
    57          <input type="radio" class="form-check-input" checked="form.value['renew_type'] == 'END_DATE'"
    58            value="END_DATE" [formControl]="form.controls['renew_type']" >
    59          Renew by setting an end date
    60        </label>
    61      </div>
    62    </div>
    63  
    64    <div class="form-group" *ngIf="(edit && form.value['renew_type'] == 'END_DATE') || form.value['type'] == 'LOAN'">
    65      <label for="enddate">End Date</label>
    66      <input class="form-control"
    67        formControlName="end_date"
    68        ng2-datetime-picker />
    69    </div>
    70  
    71    <button type="submit" [disabled]="!form.valid" class="btn btn-primary">{{submitButtonLabel}}</button>
    72    <button type="button" (click)="onCancel()" class="btn btn-secondary">Cancel</button>
    73  </form>