]>
git.proxmox.com Git - pmg-gui.git/blob - js/mobile/quarantineview.js
1 class QuarantineView
extends Component
{
2 constructor(config
= {}) {
3 config
.tpl
= config
.tpl
|| `
4 <div class="view view-quarantine">
5 <div data-name="quarantine-list" class="page">
7 <div class="navbar-inner">
9 <img class="logo-navbar" style="padding: 0 10px"
10 src="pve2/images/logo-128.png" height=32 />
12 <div class="title">Mail Gateway</div>
15 <div class="settings-form elevation-5 fab-morph-target">
16 <div class="block-title block-title-medium">` + gettext("Range") + `</div>
17 <div class="list no-hairlines-md">
19 <li class="item-content item-input">
20 <div class="item-inner">
21 <div class="item-title item-label">` + gettext("Since") + `</div>
22 <div class="item-input-wrap">
23 <input type="date" name="from" placeholder="from" required validate>
27 <li class="item-content item-input">
28 <div class="item-inner">
29 <div class="item-title item-label">` + gettext("Until") + `</div>
30 <div class="item-input-wrap">
31 <input type="date" name="to" placeholder="to" required validate>
36 <a class="button fab-close range-form">` + gettext("OK") + `</a>
39 <div class="fab fab-morph fab-right-bottom" data-morph-to=".settings-form">
41 <i class="icon f7-icons ios-only">calendar</i>
42 <i class="icon material-icons md-only">date_range</i>
45 <div class="toolbar subscription toolbar-hidden toolbar-bottom">
46 <div class="toolbar-inner">
47 <a class="button subscription">
48 <i class="icon f7-icons ios-only color-yellow">alert</i>
49 <i class="icon material-icons md-only color-yellow">warning</i>
50 <span class="subscription-text">
51 ` + gettext("No valid subscription") + `
56 <div class="page-content ptr-content">
57 <div class="ptr-preloader">
58 <div class="preloader"></div>
59 <div class="ptr-arrow"></div>
61 <div class="list virtual-list"></div>
65 config
.itemTemplate
= config
.itemTemplate
|| `
67 <div class="swipeout-content">
68 <a href="/mail/{{id}}/" class="item-link item-content">
69 <div class="item-inner">
70 <div class="item-title">
71 <div class="item-header">{{escape from}}</div>
74 <div class="item-after">Score: {{js "this.spamlevel || 0"}}</div>
78 <div class="swipeout-actions-left">
79 <a href="/mail/{{id}}/deliver" class="color-green swipeout-close">
80 <i class="icon f7-icons ios-only">paper_plane</i>
81 <i class="icon material-icons md-only">send</i>
82 ` + gettext("Deliver") + `
84 <a href="/mail/{{id}}/whitelist" class="swipeout-close">
85 <i class="icon f7-icons ios-only">check</i>
86 <i class="icon material-icons md-only">check</i>
87 ` + gettext("Whitelist") + `
90 <div class="swipeout-actions-right">
91 <a href="/mail/{{id}}/blacklist" class="color-orange swipeout-close">
92 <i class="icon f7-icons ios-only">close</i>
93 <i class="icon material-icons md-only">close</i>
94 ` + gettext("Blacklist") + `
96 <a href="/mail/{{id}}/delete" class="color-red swipeout-close">
97 <i class="icon f7-icons ios-only">trash</i>
98 <i class="icon material-icons md-only">delete</i>
99 ` + gettext("Delete") + `
103 config
.dividerTemplate
= config
.dividerTemplate
||
104 '<li class="item-divider">{{group}}</li>';
109 me
._compiledItemTemplate
= Template7
.compile(me
.config
.itemTemplate
);
110 me
._compiledDividerTemplate
= Template7
.compile(me
.config
.dividerTemplate
);
112 <li class="skeleton-text skeleton-effect-fade">
113 <a href="#" class="item-content item-link">
114 <div class="item-inner">
115 <div class="item-title">
116 <div class="item-header">_______________________</div>
117 ____ ______ __ _______ ____ _______ _______ ___
119 <div class="item-after">Score: 15</div>
123 me
.skelDividerTpl
= '<li class="item-divider skeleton-text">____-__-__</li>';
124 me
.setEndtime(new Date());
125 let startdate
= new Date();
126 startdate
.setDate(startdate
.getDate() - 7);
127 me
.setStarttime(startdate
);
130 $$(me
.config
.target
|| '#app').append(me
.getEl());
132 $$(document
).on('page:init', '.page[data-name=quarantine-list]', (e
, page
) => {
133 me
.vList
= app
.virtualList
.create({
136 renderItem: function(item
) {
137 return me
._renderItem(item
);
139 height: function(item
) {
140 return me
._calculateHeight(item
);
142 emptyTemplate
: '<div class="empty">No data in database</div>',
145 // setup pull to refresh
146 $$('.ptr-content').on('ptr:refresh', (ev
) => {
148 { skel
: true, divider
: true },
152 { skel
: true, divider
: true },
161 me
.load().then(data
=> {
168 grouperFn
: (val
) => PMG
.Utils
.unixToIso(val
.time
),
170 }).catch(PMG
.Utils
.showError
).then(() => {
175 // process query parameters
176 let { mail
, action
, date
, username
, ticket
} = PMG
.Utils
.extractParams();
178 me
.setStarttime(date
);
182 $$('input[name=from]').val(PMG
.Utils
.unixToIso(me
.starttime
));
183 $$('input[name=to]').val(PMG
.Utils
.unixToIso(me
.endtime
));
185 $$('.fab').on('fab:close', () => {
186 let fromChanged
= me
.setStarttime($$('input[name=from]').val());
187 let toChanged
= me
.setEndtime($$('input[name=to]').val());
188 if (fromChanged
|| toChanged
) {
195 let loginInfo
= { username
, ticket
};
196 let showPopup
= (username
&& ticket
) || !PMG
.Utils
.authOK();
197 me
._loginScreen
= new LoginScreen({ loginInfo
});
199 me
._loginScreen
.open().then(data
=> {
200 me
._loginScreen
.close();
201 PMG
.Utils
.setLoginInfo(data
);
202 return PMG
.Utils
.getSubscriptionInfo();
203 }).then(data
=> PMG
.Utils
.checkSubscription(data
, showPopup
)).then(data
=> {
206 let url
= "/mail/" + mail
+ "/" + (action
|| "");
207 me
._view
.router
.navigate(url
);
209 }).catch(PMG
.Utils
.showError
);
212 me
._view
= app
.views
.create('.view-quarantine', {
213 main
: me
.config
.mainView
!== undefined ? me
.config
.mainView
: true,
216 pushStateAnimateOnLoad
: true,
219 setStarttime(starttime
) {
221 let date
= starttime
;
222 if (!(starttime
instanceof Date
)) {
223 // we assume an ISO string
224 if (starttime
=== '') {
227 date
= new Date(PMG
.Utils
.isoToUnix(starttime
)*1000);
229 // starttime is at beginning of date
230 date
.setHours(0, 0, 0, 0);
231 let result
= Math
.round(date
.getTime()/1000);
232 if (result
!== me
.starttime
) {
233 me
.starttime
= result
;
238 setEndtime(endtime
) {
241 if (!(endtime
instanceof Date
)) {
242 if (endtime
=== '') {
245 // we assume an ISO string
246 date
= new Date(PMG
.Utils
.isoToUnix(endtime
)*1000);
248 // endtime is at the end of the day
249 date
.setHours(23, 59, 59);
250 let result
= Math
.round(date
.getTime()/1000);
251 if (result
!== me
.endtime
) {
257 _calculateHeight(item
) {
260 let height
= 48; // default
262 if (typeof item
=== 'object') {
263 let type
= app
.theme
+ '-' + (item
.divider
? "divider" : 'item');
286 if (typeof item
=== 'object') {
288 return item
.divider
? me
.skelDividerTpl
: me
.skelTpl
;
289 } else if (item
.divider
) {
290 return me
._compiledDividerTemplate(item
);
292 return me
._compiledItemTemplate(item
);
296 return item
.toString();
298 setItems(items
, options
) {
300 if (options
&& options
.sorter
) {
301 if (options
.sorter
.sorterFn
) {
302 items
.sort(options
.sorter
.sorterFn
);
304 let prop
= options
.sorter
.property
;
305 let numeric
= options
.sorter
.numeric
;
306 let dir
= options
.sorter
.direction
=== "ASC" ? 1 : -1;
307 items
.sort((a
, b
) => {
311 result
= a
[prop
] - b
[prop
];
313 result
= a
[prop
] === b
[prop
] ? 0 : a
[prop
] < b
[prop
] ? 1 : -1;
320 me
.vList
.replaceAllItems(items
);
321 if (options
&& options
.grouperFn
) {
324 for (let i
= 0; i
+offset
< items
.length
; i
++) {
325 let item
= items
[i
+offset
];
326 let curgroup
= options
.grouperFn(item
);
327 if (curgroup
!== lastgroup
) {
328 me
.vList
.insertItemBefore(i
+offset
++, {
332 lastgroup
= curgroup
;
339 return new Promise(function(resolve
, reject
) {
341 url
: '/api2/json/quarantine/spam',
343 starttime
: me
.starttime
,
347 success
: (response
, status
, xhr
) => {
348 resolve(response
.data
);