좌 메뉴 기능 추가.

src/main/resources/static/css/common.css

@@ -19,4 +19,14 @@
 .activeTr{
   --bs-bg-opacity: 0.25;
   background-color: rgba(var(--bs-success-rgb),var(--bs-bg-opacity))!important;
+}
+
+.menuDiv{
+  width: 250px;
+  position: absolute;
+  top: 0;
+  left: 180px;
+  z-index: 100;
+  border-left: 1px solid;
+  border-right: 1px solid;
 }

src/main/resources/static/js/common.js

@@ -27,4 +27,22 @@ $(document).on('change', '#rowCnt', function (){
 function searchFormSubmit(pageIndex){
   $("#pageIndex").val(pageIndex);
   $("#searchBtn").click();
-}
+}
+
+
+$(document).on('mouseenter', '.firstMenuLink', function (event){
+  $(".secondMenu").hide();
+  const targetMenu = $(this).parent().find(".secondMenu");
+  targetMenu.show()
+  targetMenu.find("ul").css("padding-top",(event.clientY-20)+"px")
+})
+$(document).on('mouseenter', '.secondMenuLink', function (event){
+  $(".thirdMenu").hide();
+  const targetMenu = $(this).parent().find(".thirdMenu");
+  targetMenu.show()
+  targetMenu.find("ul").css("padding-top",(event.clientY-20)+"px")
+})
+$(document).on('mouseleave', '.menuDiv', function (){
+  $(".secondMenu").hide();
+  $(".thirdMenu").hide();
+})

src/main/resources/templates/fragments/leftMenu.html

@@ -11,7 +11,29 @@
       <li th:each="firstMenu:${session.menuList}">
         <th:block th:each="cat1Code:${session.commonCode.get('CAT1')}">
           <th:block th:if="${cat1Code.itemCd eq firstMenu.cat1Cd}">
-            <a href="#" class="nav-link link-dark" th:text="${cat1Code.itemValue}"></a>
+            <a href="#" class="nav-link link-dark firstMenuLink" th:text="${cat1Code.itemValue}"></a>
+            <div class="menuDiv secondMenu h-100 bg-white" style="display: none">
+              <ul class="nav nav-pills flex-column">
+                <li th:each="secondMenu:${firstMenu.childList}">
+                  <th:block th:each="cat2Code:${session.commonCode.get('CAT2')}">
+                    <th:block th:if="${cat2Code.itemCd eq secondMenu.cat2Cd}">
+                      <a class="nav-link link-dark secondMenuLink" th:text="${cat2Code.itemValue}" th:href="${#lists.isEmpty(secondMenu.childList)?secondMenu.menuUrl:'#'}"></a>
+                      <div class="menuDiv thirdMenu h-100 bg-white" style="display: none" th:if="${#lists.isEmpty(secondMenu.childList) ne true}">
+                        <ul class="nav nav-pills flex-column">
+                          <li th:each="thirdMenu:${secondMenu.childList}">
+                            <th:block th:each="cat3Code:${session.commonCode.get('CAT3')}">
+                              <th:block th:if="${cat3Code.itemCd eq thirdMenu.cat3Cd}">
+                                <a class="nav-link link-dark" th:text="${cat3Code.itemValue}" th:href="${thirdMenu.menuUrl}"></a>
+                              </th:block>
+                            </th:block>
+                          </li>
+                        </ul>
+                      </div>
+                    </th:block>
+                  </th:block>
+                </li>
+              </ul>
+            </div>
           </th:block>
         </th:block>
       </li>

src/main/resources/templates/login/dashboard.html

@@ -3,7 +3,7 @@
       xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
       layout:decorate="~{layout/layout}">
 <th:block layout:fragment="script">
-  <script type="text/javascript" th:src="@{/js/admin/userMgt.js}"></script>
+  <!--<script type="text/javascript" th:src="@{/js/admin/userMgt.js}"></script>-->
 </th:block>
 <div layout:fragment="content">
   <main class="pt-3">