blob: d718dcdd20c4ccf8a86bc7dba3020fd3112083e3 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
|
<div class="uib-modal__content modal__local-users">
<div class="modal-header">
<h2 class="modal-title" id="dialog_label">
{{ modalCtrl.user.new ? 'Add user' : 'Modify user' }}
</h2>
<button type="button" class="btn btn--close" ng-click="$dismiss()" aria-label="Close">
<icon file="icon-close.svg" aria-hidden="true"></icon>
</button>
</div>
<form name="form">
<div class="modal-body">
<!-- Manual unlock -->
<div class="row" ng-if="modalCtrl.user.locked && !modalCtrl.automaticLockout">
<div class="column medium-9">
<div class="notification-banner"
aria-live="polite"
ng-class="{'notification-banner--warning': !form.lock.$dirty,
'notification-banner--information': form.lock.$dirty}">
<icon file="icon-warning.svg" aria-hidden="true" ng-if="!form.lock.$dirty"></icon>
<p class="notification-banner__text" ng-if="!form.lock.$dirty">Account locked</p>
<p class="notification-banner__text" ng-if="form.lock.$dirty">Click "Save" to unlock account</p>
</div>
</div>
<div class="column medium-3">
<input
type="hidden"
name="lock"
ng-model="modalCtrl.manualUnlockProperty"
value="false">
<button class="btn btn-primary"
type="button"
ng-click="form.lock.$setDirty()"
ng-disabled="form.lock.$dirty">Unlock</button>
</div>
</div>
<div class="row">
<div class="column medium-6">
<!-- Account Status -->
<fieldset class="field-group-container">
<legend>Account Status</legend>
<label class="radio-label">
<input type="radio"
name="accountStatus"
ng-value="true"
ng-model="modalCtrl.user.accountStatus"
ng-disabled="modalCtrl.user.isRoot">
Enabled
</label>
<label class="radio-label">
<input type="radio"
name="accountStatus1"
ng-value="false"
ng-model="modalCtrl.user.accountStatus"
ng-disabled="modalCtrl.user.isRoot">
Disabled
</label>
</fieldset>
<!-- Username -->
<div class="field-group-container">
<label for="username">Username</label>
<p class="label__helper-text">Cannot start with a number</p>
<p class="label__helper-text">No special characters except underscore</p>
<input id="username"
name="username"
type="text"
required
minlength="1"
maxlength="16"
ng-pattern="'^([a-zA-Z_][a-zA-Z0-9_]*)'"
ng-readonly="modalCtrl.user.isRoot"
ng-model="modalCtrl.user.username"
username-validator
existing-usernames="modalCtrl.existingUsernames"/>
<div ng-if="form.username.$invalid && form.username.$touched" class="form__validation-message">
<span ng-show="form.username.$error.required">
Field is required</span>
<span ng-show="form.username.$error.minlength || form.username.$error.maxlength">
Length must be between <span class="nowrap">1 – 16</span> characters</span>
<span ng-show="form.username.$error.pattern">
Invalid format</span>
<span ng-show="form.username.$error.duplicateUsername">
Username already exists</span>
</div>
</div>
<!-- Privlege -->
<div class="field-group-container">
<label for="privilege">Privilege</label>
<select id="privilege"
name="privilege"
required
ng-disabled="modalCtrl.user.isRoot"
ng-model="modalCtrl.user.privilege">
<option ng-if="modalCtrl.user.new"
ng-selected="modalCtrl.user.new"
value=""
disabled>
Select an option
</option>
<option ng-value="role"
ng-repeat="role in modalCtrl.privilegeRoles">
{{role}}
</option>
</select>
</div>
</div>
<div class="column medium-6">
<!-- Password -->
<div class="field-group-container">
<label for="password">User password</label>
<p class="label__helper-text">Password must between <span class="nowrap">{{modalCtrl.minPasswordLength}} – {{modalCtrl.maxPasswordLength}}</span> characters</p>
<input id="password"
name="password"
type="password"
ng-minlength="modalCtrl.minPasswordLength"
ng-maxlength="modalCtrl.maxPasswordLength"
autocomplete="new-password"
ng-required="modalCtrl.user.new || form.password.$touched || form.passwordConfirm.$touched"
ng-model="modalCtrl.user.password"
password-visibility-toggle
ng-click="form.password.$setTouched()"
placeholder="{{
(modalCtrl.user.new ||
form.password.$touched ||
form.passwordConfirm.$touched) ? '' : '******'}}"/>
<div ng-if="form.password.$invalid && form.password.$dirty" class="form__validation-message">
<span ng-show="form.password.$error.required">
Field is required</span>
<span ng-show="form.password.$error.minlength || form.password.$error.maxlength">
Length must be between <span class="nowrap">{{modalCtrl.minPasswordLength}} – {{modalCtrl.maxPasswordLength}}</span> characters</span>
</div>
</div>
<!-- Password confirm -->
<div class="field-group-container">
<label for="passwordConfirm">Confirm user password</label>
<input id="passwordConfirm"
name="passwordConfirm"
type="password"
autocomplete="new-password"
ng-required="modalCtrl.user.new || form.password.$touched || form.passwordConfirm.$touched"
ng-model="modalCtrl.user.passwordConfirm"
password-visibility-toggle
password-confirm
first-password="form.password.$modelValue"
ng-click="form.passwordConfirm.$setTouched()"
placeholder="{{(
modalCtrl.user.new ||
form.password.$touched ||
form.passwordConfirm.$touched) ? '' : '******'}}"/>
<div ng-if="form.passwordConfirm.$invalid && form.passwordConfirm.$dirty" class="form__validation-message">
<span ng-show="form.passwordConfirm.$error.required">
Field is required</span>
<span ng-show="form.passwordConfirm.$error.passwordConfirm"
ng-hide="form.passwordConfirm.$error.required">
Passwords do not match</span>
<span ng-show="form.passwordConfirm.$error.minlength || form.passwordConfirm.$error.maxlength">
Length must be between <span class="nowrap">1 – 16</span> characters</span>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-secondary" ng-click="$dismiss()" type="button">
Cancel
</button>
<button class="btn btn-primary"
type="submit"
ng-click="$close(form)"
ng-disabled="form.$invalid || form.$pristine"
ng-class="{'disabled': form.$invalid}">
{{ modalCtrl.user.new ? 'Add user' : 'Save' }}
</button>
</div>
</form>
</div>
|
