diff --git a/frontend/src/components/common/DataTable.vue b/frontend/src/components/common/DataTable.vue index 84c7e09..4a5713b 100644 --- a/frontend/src/components/common/DataTable.vue +++ b/frontend/src/components/common/DataTable.vue @@ -410,7 +410,7 @@ outlined />
@@ -428,6 +428,7 @@ import Column from "primevue/column"; import Tag from "primevue/tag"; import Button from "primevue/button"; import Select from "primevue/select"; +import Menu from "primevue/menu"; import InputText from "primevue/inputtext"; import { FilterMatchMode } from "@primevue/core"; import { useFiltersStore } from "../../stores/filters"; @@ -441,13 +442,6 @@ const paginationStore = usePaginationStore(); const menuRefs = reactive({}); const activeMenuKey = ref(null); -const defineMenuRef = (label, id) => { - console.log("Defining Menu Refs:", label, id); - const refName = `${label}-${id}` - menuRefs[refName] = ref(); - return menuRefs[refName] -} - const props = defineProps({ columns: { type: Array, @@ -531,6 +525,14 @@ const props = defineProps({ }, }); +const setMenuRef = (el, label, id) => { + if (el) { + const refName = `${label}-${id}`; + menuRefs[refName] = el; + console.log("Setting Menu Ref:", refName, el); + } +} + const emit = defineEmits([ "rowClick", "row-click", @@ -1074,15 +1076,14 @@ const handleActionClick = (action, rowData = null) => { const toggleMenu = (event, action, rowData) => { console.log("Menu button toggled"); const menuKey = `${action.label}-${rowData.id}`; - console.log(menuRefs, menuKey); + console.log("Looking for menu:", menuKey, menuRefs); const menu = menuRefs[menuKey]; - console.log(event, action, rowData, menuKey, menu); if (menu) { - console.log("Menu:", menu); + console.log("Found menu, toggling:", menu); menu.toggle(event); activeMenuKey.value = menuKey; } else { - console.log("Menu undefined."); + console.log("Menu undefined for key:", menuKey); } };