カテゴリーの階層化対応

app/css/app.css

@@ -20032,14 +20032,64 @@ button {
     margin: 0
 }
 
-.drawer-menu .drawer-menu3 li {
-    padding: 10px 0 10px 70px;
-    border-bottom: 1px solid #ccc;
-    background: none
+.category-li {
+    padding: 10px 0 10px !important;
+    border-bottom: 1px solid #ccc !important;
+    margin-bottom: 0px !important;
+}
+
+.category-a {
+    margin-left: 8px;
+}
+
+.group-level-1 {
+    padding-left: 30px !important;
+}
+
+.group-level-2 {
+    padding-left: 45px !important;
+}
+
+.group-level-3 {
+    padding-left: 60px !important;
+}
+
+.group-level-4 {
+    padding-left: 75px !important;
+}
+
+.group-level-5 {
+    padding-left: 90px !important;
+}
+
+.group-level-6 {
+    padding-left: 105px !important;
 }
 
-.drawer-menu .drawer-menu3 li:hover {
-    background-color: #f1f1f1
+.group-level-7 {
+    padding-left: 120px !important;
+}
+
+.group-level-8 {
+    padding-left: 135px !important;
+}
+
+.group-level-9 {
+    padding-left: 150px !important;
+}
+
+.group-level-10 {
+    padding-left: 165px !important;
+}
+
+.group-level-11 {
+    padding-left: 180px !important;
+}
+
+.drawer-menu .drawer-menu3 li {
+    padding: 10px 0 10px 70px !important;
+    border-bottom: 1px solid #ccc !important;
+    background: none !important;
 }
 
 .drawer-menu .menu-link li {
@@ -20047,10 +20097,6 @@ button {
     border-bottom: 1px solid #ccc
 }
 
-.drawer-menu .menu-link li:hover {
-    background-color: #f1f1f1
-}
-
 .drawer-menu .menu-ttl:after {
     content: ""
 }
@@ -20067,19 +20113,17 @@ button {
     content: ""
 }
 
-.drawer-menu .sub-menu-ttl:after {
+.drawer-menu .sub-menu-ttl:before {
     content: ""
 }
 
-.drawer-menu .sub-menu-ttl.openAcd:after,.drawer-menu .sub-menu-ttl:after {
+.drawer-menu .sub-menu-ttl.openAcd:before,.drawer-menu .sub-menu-ttl:before {
     font-family: Font Awesome\ 5 Free;
     font-weight: 700;
-    position: absolute;
-    left: 30px;
-    top: 10px
+    position: relative;
 }
 
-.drawer-menu .sub-menu-ttl.openAcd:after {
+.drawer-menu .sub-menu-ttl.openAcd:before {
     content: ""
 }
 

app/script/check.js

@@ -2757,19 +2757,29 @@ CHK.createCategory = function(operationGroupMasterList) {
 	$('#category-menu').append(noCategory);
 	//TODO operationGroupMasterId順番と深さの仕様確認要
 	for (var i = 0; i < operationGroupMasterList.length; i++) {
-		if (operationGroupMasterList[i].operationGroupMasterLevel == 0 ){ //0 : カテゴリー全体
-			var categoryParent = $("<dl id=groupMasterId_"+ operationGroupMasterList[i].operationGroupMasterId +" class='group-category-list'><dt class='menu-ttl'><a onclick='CHK.changeOperationGroupMaster(" + operationGroupMasterList[i].operationGroupMasterId + ");'>"+ operationGroupMasterList[i].operationGroupMasterName +"</a></dt></dl>");
+	    if (operationGroupMasterList[i].operationGroupMasterLevel == 0 ){
+	        var categoryParent = $("<dl id=groupMasterId_" + operationGroupMasterList[i].operationGroupMasterId
+	            + " class='group-category-list'><dt class='menu-ttl'><a onclick='CHK.changeOperationGroupMaster("
+	            + operationGroupMasterList[i].operationGroupMasterId + ");'>" + operationGroupMasterList[i].operationGroupMasterName
+	            + "</a></dt></dl>");
             $('#category-menu').append(categoryParent);
 	    } else {
-			if($('#groupMasterId_'+operationGroupMasterList[i].parentOperationGroupMasterId).length > 0){
-				var categoryChild;
-				if ($('#groupMasterId_'+ operationGroupMasterList[i].parentOperationGroupMasterId +'>dd').length > 0){
-					categoryChild = $("<li class='drawer-menu2'><a onclick='CHK.changeOperationGroupMaster(" + operationGroupMasterList[i].operationGroupMasterId + ");'>"+ operationGroupMasterList[i].operationGroupMasterName +"</a></li>");
-					$('#groupMasterId_'+operationGroupMasterList[i].parentOperationGroupMasterId+' >dd >ul').append(categoryChild);
+	        var groupParents = '#groupMasterId_' + operationGroupMasterList[i].parentOperationGroupMasterId;
+            if ($('#groupMasterId_'+ operationGroupMasterList[i].parentOperationGroupMasterId + '>ul').length > 0){
+                categoryChild = $("<li  id='groupMasterId_" + operationGroupMasterList[i].operationGroupMasterId
+                    + "' class=''><p class='category-li group-level-" + operationGroupMasterList[i].operationGroupMasterLevel
+                    + "'><a class='category-a' onclick='CHK.changeOperationGroupMaster("
+                    + operationGroupMasterList[i].operationGroupMasterId + ");'>" + operationGroupMasterList[i].operationGroupMasterName
+                    + "</a></p></li>");
+                $('#groupMasterId_' + operationGroupMasterList[i].parentOperationGroupMasterId + ' >ul').append(categoryChild);
             } else {
-					categoryChild = $("<dd style='display:none;'><ul class='drawer-menu2 menu-link'><li class='drawer-menu2'><a onclick='CHK.changeOperationGroupMaster(" + operationGroupMasterList[i].operationGroupMasterId + ");'>"+ operationGroupMasterList[i].operationGroupMasterName +"</a></li></ul></dd>");
-					$('#groupMasterId_'+operationGroupMasterList[i].parentOperationGroupMasterId).append(categoryChild);
-				}
+                $(groupParents + " > p").addClass("sub-menu-ttl");
+                categoryChild = $("<ul style='display:none;' class=''><li class='' id='groupMasterId_" + operationGroupMasterList[i].operationGroupMasterId
+                + "' class=''><p class='category-li group-level-"
+                + operationGroupMasterList[i].operationGroupMasterLevel
+                + "'><a class='category-a' onclick='CHK.changeOperationGroupMaster(" + operationGroupMasterList[i].operationGroupMasterId
+                + ");'>" + operationGroupMasterList[i].operationGroupMasterName + "</a></p></li></ul>");
+                $('#groupMasterId_' + operationGroupMasterList[i].parentOperationGroupMasterId).append(categoryChild);
             }
 	    }
 	}
@@ -2872,13 +2882,14 @@ function acdMenu() {
 
     //第2階層のアコーディオン　
     $(".drawer-menu dt").on('click', function() {
+        $(".sub-menu-ttl").removeClass("openAcd").next().slideUp("fast");
         $(".drawer-menu dt").not(this).removeClass("open").next().slideUp("fast");
         $(this).toggleClass("open").next().slideToggle("fast");
     });
 
     //第3階層のアコーディオン
-    $(".drawer-menu2 p").on('click', function() {
-        $(".drawer-menu2 p").not(this).removeClass("openAcd").next().slideUp("fast");
+    $(".sub-menu-ttl").on('click', function() {
+        $(".sub-menu-ttl").not($(this)).not($(this).parents().siblings("p")).removeClass("openAcd").next().slideUp("fast");
         $(this).toggleClass("openAcd").next().slideToggle("fast");
     });
 }