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