Make Node selection persistent
This commit is contained in:
parent
779dbe1632
commit
61dbe8eed1
@ -15,7 +15,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { defineProps, defineEmits } from 'vue';
|
||||
import { ref, onMounted, watch } from 'vue';
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
@ -26,15 +26,48 @@ const props = defineProps({
|
||||
type: Array,
|
||||
required: true,
|
||||
default: () => []
|
||||
},
|
||||
value: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update:modelValue', 'select']);
|
||||
|
||||
const selectedNode = ref(props.value || props.modelValue);
|
||||
|
||||
const selectNode = (node) => {
|
||||
selectedNode.value = node;
|
||||
emit('update:modelValue', node);
|
||||
emit('select', node);
|
||||
|
||||
// Save to localStorage
|
||||
localStorage.setItem('selectedNodeId', node);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
// Restore selected node from localStorage if available
|
||||
const savedNodeId = localStorage.getItem('selectedNodeId');
|
||||
if (savedNodeId && props.nodes.includes(savedNodeId)) {
|
||||
// Only select if the node exists in the available nodes
|
||||
selectedNode.value = savedNodeId;
|
||||
emit('update:modelValue', savedNodeId);
|
||||
emit('select', savedNodeId);
|
||||
}
|
||||
});
|
||||
|
||||
watch(() => props.value, (newValue) => {
|
||||
if (newValue) {
|
||||
selectedNode.value = newValue;
|
||||
}
|
||||
});
|
||||
|
||||
watch(() => props.modelValue, (newValue) => {
|
||||
if (newValue) {
|
||||
selectedNode.value = newValue;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
@ -464,8 +464,12 @@ const getDomainStateColor = (state) => {
|
||||
|
||||
// Initialize the component
|
||||
onMounted(() => {
|
||||
// Select the first node by default if available
|
||||
if (props.nodeData && props.nodeData.length > 0) {
|
||||
// Check if there's a saved node selection
|
||||
const savedNodeId = localStorage.getItem('selectedNodeId');
|
||||
if (savedNodeId && props.nodeData.some(node => node.name === savedNodeId)) {
|
||||
selectNode(savedNodeId);
|
||||
} else if (props.nodeData && props.nodeData.length > 0) {
|
||||
// Fall back to selecting the first node
|
||||
selectNode(props.nodeData[0].name);
|
||||
}
|
||||
|
||||
@ -496,7 +500,8 @@ const availableNodes = computed(() => {
|
||||
|
||||
const handleNodeSelect = (node) => {
|
||||
selectedNode.value = node;
|
||||
// Any other node selection handling logic
|
||||
// Save to localStorage
|
||||
localStorage.setItem('selectedNodeId', node);
|
||||
};
|
||||
|
||||
// Process node health messages
|
||||
@ -542,6 +547,11 @@ const getMessageIcon = (msg) => {
|
||||
const getMessageContent = (msg) => {
|
||||
return msg.message || 'No details available';
|
||||
};
|
||||
|
||||
const selectVM = (vmId) => {
|
||||
// Store the VM ID in localStorage so it will be selected when the VMs page loads
|
||||
localStorage.setItem('selectedVMId', vmId);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
@ -71,16 +71,8 @@ const runningDomains = computed(() => {
|
||||
|
||||
// Navigate to VM details
|
||||
const selectVM = (vmName) => {
|
||||
console.log('Navigating to VM:', vmName);
|
||||
|
||||
// Find the full VM data if available
|
||||
const vmData = props.vmData.find(vm => vm.name === vmName);
|
||||
console.log('Found VM data:', vmData);
|
||||
|
||||
router.push({
|
||||
path: '/vms',
|
||||
query: { vm: vmName }
|
||||
});
|
||||
// Store the VM ID in localStorage so it will be selected when the VMs page loads
|
||||
localStorage.setItem('selectedVMId', vmName);
|
||||
};
|
||||
</script>
|
||||
|
||||
|
@ -10,6 +10,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, watch } from 'vue';
|
||||
import PageTitle from '../components/general/PageTitle.vue';
|
||||
import NodeOverview from '../components/pages/nodes/NodeOverview.vue';
|
||||
|
||||
@ -30,6 +31,25 @@ const props = defineProps({
|
||||
default: () => ({})
|
||||
}
|
||||
});
|
||||
|
||||
const selectedNode = ref(null);
|
||||
|
||||
onMounted(() => {
|
||||
// Restore selected node from localStorage if available
|
||||
const savedNodeId = localStorage.getItem('selectedNodeId');
|
||||
if (savedNodeId) {
|
||||
selectedNode.value = savedNodeId;
|
||||
}
|
||||
});
|
||||
|
||||
watch(selectedNode, (newValue) => {
|
||||
// Save selected node to localStorage whenever it changes
|
||||
if (newValue) {
|
||||
localStorage.setItem('selectedNodeId', newValue);
|
||||
} else {
|
||||
localStorage.removeItem('selectedNodeId');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
Loading…
x
Reference in New Issue
Block a user