ali
/
custom_subtabs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

subtab bug fix

This commit is contained in:
Ali 2026-01-12 19:14:24 +04:00
parent 5cf9e982dd
commit 174fbe8f29
1 changed files with 52 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
custom_subtabs/public/js/custom_subtabs.js
View File

@ -130,9 +130,6 @@ function setup_custom_subtabs(wrapper, currentDoctype) {
const targetId = clickedButton.attr("data-target-id") || clickedButton.attr("aria-controls"); const targetId = clickedButton.attr("data-target-id") || clickedButton.attr("aria-controls");
const parentContainerId = clickedSubtab.attr("data-parent-id"); const parentContainerId = clickedSubtab.attr("data-parent-id");
// Temporarily disable shown.bs.tab handler
wrapper.off('shown.bs.tab.customsubtabs');
// Hide all tabs and content // Hide all tabs and content
wrapper.find(".nav-item").removeClass("active"); wrapper.find(".nav-item").removeClass("active");
wrapper.find("button.nav-link, a.nav-link").removeClass("active").attr("aria-selected", "false"); wrapper.find("button.nav-link, a.nav-link").removeClass("active").attr("aria-selected", "false");
@ -160,67 +157,72 @@ function setup_custom_subtabs(wrapper, currentDoctype) {
// Show parent chain // Show parent chain
ensureParentChainVisible(subtabName); ensureParentChainVisible(subtabName);
// Restore shown.bs.tab handler
setTimeout(() => {
setupMainTabHandler();
}, 100);
}); });
// Function to setup main tab handler // Function to setup main tab handler
function setupMainTabHandler() { function setupMainTabHandler() {
// Удаляем старый обработчик // Для Frappe v16 используем MutationObserver вместо событий Bootstrap
wrapper.off("shown.bs.tab.customsubtabs"); // так как shown.bs.tab не генерируется
// Регистрируем новый на wrapper без делегирования // Удаляем старый observer если есть
wrapper.on("shown.bs.tab.customsubtabs", function(event) { if (wrapper.data('subtabs-observer')) {
const button = event.target; wrapper.data('subtabs-observer').disconnect();
const $button = $(button); }
const li = $button.closest("li.nav-item");
// If this is a subtab - ignore // Создаем MutationObserver для отслеживания изменений класса active
if (li.hasClass("sub-tab")) { const observer = new MutationObserver(function(mutations) {
return; mutations.forEach(function(mutation) {
} if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
const button = mutation.target;
const $button = $(button);
const tabId = button.getAttribute("aria-controls"); // Проверяем что это кнопка таба и она стала активной
if ($button.hasClass('nav-link') && $button.hasClass('active')) {
const li = $button.closest("li.nav-item");
console.log('shown.bs.tab сработал для:', { // Игнорируем субтабы
text: $button.text().trim(), if (li.hasClass("sub-tab")) {
tabId: tabId, return;
isSubtab: li.hasClass("sub-tab") }
});
// ИСПРАВЛЕНИЕ: Убираем active классы со всех субтабов и их контента const tabId = button.getAttribute("aria-controls");
wrapper.find(".sub-tab").removeClass("active");
wrapper.find(".sub-tab button.nav-link, .sub-tab a.nav-link")
.removeClass("active")
.attr("aria-selected", "false");
// Скрываем контент всех субтабов // ИСПРАВЛЕНИЕ: Убираем active классы со всех субтабов и их контента
wrapper.find(".sub-tab").each(function() { wrapper.find(".sub-tab").removeClass("active");
const subtabButton = getTabLink($(this)); wrapper.find(".sub-tab button.nav-link, .sub-tab a.nav-link")
const subtabContentId = subtabButton.attr("data-target-id") || subtabButton.attr("aria-controls"); .removeClass("active")
if (subtabContentId) { .attr("aria-selected", "false");
$(`#${subtabContentId}`).removeClass("active show");
}
});
// Show/hide subtabs // Скрываем контент всех субтабов
wrapper.find(".sub-tab-container").each(function() { wrapper.find(".sub-tab").each(function() {
const containerParentId = $(this).attr("data-parent-id"); const subtabButton = getTabLink($(this));
console.log('Проверка контейнера:', { const subtabContentId = subtabButton.attr("data-target-id") || subtabButton.attr("aria-controls");
containerParentId: containerParentId, if (subtabContentId) {
tabId: tabId, $(`#${subtabContentId}`).removeClass("active show");
match: containerParentId === tabId }
}); });
if (containerParentId === tabId) {
$(this).removeClass("subtab-hidden"); // Show/hide subtabs
} else { wrapper.find(".sub-tab-container").each(function() {
$(this).addClass("subtab-hidden"); const containerParentId = $(this).attr("data-parent-id");
if (containerParentId === tabId) {
$(this).removeClass("subtab-hidden");
} else {
$(this).addClass("subtab-hidden");
}
});
}
} }
}); });
}); });
// Наблюдаем за всеми кнопками табов (не субтабов)
wrapper.find('ul.form-tabs > li.nav-item:not(.sub-tab) button.nav-link, ul.form-tabs > li.nav-item:not(.sub-tab) a.nav-link').each(function() {
observer.observe(this, { attributes: true, attributeFilter: ['class'] });
});
// Сохраняем observer чтобы можно было удалить позже
wrapper.data('subtabs-observer', observer);
} }
// Initialize handler // Initialize handler