feat(ui): aggiunge barra di progresso durante lo smistamento

Mostra una progress bar con messaggio contestuale nelle 4 fasi:
scansione sorgente, analisi cartella destinazione (con contatore
cartelle), ricerca duplicati (con contatore file CAD), smistamento
(N / totale). La barra è indeterminata nelle prime tre fasi e
determinata durante la copia. Il canale IPC progress viene
aperto all'inizio e chiuso al termine dell'operazione
This commit is contained in:
2026-03-16 14:54:23 +01:00
parent 57f8b230b2
commit b0bcea2f10
8 changed files with 133 additions and 19 deletions

View File

@@ -254,6 +254,53 @@
overflow: auto;
min-height: 180px;
}
.progress-container {
margin-top: 18px;
display: none;
}
.progress-label {
font-size: 13px;
color: var(--muted);
margin-bottom: 6px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
progress {
width: 100%;
height: 6px;
border-radius: 4px;
border: none;
appearance: none;
-webkit-appearance: none;
background: var(--border);
overflow: hidden;
}
progress::-webkit-progress-bar {
background: var(--border);
border-radius: 4px;
}
progress::-webkit-progress-value {
background: var(--accent);
border-radius: 4px;
transition: width 80ms ease;
}
progress:indeterminate {
background: linear-gradient(90deg, var(--border) 25%, var(--accent) 50%, var(--border) 75%);
background-size: 200% 100%;
animation: progress-indeterminate 1.2s linear infinite;
}
@keyframes progress-indeterminate {
0% { background-position: 100% 0; }
100% { background-position: -100% 0; }
}
</style>
</head>
<body>
@@ -270,6 +317,11 @@
Trascina qui una cartella o un file .zip
</section>
<div class="progress-container" id="progressContainer">
<div class="progress-label" id="progressLabel">In corso...</div>
<progress id="progressBar"></progress>
</div>
<section class="rules">
<h2>Destinazione file CAD</h2>
<div class="rule-row single-row">

View File

@@ -15,10 +15,40 @@ const clearPreviewBtn = document.getElementById('clearPreviewBtn');
const previewTitle = document.getElementById('previewTitle');
const previewMeta = document.getElementById('previewMeta');
const previewList = document.getElementById('previewList');
const progressContainer = document.getElementById('progressContainer');
const progressBar = document.getElementById('progressBar');
const progressLabel = document.getElementById('progressLabel');
const defaultDropZoneText = 'Trascina qui una cartella o un file .zip';
let isProcessing = false;
let currentPreviewKind = null;
function showProgress() {
progressContainer.style.display = 'block';
progressBar.removeAttribute('value');
progressLabel.textContent = 'In corso...';
}
function hideProgress() {
progressContainer.style.display = 'none';
}
function updateProgress({ phase, current, total, file, scanned, folder }) {
if (phase === 'scan') {
progressLabel.textContent = 'Scansione file sorgente...';
progressBar.removeAttribute('value');
} else if (phase === 'index-dest') {
progressLabel.textContent = `Analisi destinazione: ${scanned} cartelle scansionate${folder ? `${folder}` : ''}`;
progressBar.removeAttribute('value');
} else if (phase === 'index-dup') {
progressLabel.textContent = `Ricerca duplicati: ${scanned} file CAD trovati${file ? `${file}` : ''}`;
progressBar.removeAttribute('value');
} else if (phase === 'copy') {
progressBar.max = total;
progressBar.value = current;
progressLabel.textContent = `Smistamento: ${current} / ${total}${file ? `${file}` : ''}`;
}
}
function setLoading(isLoading) {
folderBtn.disabled = isLoading;
zipBtn.disabled = isLoading;
@@ -101,6 +131,8 @@ async function handleAction(actionName, actionFn) {
isProcessing = true;
setLoading(true);
showProgress();
window.api.onProgress(updateProgress);
output.textContent = `${actionName} in corso...`;
try {
@@ -115,6 +147,8 @@ async function handleAction(actionName, actionFn) {
} catch (error) {
output.textContent = `${actionName} fallito:\n${error.message}`;
} finally {
window.api.offProgress();
hideProgress();
setLoading(false);
isProcessing = false;
}