PT-14058: Broken submenu in options menu (#219)

fix: Broken submenu in options menu
VirtoCommerce · Oct 23, 2023 · 5140a45 · 5140a45
1 parent 86b7764
commit 5140a45
Show file tree

Hide file tree

Showing 3 changed files with 181 additions and 154 deletions.
diff --git a/src/VirtoCommerce.CoreModule.Web/Scripts/dynamicConditions/expression-directives.js b/src/VirtoCommerce.CoreModule.Web/Scripts/dynamicConditions/expression-directives.js
@@ -20,6 +20,23 @@ angular.module('virtoCommerce.coreModule.common')
             //    source: '='
             //},
             link: function ($scope, $element, $attrs) {
+                $scope.toggle = function ($event) {
+                    var elem = $event.target;
+                    var childUlElement = $(elem).find("ul");
+                    if (childUlElement.length > 0) {
+                        var iconElement = $(elem).find("i");
+                        if (iconElement.hasClass("fa-caret-down")) {
+                            iconElement.removeClass("fa-caret-down");
+                            iconElement.addClass("fa-caret-right");
+                        }
+                        else {
+                            iconElement.removeClass("fa-caret-right");
+                            iconElement.addClass("fa-caret-down");
+                        }
+                        childUlElement.toggle();
+                        $event.stopPropagation();
+                    }
+                };
                 $scope.addChild = function (chosenMenuElement, parentBlock) {
                     if (!parentBlock.children) {
                         parentBlock.children = [];

diff --git a/src/VirtoCommerce.CoreModule.Web/Scripts/dynamicConditions/expression-tree.tpl.html b/src/VirtoCommerce.CoreModule.Web/Scripts/dynamicConditions/expression-tree.tpl.html
@@ -26,9 +26,9 @@
         </ul>
         <a class="add __link __usergroup" left-click-menu data-target="det_add_{{element.id}}">{{element.newChildLabel}}</a>
         <ul class="menu __context" role="menu" id="det_add_{{element.id}}">
-            <li class="menu-item" ng-class="{'__right': child.subitems}" ng-click='!child.subitems && addChild(child, element)' ng-repeat="child in element.availableChildren">
-                <i class="menu-ico fa fa-caret-right" ng-if="child.subitems"></i>{{child.displayName}}
-                <ul class="menu __sub" ng-if="child.subitems">
+            <li class="menu-item" ng-class="{'__right': child.subitems}" ng-click='child.subitems ? toggle($event) : addChild(child, element)' ng-repeat="child in element.availableChildren">
+                <i class="menu-ico fa fa-caret-down" ng-if="child.subitems"></i>{{child.displayName}}
+                <ul class="menu" ng-if="child.subitems">
                     <li class="menu-item" ng-click='addChild(child, element)' ng-repeat="child in child.subitems">{{child.displayName}}</li>
                 </ul>
             </li>