You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
190 lines
8.0 KiB
190 lines
8.0 KiB
{{define "document_remove"}}
|
|
<h2>Document Removal</h2>
|
|
|
|
<div class="upload-container">
|
|
<!-- Loading Overlay -->
|
|
<div class="removal-overlay htmx-indicator">
|
|
<div class="upload-overlay-content">
|
|
<div class="overlay-spinner"></div>
|
|
<h3>Removing Documents</h3>
|
|
<p>Please wait while your documents are being removed...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 1: CSV Upload -->
|
|
<div id="step1-removal" class="content">
|
|
<h3 class="submenu-header">Step 1: Upload CSV file with Job IDs</h3>
|
|
{{template "document_remove_csv" .}}
|
|
</div>
|
|
|
|
<!-- Step 2: Document Selection -->
|
|
<div id="step2-removal" class="content" style="display: none;">
|
|
<h3 class="submenu-header">Step 2: Select Documents to Remove</h3>
|
|
|
|
<div id="bulk-removal-section">
|
|
<form id="bulk-remove-form" hx-post="/documents/remove/bulk" hx-target="#removal-results"
|
|
hx-indicator=".removal-overlay">
|
|
<div class="form-group">
|
|
<label>Document Types to Remove:</label>
|
|
<div class="checkbox-group">
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="type-1" name="documentTypes" value="1">
|
|
<label for="type-1">Job Paperwork</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="type-2" name="documentTypes" value="2">
|
|
<label for="type-2">Job Vendor Bill</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="type-7" name="documentTypes" value="7">
|
|
<label for="type-7">Generic Attachment</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="type-14" name="documentTypes" value="14">
|
|
<label for="type-14">Job Invoice</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="filename-patterns">Filename Patterns (comma-separated, use * as wildcard):</label>
|
|
<input type="text" id="filename-patterns" name="filenamePatterns" class="card-input"
|
|
placeholder="e.g. invoice*.pdf, report*.docx">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="age-filter">Remove Files Older Than (days):</label>
|
|
<select class="card-input" id="age-filter" name="age-filter">
|
|
<option value="0" selected>Any</option>
|
|
<option value="1">1 Day</option>
|
|
<option value="7">7 Days</option>
|
|
<option value="30">30 Days</option>
|
|
<option value="90">90 Days</option>
|
|
<option value="120">120 Days</option>
|
|
<option value="180">180 Days</option>
|
|
<option value="365">365 Days</option>
|
|
</select>
|
|
</div>
|
|
|
|
<input type="hidden" id="bulk-job-ids" name="jobIDs">
|
|
|
|
<div class="form-actions">
|
|
<button type="submit" class="warning-button" id="bulk-remove-btn" disabled>
|
|
Remove All Matching Documents
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Job IDs container moved inside the form for better structure -->
|
|
<div id="job-ids-removal-container" style="display: none;">
|
|
<!-- Hidden input placeholder for job IDs -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 3: Results -->
|
|
<div id="step3-removal" class="content" style="display: none;">
|
|
<h3 class="submenu-header">Step 3: Removal Results</h3>
|
|
<div id="removal-results" class="upload-results">
|
|
<!-- Results will appear here after removing documents -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Restart Button (initially hidden) -->
|
|
<div id="restart-section-removal" class="content" style="display: none;">
|
|
<h3 class="submenu-header">Removal Complete</h3>
|
|
<button type="button" class="btn-primary" hx-on:click="restartRemoval()">Start New Removal</button>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
// Sync job IDs between forms
|
|
htmx.on('#job-ids-removal-container', 'htmx:afterSwap', function () {
|
|
// Get jobIDs from the container
|
|
const hiddenInput = document.querySelector('#job-ids-removal-container input[name="jobIDs"]');
|
|
if (hiddenInput) {
|
|
const jobIds = hiddenInput.value;
|
|
|
|
// Update bulk form hidden input
|
|
const bulkJobIds = document.getElementById('bulk-job-ids');
|
|
if (bulkJobIds) {
|
|
bulkJobIds.value = jobIds;
|
|
|
|
// Enable bulk remove button if we have job IDs
|
|
const bulkRemoveBtn = document.getElementById('bulk-remove-btn');
|
|
if (bulkRemoveBtn) {
|
|
bulkRemoveBtn.disabled = !jobIds;
|
|
}
|
|
}
|
|
|
|
// Show step 2 when job IDs are loaded
|
|
document.getElementById('step2-removal').style.display = 'block';
|
|
}
|
|
});
|
|
|
|
// Add event listeners for the removal overlay
|
|
document.querySelectorAll('form').forEach(form => {
|
|
form.addEventListener('htmx:beforeRequest', function (evt) {
|
|
if (evt.detail.pathInfo.requestPath.includes('/documents/remove')) {
|
|
document.querySelector('.removal-overlay').style.display = 'flex';
|
|
}
|
|
});
|
|
|
|
form.addEventListener('htmx:afterRequest', function (evt) {
|
|
if (evt.detail.pathInfo.requestPath.includes('/documents/remove')) {
|
|
document.querySelector('.removal-overlay').style.display = 'none';
|
|
|
|
// If it's a removal action and successful, show step 3 and restart section
|
|
if (evt.detail.successful &&
|
|
(evt.detail.pathInfo.requestPath.includes('/documents/remove/bulk'))) {
|
|
document.getElementById('step3-removal').style.display = 'block';
|
|
document.getElementById('restart-section-removal').style.display = 'block';
|
|
}
|
|
}
|
|
});
|
|
|
|
form.addEventListener('htmx:error', function (evt) {
|
|
document.querySelector('.removal-overlay').style.display = 'none';
|
|
});
|
|
});
|
|
});
|
|
|
|
// Function to restart the removal process
|
|
function restartRemoval() {
|
|
// Hide all sections except step 1
|
|
document.getElementById('step2-removal').style.display = 'none';
|
|
document.getElementById('step3-removal').style.display = 'none';
|
|
document.getElementById('restart-section-removal').style.display = 'none';
|
|
|
|
// Clear results
|
|
document.getElementById('removal-results').innerHTML = '';
|
|
|
|
// Reset CSV preview if it exists
|
|
const csvPreview = document.getElementById('csv-preview-removal');
|
|
if (csvPreview) {
|
|
csvPreview.style.display = 'none';
|
|
}
|
|
|
|
const csvPreviewContent = document.getElementById('csv-preview-content-removal');
|
|
if (csvPreviewContent) {
|
|
csvPreviewContent.innerHTML = '<p>No jobs loaded yet</p>';
|
|
}
|
|
|
|
// Reset job IDs container
|
|
document.getElementById('job-ids-removal-container').innerHTML = '';
|
|
|
|
// Show step 1
|
|
document.getElementById('step1-removal').style.display = 'block';
|
|
|
|
// Reset any file inputs
|
|
const fileInput = document.getElementById('csv-file-removal');
|
|
if (fileInput) {
|
|
fileInput.value = '';
|
|
}
|
|
|
|
// Reset form
|
|
document.getElementById('bulk-remove-form').reset();
|
|
}
|
|
</script>
|
|
{{end}}
|