diff --git a/custom_subtabs/public/js/custom_subtabs.js b/custom_subtabs/public/js/custom_subtabs.js index 8d9ef4c..c380ad5 100644 --- a/custom_subtabs/public/js/custom_subtabs.js +++ b/custom_subtabs/public/js/custom_subtabs.js @@ -93,22 +93,22 @@ function setup_custom_subtabs(wrapper, currentDoctype) { function ensureParentChainVisible(subtabName) { let currentChild = subtabName; const parentsToShow = []; - + // Collect parent chain while (childToParentMap[currentChild]) { const parentName = childToParentMap[currentChild]; parentsToShow.push(parentName); - - // Show all siblings + + // Show all siblings - НЕ используем .show(), используем CSS класс const siblings = subtabs[parentName] || []; siblings.forEach(sibling => { const siblingElement = wrapper.find(`.sub-tab[data-subtab-name="${sibling}"]`); - siblingElement.show(); + siblingElement.css('display', ''); // Убираем inline style }); - + currentChild = parentName; } - + // Show all parent content parentsToShow.forEach(parentName => { const parentTabContentId = `${currentDoctype.toLowerCase().replace(/\s+/g, '-')}-${parentName.toLowerCase().replace(/\s+/g, '_')}_tab`; @@ -123,33 +123,44 @@ function setup_custom_subtabs(wrapper, currentDoctype) { wrapper.on("click.customsubtabs", ".sub-tab button.nav-link, .sub-tab a.nav-link", function(event) { event.preventDefault(); event.stopPropagation(); - + const clickedButton = $(this); const clickedSubtab = clickedButton.closest(".sub-tab"); const subtabName = clickedSubtab.attr("data-subtab-name"); const targetId = clickedButton.attr("data-target-id") || clickedButton.attr("aria-controls"); - + const parentContainerId = clickedSubtab.attr("data-parent-id"); + // Temporarily disable shown.bs.tab handler wrapper.off('shown.bs.tab.customsubtabs'); - + // Hide all tabs and content wrapper.find(".nav-item").removeClass("active"); wrapper.find("button.nav-link, a.nav-link").removeClass("active").attr("aria-selected", "false"); wrapper.find(".tab-pane").removeClass("active show"); - + + // Скрыть все контейнеры субтабов, кроме родительского + wrapper.find(".sub-tab-container").each(function() { + const containerParentId = $(this).attr("data-parent-id"); + if (containerParentId !== parentContainerId) { + $(this).addClass("subtab-hidden"); + } else { + $(this).removeClass("subtab-hidden"); + } + }); + // Activate subtab clickedSubtab.addClass("active"); clickedButton.addClass("active").attr("aria-selected", "true"); - + // Show subtab content const targetPane = $(`#${targetId}`); if (targetPane.length) { targetPane.addClass("active show"); } - + // Show parent chain ensureParentChainVisible(subtabName); - + // Restore shown.bs.tab handler setTimeout(() => { setupMainTabHandler(); @@ -200,6 +211,18 @@ function setup_custom_subtabs(wrapper, currentDoctype) { // Initialize handler setupMainTabHandler(); + // Инициализация: скрыть все контейнеры, кроме активного таба + const activeMainTab = wrapper.find("ul.form-tabs > li.nav-item.active:not(.sub-tab)").first(); + const activeTabLink = getTabLink(activeMainTab); + const activeTabId = activeTabLink.attr("aria-controls"); + + wrapper.find(".sub-tab-container").each(function() { + const containerParentId = $(this).attr("data-parent-id"); + if (containerParentId !== activeTabId) { + $(this).addClass("subtab-hidden"); + } + }); + // Mark as processed wrapper.attr('data-subtabs-processed', 'true'); }