Motion >> Repos - motion-next.git/blob

   1 <md-dialog class="telephone-dialog" aria-label="{{vm.name}}">
   2   <form name="telephoneForm" class="md-inline-form" novalidate>
   3     <md-toolbar class="md-accent md-hue-2">
   4       <div
   5         class="md-toolbar-tools"
   6         layout="row"
   7         layout-align="space-between center"
   8       >
   9         <span class="title">{{ ' STAFF.CHANGE_PASSWORD' | translate }}</span>
  10         <md-button class="md-icon-button" ng-click="vm.closeDialog()">
  11           <md-icon
  12             md-font-icon="icon-close"
  13             aria-label="Close dialog"
  14           ></md-icon>
  15         </md-button>
  16       </div>
  17     </md-toolbar>
  18
  19     <md-dialog-content ms-scroll>
  20       <div class="error-list">
  21         <div
  22           ng-repeat="error in vm.errors"
  23           class="error"
  24           layout="row"
  25           layout-align="space-between center"
  26         >
  27           <div>
  28             <span class="message">{{error.message}}</span>
  29             <span class="type">({{error.type}})</span>
  30           </div>
  31           <md-button class="md-icon-button">
  32             <md-icon
  33               md-font-icon="icon-alert-box"
  34               aria-label="alert error"
  35               class="s16"
  36             ></md-icon>
  37           </md-button>
  38         </div>
  39       </div>
  40       <md-input-container
  41         class="md-block"
  42         ng-if="vm.currentUser.id == vm.telephone.id"
  43       >
  44         <label translate="STAFF.OLD_PASSWORD">Old Password</label>
  45         <input
  46           type="password"
  47           name="oldPassword"
  48           ng-model="vm.oldPassword"
  49           placeholder="Password"
  50           translate
  51           translate-attr-placeholder="STAFF.OLD_PASSWORD"
  52           required
  53         />
  54         <div ng-messages="telephoneForm.oldPassword.$error" role="alert">
  55           <div ng-message="required">
  56             <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
  57               >Password field is required</span
  58             >
  59           </div>
  60         </div>
  61       </md-input-container>
  62       <md-input-container class="md-block">
  63         <label translate="STAFF.NEW_PASSWORD">New Password</label>
  64         <input
  65           type="password"
  66           name="password"
  67           ng-model="vm.password"
  68           placeholder="Password"
  69           translate
  70           ng-pattern="vm.passwordPattern"
  71           translate-attr-placeholder="STAFF.NEW_PASSWORD"
  72           required
  73         />
  74         <div ng-messages="telephoneForm.password.$error" role="alert">
  75           <div ng-message="required">
  76             <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
  77               >Password field is required</span
  78             >
  79           </div>
  80
  81           <div ng-message="pattern">
  82             <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
  83               >Must contain at least 8 characters, with a minimum of 1 lowercase
  84               letter, 1 uppercase letter, 1 numeric character and 1 special
  85               character ~!?*@#$%^&-_=+[{]}.</span
  86             >
  87           </div>
  88           <div ng-message="oldPasswordMatch">
  89             <span translate="STAFF.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
  90               >New password must be different from old one</span
  91             >
  92           </div>
  93         </div>
  94       </md-input-container>
  95       <md-input-container class="md-block">
  96         <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
  97         <input
  98           type="password"
  99           match-password="password"
 100           name="confirmPassword"
 101           ng-model="confirmPassword"
 102         />
 103         <div
 104           ng-messages="telephoneForm.confirmPassword.$error"
 105           role="alert"
 106           multiple
 107         >
 108           <div ng-message="required">
 109             <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
 110               >Confirm field is required</span
 111             >
 112           </div>
 113           <div ng-message="passwordMatch">
 114             <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
 115               >Your password did not match</span
 116             >
 117           </div>
 118         </div>
 119       </md-input-container>
 120       <div class="error-list">
 121         <div
 122           ng-repeat="error in vm.errors"
 123           class="error"
 124           layout="row"
 125           layout-align="space-between center"
 126         >
 127           <div>
 128             <span class="message">{{error.message}}</span>
 129             <span class="type">({{error.type}})</span>
 130           </div>
 131           <md-button class="md-icon-button">
 132             <md-icon
 133               md-font-icon="icon-alert-box"
 134               aria-label="alert error"
 135               class="s16"
 136             ></md-icon>
 137           </md-button>
 138         </div>
 139       </div>
 140     </md-dialog-content>
 141
 142     <md-dialog-actions layout="row" layout-align="space-between center">
 143       <div layout="row" layout-align="start center">
 144         <md-button
 145           type="submit"
 146           ng-click="vm.savePassword()"
 147           class="send-button md-accent md-raised"
 148           ng-disabled="telephoneForm.$invalid || telephoneForm.$pristine"
 149           aria-label="SAVE"
 150           translate="STAFF.SAVE"
 151           translate-attr-aria-label="STAFF.SAVE"
 152         >
 153           SAVE
 154         </md-button>
 155       </div>
 156     </md-dialog-actions>
 157   </form>
 158 </md-dialog>