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.
232 lines
9.9 KiB
232 lines
9.9 KiB
{{define "document_remove"}}
|
|
<h2>Document Removal</h2>
|
|
|
|
<div class="upload-container">
|
|
<!-- Loading Overlay -->
|
|
<div class="upload-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 class="tab-buttons">
|
|
<button id="individual-tab-btn" class="tab-button active">Individual Selection</button>
|
|
<button id="bulk-tab-btn" class="tab-button">Bulk Removal</button>
|
|
</div>
|
|
|
|
<div id="individual-selection-tab">
|
|
{{template "document_remove_form" .}}
|
|
</div>
|
|
|
|
<div id="bulk-removal-tab" style="display: none;">
|
|
<form id="bulk-remove-form" hx-post="/documents/remove/bulk" hx-target="#removal-results"
|
|
hx-indicator=".upload-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 id="job-results" class="job-selection">
|
|
<!-- Jobs and document selection will appear here -->
|
|
</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" onclick="restartRemoval()">Start New Removal</button>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
// Tab switching
|
|
const individualTabBtn = document.getElementById('individual-tab-btn');
|
|
const bulkTabBtn = document.getElementById('bulk-tab-btn');
|
|
const individualTab = document.getElementById('individual-selection-tab');
|
|
const bulkTab = document.getElementById('bulk-removal-tab');
|
|
|
|
individualTabBtn.addEventListener('click', function () {
|
|
individualTabBtn.classList.add('active');
|
|
bulkTabBtn.classList.remove('active');
|
|
individualTab.style.display = 'block';
|
|
bulkTab.style.display = 'none';
|
|
});
|
|
|
|
bulkTabBtn.addEventListener('click', function () {
|
|
bulkTabBtn.classList.add('active');
|
|
individualTabBtn.classList.remove('active');
|
|
bulkTab.style.display = 'block';
|
|
individualTab.style.display = 'none';
|
|
});
|
|
|
|
// 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('.upload-overlay').style.display = 'flex';
|
|
}
|
|
});
|
|
|
|
form.addEventListener('htmx:afterRequest', function (evt) {
|
|
if (evt.detail.pathInfo.requestPath.includes('/documents/remove')) {
|
|
document.querySelector('.upload-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/job/') ||
|
|
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('.upload-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 = '';
|
|
|
|
// Reset tab selection
|
|
const individualTabBtn = document.getElementById('individual-tab-btn');
|
|
const bulkTabBtn = document.getElementById('bulk-tab-btn');
|
|
const individualTab = document.getElementById('individual-selection-tab');
|
|
const bulkTab = document.getElementById('bulk-removal-tab');
|
|
|
|
individualTabBtn.classList.add('active');
|
|
bulkTabBtn.classList.remove('active');
|
|
individualTab.style.display = 'block';
|
|
bulkTab.style.display = 'none';
|
|
|
|
// 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 = '';
|
|
}
|
|
}
|
|
</script>
|
|
{{end}}
|