974494721a3d8057f814c9bf0eed76c7ee61bcf8
[motion-next.git] /
1 <md-dialog class="deskAccount-dialog" aria-label="New DeskAccount">
2   <form name="deskAccountForm" 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">{{ vm.title | 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 class="md-block">
41         <label translate="INTEGRATIONS.NAME">Name</label>
42         <input
43           type="text"
44           name="name"
45           ng-model="vm.deskAccount.name"
46           ng-required="true"
47           autofocus
48         />
49
50         <div
51           ng-messages="deskAccountForm['name'].$error"
52           ng-show="deskAccountForm['name'].$touched"
53           role="alert"
54         >
55           <div ng-message="required">
56             <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
57               >Name field is required</span
58             >
59           </div>
60         </div>
61       </md-input-container>
62       <md-input-container class="md-block">
63         <label translate="INTEGRATIONS.TYPE">Type</label>
64         <md-select name="type" ng-model="vm.deskAccount.type" required>
65           <md-option ng-value="'integrationTab'">
66             {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
67           </md-option>
68
69           <md-option ng-value="'newTab'">
70             {{ 'INTEGRATIONS.NEW_TAB' | translate }}
71           </md-option>
72         </md-select>
73         <div
74           ng-messages="deskAccountForm['type'].$error"
75           ng-show="deskAccountForm['type'].$touched"
76           role="alert"
77         >
78           <div ng-message="required">
79             <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
80               >Type field is required</span
81             >
82           </div>
83         </div>
84       </md-input-container>
85       <md-input-container class="md-block">
86         <label translate="INTEGRATIONS.URI">Uri</label>
87         <input
88           type="url"
89           name="remoteUri"
90           ng-model="vm.deskAccount.remoteUri"
91           ng-required="true"
92         />
93
94         <div
95           ng-messages="deskAccountForm['remoteUri'].$error"
96           ng-show="deskAccountForm['remoteUri'].$touched"
97           role="alert"
98         >
99           <div ng-message="required">
100             <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
101               >Uri field is required</span
102             >
103           </div>
104           <div ng-message="url">
105             <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
106               >Uri must be a valid url http://www.xcally.com</span
107             >
108           </div>
109         </div>
110       </md-input-container>
111       <md-input-container class="md-block">
112         <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
113         <md-select name="authType" ng-model="vm.deskAccount.authType" required>
114           <md-option ng-value="'basic'">Basic</md-option>
115         </md-select>
116         <div
117           ng-messages="deskAccountForm['authType'].$error"
118           ng-show="deskAccountForm['authType'].$touched"
119           role="alert"
120         >
121           <div ng-message="required">
122             <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
123               >AuthType field is required</span
124             >
125           </div>
126         </div>
127       </md-input-container>
128       <md-input-container
129         ng-if="vm.deskAccount.authType == 'basic'"
130         class="md-block"
131       >
132         <label translate="INTEGRATIONS.USERNAME">Username</label>
133         <input
134           type="text"
135           name="username"
136           ng-model="vm.deskAccount.username"
137           ng-required="true"
138         />
139
140         <div
141           ng-messages="deskAccountForm['username'].$error"
142           ng-show="deskAccountForm['username'].$touched"
143           role="alert"
144         >
145           <div ng-message="required">
146             <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
147               >Username field is required</span
148             >
149           </div>
150         </div>
151       </md-input-container>
152       <md-input-container
153         class="md-block"
154         ng-if="vm.deskAccount.authType == 'basic'"
155       >
156         <label translate="INTEGRATIONS.PASSWORD">Password</label>
157         <input
158           type="password"
159           name="password"
160           ng-model="vm.deskAccount.password"
161           placeholder="Password"
162           translate
163           translate-attr-placeholder="INTEGRATIONS.PASSWORD"
164           required
165         />
166         <div ng-messages="deskAccountForm['password'].$error" role="alert">
167           <div ng-message="required">
168             <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
169               >Password field is required</span
170             >
171           </div>
172           <div ng-message="pattern">
173             <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
174               >Must contain at least 8 characters, with a minimum of 1 lowercase
175               letter, 1 uppercase letter, 1 numeric character and 1 special
176               character ~!?*@#$%^&-_=+[{]}.</span
177             >
178           </div>
179         </div>
180       </md-input-container>
181
182       <md-input-container class="md-block">
183         <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
184           >MotionProxyAddress</label
185         >
186         <input
187           type="url"
188           name="serverUrl"
189           ng-model="vm.deskAccount.serverUrl"
190         />
191
192         <div class="hint">
193           <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
194         </div>
195         <div
196           ng-messages="deskAccountForm['serverUrl'].$error"
197           ng-show="deskAccountForm['serverUrl'].$touched"
198           role="alert"
199         >
200           <div ng-message="required">
201             <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
202               >MotionProxyAddress field is required</span
203             >
204           </div>
205           <div ng-message="url">
206             <span
207               translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
208               >MotionProxyAddress must be a valid url
209               http://www.xcally.com</span
210             >
211           </div>
212         </div>
213       </md-input-container>
214       <md-input-container class="md-block">
215         <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
216         <input
217           type="text"
218           name="description"
219           ng-model="vm.deskAccount.description"
220         />
221
222         <div
223           ng-messages="deskAccountForm['description'].$error"
224           ng-show="deskAccountForm['description'].$touched"
225           role="alert"
226         >
227           <div ng-message="required">
228             <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
229               >Description field is required</span
230             >
231           </div>
232         </div>
233       </md-input-container>
234
235       <div class="error-list">
236         <div
237           ng-repeat="error in vm.errors"
238           class="error"
239           layout="row"
240           layout-align="space-between center"
241         >
242           <div>
243             <span class="message">{{error.message}}</span>
244             <span class="type">({{error.type}})</span>
245           </div>
246           <md-button class="md-icon-button">
247             <md-icon
248               md-font-icon="icon-alert-box"
249               aria-label="alert error"
250               class="s16"
251             ></md-icon>
252           </md-button>
253         </div>
254       </div>
255     </md-dialog-content>
256
257     <md-dialog-actions
258       layout="row"
259       layout-align="space-between center"
260       ng-if="!vm.crudPermissions.readOnly"
261     >
262       <div layout="row" layout-align="start center">
263         <md-button
264           type="submit"
265           ng-if="vm.crudPermissions.canEdit && !vm.newDeskAccount"
266           ng-click="vm.saveDeskAccount()"
267           class="send-button md-accent md-raised"
268           ng-disabled="deskAccountForm.$invalid || deskAccountForm.$pristine"
269           aria-label="SAVE"
270           translate="INTEGRATIONS.SAVE"
271           translate-attr-aria-label="INTEGRATIONS.SAVE"
272         >
273           SAVE
274         </md-button>
275
276         <md-button
277           type="submit"
278           ng-if="vm.crudPermissions.canEdit && vm.newDeskAccount"
279           ng-click="vm.addNewDeskAccount()"
280           class="send-button md-accent md-raised"
281           ng-disabled="deskAccountForm.$invalid"
282           aria-label="ADD"
283           translate="INTEGRATIONS.ADD_DESKACCOUNT"
284           translate-attr-aria-label="INTEGRATIONS.ADD_DESKACCOUNT"
285         >
286           ADD DESKACCOUNT
287         </md-button>
288       </div>
289       <div layout="row">
290         <md-button
291           class="md-icon-button"
292           ng-if="vm.crudPermissions.canDelete && !vm.newDeskAccount"
293           ng-click="vm.deleteDeskAccount($event)"
294           aria-label="DELETE"
295           translate
296           translate-attr-aria-label="INTEGRATIONS.DELETE"
297         >
298           <md-icon md-font-icon="icon-delete"></md-icon>
299           <md-tooltip
300             ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
301           >
302         </md-button>
303       </div>
304     </md-dialog-actions>
305   </form>
306 </md-dialog>