parallelvirtualcluster/pvc-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reorder state filters so start is first

Browse Source
This commit is contained in:
Joshua Boniface 2025-03-01 14:19:26 -05:00
parent 70639194ea
commit 4a9b48caa0
1 changed files with 51 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
pvc-vue/src/views/VMs.vue
View File

@ -319,9 +319,8 @@ const toggleFilter = (type, value) => {
filterVMs(); filterVMs();
}; };
// Reset filters // Reset all filters
const resetFilters = () => { const resetFilters = () => {
// Reset all filters and apply immediately
Object.keys(appliedFilters.value.states).forEach(state => { Object.keys(appliedFilters.value.states).forEach(state => {
appliedFilters.value.states[state] = false; appliedFilters.value.states[state] = false;
}); });
@ -335,9 +334,17 @@ const resetFilters = () => {
// Count active filters // Count active filters
const activeFiltersCount = computed(() => { const activeFiltersCount = computed(() => {
const stateFiltersCount = Object.values(appliedFilters.value.states).filter(v => v).length; let count = 0;
const nodeFiltersCount = Object.values(appliedFilters.value.nodes).filter(v => v).length;
return stateFiltersCount + nodeFiltersCount; Object.values(appliedFilters.value.states).forEach(isActive => {
if (isActive) count++;
});
Object.values(appliedFilters.value.nodes).forEach(isActive => {
if (isActive) count++;
});
return count;
}); });
// Get available states from VM data // Get available states from VM data
@ -346,7 +353,24 @@ const availableStates = computed(() => {
vmData.value.forEach(vm => { vmData.value.forEach(vm => {
if (vm.state) states.add(vm.state); if (vm.state) states.add(vm.state);
}); });
return Array.from(states).sort(); // Get all states as an array
const statesArray = Array.from(states);
// Remove 'start' if it exists
const startIndex = statesArray.indexOf('start');
if (startIndex !== -1) {
statesArray.splice(startIndex, 1);
}
// Sort the remaining states
statesArray.sort();
// Add 'start' at the beginning if it was present
if (startIndex !== -1) {
statesArray.unshift('start');
}
return statesArray;
}); });
// Get available nodes from VM data // Get available nodes from VM data
@ -365,27 +389,29 @@ const filteredVMs = computed(() => {
let filtered = [...vmData.value]; let filtered = [...vmData.value];
// Apply search filter // Apply search filter
if (searchQuery.value.trim()) { if (searchQuery.value) {
const query = searchQuery.value.toLowerCase(); const query = searchQuery.value.toLowerCase();
filtered = filtered.filter(vm => filtered = filtered.filter(vm =>
vm.name.toLowerCase().includes(query) vm.name.toLowerCase().includes(query)
); );
} }
// Apply state filters // Apply state filters if any are active
const hasStateFilters = Object.values(appliedFilters.value.states).some(v => v); const activeStates = Object.entries(appliedFilters.value.states)
if (hasStateFilters) { .filter(([_, isActive]) => isActive)
filtered = filtered.filter(vm => { .map(([state]) => state);
return appliedFilters.value.states[vm.state] === true;
}); if (activeStates.length > 0) {
filtered = filtered.filter(vm => activeStates.includes(vm.state));
} }
// Apply node filters // Apply node filters if any are active
const hasNodeFilters = Object.values(appliedFilters.value.nodes).some(v => v); const activeNodes = Object.entries(appliedFilters.value.nodes)
if (hasNodeFilters) { .filter(([_, isActive]) => isActive)
filtered = filtered.filter(vm => { .map(([node]) => node);
return appliedFilters.value.nodes[vm.node] === true;
}); if (activeNodes.length > 0) {
filtered = filtered.filter(vm => activeNodes.includes(vm.node));
} }
return filtered; return filtered;
@ -399,19 +425,17 @@ const selectedVMData = computed(() => {
// Get status class based on VM state // Get status class based on VM state
const getStatusClass = (state) => { const getStatusClass = (state) => {
if (!state) return 'status-unknown'; if (!state) return '';
switch (state) { switch(state.toLowerCase()) {
case 'start': case 'start':
return 'status-running'; return 'status-running';
case 'shutdown': case 'stop':
return 'status-stopped'; return 'status-stopped';
case 'pause': case 'disable':
return 'status-paused'; return 'status-disabled';
case 'crash':
return 'status-error';
default: default:
return 'status-unknown'; return '';
} }
}; };