]>
Commit | Line | Data |
---|---|---|
43f0b189 DC |
1 | class LoginScreen extends Component { |
2 | constructor(config = {}) { | |
3 | config.tpl = ` | |
4 | <div class="login-screen"> | |
5 | <div class="view"> | |
6 | <div class="page"> | |
7 | <div class="page-content login-screen-content"> | |
8 | <div class="login-screen-title"> | |
9 | <img class="logo" src="pve2/images/logo-128.png" /> | |
10 | Proxmox Mail Gateway | |
11 | </div> | |
12 | <form action="/api2/json/access/ticket" method="POST" class="form-ajax-submit"> | |
13 | <div class="list"> | |
14 | <ul> | |
15 | <li class="item-content item-input"> | |
16 | <div class="item-inner"> | |
17 | <div class="item-title item-label">Username</div> | |
18 | <div class="item-input-wrap"> | |
a827641e | 19 | <input type="text" name="username" placeholder="` + gettext('Username') + `" required validate> |
43f0b189 DC |
20 | <span class="input-clear-button"></span> |
21 | </div> | |
22 | </div> | |
23 | </li> | |
24 | <li class="item-content item-input"> | |
25 | <div class="item-inner"> | |
26 | <div class="item-title item-label">Password</div> | |
27 | <div class="item-input-wrap"> | |
a827641e | 28 | <input type="password" name="password" placeholder="` + gettext('Password') + `" required validate> |
43f0b189 DC |
29 | <span class="input-clear-button"></span> |
30 | </div> | |
31 | </div> | |
32 | </li> | |
33 | </ul> | |
34 | </div> | |
35 | <div class="list"> | |
36 | <ul> | |
37 | <li> | |
a827641e | 38 | <input type="submit" class="button" value='` + gettext("Log In") + `'> |
43f0b189 DC |
39 | </li> |
40 | </ul> | |
41 | </div> | |
42 | </form> | |
43 | </div> | |
44 | </div> | |
45 | </div> | |
46 | </div> | |
47 | `; | |
48 | super(config); | |
49 | var me = this; | |
50 | me._screen = app.loginScreen.create({ | |
51 | content: me.getEl(), | |
52 | }); | |
53 | ||
54 | let login = config.loginInfo; | |
55 | me._form = me.getEl().find('form'); | |
56 | ||
57 | if (login.username && login.ticket) { | |
58 | app.form.fillFromData(me._form, { | |
59 | username: login.username, | |
60 | password: login.ticket, | |
61 | }); | |
62 | me._autoLogin = true; | |
63 | } else if (PMG.Utils.authOK()) { | |
64 | app.form.fillFromData(me._form, { | |
65 | username: Proxmox.UserName, | |
66 | password: decodeURIComponent(PMG.Utils.getCookie('PMGAuthCookie')), | |
67 | }); | |
68 | me._autoLogin = true; | |
69 | } | |
70 | } | |
71 | open(onLogin) { | |
72 | var me = this; | |
73 | return new Promise(function(resolve, reject) { | |
4714e65d | 74 | me._form.on('formajax:beforesend', (e) => { |
43f0b189 DC |
75 | me.loader = app.dialog.preloader(); |
76 | }); | |
77 | ||
4714e65d DC |
78 | me._form.on('formajax:success', (e) => { |
79 | let xhr = e.detail.xhr; | |
43f0b189 DC |
80 | let json; |
81 | try { | |
82 | json = JSON.parse(xhr.responseText); | |
83 | } catch (err) { | |
84 | xhr.error = err; | |
85 | PMG.Utils.showError(xhr); | |
86 | return; | |
87 | } | |
88 | ||
89 | resolve(json); | |
90 | }); | |
91 | ||
4714e65d DC |
92 | me._form.on('formajax:error', (e) => { |
93 | let xhr = e.detail.xhr; | |
43f0b189 DC |
94 | me.loader.close(); |
95 | PMG.Utils.showError(xhr); | |
96 | }); | |
97 | ||
98 | if (me._autoLogin) { | |
99 | delete me._autoLogin; | |
100 | me._screen.on('open', () => { | |
101 | me._form.trigger('submit'); | |
c87d46fb | 102 | }); |
43f0b189 DC |
103 | } |
104 | ||
105 | me._screen.open(); | |
106 | }); | |
107 | } | |
108 | close() { | |
109 | var me = this; | |
110 | if (me.loader) { | |
111 | me.loader.close(); | |
112 | } | |
113 | me._screen.close(false); | |
114 | } | |
115 | } | |
116 |