subtab bug fix
This commit is contained in:
parent
5cf9e982dd
commit
174fbe8f29
|
|
@ -130,9 +130,6 @@ function setup_custom_subtabs(wrapper, currentDoctype) {
|
|||
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");
|
||||
|
|
@ -160,67 +157,72 @@ function setup_custom_subtabs(wrapper, currentDoctype) {
|
|||
|
||||
// Show parent chain
|
||||
ensureParentChainVisible(subtabName);
|
||||
|
||||
// Restore shown.bs.tab handler
|
||||
setTimeout(() => {
|
||||
setupMainTabHandler();
|
||||
}, 100);
|
||||
});
|
||||
|
||||
// Function to setup main tab handler
|
||||
function setupMainTabHandler() {
|
||||
// Удаляем старый обработчик
|
||||
wrapper.off("shown.bs.tab.customsubtabs");
|
||||
// Для Frappe v16 используем MutationObserver вместо событий Bootstrap
|
||||
// так как shown.bs.tab не генерируется
|
||||
|
||||
// Регистрируем новый на wrapper без делегирования
|
||||
wrapper.on("shown.bs.tab.customsubtabs", function(event) {
|
||||
const button = event.target;
|
||||
const $button = $(button);
|
||||
const li = $button.closest("li.nav-item");
|
||||
// Удаляем старый observer если есть
|
||||
if (wrapper.data('subtabs-observer')) {
|
||||
wrapper.data('subtabs-observer').disconnect();
|
||||
}
|
||||
|
||||
// If this is a subtab - ignore
|
||||
if (li.hasClass("sub-tab")) {
|
||||
return;
|
||||
}
|
||||
// Создаем MutationObserver для отслеживания изменений класса active
|
||||
const observer = new MutationObserver(function(mutations) {
|
||||
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(),
|
||||
tabId: tabId,
|
||||
isSubtab: li.hasClass("sub-tab")
|
||||
});
|
||||
// Игнорируем субтабы
|
||||
if (li.hasClass("sub-tab")) {
|
||||
return;
|
||||
}
|
||||
|
||||
// ИСПРАВЛЕНИЕ: Убираем active классы со всех субтабов и их контента
|
||||
wrapper.find(".sub-tab").removeClass("active");
|
||||
wrapper.find(".sub-tab button.nav-link, .sub-tab a.nav-link")
|
||||
.removeClass("active")
|
||||
.attr("aria-selected", "false");
|
||||
const tabId = button.getAttribute("aria-controls");
|
||||
|
||||
// Скрываем контент всех субтабов
|
||||
wrapper.find(".sub-tab").each(function() {
|
||||
const subtabButton = getTabLink($(this));
|
||||
const subtabContentId = subtabButton.attr("data-target-id") || subtabButton.attr("aria-controls");
|
||||
if (subtabContentId) {
|
||||
$(`#${subtabContentId}`).removeClass("active show");
|
||||
}
|
||||
});
|
||||
// ИСПРАВЛЕНИЕ: Убираем active классы со всех субтабов и их контента
|
||||
wrapper.find(".sub-tab").removeClass("active");
|
||||
wrapper.find(".sub-tab button.nav-link, .sub-tab a.nav-link")
|
||||
.removeClass("active")
|
||||
.attr("aria-selected", "false");
|
||||
|
||||
// Show/hide subtabs
|
||||
wrapper.find(".sub-tab-container").each(function() {
|
||||
const containerParentId = $(this).attr("data-parent-id");
|
||||
console.log('Проверка контейнера:', {
|
||||
containerParentId: containerParentId,
|
||||
tabId: tabId,
|
||||
match: containerParentId === tabId
|
||||
});
|
||||
if (containerParentId === tabId) {
|
||||
$(this).removeClass("subtab-hidden");
|
||||
} else {
|
||||
$(this).addClass("subtab-hidden");
|
||||
// Скрываем контент всех субтабов
|
||||
wrapper.find(".sub-tab").each(function() {
|
||||
const subtabButton = getTabLink($(this));
|
||||
const subtabContentId = subtabButton.attr("data-target-id") || subtabButton.attr("aria-controls");
|
||||
if (subtabContentId) {
|
||||
$(`#${subtabContentId}`).removeClass("active show");
|
||||
}
|
||||
});
|
||||
|
||||
// Show/hide subtabs
|
||||
wrapper.find(".sub-tab-container").each(function() {
|
||||
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
|
||||
|
|
|
|||
Loading…
Reference in New Issue