ux: Toast 提示替代 alert,自动消失无需手动点击
This commit is contained in:
@@ -10,6 +10,22 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
refreshAll();
|
||||
});
|
||||
|
||||
// Toast 提示(自动消失)
|
||||
function showToast(message, duration) {
|
||||
duration = duration || 2000;
|
||||
var toast = document.createElement('div');
|
||||
toast.className = 'toast';
|
||||
toast.textContent = message;
|
||||
document.body.appendChild(toast);
|
||||
|
||||
setTimeout(function() {
|
||||
toast.classList.add('fade-out');
|
||||
setTimeout(function() {
|
||||
toast.remove();
|
||||
}, 300);
|
||||
}, duration);
|
||||
}
|
||||
|
||||
// 点击模态框背景关闭
|
||||
function closeModalOnBackground(event, modalId) {
|
||||
if (event.target.id === modalId) {
|
||||
@@ -92,13 +108,13 @@ function startScheduler() {
|
||||
.then(function(res) { return res.json(); })
|
||||
.then(function(data) {
|
||||
if (data.success) {
|
||||
alert('Started!');
|
||||
showToast('Started!', 1500);
|
||||
refreshAll();
|
||||
} else {
|
||||
alert('Failed: ' + data.error);
|
||||
showToast('Failed: ' + data.error, 3000);
|
||||
}
|
||||
})
|
||||
.catch(function(e) { alert('Error: ' + e.message); });
|
||||
.catch(function(e) { showToast('Error: ' + e.message, 3000); });
|
||||
}
|
||||
|
||||
function stopScheduler() {
|
||||
@@ -106,11 +122,11 @@ function stopScheduler() {
|
||||
.then(function(res) { return res.json(); })
|
||||
.then(function(data) {
|
||||
if (data.success) {
|
||||
alert('Stopped!');
|
||||
showToast('Stopped!', 1500);
|
||||
refreshAll();
|
||||
}
|
||||
})
|
||||
.catch(function(e) { alert('Error: ' + e.message); });
|
||||
.catch(function(e) { showToast('Error: ' + e.message, 3000); });
|
||||
}
|
||||
|
||||
function captureNow() {
|
||||
@@ -118,23 +134,23 @@ function captureNow() {
|
||||
.then(function(res) { return res.json(); })
|
||||
.then(function(data) {
|
||||
if (data.success) {
|
||||
alert('Capture success! Image ID: ' + data.image_id);
|
||||
showToast('Captured! ID: ' + data.image_id, 1500);
|
||||
refreshAll();
|
||||
} else {
|
||||
alert('Capture failed: ' + data.error);
|
||||
showToast('Failed: ' + data.error, 3000);
|
||||
}
|
||||
})
|
||||
.catch(function(e) { alert('Error: ' + e.message); });
|
||||
.catch(function(e) { showToast('Error: ' + e.message, 3000); });
|
||||
}
|
||||
|
||||
function analyzeUnanalyzed() {
|
||||
fetch(API_BASE + '/api/analyze/unanalyzed', {method: 'POST'})
|
||||
.then(function(res) { return res.json(); })
|
||||
.then(function(data) {
|
||||
alert('Analyzed ' + data.results.length + ' images');
|
||||
showToast('Analyzed ' + data.results.length + ' images', 1500);
|
||||
refreshAll();
|
||||
})
|
||||
.catch(function(e) { alert('Error: ' + e.message); });
|
||||
.catch(function(e) { showToast('Error: ' + e.message, 3000); });
|
||||
}
|
||||
|
||||
// Images
|
||||
|
||||
Reference in New Issue
Block a user