LotusGuild/tinker_tickets
2
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Fix?

Browse Source
This commit is contained in:
Jared Vititoe
2025-03-11 20:42:38 -04:00
parent 9ddcfa700c
commit 4e7b92283e
1 changed files with 151 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files

301
assets/js/dashboard.js
View File

@ -413,169 +413,170 @@ function createHamburgerMenu() {
const hamburgerMenu = document.createElement('div'); const hamburgerMenu = document.createElement('div');
hamburgerMenu.className = 'hamburger-menu'; hamburgerMenu.className = 'hamburger-menu';
// Check if we're on a ticket page // Check if we're on a ticket page
const isTicketPage = window.location.pathname.includes('ticket.php'); const isTicketPage = window.location.pathname.includes('ticket.php');
if (isTicketPage) { if (isTicketPage) {
const selects = document.querySelectorAll('select.editable'); // Get current values from existing select elements
const values = {}; const selects = document.querySelectorAll('select.editable');
selects.forEach(select => { const values = {};
values[select.dataset.field] = select.value; selects.forEach(select => {
}); values[select.dataset.field] = select.value;
});
hamburgerMenu.innerHTML = ` hamburgerMenu.innerHTML = `
<div class="hamburger-icon">☰</div> <div class="hamburger-icon">☰</div>
<div class="hamburger-content"> <div class="hamburger-content">
<div class="close-hamburger">☰</div> <div class="close-hamburger">☰</div>
<h3>Ticket Controls</h3> <h3>Ticket Controls</h3>
<div class="menu-group"> <div class="menu-group">
<label>Status</label> <label>Status</label>
<select class="editable" data-field="status"> <select class="editable" data-field="status">
<option value="Open" ${currentStatus === 'Open' ? 'selected' : ''}>Open</option> <option value="Open" ${values.status === 'Open' ? 'selected' : ''}>Open</option>
<option value="Closed" ${currentStatus === 'Closed' ? 'selected' : ''}>Closed</option> <option value="Closed" ${values.status === 'Closed' ? 'selected' : ''}>Closed</option>
</select> </select>
</div>
<div class="menu-group">
<label>Priority</label>
<select class="editable" data-field="priority">
<option value="1" ${currentPriority === '1' ? 'selected' : ''}>P1 - Critical Impact</option>
<option value="2" ${currentPriority === '2' ? 'selected' : ''}>P2 - High Impact</option>
<option value="3" ${currentPriority === '3' ? 'selected' : ''}>P3 - Medium Impact</option>
<option value="4" ${currentPriority === '4' ? 'selected' : ''}>P4 - Low Impact</option>
</select>
</div>
<div class="menu-group">
<label>Category</label>
<select class="editable" data-field="category">
<option value="Hardware" ${currentCategory === 'Hardware' ? 'selected' : ''}>Hardware</option>
<option value="Software" ${currentCategory === 'Software' ? 'selected' : ''}>Software</option>
<option value="Network" ${currentCategory === 'Network' ? 'selected' : ''}>Network</option>
<option value="Security" ${currentCategory === 'Security' ? 'selected' : ''}>Security</option>
<option value="Other" ${currentCategory === 'Other' ? 'selected' : ''}>Other</option>
</select>
</div>
<div class="menu-group">
<label>Type</label>
<select class="editable" data-field="type">
<option value="Maintenance" ${currentType === 'Maintenance' ? 'selected' : ''}>Maintenance</option>
<option value="Install" ${currentType === 'Install' ? 'selected' : ''}>Install</option>
<option value="Task" ${currentType === 'Task' ? 'selected' : ''}>Task</option>
<option value="Upgrade" ${currentType === 'Upgrade' ? 'selected' : ''}>Upgrade</option>
</select>
</div>
<div class="menu-actions">
<button onclick="saveTicket()" class="btn primary">Save Changes</button>
</div>
</div> </div>
`; <div class="menu-group">
} else { <label>Priority</label>
hamburgerMenu.innerHTML = ` <select class="editable" data-field="priority">
<div class="hamburger-icon">☰</div> <option value="1" ${values.priority === '1' ? 'selected' : ''}>P1 - Critical Impact</option>
<div class="hamburger-content"> <option value="2" ${values.priority === '2' ? 'selected' : ''}>P2 - High Impact</option>
<div class="close-hamburger">☰</div> <option value="3" ${values.priority === '3' ? 'selected' : ''}>P3 - Medium Impact</option>
<h3>Filters</h3> <option value="4" ${values.priority === '4' ? 'selected' : ''}>P4 - Low Impact</option>
<div class="filter-section"> </select>
<h4>Categories</h4>
<div id="category-filters"></div>
</div>
<div class="filter-section">
<h4>Types</h4>
<div id="type-filters"></div>
</div>
<div class="filter-actions">
<button id="apply-filters">Apply Filters</button>
<button id="clear-filters">Clear Filters</button>
</div>
</div> </div>
`; <div class="menu-group">
<label>Category</label>
<select class="editable" data-field="category">
<option value="Hardware" ${values.category === 'Hardware' ? 'selected' : ''}>Hardware</option>
<option value="Software" ${values.category === 'Software' ? 'selected' : ''}>Software</option>
<option value="Network" ${values.category === 'Network' ? 'selected' : ''}>Network</option>
<option value="Security" ${values.category === 'Security' ? 'selected' : ''}>Security</option>
<option value="Other" ${values.category === 'Other' ? 'selected' : ''}>Other</option>
</select>
</div>
<div class="menu-group">
<label>Type</label>
<select class="editable" data-field="type">
<option value="Maintenance" ${values.type === 'Maintenance' ? 'selected' : ''}>Maintenance</option>
<option value="Install" ${values.type === 'Install' ? 'selected' : ''}>Install</option>
<option value="Task" ${values.type === 'Task' ? 'selected' : ''}>Task</option>
<option value="Upgrade" ${values.type === 'Upgrade' ? 'selected' : ''}>Upgrade</option>
</select>
</div>
<div class="menu-actions">
<button onclick="saveTicket()" class="btn primary">Save Changes</button>
</div>
</div>
`;
} else {
hamburgerMenu.innerHTML = `
<div class="hamburger-icon">☰</div>
<div class="hamburger-content">
<div class="close-hamburger">☰</div>
<h3>Filters</h3>
<div class="filter-section">
<h4>Categories</h4>
<div id="category-filters"></div>
</div>
<div class="filter-section">
<h4>Types</h4>
<div id="type-filters"></div>
</div>
<div class="filter-actions">
<button id="apply-filters">Apply Filters</button>
<button id="clear-filters">Clear Filters</button>
</div>
</div>
`;
// Populate categories and types from data attributes // Populate categories and types from data attributes
const categoriesContainer = hamburgerMenu.querySelector('#category-filters'); const categoriesContainer = hamburgerMenu.querySelector('#category-filters');
const typesContainer = hamburgerMenu.querySelector('#type-filters'); const typesContainer = hamburgerMenu.querySelector('#type-filters');
const categories = JSON.parse(document.body.dataset.categories || '[]');
const types = JSON.parse(document.body.dataset.types || '[]');
// Create checkboxes for categories
categories.forEach(category => {
const label = document.createElement('label');
const checkbox = document.createElement('input');
checkbox.type = 'checkbox';
checkbox.value = category;
checkbox.name = 'category';
label.appendChild(checkbox);
label.appendChild(document.createTextNode(category));
categoriesContainer.appendChild(label);
});
// Create checkboxes for types
types.forEach(type => {
const label = document.createElement('label');
const checkbox = document.createElement('input');
checkbox.type = 'checkbox';
checkbox.value = type;
checkbox.name = 'type';
label.appendChild(checkbox);
label.appendChild(document.createTextNode(type));
typesContainer.appendChild(label);
});
// Apply filters
const applyFiltersBtn = hamburgerMenu.querySelector('#apply-filters');
applyFiltersBtn.addEventListener('click', () => {
const selectedCategories = Array.from(
categoriesContainer.querySelectorAll('input:checked')
).map(cb => cb.value);
const categories = JSON.parse(document.body.dataset.categories || '[]'); const selectedTypes = Array.from(
const types = JSON.parse(document.body.dataset.types || '[]'); typesContainer.querySelectorAll('input:checked')
).map(cb => cb.value);
// Create checkboxes for categories // Construct URL with filters
categories.forEach(category => { const params = new URLSearchParams(window.location.search);
const label = document.createElement('label');
const checkbox = document.createElement('input'); if (selectedCategories.length > 0) {
checkbox.type = 'checkbox'; params.set('category', selectedCategories.join(','));
checkbox.value = category; } else {
checkbox.name = 'category';
label.appendChild(checkbox);
label.appendChild(document.createTextNode(category));
categoriesContainer.appendChild(label);
});
// Create checkboxes for types
types.forEach(type => {
const label = document.createElement('label');
const checkbox = document.createElement('input');
checkbox.type = 'checkbox';
checkbox.value = type;
checkbox.name = 'type';
label.appendChild(checkbox);
label.appendChild(document.createTextNode(type));
typesContainer.appendChild(label);
});
// Apply filters
const applyFiltersBtn = hamburgerMenu.querySelector('#apply-filters');
applyFiltersBtn.addEventListener('click', () => {
const selectedCategories = Array.from(
categoriesContainer.querySelectorAll('input:checked')
).map(cb => cb.value);
const selectedTypes = Array.from(
typesContainer.querySelectorAll('input:checked')
).map(cb => cb.value);
// Construct URL with filters
const params = new URLSearchParams(window.location.search);
if (selectedCategories.length > 0) {
params.set('category', selectedCategories.join(','));
} else {
params.delete('category');
}
if (selectedTypes.length > 0) {
params.set('type', selectedTypes.join(','));
} else {
params.delete('type');
}
// Reload with new filters
window.location.search = params.toString();
});
// Clear filters
const clearFiltersBtn = hamburgerMenu.querySelector('#clear-filters');
clearFiltersBtn.addEventListener('click', () => {
const params = new URLSearchParams(window.location.search);
params.delete('category'); params.delete('category');
}
if (selectedTypes.length > 0) {
params.set('type', selectedTypes.join(','));
} else {
params.delete('type'); params.delete('type');
window.location.search = params.toString(); }
});
}
// Add to body
document.body.appendChild(hamburgerMenu);
// Toggle hamburger menu // Reload with new filters
const hamburgerIcon = hamburgerMenu.querySelector('.hamburger-icon'); window.location.search = params.toString();
const hamburgerContent = hamburgerMenu.querySelector('.hamburger-content');
hamburgerIcon.addEventListener('click', () => {
hamburgerContent.classList.toggle('open');
document.body.classList.toggle('menu-open');
}); });
// Close hamburger menu // Clear filters
const closeButton = hamburgerMenu.querySelector('.close-hamburger'); const clearFiltersBtn = hamburgerMenu.querySelector('#clear-filters');
closeButton.addEventListener('click', () => { clearFiltersBtn.addEventListener('click', () => {
hamburgerContent.classList.remove('open'); const params = new URLSearchParams(window.location.search);
document.body.classList.remove('menu-open'); params.delete('category');
params.delete('type');
window.location.search = params.toString();
}); });
}
// Add to body
document.body.appendChild(hamburgerMenu);
// Toggle hamburger menu
const hamburgerIcon = hamburgerMenu.querySelector('.hamburger-icon');
const hamburgerContent = hamburgerMenu.querySelector('.hamburger-content');
hamburgerIcon.addEventListener('click', () => {
hamburgerContent.classList.toggle('open');
document.body.classList.toggle('menu-open');
});
// Close hamburger menu
const closeButton = hamburgerMenu.querySelector('.close-hamburger');
closeButton.addEventListener('click', () => {
hamburgerContent.classList.remove('open');
document.body.classList.remove('menu-open');
});
} }
// Add to DOMContentLoaded // Add to DOMContentLoaded