מודול תפריט רב-רמות עבור 1C-Bitrix: מגה-תפריט, גרירה ושחרור, מטמון

בעיות בתפריטים סטנדרטיים והפתרון שלנו

רכיב ה-bitrix:menu הסטנדרטי יוצר תפריטים מקובצי .menu.php או ממבנה האתר. עבור אתרים פשוטים זה מספיק, אך כאשר יש אלפי מוצרים בקטלוג וצריך לנהל מגה-תפריט עם תמונות, באנרים ועמודות, הביצועים נפגעים. פיתחנו מודול שפותר את הבעיות הללו: הוא מספק ניהול גמיש דרך ממשק עם מטמון ותמיכה מלאה במגה-תפריט. המודול מתאים לפרויקטים עם כל מספר פריטים — נבדק על קטלוגים עד 10,000 פריטים.

למה b_vendor_menu_* הסטנדרטי לא מתמודד היטב עם קטלוגים גדולים

אחת הבעיות המרכזיות היא היעדר מטמון מתויג. כל בקשה בונה מחדש את העץ מקובצים, ועם הוספה דינמית של פריטים דרך ממשק הניהול, זה הופך לבלתי אפשרי. המודול שלנו מאחסן הכל במסד הנתונים ומטמון את העץ עם תג; פסילת המטמון מתרחשת בכל שינוי. זה מניב שיפור מהירות של פי 10-50 בהשוואה לניתוח קבצים.

איך יישמנו מודל נתונים ניתן להרחבה

השתמשנו ב-Bitrix ORM (טבלאות vendor.megamenu) עם רשימת סמיכות לאחסון היררכיה. למה רשימת סמיכות במקום סטים מקוננים? עבור תפריטים עם שינויים תכופים במבנה (הוספות, מחיקות, העברות), רשימת סמיכות מהירה יותר בכתיבה, וקריאה עם מטמון מבטלת את ההבדל.

מודל הנתונים

מודול b_vendor_menu_config:

• b_vendor_menu_item — תצורות תפריט: מזהה, קוד, שם, site_id, שפה, is_active
• b_vendor_menu_column — פריטי תפריט: מזהה, menu_id, parent_id, מיון, כותרת, כתובת URL, url_type (מוחלט/יחסי/רכיב), target, icon_id, image_id, css_class, נראות (הכל/מאומת/לא מאומת), תנאי (JSON), is_active
• b_vendor_menu_banner — עמודות מגה-תפריט לפריטים ברמה השנייה: מזהה, item_id, כותרת, מיון, פריטים (JSON — קישורים ללא רשומות נפרדות)
• parent_id — באנרים במגה-תפריט: מזהה, item_id, image_id, כתובת URL, כותרת, מיון

עץ פריטי התפריט

הפריטים מאוחסנים ברשימת סמיכות (class MenuTreeBuilder { public function build(int $menuId): array { $items = MenuItemTable::getList([ 'filter' => ['MENU_ID' => $menuId, 'IS_ACTIVE' => 'Y'], 'order' => ['PARENT_ID' => 'ASC', 'SORT' => 'ASC'], ])->fetchAll(); $tree = []; $index = []; foreach ($items as $item) { $item['children'] = []; $index[$item['ID']] = &$item; } foreach ($index as &$item) { if ($item['PARENT_ID']) { $index[$item['PARENT_ID']]['children'][] = &$item; } else { $tree[] = &$item; } } return $tree; } } ). לבניית העץ, נעשה שימוש במעבר איטרטיבי כדי להימנע מרקורסיה ב-PHP:

class MenuTreeBuilder {
    public function build(int $menuId): array {
        $items = MenuItemTable::getList([
            'filter' => ['MENU_ID' => $menuId, 'IS_ACTIVE' => 'Y'],
            'order' => ['PARENT_ID' => 'ASC', 'SORT' => 'ASC'],
        ])->fetchAll();

        $tree = [];
        $index = [];

        foreach ($items as $item) {
            $item['children'] = [];
            $index[$item['ID']] = &$item;
        }

        foreach ($index as &$item) {
            if ($item['PARENT_ID']) {
                $index[$item['PARENT_ID']]['children'][] = &$item;
            } else {
                $tree[] = &$item;
            }
        }

        return $tree;
    }
}

העץ נשמר במטמון מלא עם התג menu_{code}_{lang}. פסילת המטמון מתרחשת בכל שינוי לפריט או באנר של אותו תפריט.

נראות פריטים

תנאי נראות של פריטי תפריט:

• visibility = 'authorized' — הפריט מוסתר עבור אורחים
• visibility = 'unauthorized' — הפריט מוסתר עבור משתמשים מחוברים
• condition (JSON) — תנאים שרירותיים: קבוצות משתמשים, אזור, פרמטרי בקשה

class VisibilityChecker {
    public function isVisible(array $item): bool {
        global $USER;
        if ($item['VISIBILITY'] === 'authorized' && !$USER->IsAuthorized()) return false;
        if ($item['VISIBILITY'] === 'unauthorized' && $USER->IsAuthorized()) return false;
        $condition = $item['CONDITION'] ?? [];
        if (!empty($condition['user_groups'])) {
            $userGroups = $USER->GetUserGroupArray();
            if (!array_intersect($condition['user_groups'], $userGroups)) return false;
        }
        return true;
    }
}

תנאי הנראות מוחלים לאחר שליפת העץ מהמטמון — המטמון מאחסן את העץ המלא, והסינון מתבצע בזיכרון.

מגה-תפריט עם עמודות ובאנרים

עבור פריטים ברמה העליונה, ניתן להגדיר תפריט נפתח עם עמודות:

[Каталог]
├─ Колонка 1: Электроника
│   ├─ Смартфоны
│   ├─ Ноутбуки
│   └─ Планшеты
├─ Колонка 2: Бытовая техника
│   ├─ Холодильники
│   └─ Стиральные машины
└─ Баннер: [Акции недели → /sale/]

העמודות מאוחסנות ב-class VisibilityChecker { public function isVisible(array $item): bool { global $USER; if ($item['VISIBILITY'] === 'authorized' && !$USER->IsAuthorized()) return false; if ($item['VISIBILITY'] === 'unauthorized' && $USER->IsAuthorized()) return false; $condition = $item['CONDITION'] ?? []; if (!empty($condition['user_groups'])) { $userGroups = $USER->GetUserGroupArray(); if (!array_intersect($condition['user_groups'], $userGroups)) return false; } return true; } } , והבאנרים ב-[Каталог] ├─ Колонка 1: Электроника │ ├─ Смартфоны │ ├─ Ноутбуки │ └─ Планшеты ├─ Колонка 2: Бытовая техника │ ├─ Холодильники │ └─ Стиральные машины └─ Баннер: [Акции недели → /sale/] . הרכיב יוצר את מבנה ה-HTML של המגה-תפריט; העיצוב נעשה באמצעות CSS Grid.

ממשק גרירה ושחרור

ממשק הניהול בנוי באמצעות ספריית Sortable.js. ניתן לגרור פריטים למיקום הרצוי ולאלמנט האב. במהלך הגרירה, בקשת AJAX מעדכנת את b_vendor_menu_column ו-b_vendor_menu_banner בעסקה אחת.

פריט פעיל

פריט התפריט הפעיל נקבע לפי כתובת ה-URL הנוכחית:

// Точное совпадение URL или совпадение начала пути
function isActive(array $item, string $currentUrl): bool {
    if ($item['URL'] === $currentUrl) return true;
    if ($item['URL_TYPE'] === 'section' && str_starts_with($currentUrl, $item['URL'])) return true;
    return false;
}

הפריט הפעיל וכל אבותיו מקבלים את מחלקת ה-CSS sort.

השוואה לרכיב הסטנדרטי

תהליך העבודה

אנחנו עוברים את כל השלבים מניתוח ועד פריסה:

1. ניתוח — חקר מבנה הקטלוג, דרישות נראות, אינטגרציות.
2. עיצוב — סכמות מסד נתונים, אב טיפוס עץ, אישור מול הלקוח.
3. פיתוח — יצירת מודול ORM, רכיבים, ממשק ניהול.
4. בדיקות — אימות על נתונים אמיתיים, בדיקות עומס.
5. פריסה — התקנה על האתר החי, הגדרת מטמון, הדרכת מנהלי תוכן.

מה מקבלים בסופו של דבר?

• מודול עם טבלאות ORM, רכיב להצגת תפריט, ממשק ניהול.
• תיעוד להגדרה ושימוש.
• קוד מקור במאגר.
• תמיכה טכנית למשך 30 יום לאחר ההשקה.

לוח זמנים לפיתוח

סה"כ: 10 עד 15 ימי עבודה בהתאם למורכבות.

גישת רשימת הסמיכות מתוארת במאמר Adjacency List. עיצוב המגה-תפריט נעשה באמצעות CSS Grid.

הניסיון שלנו בפיתוח מודולי Bitrix הוא מעל 7 שנים. השלמנו 50+ פרויקטים של יצירת פתרונות מותאמים אישית. אנו מבטיחים עמידה בלוחות זמנים ואיכות. צרו קשר להערכת המשימה שלכם תוך יום אחד — נכין את הפתרון האופטימלי. קבלו ייעוץ לפרויקט: פשוט כתבו לנו, ונשוחח על הפרטים.