forked from hyperledger-archives/composer
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add roles when creating identities (hyperledger-archives#2112)
Added the ability to add roles when creating an identity card Added styles for checkbox contributes to hyperledger/composer#2032
- Loading branch information
Showing
16 changed files
with
479 additions
and
140 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
196 changes: 121 additions & 75 deletions
196
...poser-playground/src/app/login/edit-card-credentials/edit-card-credentials.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,87 +1,133 @@ | ||
<section class="edit-card-credentials"> | ||
<h1>Create ID Card</h1> | ||
<section class="profiles"> | ||
<div class="description upper"><b>Provide security credentials</b></div> | ||
<div class="holding-div"> | ||
<div class="create-route"> | ||
<p>You must provide one of two types of information to create an ID card:</p> | ||
<div class="file-types-list"> | ||
<div class="file-types-list-item"> | ||
<input type="radio" id="useCert" name="file-type" [checked]="true" | ||
(change)="useCertificates(true)"> | ||
<label class="radio-label" for="useCert" style="color:grey"><h3>Certificates</h3></label> | ||
<div class="description" style="color:grey"><p>Required here are certificate and private key files.</p></div> | ||
</div> | ||
<div class="file-types-list-item"> | ||
<input type="radio" id="noCert" name="file-type" | ||
(change)="useCertificates(false)"> | ||
<label class="radio-label" for="noCert"><h3>ID and Secret</h3></label> | ||
<div class="description"><p>These can be created when accessing a business network.</p></div> | ||
<section class="profiles section"> | ||
<div class="description upper"><b>Provide security credentials</b></div> | ||
<div class="holding-div"> | ||
<div class="create-route"> | ||
<p>You must provide one of two types of information to create an ID card:</p> | ||
<div class="file-types-list"> | ||
<div class="file-types-list-item"> | ||
<input type="radio" id="useCert" name="file-type" [checked]="true" | ||
(change)="useCertificates(true)"> | ||
<label class="radio-label" for="useCert"><h3>Certificates</h3></label> | ||
<div class="description"><p>Required here are certificate and private key | ||
files.</p></div> | ||
</div> | ||
<div class="file-types-list-item"> | ||
<input type="radio" id="noCert" name="file-type" | ||
(change)="useCertificates(false)"> | ||
<label class="radio-label" for="noCert"><h3>ID and Secret</h3></label> | ||
<div class="description"><p>These can be created when accessing a business network.</p></div> | ||
</div> | ||
</div> | ||
</div> | ||
<div *ngIf="useCerts" class="noCerts"> | ||
<form #addIdentityForm="ngForm" id="add-identity-form" (ngSubmit)="addIdentityCard()"> | ||
<div class="option key-field"> | ||
<label for="publicKey"><h3>Certificate</h3></label> | ||
<textarea required name="addedPublicCertificate" id="publicKey" rows="6" | ||
placeholder="Paste your certificate here..." | ||
[(ngModel)]="addedPublicCertificate"></textarea> | ||
</div> | ||
<div class="option key-field"> | ||
<label for="privateKey"><h3>Private Key</h3></label> | ||
<textarea required name="addedPrivateCertificate" id="privateKey" rows="6" | ||
placeholder="Paste your private key here..." | ||
[(ngModel)]="addedPrivateCertificate"></textarea> | ||
</div> | ||
<div class="option"> | ||
<label for="name"><h3>Name this ID Card</h3></label> | ||
<input required type="text" [(ngModel)]="userId" id="name" name="userId" autocomplete="off"> | ||
</div> | ||
</form> | ||
</div> | ||
<div *ngIf="!useCerts" class="noCerts"> | ||
<p>An Enrollment ID and Secret must be created by someone who already has access to the Business Network | ||
you are connecting to.</p> | ||
<form #idSecretForm="ngForm" (submit)="submitCard()" (keydown)="submitCard($event)"> | ||
<div class="option"> | ||
<label for="userId"><h3>Enrollment ID</h3></label> | ||
<input required type="text" [(ngModel)]="userId" id="userId" name="userId" autocomplete="off"> | ||
</div> | ||
<div class="option"> | ||
<label for="userSecret"><h3>Enrollment Secret</h3></label> | ||
<input required type="password" [(ngModel)]="userSecret" id="userSecret" name="userSecret" | ||
autocomplete="off"> | ||
</div> | ||
</form> | ||
</div> | ||
</div> | ||
<div *ngIf="useCerts" class="noCerts"> | ||
<form #addIdentityForm="ngForm" id="add-identity-form" (ngSubmit)="addIdentityCard()"> | ||
<div class="option key-field"> | ||
<label for="publicKey"><h3>Certificate</h3></label> | ||
<textarea required name="addedPublicCertificate" id="publicKey" rows="6" placeholder="Paste your certificate here..." [(ngModel)]="addedPublicCertificate"></textarea> | ||
</div> | ||
<div class="option key-field"> | ||
<label for="privateKey"><h3>Private Key</h3></label> | ||
<textarea required name="addedPrivateCertificate" id="privateKey" rows="6" placeholder="Paste your private key here..." [(ngModel)]="addedPrivateCertificate"></textarea> | ||
</div> | ||
<div class="option"> | ||
<label for="name"><h3>Name this ID Card</h3></label> | ||
<input required type="text" [(ngModel)]="userId" id="name" name="userId" autocomplete="off"> | ||
</div> | ||
</form> | ||
</div> | ||
<div *ngIf="!useCerts" class="noCerts"> | ||
<p>An Enrollment ID and Secret must be created by someone who already has access to the Business Network you are connecting to.</p> | ||
<form #idSecretForm="ngForm" (submit)="submitCard()" (keydown)="submitCard($event)"> | ||
<div class="option"> | ||
<label for="userId"><h3>Enrollment ID</h3></label> | ||
<input required type="text" [(ngModel)]="userId" id="userId" name="userId" autocomplete="off"> | ||
</section> | ||
<section class="profiles"> | ||
<div class="description upper"><b>Card Type</b></div> | ||
<div class="holding-div"> | ||
<div class="create-route"> | ||
<p>What type of card do you want to create?</p> | ||
<div class="file-types-list"> | ||
<div class="file-types-list-item"> | ||
<input type="radio" id="participantCard" name="participant-type" [checked]="true" | ||
(change)="useParticipantCardType(true)"> | ||
<label class="radio-label" for="participantCard"><h3>Participant Card</h3></label> | ||
<div class="description"><p>An ID card that is bound to a participant</p></div> | ||
</div> | ||
<div class="file-types-list-item"> | ||
<input type="radio" id="adminCard" name="participant-type" | ||
(change)="useParticipantCardType(false)"> | ||
<label class="radio-label" for="adminCard"><h3>Admin Card</h3></label> | ||
<div class="description"><p>An ID card that is not bound to a participant.</p></div> | ||
</div> | ||
</div> | ||
<div class="option"> | ||
<label for="userSecret"><h3>Enrollment Secret</h3></label> | ||
<input required type="password" [(ngModel)]="userSecret" id="userSecret" name="userSecret" autocomplete="off"> | ||
</div> | ||
|
||
<div *ngIf="useParticipantCard" class="noCerts"> | ||
<p>The name of the Business Network to which you are going to connect.</p> | ||
<form #busNetForm="ngForm" (submit)="submitCard()" (keydown)="submitCard($event)"> | ||
<div class="option"> | ||
<label for="busNetName"><h3>Name of Business Network</h3></label> | ||
<input type="text" [(ngModel)]="busNetName" id="busNetName" name="busNetName" | ||
autocomplete="off"> | ||
</div> | ||
</form> | ||
</div> | ||
<div *ngIf="!useParticipantCard" class="roles"> | ||
<p>Roles can be added to an identity for installing and starting a business network.</p> | ||
<div class="role-list"> | ||
<div class="option"> | ||
<input type="checkbox" [(ngModel)]="peerAdmin" id="peerAdmin" name="peerAdmin" | ||
autocomplete="off"> | ||
<label for="peerAdmin" class="checkbox-label"><h3>Peer Admin</h3></label> | ||
<div class="description"><p>A role that has permission to install a business network</p> | ||
</div> | ||
</div> | ||
<div class="option"> | ||
<input type="checkbox" [(ngModel)]="channelAdmin" id="channelAdmin" name="channelAdmin" | ||
autocomplete="off"> | ||
<label for="channelAdmin" class="checkbox-label"><h3>Channel Admin</h3></label> | ||
<div class="description"><p>A role that has permission to start a business network</p> | ||
</div> | ||
</div> | ||
</div> | ||
</form> | ||
</div> | ||
</div> | ||
</div> | ||
</section> | ||
<section class="profiles"> | ||
<div class="description upper"><b>business network name</b></div> | ||
<div class="holding-div"> | ||
<div class="noCerts"> | ||
<p>The name of the Business Network to which you are going to connect should be specified when using supplied credentials.</p> | ||
<form #busNetForm="ngForm" (submit)="submitCard()" (keydown)="submitCard($event)"> | ||
<div class="option"> | ||
<label for="busNetName"><h3>Name of Business Network</h3></label> | ||
<input required type="text" [(ngModel)]="busNetName" id="busNetName" name="busNetName" autocomplete="off"> | ||
</section> | ||
<footer> | ||
<button type="button" class="secondary" (click)="close();"> | ||
<span>Cancel</span> | ||
</button> | ||
<button type="button" class="primary" [disabled]="!validContents() || addInProgress" | ||
(click)="addIdentityCard();"> | ||
<div *ngIf="!addInProgress"> | ||
<span>Create</span> | ||
</div> | ||
<div *ngIf="addInProgress" class="ibm-spinner-indeterminate small loop"> | ||
<div class="loader"> | ||
<svg class="circular" viewBox="25 25 50 50"> | ||
<circle class="circle-path" cx="50" cy="50" r="20"/> | ||
</svg> | ||
</div> | ||
</form> | ||
</div> | ||
</div> | ||
</section> | ||
<footer> | ||
<button type="button" class="secondary" (click)="close();"> | ||
<span>Cancel</span> | ||
</button> | ||
<button type="button" class="primary" [disabled]="!validContents() || addInProgress" (click)="addIdentityCard();"> | ||
<div *ngIf="!addInProgress"> | ||
<span>Create</span> | ||
</div> | ||
<div *ngIf="addInProgress" class="ibm-spinner-indeterminate small loop"> | ||
<div class="loader"> | ||
<svg class="circular" viewBox="25 25 50 50"> | ||
<circle class="circle-path" cx="50" cy="50" r="20"/> | ||
</svg> | ||
</div> | ||
</div> | ||
</button> | ||
</footer> | ||
</div> | ||
</button> | ||
</footer> | ||
</section> | ||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.