646 lines
26 KiB
HTML
Executable File
646 lines
26 KiB
HTML
Executable File
{% extends "base.html" %}
|
|
{% block title %}Create Warehouse Locations{% endblock %}
|
|
|
|
{% block head %}
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/warehouse.css') }}">
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="warehouse-page-container">
|
|
<!-- Container 1: Add Location (1 part width) -->
|
|
<div class="warehouse-container-1">
|
|
<h3>Add Warehouse Location</h3>
|
|
{% if message %}
|
|
<div class="form-message">{{ message }}</div>
|
|
{% endif %}
|
|
<form method="POST" class="form-centered">
|
|
<label>Location Code:</label>
|
|
<input type="text" name="location_code" maxlength="12" required><br>
|
|
<label>Size:</label>
|
|
<input type="number" name="size"><br>
|
|
<label>Description:</label>
|
|
<input type="text" name="description" maxlength="250"><br>
|
|
<button type="submit" class="btn">Add Location</button>
|
|
</form>
|
|
<!-- Import from CSV section -->
|
|
<div style="margin-top: 24px;">
|
|
<h3 style="font-size: 1.1em;">Import Locations from CSV</h3>
|
|
<div style="display: flex; flex-direction: row; gap: 16px; align-items: center;">
|
|
<span style="font-size: 0.95em;">Bulk import warehouse locations using a CSV file.</span>
|
|
<a href="{{ url_for('warehouse.import_locations_csv') }}" class="btn" style="padding: 4px 12px; font-size: 0.95em;">Go to Import Page</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Container 2: Warehouse Locations Table (2 parts width) -->
|
|
<div class="warehouse-container-2">
|
|
<h3>Warehouse Locations</h3>
|
|
<div id="location-selection-hint" style="margin-bottom: 10px; font-size: 11px; color: #666; text-align: center;">
|
|
Click on a row to select a location for printing
|
|
</div>
|
|
<table class="scan-table" id="locations-table">
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>Location Code</th>
|
|
<th>Size</th>
|
|
<th>Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for loc in locations %}
|
|
<tr class="location-row" data-location-code="{{ loc[1] }}"
|
|
data-location-id="{{ loc[0] }}"
|
|
data-location-size="{{ loc[2] or '' }}"
|
|
data-location-description="{{ loc[3] or '' }}">
|
|
<td>{{ loc[0] }}</td>
|
|
<td>{{ loc[1] }}</td>
|
|
<td>{{ loc[2] or '' }}</td>
|
|
<td>{{ loc[3] or '' }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- Container 3: Edit/Delete and Print (1 part width) -->
|
|
<div class="warehouse-container-3">
|
|
<div class="edit-delete-card">
|
|
<h3>Edit/Delete Selected Location</h3>
|
|
<div id="no-selection-message" class="selection-message">
|
|
Select a location from the table to edit or delete it.
|
|
</div>
|
|
<div id="selected-location-info" class="selection-info" style="display: none;">
|
|
<strong>Selected:</strong> <span id="selected-location-display"></span>
|
|
</div>
|
|
<div class="button-group">
|
|
<button id="edit-location-btn" class="btn btn-info" disabled>
|
|
✏️ Edit Selected Location
|
|
</button>
|
|
<button id="delete-location-btn" class="btn btn-danger" disabled>
|
|
🗑️ Delete Selected Location
|
|
</button>
|
|
</div>
|
|
</div>
|
|
{% if session['role'] in ['administrator', 'management'] %}
|
|
<div style="margin-top: 32px; padding: 12px; border-top: 1px solid #eee;">
|
|
<label style="font-weight:bold;">Delete location from table</label>
|
|
<div style="font-size:0.95em; margin-bottom:8px;">To delete a location, enter the ID of the location and press delete.<br>To delete 2 or multiple locations, enter the IDs separated by "," and then press delete.</div>
|
|
<form method="POST" style="display:flex; gap:8px; align-items:center;" onsubmit="return confirmDeleteLocations();">
|
|
<input type="text" name="delete_ids" placeholder="e.g. 5,7,12" style="width:160px;">
|
|
<button type="submit" name="delete_locations" value="1" class="btn" style="padding:4px 16px;">Delete Locations</button>
|
|
</form>
|
|
<script>
|
|
function confirmDeleteLocations() {
|
|
return confirm('Do you really want to delete the selected locations?');
|
|
}
|
|
</script>
|
|
</div>
|
|
{% endif %}
|
|
<hr style="margin: 32px 0 24px 0;">
|
|
<h3 style="font-size: 1.1em; margin-bottom: 12px;">Print Location Barcode</h3>
|
|
<!-- Label Preview -->
|
|
<div id="barcode-label-preview" style="display: flex; align-items: center; justify-content: center;">
|
|
<div style="width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;">
|
|
<div class="location-text">
|
|
<div id="location-code-display">Select a location</div>
|
|
</div>
|
|
<canvas id="location-barcode" style="display: none;"></canvas>
|
|
<div id="barcode-placeholder" style="color: #999; font-style: italic; text-align: center;">No location selected</div>
|
|
</div>
|
|
</div>
|
|
<!-- Print Controls -->
|
|
<div style="text-align: center; margin-top: 15px;">
|
|
<div style="margin-bottom: 10px;">
|
|
<label for="printer-select" style="font-size: 11px; font-weight: 600;">Select Printer:</label>
|
|
<select id="printer-select" class="form-control form-control-sm" style="width: 200px; margin: 5px auto; font-size: 11px;">
|
|
<option value="">Loading printers...</option>
|
|
</select>
|
|
</div>
|
|
<button id="print-barcode-btn" class="btn btn-success" style="font-size: 12px; padding: 6px 20px;" disabled>
|
|
🖨️ Print Location Barcode
|
|
</button>
|
|
<button onclick="testQZConnection()" class="btn btn-info" style="font-size: 11px; padding: 4px 12px; margin-left: 8px;">
|
|
🔧 Test QZ Tray
|
|
</button>
|
|
<div id="print-status" style="margin-top: 8px; font-size: 11px;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Delete Confirmation Modal -->
|
|
<div id="delete-modal" class="modal" style="display: none;">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h3>Confirm Delete</h3>
|
|
<span class="close" onclick="closeDeleteModal()">×</span>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>Are you sure you want to delete the following location?</p>
|
|
<table class="confirm-table">
|
|
<tr><td><strong>ID:</strong></td><td id="delete-confirm-id"></td></tr>
|
|
<tr><td><strong>Location Code:</strong></td><td id="delete-confirm-code"></td></tr>
|
|
<tr><td><strong>Size:</strong></td><td id="delete-confirm-size"></td></tr>
|
|
<tr><td><strong>Description:</strong></td><td id="delete-confirm-description"></td></tr>
|
|
</table>
|
|
<div class="modal-buttons">
|
|
<button type="button" class="btn btn-secondary" onclick="closeDeleteModal()">Cancel</button>
|
|
<button type="button" class="btn btn-danger" onclick="confirmDelete()">Delete Location</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Include required JS libraries -->
|
|
<script src="{{ url_for('static', filename='JsBarcode.all.min.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='qz-tray.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='html2canvas.min.js') }}"></script>
|
|
|
|
<script>
|
|
// Simplified notification system (matching print module)
|
|
function showNotification(message, type = 'info') {
|
|
const existingNotifications = document.querySelectorAll('.notification');
|
|
existingNotifications.forEach(n => n.remove());
|
|
|
|
const notification = document.createElement('div');
|
|
notification.className = `notification alert alert-${type === 'error' ? 'danger' : type === 'success' ? 'success' : type === 'warning' ? 'warning' : 'info'}`;
|
|
notification.style.cssText = `
|
|
position: fixed;
|
|
top: 20px;
|
|
right: 20px;
|
|
z-index: 9999;
|
|
max-width: 450px;
|
|
padding: 15px;
|
|
border-radius: 5px;
|
|
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
|
|
`;
|
|
|
|
const formattedMessage = message.replace(/\n/g, '<br>');
|
|
|
|
notification.innerHTML = `
|
|
<div style="display: flex; align-items: flex-start; justify-content: space-between;">
|
|
<span style="flex: 1; padding-right: 10px; white-space: pre-wrap; font-family: monospace; font-size: 12px;">${formattedMessage}</span>
|
|
<button type="button" onclick="this.parentElement.parentElement.remove()" style="background: none; border: none; font-size: 20px; cursor: pointer; flex-shrink: 0;">×</button>
|
|
</div>
|
|
`;
|
|
|
|
document.body.appendChild(notification);
|
|
|
|
const timeout = type === 'error' ? 15000 : 5000;
|
|
setTimeout(() => {
|
|
if (notification.parentNode) {
|
|
notification.remove();
|
|
}
|
|
}, timeout);
|
|
}
|
|
|
|
let selectedLocationCode = null;
|
|
let qzTray = null;
|
|
let availablePrinters = [];
|
|
|
|
// Initialize QZ Tray connection (matching print module implementation)
|
|
async function initializeQZTray() {
|
|
try {
|
|
console.log('🔍 Checking for QZ Tray...');
|
|
|
|
// Check if QZ Tray library is loaded
|
|
if (typeof qz === 'undefined') {
|
|
console.error('❌ QZ Tray library not loaded');
|
|
const errorMsg = '❌ QZ Tray Library Not Loaded\n\n' +
|
|
'The QZ Tray JavaScript library failed to load.\n' +
|
|
'Check the browser console for errors and refresh the page.\n\n' +
|
|
'Path: /static/qz-tray.js';
|
|
document.getElementById('print-status').textContent = 'Library Error';
|
|
showNotification(errorMsg, 'error');
|
|
return false;
|
|
}
|
|
|
|
console.log('✅ QZ Tray library loaded');
|
|
console.log('🔒 Using patched qz-tray.js for pairing-key authentication...');
|
|
|
|
console.log('🔌 Attempting to connect to QZ Tray on client PC...');
|
|
|
|
// Set connection closed callback
|
|
qz.websocket.setClosedCallbacks(function() {
|
|
console.warn('⚠️ QZ Tray connection closed');
|
|
document.getElementById('print-status').textContent = 'QZ Tray Disconnected';
|
|
});
|
|
|
|
// Connect to QZ Tray running on client PC
|
|
console.log('⏳ Connecting...');
|
|
await qz.websocket.connect();
|
|
qzTray = qz;
|
|
|
|
const version = await qz.api.getVersion();
|
|
console.log('✅ QZ Tray connected successfully');
|
|
console.log('📋 QZ Tray Version:', version);
|
|
|
|
document.getElementById('print-status').textContent = 'QZ Tray Connected';
|
|
|
|
// Load printers
|
|
await loadQZTrayPrinters();
|
|
|
|
return true;
|
|
|
|
} catch (error) {
|
|
console.error('❌ QZ Tray connection failed:', error);
|
|
|
|
let errorMsg = '❌ QZ Tray Connection Failed\n\n';
|
|
let statusText = 'Connection Failed';
|
|
|
|
if (error.message && error.message.includes('certificate')) {
|
|
errorMsg += '🔒 Certificate Trust Required\n\n';
|
|
errorMsg += 'QZ Tray requires you to trust its certificate:\n';
|
|
errorMsg += '1. Open: https://localhost:8182\n';
|
|
errorMsg += '2. Accept/Trust the security certificate\n';
|
|
errorMsg += '3. Refresh this page and try again\n\n';
|
|
errorMsg += '🔍 This is normal and safe for QZ Tray';
|
|
statusText = 'Certificate Error';
|
|
} else {
|
|
errorMsg += '⚠️ Troubleshooting:\n';
|
|
errorMsg += '1. Make sure QZ Tray is running\n';
|
|
errorMsg += '2. Check firewall settings\n';
|
|
errorMsg += '3. Try restarting QZ Tray\n';
|
|
errorMsg += '4. Restart your browser\n\n';
|
|
errorMsg += 'Error: ' + error.message;
|
|
}
|
|
|
|
document.getElementById('print-status').textContent = statusText;
|
|
showNotification(errorMsg, 'error');
|
|
return false;
|
|
}
|
|
}
|
|
|
|
// Load available printers from QZ Tray (matching print module)
|
|
async function loadQZTrayPrinters() {
|
|
try {
|
|
if (!qzTray) return;
|
|
|
|
const printers = await qzTray.printers.find();
|
|
availablePrinters = printers;
|
|
|
|
const printerSelect = document.getElementById('printer-select');
|
|
printerSelect.innerHTML = '<option value="">Select a printer...</option>';
|
|
|
|
printers.forEach(printer => {
|
|
const option = document.createElement('option');
|
|
option.value = printer;
|
|
option.textContent = printer;
|
|
printerSelect.appendChild(option);
|
|
});
|
|
|
|
console.log(`📄 Found ${printers.length} printers:`, printers);
|
|
|
|
// Auto-select first thermal printer if available
|
|
const thermalPrinter = printers.find(p =>
|
|
p.toLowerCase().includes('thermal') ||
|
|
p.toLowerCase().includes('label') ||
|
|
p.toLowerCase().includes('zebra') ||
|
|
p.toLowerCase().includes('epson')
|
|
);
|
|
|
|
if (thermalPrinter) {
|
|
printerSelect.value = thermalPrinter;
|
|
console.log('🏷️ Auto-selected thermal printer:', thermalPrinter);
|
|
} else if (printers.length > 0) {
|
|
printerSelect.value = printers[0];
|
|
console.log('🖨️ Auto-selected first printer:', printers[0]);
|
|
}
|
|
|
|
showNotification(`✅ Found ${printers.length} printer(s)`, 'success');
|
|
|
|
} catch (error) {
|
|
console.error('Error loading printers:', error);
|
|
document.getElementById('printer-select').innerHTML = '<option value="">Failed to load printers</option>';
|
|
showNotification('⚠️ Failed to load printers: ' + error.message, 'warning');
|
|
}
|
|
}
|
|
|
|
// Generate barcode for location
|
|
function generateLocationBarcode(locationCode) {
|
|
const canvas = document.getElementById('location-barcode');
|
|
const placeholder = document.getElementById('barcode-placeholder');
|
|
|
|
if (locationCode) {
|
|
try {
|
|
JsBarcode(canvas, locationCode, {
|
|
format: "CODE128",
|
|
width: 2,
|
|
height: 80,
|
|
displayValue: true,
|
|
fontSize: 12,
|
|
margin: 5
|
|
});
|
|
canvas.style.display = 'block';
|
|
placeholder.style.display = 'none';
|
|
} catch (error) {
|
|
console.error('Error generating barcode:', error);
|
|
canvas.style.display = 'none';
|
|
placeholder.style.display = 'block';
|
|
placeholder.textContent = 'Barcode generation failed';
|
|
}
|
|
} else {
|
|
canvas.style.display = 'none';
|
|
placeholder.style.display = 'block';
|
|
placeholder.textContent = 'No location selected';
|
|
}
|
|
}
|
|
|
|
// Handle location row selection
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const locationRows = document.querySelectorAll('.location-row');
|
|
const locationCodeDisplay = document.getElementById('location-code-display');
|
|
const printButton = document.getElementById('print-barcode-btn');
|
|
const editButton = document.getElementById('edit-location-btn');
|
|
const deleteButton = document.getElementById('delete-location-btn');
|
|
const noSelectionMessage = document.getElementById('no-selection-message');
|
|
const selectedLocationInfo = document.getElementById('selected-location-info');
|
|
const selectedLocationDisplay = document.getElementById('selected-location-display');
|
|
|
|
let selectedLocation = null;
|
|
|
|
locationRows.forEach(row => {
|
|
row.addEventListener('click', function() {
|
|
// Remove selection from other rows
|
|
locationRows.forEach(r => r.classList.remove('selected'));
|
|
|
|
// Select this row
|
|
this.classList.add('selected');
|
|
|
|
// Get location data
|
|
selectedLocationCode = this.dataset.locationCode;
|
|
selectedLocation = {
|
|
id: this.cells[0].textContent,
|
|
code: this.cells[1].textContent,
|
|
size: this.cells[2].textContent,
|
|
description: this.cells[3].textContent
|
|
};
|
|
|
|
// Update display
|
|
locationCodeDisplay.textContent = selectedLocationCode;
|
|
selectedLocationDisplay.textContent = `${selectedLocation.code} (ID: ${selectedLocation.id})`;
|
|
|
|
// Show/hide selection info
|
|
noSelectionMessage.style.display = 'none';
|
|
selectedLocationInfo.style.display = 'block';
|
|
|
|
// Generate barcode
|
|
generateLocationBarcode(selectedLocationCode);
|
|
|
|
// Enable buttons
|
|
printButton.disabled = false;
|
|
editButton.disabled = false;
|
|
deleteButton.disabled = false;
|
|
|
|
showNotification(`📍 Selected location: ${selectedLocationCode}`, 'info');
|
|
});
|
|
});
|
|
|
|
// Edit button functionality
|
|
editButton.addEventListener('click', function() {
|
|
if (selectedLocation) {
|
|
openEditModal(selectedLocation);
|
|
}
|
|
});
|
|
|
|
// Delete button functionality
|
|
deleteButton.addEventListener('click', function() {
|
|
if (selectedLocation) {
|
|
openDeleteModal(selectedLocation);
|
|
}
|
|
});
|
|
|
|
// Initialize QZ Tray
|
|
initializeQZTray();
|
|
});
|
|
|
|
// Print barcode function with enhanced QZ Tray support
|
|
async function printLocationBarcode() {
|
|
if (!selectedLocationCode) {
|
|
showNotification('❌ Please select a location first', 'error');
|
|
return;
|
|
}
|
|
|
|
const selectedPrinter = document.getElementById('printer-select').value;
|
|
if (!selectedPrinter) {
|
|
showNotification('❌ Please select a printer', 'error');
|
|
return;
|
|
}
|
|
|
|
const printButton = document.getElementById('print-barcode-btn');
|
|
const printStatus = document.getElementById('print-status');
|
|
|
|
try {
|
|
printButton.disabled = true;
|
|
printStatus.textContent = 'Generating label...';
|
|
|
|
// Generate PDF for the 4x8cm label
|
|
const response = await fetch('/generate_location_label_pdf', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify({
|
|
location_code: selectedLocationCode
|
|
})
|
|
});
|
|
|
|
if (!response.ok) {
|
|
throw new Error('Failed to generate PDF');
|
|
}
|
|
|
|
const pdfBlob = await response.blob();
|
|
const pdfArrayBuffer = await pdfBlob.arrayBuffer();
|
|
const pdfBase64 = btoa(String.fromCharCode(...new Uint8Array(pdfArrayBuffer)));
|
|
|
|
printStatus.textContent = 'Sending to printer...';
|
|
|
|
// Configure QZ Tray for PDF printing with 4x8cm size
|
|
const config = qzTray.configs.create(selectedPrinter, {
|
|
size: { width: 4, height: 8, units: 'cm' },
|
|
margins: { top: 0, right: 0, bottom: 0, left: 0 },
|
|
orientation: 'portrait'
|
|
});
|
|
|
|
const data = [{
|
|
type: 'pdf',
|
|
format: 'base64',
|
|
data: pdfBase64
|
|
}];
|
|
|
|
await qzTray.print(config, data);
|
|
|
|
printStatus.textContent = 'Label printed successfully!';
|
|
showNotification(`✅ Location barcode printed successfully!\n📍 Location: ${selectedLocationCode}\n🖨️ Printer: ${selectedPrinter}`, 'success');
|
|
|
|
setTimeout(() => {
|
|
printStatus.textContent = '';
|
|
}, 3000);
|
|
|
|
} catch (error) {
|
|
console.error('Print error:', error);
|
|
printStatus.textContent = 'Print failed: ' + error.message;
|
|
showNotification('❌ Print failed: ' + error.message, 'error');
|
|
} finally {
|
|
printButton.disabled = false;
|
|
}
|
|
}
|
|
|
|
// Add event listener for print button
|
|
document.getElementById('print-barcode-btn').addEventListener('click', printLocationBarcode);
|
|
|
|
// Test QZ Tray connection function (for debugging)
|
|
async function testQZConnection() {
|
|
console.log('🔍 ========== QZ TRAY CONNECTION TEST ==========');
|
|
|
|
const printStatus = document.getElementById('print-status');
|
|
const originalStatus = printStatus.textContent;
|
|
printStatus.textContent = 'Testing QZ Tray...';
|
|
|
|
let testResults = [];
|
|
|
|
try {
|
|
// Test 1: Check if library is loaded
|
|
if (typeof qz === 'undefined') {
|
|
testResults.push('❌ Test 1: Library NOT loaded');
|
|
throw new Error('QZ Tray library not loaded');
|
|
}
|
|
testResults.push('✅ Test 1: Library loaded successfully');
|
|
|
|
// Test 2: Test connection
|
|
if (!qzTray) {
|
|
await initializeQZTray();
|
|
}
|
|
testResults.push('✅ Test 2: Connection successful');
|
|
|
|
// Test 3: Test printer discovery
|
|
await loadQZTrayPrinters();
|
|
testResults.push(`✅ Test 3: Found ${availablePrinters.length} printers`);
|
|
|
|
const resultMsg = 'QZ Tray Connection Test Results:\n\n' + testResults.join('\n');
|
|
showNotification(resultMsg, 'success');
|
|
printStatus.textContent = 'Test completed successfully';
|
|
|
|
} catch (error) {
|
|
testResults.push(`❌ Test failed: ${error.message}`);
|
|
const resultMsg = 'QZ Tray Connection Test Results:\n\n' + testResults.join('\n');
|
|
showNotification(resultMsg, 'error');
|
|
printStatus.textContent = 'Test failed';
|
|
}
|
|
|
|
setTimeout(() => {
|
|
printStatus.textContent = originalStatus;
|
|
}, 3000);
|
|
}
|
|
|
|
// Add test button functionality (for debugging - can be removed in production)
|
|
console.log('🔧 QZ Tray test function available: testQZConnection()');
|
|
|
|
// Modal Functions for Edit/Delete
|
|
function openEditModal(location) {
|
|
document.getElementById('edit-location-id').value = location.id;
|
|
document.getElementById('edit-location-code').value = location.code;
|
|
document.getElementById('edit-size').value = location.size || '';
|
|
document.getElementById('edit-description').value = location.description || '';
|
|
document.getElementById('edit-modal').style.display = 'flex';
|
|
}
|
|
|
|
function closeEditModal() {
|
|
document.getElementById('edit-modal').style.display = 'none';
|
|
}
|
|
|
|
function openDeleteModal(location) {
|
|
document.getElementById('delete-confirm-id').textContent = location.id;
|
|
document.getElementById('delete-confirm-code').textContent = location.code;
|
|
document.getElementById('delete-confirm-size').textContent = location.size || '-';
|
|
document.getElementById('delete-confirm-description').textContent = location.description || '-';
|
|
document.getElementById('delete-modal').style.display = 'flex';
|
|
}
|
|
|
|
function closeDeleteModal() {
|
|
document.getElementById('delete-modal').style.display = 'none';
|
|
}
|
|
|
|
// Handle edit form submission
|
|
document.getElementById('edit-form').addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
const formData = new FormData(this);
|
|
const data = {
|
|
location_id: formData.get('location_id'),
|
|
location_code: formData.get('location_code'),
|
|
size: formData.get('size'),
|
|
description: formData.get('description')
|
|
};
|
|
|
|
// Send update request
|
|
fetch('/update_location', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify(data)
|
|
})
|
|
.then(response => response.json())
|
|
.then(result => {
|
|
if (result.success) {
|
|
showNotification('✅ Location updated successfully!', 'success');
|
|
closeEditModal();
|
|
// Reload page to show changes
|
|
setTimeout(() => window.location.reload(), 1000);
|
|
} else {
|
|
showNotification('❌ Error updating location: ' + result.error, 'error');
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
showNotification('❌ Error updating location: ' + error.message, 'error');
|
|
});
|
|
});
|
|
|
|
// Handle delete confirmation
|
|
function confirmDelete() {
|
|
const locationId = document.getElementById('delete-confirm-id').textContent;
|
|
|
|
// Send delete request
|
|
fetch('/delete_location', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify({ location_id: locationId })
|
|
})
|
|
.then(response => response.json())
|
|
.then(result => {
|
|
if (result.success) {
|
|
showNotification('✅ Location deleted successfully!', 'success');
|
|
closeDeleteModal();
|
|
// Reload page to show changes
|
|
setTimeout(() => window.location.reload(), 1000);
|
|
} else {
|
|
showNotification('❌ Error deleting location: ' + result.error, 'error');
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
showNotification('❌ Error deleting location: ' + error.message, 'error');
|
|
});
|
|
}
|
|
|
|
// Close modals when clicking outside
|
|
window.addEventListener('click', function(event) {
|
|
const editModal = document.getElementById('edit-modal');
|
|
const deleteModal = document.getElementById('delete-modal');
|
|
|
|
if (event.target === editModal) {
|
|
closeEditModal();
|
|
}
|
|
if (event.target === deleteModal) {
|
|
closeDeleteModal();
|
|
}
|
|
});
|
|
</script>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|