Broken but retrying

This commit is contained in:
Joshua Boniface 2025-03-02 14:24:02 -05:00
parent adfc1d8269
commit 4e5274c6f0
2 changed files with 13 additions and 20 deletions

View File

@ -94,7 +94,7 @@
:data-vm-name="vm.name" :data-vm-name="vm.name"
class="vm-list-item" class="vm-list-item"
:class="{ 'active': selectedVM === vm.name || vmFromUrl === vm.name }" :class="{ 'active': selectedVM === vm.name || vmFromUrl === vm.name }"
@click="handleVMSelect(vm)" @click="() => { console.log('VM clicked:', vm); handleVMSelect(vm); }"
> >
<div v-if="selectedVM === vm.name || vmFromUrl === vm.name" class="active-indicator"></div> <div v-if="selectedVM === vm.name || vmFromUrl === vm.name" class="active-indicator"></div>
<div class="vm-item-content"> <div class="vm-item-content">
@ -424,8 +424,10 @@ const toggleList = () => {
}; };
const handleVMSelect = (vm) => { const handleVMSelect = (vm) => {
console.log('handleVMSelect called with:', vm); console.log('Selecting VM:', vm);
emit('update:modelValue', ''); // Clear search query
// Don't clear the search query or change filter state
// Just emit the select-vm event
emit('select-vm', vm); emit('select-vm', vm);
}; };

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="overview-container"> <div class="overview-container">
<VMSearchBar <VMSearchBar
:key="searchBarKey" :key="`vm-search-${selectedVM}`"
v-model="searchQuery" v-model="searchQuery"
:selected-vm="selectedVM" :selected-vm="selectedVM"
:vm-from-url="route.query.vm" :vm-from-url="route.query.vm"
@ -204,10 +204,16 @@ const toggleVMList = () => {
// Select a VM // Select a VM
const selectVM = (vm) => { const selectVM = (vm) => {
// Update the ref first console.log('VMOverview selectVM called with:', vm);
// Update the ref
selectedVM.value = vm.name; selectedVM.value = vm.name;
invalidVMSelected.value = false; invalidVMSelected.value = false;
// Close the VM list
showVMList.value = false; showVMList.value = false;
// Update the URL
router.push({ query: { vm: vm.name } }); router.push({ query: { vm: vm.name } });
}; };
@ -288,21 +294,6 @@ watch(() => selectedVM.value, (newVal) => {
console.log('VMOverview selectedVM changed:', newVal); console.log('VMOverview selectedVM changed:', newVal);
}, { immediate: true }); }, { immediate: true });
// Watch for vmData changes to update VMSearchBar
watch(() => props.vmData, (newData) => {
if (newData.length && selectedVM.value) {
console.log('VM data loaded, updating VMSearchBar with selectedVM:', selectedVM.value);
// Force a refresh of the VMSearchBar by toggling a key
nextTick(() => {
// This will force the VMSearchBar to re-render with the correct data
searchBarKey.value = Date.now();
});
}
});
// Add a key to force VMSearchBar to re-render when data changes
const searchBarKey = ref(0);
// Helper functions // Helper functions
const getStateColor = (state) => { const getStateColor = (state) => {
if (!state) return ''; if (!state) return '';