KEYCLOAK-7294: Password page - Angular

This commit is contained in:
ssilvert@win.redhat.com 2018-07-13 15:25:48 -04:00 committed by Stan Silvert
parent 9c1a411c6e
commit d73c4288ae
3 changed files with 22 additions and 8 deletions

View file

@ -1,5 +1,6 @@
package org.keycloak.services.resources.account;
import com.fasterxml.jackson.annotation.JsonIgnoreProperties;
import org.keycloak.credential.CredentialModel;
import org.keycloak.credential.CredentialProvider;
import org.keycloak.credential.PasswordCredentialProvider;
@ -92,6 +93,7 @@ public class AccountCredentialResource {
}
@JsonIgnoreProperties(ignoreUnknown=true)
public static class PasswordUpdate {
private String currentPassword;

View file

@ -5,7 +5,7 @@
<div class="col-sm-12 card-pf">
<div class="card-pf-body p-b">
<span class="i pficon pficon-info"></span>
{{'passwordLastUpdateMessage' | translate}} <strong></strong>
{{'passwordLastUpdateMessage' | translate}} <strong>{{lastPasswordUpdate | date:'medium'}}</strong>
</div>
</div>
@ -26,17 +26,17 @@
<input readonly="" value="this is not a login form" style="display: none;" type="text">
<input readonly="" value="this is not a login form" style="display: none;" type="password">
<div class="form-group">
<label for="password" class="control-label">{{'currentPassword' | translate}}</label>
<input ngModel class="form-control" id="password" name="password" autofocus="" autocomplete="off" type="password">
<label for="password" class="control-label">{{'currentPassword' | translate}}</label><span class="required">*</span>
<input ngModel class="form-control" #password id="password" name="currentPassword" autofocus="" autocomplete="off" type="password">
</div>
<div class="form-group">
<label for="password-new" class="control-label">{{'passwordNew' | translate}}</label>
<label for="password-new" class="control-label">{{'passwordNew' | translate}}</label><span class="required">*</span>
<input ngModel class="form-control" id="newPassword" name="newPassword" autocomplete="off" type="password">
</div>
<div class="form-group">
<label for="password-confirm" class="control-label">{{'passwordConfirm' | translate}}</label>
<label for="password-confirm" class="control-label">{{'passwordConfirm' | translate}}</label><span class="required">*</span>
<input ngModel class="form-control" id="confirmation" name="confirmation" autocomplete="off" type="password">
</div>

View file

@ -14,7 +14,7 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import {Component, OnInit, ViewChild} from '@angular/core';
import {Component, OnInit, ViewChild, Renderer2} from '@angular/core';
import {Response} from '@angular/http';
import {FormGroup} from '@angular/forms';
@ -28,19 +28,31 @@ import {AccountServiceClient} from '../../account-service/account.service';
export class PasswordPageComponent implements OnInit {
@ViewChild('formGroup') private formGroup: FormGroup;
private lastPasswordUpdate: number;
constructor(private accountSvc: AccountServiceClient) {
constructor(private accountSvc: AccountServiceClient, private renderer: Renderer2) {
this.accountSvc.doGetRequest("/credentials/password", (res: Response) => this.handleGetResponse(res));
}
public changePassword() {
console.log("posting: " + JSON.stringify(this.formGroup.value));
this.accountSvc.doPostRequest("/credentials", (res: Response) => this.handlePostResponse(res), this.formGroup.value);
this.accountSvc.doPostRequest("/credentials/password", (res: Response) => this.handlePostResponse(res), this.formGroup.value);
this.renderer.selectRootElement('#password').focus();
}
protected handlePostResponse(res: Response) {
console.log('**** response from account POST ***');
console.log(JSON.stringify(res));
console.log('***************************************');
this.formGroup.reset();
this.accountSvc.doGetRequest("/credentials/password", (res: Response) => this.handleGetResponse(res));
}
protected handleGetResponse(res: Response) {
console.log('**** response from account POST ***');
console.log(JSON.stringify(res));
console.log('***************************************');
this.lastPasswordUpdate = res.json()['lastUpdate'];
}
ngOnInit() {