회원관리 페이지 반응형 작업.

src/main/webapp/WEB-INF/jsp/admin/dashBoard.jsp

@@ -86,7 +86,7 @@
     </div>
     <div class="col-lg-9">
       <div class="row">
-        <div class="col-12">
+        <div class="col-lg-12">
           <div class="card my-2">
             <div class="card-body">
               <p class="mb-0 text-black-50">지도사용 이력 추이</p>
@@ -94,7 +94,7 @@
             </div>
           </div>
         </div>
-        <div class="col-5">
+        <div class="col-lg-5">
           <div class="card my-2">
             <div class="card-body">
               <div class="col-auto">
@@ -104,7 +104,7 @@
             </div>
           </div>
         </div>
-        <div class="col-7">
+        <div class="col-lg-7">
           <div class="card my-2">
             <div class="card-body">
               <div class="col-auto">

src/main/webapp/WEB-INF/jsp/admin/userInfo.jsp

@@ -15,8 +15,8 @@
     <h1 class="h4 m-3">회원관리</h1>
     <form:form commandName="userSearchVO" name="searchForm" action="/admin/userInfo" method="get">
 
-        <div class="row justify-content-between bg-white mx-3 py-2">
+        <div class="row justify-content-between bg-white mx-3">
-            <div class="col-auto">
+            <div class="col-auto py-2">
                 <ul class="nav nav-pills ms-2" role="tablist">
                     <li role="presentation" class="nav-item">
                       <a class="nav-link ${userSearchVO.auth eq '99'?'active':''}" href="/admin/userInfo?auth=99">승인대기(${standByCount})</a>
@@ -28,8 +28,8 @@
                 <input type="hidden" name="auth" value="${userSearchVO.auth}"/>
             </div>
 
-            <div class="col-auto row">
+            <div class="col-auto py-2 row">
-                <div class="col-auto">
+                <div class="col-12 col-lg-4">
                     <select class="form-select" name="searchCondition">
                         <option value="all" ${userSearchVO.searchCondition eq 'all'?'selected':''}>통합검색</option>
                         <option value="name" ${userSearchVO.searchCondition eq 'name'?'selected':''}>이름</option>
@@ -38,18 +38,16 @@
                         <option value="phonenum" ${userSearchVO.searchCondition eq 'phonenum'?'selected':''}>전화번호</option>
                     </select>
                 </div>
-
+                <div class="col-9 col-lg-5">
-                <div class="col-auto">
                     <input type="text" class="form-control" name="searchKeyword" value="${userSearchVO.searchKeyword}"/>
                 </div>
-                <div class="col-auto">
+                <div class="col-3 col-lg-3">
-                    <input class="btn btn-outline-secondary" type="submit" value="검색"/>
+                    <input class="btn btn-outline-secondary w-100" type="submit" value="검색"/>
                 </div>
             </div>
         </div>
-
-
         <div class="row m-3 p-2 bg-white">
+          <div class="col-12 d-none d-sm-block">
             <table class="table table-hover text-center">
                 <thead>
                 <tr>
@@ -65,8 +63,8 @@
                 <tbody>
                 <c:if test="${count >= 1}">
                     <c:forEach var="user" items="${userList}" varStatus="idx">
-                        <tr>
+                        <tr data-userid="${user.userid}">
-                            <td class="clickAbleObj userInfoModalBtn useridTd"><c:out value='${user.userid}'/></td>
+                            <td class="clickAbleObj userInfoModalBtn"><c:out value='${user.userid}'/></td>
                             <td class="clickAbleObj userInfoModalBtn"><c:out value='${user.name}'/></td>
                             <td class="clickAbleObj userInfoModalBtn"><c:out value='${user.company}'/></td>
                             <td class="clickAbleObj userInfoModalBtn"><c:out value='${user.phonenum}'/></td>
@@ -94,6 +92,61 @@
                 </c:if>
                 </tbody>
             </table>
+          </div>
+          <div class="col-12 d-block d-sm-none">
+            <table class="table table-hover text-center">
+              <tbody class="border-0 border-top border-bottom border-2 border-dark">
+              <c:if test="${count >= 1}">
+                <c:forEach var="user" items="${userList}" varStatus="idx">
+                  <tr class="clickAbleObj userInfoModalBtn border-bottom" data-userid="${user.userid}">
+                    <th class="bg-secondary" style="--bs-bg-opacity: .5">아이디</th>
+                    <td><c:out value='${user.userid}'/></td>
+                  </tr>
+                  <tr class="clickAbleObj userInfoModalBtn border-bottom" data-userid="${user.userid}">
+                    <th class="bg-secondary" style="--bs-bg-opacity: .5">이름</th>
+                    <td><c:out value='${user.name}'/></td>
+                  </tr>
+                  <tr class="clickAbleObj userInfoModalBtn border-bottom" data-userid="${user.userid}">
+                    <th class="bg-secondary" style="--bs-bg-opacity: .5">소속</th>
+                    <td><c:out value='${user.company}'/></td>
+                  </tr>
+                  <tr class="clickAbleObj userInfoModalBtn border-bottom" data-userid="${user.userid}">
+                    <th class="bg-secondary" style="--bs-bg-opacity: .5">전화번호</th>
+                    <td><c:out value='${user.phonenum}'/></td>
+                  </tr>
+                  <tr class="clickAbleObj userInfoModalBtn border-bottom" data-userid="${user.userid}">
+                    <th class="bg-secondary" style="--bs-bg-opacity: .5">이메일</th>
+                    <td><c:out value='${user.email}'/></td>
+                  </tr>
+                  <tr class="clickAbleObj userInfoModalBtn border-bottom" data-userid="${user.userid}">
+                    <th class="bg-secondary" style="--bs-bg-opacity: .5">가입일</th>
+                    <td class="td_date"><c:out value='${user.regdate}'/></td>
+                  </tr>
+                  <tr class="border-0 border-bottom border-2 border-dark">
+                    <th class="bg-secondary" style="--bs-bg-opacity: .5">${userSearchVO.auth eq '99'?'상태':'권한'}</th>
+                    <td>
+                      <c:choose>
+                        <c:when test="${user.auth eq '1'}">관리자</c:when>
+                        <c:when test="${user.auth eq '2'}">사용자</c:when>
+                        <c:when test="${user.auth eq '99'}">
+                          <input type="button" class="btn btn-outline-success" value="승인"
+                                 onclick="confirmBtn('${user.userid}','2'); return false;"/>
+                          <input type="button" class="btn btn-outline-danger" value="삭제"
+                                 onclick="confirmBtn('${user.userid}','-1'); return false;"/>
+                        </c:when>
+                      </c:choose>
+                    </td>
+                  </tr>
+                </c:forEach>
+              </c:if>
+              <c:if test="${count == 0}">
+                <tr>
+                  <td colspan="7">요청한 목록이 없습니다.</td>
+                </tr>
+              </c:if>
+              </tbody>
+            </table>
+          </div>
         </div>
         <div class="text-page">
             <form:hidden path="pageIndex"/>

src/main/webapp/WEB-INF/jsp/map/requestView.jsp

@@ -134,10 +134,8 @@
             <td colspan="1" class="text-center" >
               <c:if test="${useRequestVO.status ne '99' }">
                 <c:choose>
-                  <c:when test="${useRequestVO.status eq '0' }"><span class="label label-success">
+                  <c:when test="${useRequestVO.status eq '0' }"><span class="label label-success"><c:out value='사용중' /></span></c:when>
-                                                    <c:out value='사용중' /></span></c:when>
+                  <c:otherwise><span class="label label-danger"><c:out value='사용불가' /></span></c:otherwise>
-                  <c:otherwise><span class="label label-danger">
-                                                    <c:out value='사용불가' /></span></c:otherwise>
                 </c:choose>
               </c:if>
             </td>
@@ -160,15 +158,17 @@
             <th rowspan="3" colspan="1">레이어</th>
             <th><label>지하시설물</label></th>
               <td colspan="4">
-<%--              <div  class="setting_content2" class="facility">--%>
+              <div  class="setting_content2" class="facility">
                 <c:forEach var="item" items="${layersVO}" varStatus="status">
                   <c:if test="${item.code eq  'facility'}">
                     <c:set var="faciltySize" value="${faciltySize+1}" />
-                    <label class="layer-label"><input type="checkbox" class="me-2" name="${item.code}" id="${item.code}" disabled="disabled" value="${item.layer}" <c:forEach var="item2" items="${layers}" varStatus="status2">
+                    <label class="layer-label">
-                        <c:if test="${item.layer eq item2}">
+                      <input type="checkbox" class="me-2" name="${item.code}" id="${item.code}" disabled="disabled" value="${item.layer}"
-                          checked
+                          <c:forEach var="item2" items="${layers}" varStatus="status2">
-                        </c:if>
+                            <c:if test="${item.layer eq item2}">
-                      </c:forEach>
+                              checked
+                            </c:if>
+                          </c:forEach>
                       />${item.name}
                     </label>
                   </c:if>

src/main/webapp/css/style.css

@@ -19,10 +19,6 @@ a {
     padding-top: 10px;
 }
 
-.text-center {
-    text-align: center;
-}
-
 .point-cursor {
     cursor: pointer;
 }
@@ -232,10 +228,7 @@ a {
 
 .setting_content2 {
     width: 100%;
-    margin-top: 10px;
     justify-content: space-between;
-    line-height: 3;
-
 }
 
 .setting_sub_title {
@@ -682,7 +675,7 @@ a {
 .layer-label {
     width: 140px;
     display: inline-block;
-    line-height: 50px;
+    line-height: 30px;
     margin-left: 20px;
 }
 

src/main/webapp/js/admin/userinfo.js

@@ -4,7 +4,7 @@ $(function () {
 })
 
 $(document).on('click', '.userInfoModalBtn', function () {
-    const userid = $(this.parentNode).find(".useridTd")[0].innerText;
+    const userid = $(this.parentNode).attr("data-userid");
     $.ajax({
         url: '/admin/userInfo/' + userid,
         type: 'GET',