File

trusted-certificates/crl/crl-settings.component.ts

Metadata

Index

Properties
Methods
Accessors

Constructor

constructor(crlService: CrlService, alertService: AlertService, modalService: ModalService)
Parameters :
Name Type Optional
crlService CrlService No
alertService AlertService No
modalService ModalService No

Methods

addCertificateRevocation
addCertificateRevocation()
Returns : void
Async downloadCrl
downloadCrl()
Returns : any
downloadCrlTemplate
downloadCrlTemplate()
Returns : void
removeCertificateRevocation
removeCertificateRevocation(certificateRevocation)
Parameters :
Name Optional
certificateRevocation No
Returns : void
Async save
save()
Returns : any

Properties

crls
Type : ICertificateRevocation[]
Default value : [this.getEmptyCertificateRevocation()]
droppedFiles
Type : DroppedFile[]
Default value : []
FILE_UPLOAD_POPOVER
Default value : gettext( 'In this section, you can upload a file with the list of certificates to be revoked. The file must be in CSV format, and it should include the serial number and revocation date. If the revocation date is empty, it will be set to the current date.' )
MANUAL_ENTRY_POPOVER
Default value : gettext( 'In this section, you can override or add individual entries to the CRL. Providing the serial number is mandatory. In case the revocation date is not set, it will be configured to the current date.' )
today
Type : Date
Default value : new Date()

Accessors

isListEmpty
getisListEmpty()
isFileDropped
getisFileDropped()
<c8y-title>{{ 'Trusted certificates' | translate }}</c8y-title>

<c8y-breadcrumb>
  <c8y-breadcrumb-item
    icon="c8y-management"
    label="{{ 'Management' | translate }}"
  ></c8y-breadcrumb-item>
  <c8y-breadcrumb-item
    icon="certificate"
    label="{{ 'Trusted certificates' | translate }}"
  ></c8y-breadcrumb-item>
</c8y-breadcrumb>

<c8y-crl-check-settings></c8y-crl-check-settings>

<c8y-help
  src="/docs/device-management-application/managing-device-data/#managing-trusted-certificate-settings"
  [icon]="'settings'"
></c8y-help>

<form
  class="card card--fullpage"
  #crlManualForm="ngForm"
  novalidate
>
  <div class="card-header separator">
    <div class="card-title">
      {{ 'Offline configuration of Certificate Revocation List (CRL)' | translate }}
    </div>
  </div>
  <div class="inner-scroll">
    <div class="card-block">
      <div
        class="legend form-block"
      >
        {{ 'Manual' | translate }}
        <button
          class="btn-help btn-help--sm"
          [attr.aria-label]="'Help' | translate"
          popover="{{ MANUAL_ENTRY_POPOVER | translate }}"
          placement="right"
          triggers="focus"
          container="body"
          type="button"
        ></button>
      </div>

      <div
        class="row tight-grid"
        data-cy="c8y-row-grid--new-row"
        *ngFor="let certificateRevocation of crls; index as index; last as isLast"
      >
        <div class="col-sm-5">
          <c8y-form-group>
            <label
              [for]="'serialNumber' + index"
              translate
            >
              Serial number
            </label>
            <input
              class="form-control"
              required
              [name]="'serialNumber' + index"
              [id]="'serialNumber' + index"
              [(ngModel)]="certificateRevocation.serialNumberInHex"
              [placeholder]="'e.g. {{ example }}' | translate: { example: '8ab34fe5476' }"
              c8yDefaultValidation="colonedHexNumber"
            />
          </c8y-form-group>
        </div>
        <div class="col-sm-5">
          <c8y-form-group class="datepicker">
            <label [for]="'validTillPicker' + index">
              {{ 'Valid till' | translate }}
            </label>
            <input
              class="form-control"
              [attr.aria-label]="'Date to' | translate"
              placeholder="{{ 'Date to' | translate }}"
              [name]="'validTillPicker' + index"
              [id]="'validTillPicker' + index"
              [(ngModel)]="certificateRevocation.revocationDate"
              [bsConfig]="{ customTodayClass: 'today' }"
              bsDatepicker
              [maxDate]="today"
            />
          </c8y-form-group>
        </div>
        <div class="col-sm-2">
          <c8y-form-group>
            <div class="p-t-24">
              <button
                *ngIf="crls.length > 1"
                class="btn btn-link hidden-xs hidden-sm"
                title="{{ 'Remove' | translate }}"
                type="button"
                (click)="removeCertificateRevocation(certificateRevocation)"
              >
                <i
                  class="text-danger"
                  c8yIcon="minus-circle"
                ></i>
              </button>
              <button
                class="btn btn-link hidden-xs hidden-sm"
                title="{{ 'Add' | translate }}"
                type="button"
                (click)="addCertificateRevocation()"
                *ngIf="isLast"
              >
                <i
                  class="text-primary"
                  c8yIcon="plus-circle"
                ></i>
              </button>

              <button
                *ngIf="crls.length > 1"
                class="btn btn-danger btn-block btn-sm visible-xs visible-sm"
                title="{{ 'Remove' | translate }}"
                type="button"
                (click)="removeCertificateRevocation(certificateRevocation)"
              >
                <i c8yIcon="minus-circle"></i>
                {{ 'Remove' | translate }}
              </button>
              <button
                class="btn btn-primary btn-block btn-sm visible-xs visible-sm"
                title="{{ 'Add' | translate }}"
                type="button"
                (click)="addCertificateRevocation()"
                *ngIf="isLast"
              >
                <i c8yIcon="plus-circle"></i>
                {{ 'Add' | translate }}
              </button>
            </div>
          </c8y-form-group>
        </div>
      </div>
      <div class="legend form-block center">
        {{ 'or' | translate }}
      </div>
      <div
        class="legend form-block"
      >
        {{ 'File upload' | translate }}
        <button
          class="btn-help btn-help--sm"
          [attr.aria-label]="'Help' | translate"
          popover="{{ FILE_UPLOAD_POPOVER | translate }}"
          placement="right"
          triggers="focus"
          container="body"
          type="button"
        ></button>
      </div>

      <c8y-drop-area
        class="drop-area-sm"
        [title]="'Upload CRL file (.csv format)' | translate"
        name="uploadCrlDropArea"
        [(ngModel)]="droppedFiles"
        [message]="'Upload CRL file (.csv format)' | translate"
        [loadingMessage]="'Uploading…' | translate"
        [accept]="'.csv'"
        [maxAllowedFiles]="1"
      ></c8y-drop-area>
      <p class="help-block has-info text-muted m-t-4">
        {{ 'CRL file content will override manual entries.' | translate }}
      </p>

      <button
        class="btn btn-sm btn-default m-t-16"
        title="{{ 'Download template' | translate }}"
        type="button"
        (click)="downloadCrlTemplate()"
      >
        <i
          class="m-r-4"
          c8yIcon="template"
        ></i>
        {{ 'Download template' | translate }}
      </button>
    </div>
  </div>
  <div class="card-footer separator">
    <button
      class="btn btn-default"
      title="{{ 'Download CRL file' | translate }}"
      type="button"
      (click)="downloadCrl()"
    >
      <i
        class="m-r-4"
        c8yIcon="download"
      ></i>
      {{ 'Download CRL file' | translate }}
    </button>
    <button
      class="btn btn-primary"
      title="{{ 'Save' | translate }}"
      type="submit"
      (click)="save()"
      [disabled]="!(crlManualForm.form.valid || isListEmpty) || (isListEmpty && !isFileDropped)"
    >
      {{ 'Save' | translate }}
    </button>
  </div>
</form>

results matching ""

    No results matching ""