Commit @4d17fd09794247cd974faa420c26af25092c6099

류윤주 03-28

250328 류윤주 수정

@4d17fd09794247cd974faa420c26af25092c6099

9600e70

4d17fd0

client/resources/scss/admin/content.scss

--- client/resources/scss/admin/content.scss

+++ client/resources/scss/admin/content.scss


     height: 100%;
     padding: 3rem;
 
-
-
-    .box-title,
-    .section-title {
-        font-size: var(--tk-fz-title-md);
-        font-weight: 700;
-        margin-bottom: 1rem;
-    }
-
-
-    .search-bar {
-        @include flex-layout(flex, center, end);
-        margin-bottom: 1rem;
-
-        .form-select {
-            width: 120px;
-        }
-
-        .form-control {
-            width: 300px;
-            margin-left: 1rem;
-        }
-
-        .btn {
-            margin-left: 1rem;
-        }
-    }
-
-    .btn-wrap {
-        @include flex-layout(flex, center, end);
-        padding: 3rem 0;
-
-        button {
-            margin-left: 1rem
-        }
-    }
-
-    .btn-wrap.list {
-        @include flex-layout(flex, center, space-between);
-        padding: 3rem 0;
-    }
-
-    .form-content {
-        padding: 3rem;
-        display: grid;
-        grid-template-columns: 1fr 1fr;
-        // grid-template-rows: 1fr 1fr;
-
-        >div {
-            @include flex-layout(flex, center, start);
-            width: 100%;
-            padding: 1rem;
-            border-bottom: 1px solid var(--tk-gray-10);
-
-            .form-title {
-                width: 180px;
-                font-weight: 700;
-
-                span {
-                    color: var(--tk-point-40);
-                    margin-right: .5rem;
-                }
-            }
-
-
-            .form-select {
-                width: 200px;
-            }
-
-            .form-control {
-                max-width: calc(100% - 180px);
-            }
-
-            .form-group {
-                width: calc(100% - 180px);
-
-                .form-control {
-                    max-width: 100%;
-                }
-
-                span {
-                    font-size: var(--tk-fz-detail-sm);
-                }
-            }
-        }
-
-        >div:nth-child(1),
-        div:nth-child(2) {
-            padding-top: 0;
-        }
-
-        >div:last-child {
-            grid-column: 1/3;
-            padding-bottom: 0;
-            border-bottom: 0;
-        }
-
-        // 자식 div 개수가 짝수일 때 마지막 div의 스타일을 변경
-        &:has(> div:nth-child(even):last-child) {
-            >div {
-                padding-left: 3rem;
-            }
-
-            >div:last-child {
-                grid-column: unset;
-            }
-
-            >div:nth-last-child(2) {
-                border-bottom: 0;
-            }
-        }
-
-        .check-area {
-            @include flex-layout(flex, center);
-            gap: 3rem;
-        }
-
-
-    }
-
-    
-    .title-zone {
-        @include flex-layout(flex, center, space-between);
-        margin-bottom: 3rem;
-
-        .section-title {
-            margin-bottom: 0;
-        }
-    }
-
     >.content-zone {
         height: calc(100% - 70px);
         background-color: var(--tk-white);

                 height: 100%;
                 overflow-y: auto;
 
-                .top-zone {
-                    >div {
-                        margin-bottom: 5rem;
 
-                        .tbl {
-                            .table-title {
-                                @include ellipsis(1);
-                            }
-
-                        }
-                    }
-
-                }
-
-                .middle-zone {
-                    @include flex-layout(flex, flex-start, space-between);
-                    gap: 3rem;
-                    margin-bottom: 5rem;
-
-                    .first-box,
-                    .two-box,
-                    .three-box {
-                        flex: 0 0 calc(33.333% - 2rem);
-                        max-width: calc(33.333% - 2rem);
-                        padding: 2rem;
-                        border-radius: var(--tk-rd-12);
-                        text-align: center;
-                        border: 1px solid var(--tk-gray-10);
-
-
-                    }
-                }
-
-                .chart-wrap {
-                    padding: 3rem;
-                    border: 1px solid var(--tk-gray-10);
-                    @include radius(30);
-                }
-
-                .form-box {
-                    border: 1px solid var(--tk-gray-10);
-                    @include radius(30);
-
-                    .form-box-title {
-                        padding: 1rem 3rem;
-                        background-color: #fbfbfb;
-                        @include flex-layout(flex, center, start);
-                        font-size: var(--tk-fz-title-sm);
-                        border-radius: 3rem 3rem 0 0;
-
-                        >p {
-                            margin-right: 1rem;
-                            font-weight: 700;
-                        }
-
-                        >p:nth-of-type(2) {
-                            font-size: var(--tk-fz-detail-sm);
-                            background-color: var(--tk-point-5);
-                            border: 1px solid var(--tk-point-40);
-                            padding: .2rem 1rem;
-                            // border-radius: var(--tk-rd-12);
-                            @include radius(30);
-                            font-weight: 400;
-
-                            span {
-                                color: var(--tk-point-40);
-                                margin-right: .5rem;
-                            }
-                        }
-                    }
-
-
-                }
             }
 
-            .setting-box {
-                @include flex-layout(flex, start, start);
-                width: 100%;
-                height: calc(100% - 38.5px);
+        }
 
-                .node-zone {
-                    width: 325px;
-                    height: 100%;
-                    margin-right: 5rem;
-                    background-color: #fbfbfb;
-                    border-radius: var(--tk-rd-12);
-
-                    .tree {
-                        padding: 3rem;
-                        width: 100%;
-                        height: calc(100% - 149px);
-                        overflow-y: auto;
-
-
-                    }
-                }
-
-                .setting-zone {
-                    width: calc(100% - 325px - 5rem);
-                    height: 100%;
-
-                    .form-content {
-                        padding: 0;
-
-                        >div {
-                            padding: 1rem;
-                        }
-
-                        >div:nth-child(2),
-                        div:nth-child(4),
-                        div:nth-child(6) {
-                            padding-left: 3rem;
-                        }
-
-                        >div:last-child {
-                            align-items: flex-start;
-                        }
-
-                    }
-                }
-
-                .btn-zone {
-                    padding: 3rem;
-
-                    button {
-                        min-width: 126px;
-                        margin-left: 1rem;
-                        margin-bottom: 1rem;
-                    }
-
-                    button:nth-child(1) {
-                        margin-left: 0;
-                    }
-
-                    button:last-child {
-                        min-width: 100%;
-                        margin-left: 0;
-                        margin-bottom: 0;
-                    }
-                }
-            }
+        &.full-page {
+            height: 100%;
         }
 
     }

     .content-zone {
         height: 100%;
     }
+}
+
+.page-title {
+    font-size: var(--tk-fz-title-xlg);
+    font-weight: 700;
+}
+
+.box-title,
+.section-title {
+    font-size: var(--tk-fz-title-md);
+    font-weight: 700;
+    margin-bottom: 1rem;
+}
+
+
+
+.search-bar {
+    @include flex-layout(flex, center, end);
+    margin-bottom: 1rem;
+
+    .form-select {
+        width: 120px;
+    }
+
+    .form-control {
+        width: 300px;
+        margin-left: 1rem;
+    }
+
+    .btn {
+        margin-left: 1rem;
+    }
+}
+
+.btn-wrap {
+    @include flex-layout(flex, center, end);
+    padding: 3rem 0;
+
+    button {
+        margin-left: 1rem
+    }
+
+    &.list {
+        @include flex-layout(flex, center, space-between);
+        padding: 3rem 0;
+    }
+}
+
+
+.form-content {
+    padding: 2rem;
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    // grid-template-rows: 1fr 1fr;
+
+    >div {
+        @include flex-layout(flex, center, start);
+        width: 100%;
+        padding: 1rem;
+        border-bottom: 1px solid var(--tk-gray-10);
+
+        &:last-child {
+            align-items: flex-start;
+        }
+
+        .form-title {
+            width: 180px;
+            font-weight: 700;
+
+            span {
+                color: var(--tk-point-40);
+                margin-right: .5rem;
+            }
+        }
+
+
+        .form-select {
+            width: 200px;
+        }
+
+        .form-control {
+            max-width: calc(100% - 180px);
+        }
+
+        .form-group {
+            width: calc(100% - 180px);
+
+            .form-control {
+                max-width: 100%;
+            }
+
+            span {
+                font-size: var(--tk-fz-detail-sm);
+            }
+        }
+
+        .input-group{
+            max-width: calc(100% - 180px);
+        }
+
+        &.grid-column {
+            grid-column: 1/3;
+        }
+
+        &:nth-child(1),:nth-child(2){
+            padding-top: 0;
+        }
+
+        &:last-child{
+            grid-column: 1/3;
+            padding-bottom: 0;
+            border-bottom: 0;
+        }
+    }
+
+
+    // 자식 div 개수가 짝수일 때 마지막 div의 스타일을 변경
+    &:has(> div:nth-child(even)) {
+
+        >div{
+
+            &:nth-last-child(-n + 2){
+                border-bottom: 0;
+            }
+
+            &:last-child {
+                grid-column: unset;
+    
+                &.grid-column {
+                    grid-column: 1/3;
+                }
+            }
+        }
+
+    }
+
+    .check-area {
+        @include flex-layout(flex, center);
+        gap: 3rem;
+    }
+
+
+}
+
+
+.title-zone {
+    @include flex-layout(flex, center, space-between);
+    margin-bottom: 3rem;
+
+    .section-title {
+        margin-bottom: 0;
+    }
+}
+
+
+.form-box {
+    border: 1px solid var(--tk-gray-10);
+    @include radius(30);
+
+    .form-box-title {
+        padding: 1rem 3rem;
+        background-color: #fbfbfb;
+        @include flex-layout(flex, center, start);
+        font-size: var(--tk-fz-title-sm);
+        border-radius: 3rem 3rem 0 0;
+
+        >p {
+            margin-right: 1rem;
+            font-weight: 700;
+        }
+
+        >p:nth-of-type(2) {
+            font-size: var(--tk-fz-detail-sm);
+            background-color: var(--tk-point-5);
+            border: 1px solid var(--tk-point-40);
+            padding: .2rem 1rem;
+            // border-radius: var(--tk-rd-12);
+            @include radius(30);
+            font-weight: 400;
+
+            span {
+                color: var(--tk-point-40);
+                margin-right: .5rem;
+            }
+        }
+    }
+
+
+}
+
+.setting-box {
+    @include flex-layout(flex, start, start);
+    width: 100%;
+    height: calc(100% - 58.5px);
+
+    .node-zone {
+        width: 325px;
+        height: 100%;
+        margin-right: 5rem;
+        background-color: #fbfbfb;
+        border-radius: var(--tk-rd-12);
+
+        .tree {
+            padding: 3rem;
+            width: 100%;
+            height: calc(100% - 149px);
+            overflow-y: auto;
+
+
+        }
+    }
+
+    .setting-zone {
+        width: calc(100% - 325px - 5rem);
+        height: 100%;
+
+        // .form-content {
+        //     // padding: 0;
+
+        //     >div {
+        //         padding: 1rem;
+        //         
+        //     }
+        // }
+        .btn-wrap {
+            // justify-content: flex-end;
+            padding: 1rem 0;
+        }
+    }
+
+    .btn-zone {
+        padding: 3rem;
+
+        button {
+            min-width: 126px;
+            margin-left: 1rem;
+            margin-bottom: 1rem;
+        }
+
+        button:nth-child(1) {
+            margin-left: 0;
+        }
+
+        button:last-child {
+            min-width: 100%;
+            margin-left: 0;
+            margin-bottom: 0;
+        }
+    }
+}
+
+.top-zone {
+    >div {
+        margin-bottom: 5rem;
+
+        .tbl {
+            .table-title {
+                @include ellipsis(1);
+            }
+
+        }
+    }
+
+}
+
+.middle-zone {
+    @include flex-layout(flex, flex-start, space-between);
+    gap: 3rem;
+    margin-bottom: 5rem;
+
+    .first-box,
+    .two-box,
+    .three-box {
+        flex: 0 0 calc(33.333% - 2rem);
+        max-width: calc(33.333% - 2rem);
+        padding: 2rem;
+        border-radius: var(--tk-rd-12);
+        text-align: center;
+        border: 1px solid var(--tk-gray-10);
+
+
+    }
+}
+
+.chart-wrap {
+    padding: 3rem;
+    border: 1px solid var(--tk-gray-10);
+    @include radius(30);
+}
+
+
+.area{
+    font-size: var(--tk-input-fz-sm);
+}
+
+.form-check{
+    display: flex;
+    align-items: center;
 }

9600e70

4d17fd0

client/resources/scss/common/component/_tree.scss

--- client/resources/scss/common/component/_tree.scss

+++ client/resources/scss/common/component/_tree.scss


         >div.node-wrap.selected{
             border: 1px solid var(--tk-primary);
             border-radius: var(--tk-rd-12);
-            margin-bottom: 1rem;
+
         }
 
         .child-node {
-            padding: 1rem;
-            padding-left: 2rem;
-            background-color: var(--tk-white);
+            padding-left: 1.5rem;
             border-radius: var(--tk-rd-12);
             margin-bottom: 1rem;
 

9600e70

4d17fd0

client/views/component/userInfo/UserInfoInsert.vue

--- client/views/component/userInfo/UserInfoInsert.vue

+++ client/views/component/userInfo/UserInfoInsert.vue


     <div class="content">
       <div class="scroll">
         <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>{{pageTit}}</p>
           </div>
           <PagiNavigationBar />

9600e70

4d17fd0

client/views/component/userInfo/UserInfoView.vue

--- client/views/component/userInfo/UserInfoView.vue

+++ client/views/component/userInfo/UserInfoView.vue


       <div class="content">
         <div class="scroll">
           <div class="title-zone">
-            <div class="section-title">
+            <div class="page-title">
               <p>{{pageTit}}</p>
             </div>
             <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/adm/departmentManagement/DepartmentManagement.vue

--- client/views/pages/adm/departmentManagement/DepartmentManagement.vue

+++ client/views/pages/adm/departmentManagement/DepartmentManagement.vue


 <template>
-  <div class="content admin-style">
-    <div class="admin-page-title point-font2 mb30">
-      <p>부서관리</p>
-    </div>
-    <div class="full-page">
-      <div class="flex content">
-        <div class="gd-2 pl0 conten">
-          <div class="tree-zone content pd15">
-            <div class="tree">
-              <div class="content overflow-y">
-                <draggable
-                  tag="ul"
-                  class="tree-node"
-                  :list="deptList"
-                  :group="{ name: 'menu' }"
-                  item-key="id"
-                  handle=".handle"
-                  ghost-class="ghost"
-                >
-                  <template #item="{ element }">
-                    <Hierachy
-                      :tasks="element"
-                      :icon="iconPath"
-                      :selectedNode="selectedDeptId"
-                      @changeSelected="fnViewDetail"
-                    />
-                  </template>
-                </draggable>
-              </div>
-            </div>
-            <div class="btn-zone pt15">
-              <template v-if="pageAuth.mdfcnAuthrt == 'Y'">
-                <div class="flex">
-                  <div class="gd-6 pl0">
-                    <button class="large-btn blue-border-btn" @click="topAdd">
-                      TOP+
-                    </button>
-                  </div>
-                  <div class="gd-6 pr0">
-                    <button class="large-btn blue-border-btn" @click="subAdd">
-                      SUB+
-                    </button>
-                  </div>
-                </div>
-                <div class="pt15">
-                  <button
-                    class="large-btn blue-border-btn"
-                    @click="fnListUpdate"
-                  >
-                    메뉴 저장
-                  </button>
-                </div>
-              </template>
+  <div class="content-zone full-page">
+    <div class="content">
+      <div class="title-zone">
+          <div class="page-title">
+            <p>부서관리</p>
+          </div>
+          <PagiNavigationBar />
+      </div>
+      <div class="setting-box">
+        <div class="node-zone">
+          <div class="tree">
+            <div>
+              <draggable
+                tag="ul"
+                class="tree-node"
+                :list="deptList"
+                :group="{ name: 'menu' }"
+                item-key="id"
+                handle=".handle"
+                ghost-class="ghost"
+              >
+                <template #item="{ element }">
+                  <Hierachy
+                    :tasks="element"
+                    :icon="iconPath"
+                    :selectedNode="selectedDeptId"
+                    @changeSelected="fnViewDetail"
+                  />
+                </template>
+              </draggable>
             </div>
           </div>
+          <div class="btn-zone">
+            <template v-if="pageAuth.mdfcnAuthrt == 'Y'">
+                <button class="btn top sm secondary" @click="topAdd">TOP+</button>
+                <button class="btn top sm secondary" @click="subAdd">SUB+</button>
+                <button class="btn save sm" @click="fnListUpdate">메뉴 저장</button>
+            </template>
+          </div>
         </div>
-        <div class="gd-10 pr0 content overflow-y">
-          <div class="content">
-            <div class="mb30">
-              <details open class="form-table-style">
-                <summary class="point-font2">
-                  <p class="summary-style pl10">부서정보</p>
-                </summary>
+        <div class="setting-zone">
+          <div>
+            <div class="form-box">
+              <div class="form-box-title">
+                <p>부서 정보</p>
+              </div>
+              <div class="form-content">
                 <div>
-                  <table class="form-table">
-                    <colgroup>
-                      <col width="50%" />
-                      <col width="50%" />
-                    </colgroup>
-                    <tr>
-                      <td>
-                        <div class="gd-12 pl0">
-                          <label for="" class="form-title point-font2 mb10"
-                            >상위부서</label
-                          >
-                          <input
-                            type="text"
-                            class="full-input"
-                            disabled
-                            v-model="viewDept.upDeptNm"
-                          />
-                        </div>
-                      </td>
-                      <td>
-                        <div class="gd-12 pr0">
-                          <label for="" class="form-title point-font2 mb10"
-                            >부서명</label
-                          >
-                          <input
-                            type="text"
-                            class="full-input"
-                            :disabled="isFormDisabled"
-                            v-model="viewDept.deptNm"
-                          />
-                        </div>
-                      </td>
-                    </tr>
-                    <tr>
-                      <td colspan="2">
-                        <div class="gd-12 pl0">
-                          <label for="" class="point-font2 mb10"
-                            >부서설명</label
-                          >
-                          <textarea
-                            name=""
-                            id=""
-                            style="min-height: 3rem"
-                            :disabled="isFormDisabled"
-                            v-model="viewDept.deptExpln"
-                          ></textarea>
-                        </div>
-                      </td>
-                    </tr>
-                    <tr>
-                      <td>
-                        <div class="gd-12 pl0">
-                          <label for="" class="form-title point-font2 mb10"
-                            >부서권한</label
-                          >
-                          <select
-                            name=""
-                            id=""
-                            class="full-select"
-                            :disabled="isFormDisabled"
-                            v-model="selectedAuthrt"
-                          >
-                            <option value="">선택</option>
-                            <option
-                              v-for="(item, idx) in authList"
-                              :key="idx"
-                              :value="item.authrtCd"
-                            >
-                              {{ item.authrtNm }}
-                            </option>
-                          </select>
-                        </div>
-                      </td>
-                    </tr>
-                  </table>
+                  <label class="form-title">상위부서</label>
+                  <input
+                    type="text"
+                    class="form-control sm"
+                    disabled
+                    v-model="viewDept.upDeptNm"
+                  />
                 </div>
-              </details>
-              <div class="flex justify-end pt15">
-                <div class="gd-1">
-                  <button
-                    class="large-btn blue-btn"
+                <div>
+                  <label class="form-title">부서명</label>
+                  <input
+                    type="text"
+                    class="form-control sm"
                     :disabled="isFormDisabled"
-                    @click="fnSave"
-                  >
-                    <span v-if="submitStts"> 등록 </span>
-                    <span v-else>수정</span>
-                  </button>
+                    v-model="viewDept.deptNm"
+                  />
                 </div>
-                <div class="gd-1 pr0">
-                  <button
-                    class="large-btn red-btn"
+                <div  class="grid-column">
+                  <label class="form-title">부서권한</label>
+                  <select
+                    class="form-select sm"
                     :disabled="isFormDisabled"
-                    @click="fnDel"
+                    v-model="selectedAuthrt"
                   >
-                    삭제
-                  </button>
+                    <option value="">선택</option>
+                    <option
+                      v-for="(item, idx) in authList"
+                      :key="idx"
+                      :value="item.authrtCd"
+                    >
+                      {{ item.authrtNm }}
+                    </option>
+                  </select>
+                </div>
+                <div class="grid-column">
+                  <label class="form-title">부서설명</label>
+                  <textarea
+                    class="form-control lg area"
+                    style="min-height: 3rem"
+                    :disabled="isFormDisabled"
+                    v-model="viewDept.deptExpln"
+                  ></textarea>
                 </div>
               </div>
             </div>
-            <div>
-              <details open class="form-table-style">
-                <summary class="point-font2">
-                  <p class="summary-style pl10">부서 사용자</p>
-                </summary>
-                <div class="pt10 pb10">
+            <div class="btn-wrap">
+                <button
+                  class="btn sm primary"
+                  :disabled="isFormDisabled"
+                  @click="fnSave"
+                >
+                  <span v-if="submitStts"> 등록 </span>
+                  <span v-else>수정</span>
+                </button>
+
+    
+                <button
+                  class="btn sm red"
+                  :disabled="isFormDisabled"
+                  @click="fnDel"
+                >
+                  삭제
+                </button>
+            </div>
+          </div>
+    
+          <div>
+            <div class="form-box">
+              <div class="form-box-title">
+                <p>부서 사용자</p>
+              </div>
+              <div class="form-content">
+                <div class="tbl-wrap">
                   <ListTable
-                    :className="'admin-list'"
+                    :className="'data'"
                     :colgroup="colgroup"
                     :thead="thead"
                     :tbody="tbody"
                     @listClick="clickEvent"
                   >
                     <template v-slot:checkbox="{ row, idx }">
-                      <input
+                      <div class="form-check">
+                        <input
                         type="checkbox"
                         :id="'check_' + idx"
+                        class="checkbox md"
                         :checked="selectedMbr.includes(row.loginId)"
                         @change="() => checkboxChange(row, idx)"
                       />
+                      <label for="'check_' + idx"></label>
+                      </div>
                     </template>
                   </ListTable>
                 </div>
-              </details>
-              <div class="flex justify-between pt15">
-                <div class="gd-2">
-                  <button
-                    class="large-btn red-btn"
-                    :disabled="isFormDisabled"
-                    @click="deptMbrDel"
-                    v-if="pageAuth.delAuthrt == 'Y'"
-                  >
-                    선택 사용자 삭제
-                  </button>
-                </div>
-                <div class="gd-8">
-                  <!-- <PaginationButton /> -->
-                </div>
-                <div class="gd-2 pr0">
-                  <button
-                    class="large-btn blue-btn"
-                    :disabled="isFormDisabled"
-                    @click="modalOpen"
-                    v-if="pageAuth.regAuthrt == 'Y'"
-                  >
-                    사용자 추가
-                  </button>
-                </div>
               </div>
+            </div>
+            <div class="btn-wrap">
+              <button
+                class="btn sm primary"
+                :disabled="isFormDisabled"
+                @click="modalOpen"
+                v-if="pageAuth.regAuthrt == 'Y'"
+              >
+                사용자 추가
+              </button>
+                <button
+                  class="btn sm red"
+                  :disabled="isFormDisabled"
+                  @click="deptMbrDel"
+                  v-if="pageAuth.delAuthrt == 'Y'"
+                >
+                  선택 사용자 삭제
+                </button>
             </div>
           </div>
         </div>
       </div>
     </div>
   </div>
+
+
   <Modal :showModal="userListModal">
     <template v-slot:header>
       <div class="box-title point-font2">

9600e70

4d17fd0

client/views/pages/adm/member/adminManagement/AdminManagementSelectList.vue

--- client/views/pages/adm/member/adminManagement/AdminManagementSelectList.vue

+++ client/views/pages/adm/member/adminManagement/AdminManagementSelectList.vue


     <div class="content">
       <div class="scroll">
         <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>관리자 관리</p>
           </div>
           <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/adm/member/userManagement/UserManagementSelectList.vue

--- client/views/pages/adm/member/userManagement/UserManagementSelectList.vue

+++ client/views/pages/adm/member/userManagement/UserManagementSelectList.vue


     <div class="content">
       <div class="scroll">
         <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>일반회원 관리</p>
           </div>
           <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/adm/menuManagement/menuManagement/MenuManagement.vue

--- client/views/pages/adm/menuManagement/menuManagement/MenuManagement.vue

+++ client/views/pages/adm/menuManagement/menuManagement/MenuManagement.vue


 <template>
-  <div class="content admin-style">
-    <div class="admin-page-title point-font2 mb30">
-      <p>메뉴관리</p>
-    </div>
-    <div class="full-page">
-      <div class="flex content">
-        <div class="gd-3 pl0 content">
-          <div class="tree-zone content pd10">
+  <div class="content-zone">
+    <div class="content">
+      <div class="title-zone">
+          <div class="page-title">
+            <p>메뉴관리</p>
+          </div>
+          <PagiNavigationBar />
+      </div>
+      <div class="setting-box">
+          <div class="node-zone">
             <div class="tree">
-              <div class="content overflow-y">
-                <draggable tag="ul" class="tree-node" :list="menuList" :group="{ name: 'menu' }" item-key="id"
-                  handle=".handle" ghost-class="ghost">
-                  <template #item="{ element }">
-                    <Hierachy :tasks="element" :icon="iconPath" :selectedNode="selectedMenuId"
-                      @changeSelected="fnViewDetail" />
-                  </template>
-                </draggable>
-              </div>
+              <draggable tag="ul" class="tree-node" :list="menuList" :group="{ name: 'menu' }" item-key="id"
+                handle=".handle" ghost-class="ghost">
+                <template #item="{ element, index }">
+                  <Hierachy :tasks="element" :icon="iconPath" :selectedNode="selectedMenuId"   :isLastNode="element.childList && index === element.childList.length - 1"
+                    @changeSelected="fnViewDetail" />
+                </template>
+              </draggable>
             </div>
-            <div class="btn-zone pt15" v-if="pageAuth.mdfcnAuthrt == 'Y'">
-              <div class="flex">
-                <div class="gd-6 pl0">
-                  <button class="large-btn blue-border-btn" @click="fnTopAdd">
+            <div class="btn-zone" v-if="pageAuth.mdfcnAuthrt == 'Y'">
+                  <button class="btn top sm secondary" @click="fnTopAdd">
                     TOP+
                   </button>
-                </div>
-                <div class="gd-6 pr0">
-                  <button class="large-btn blue-border-btn" @click="fnSubAdd">
+                  <button class="btn top sm secondary" @click="fnSubAdd">
                     SUB+
                   </button>
-                </div>
-              </div>
-              <div class="pt15">
-                <button class="large-btn blue-border-btn" @click="fnListUpdate">
+                <button class="btn save sm" @click="fnListUpdate">
                   메뉴 저장
                 </button>
               </div>
-            </div>
           </div>
-        </div>
-        <div class="gd-9 pr0 content overflow-y">
-          <div class="content">
-            <table class="form-table">
-              <colgroup>
-                <col width="50%" />
-                <col width="50%" />
-              </colgroup>
-              <tr>
-                <td>
-                  <div class="gd-12 pl0 pr0">
-                    <label for="" class="point-font2 mb10">상위 메뉴명 </label>
-                    <input type="text" class="full-input" v-model="viewMenu.upMenuNm" disabled />
-                  </div>
-                </td>
-                <td>
-                  <div class="gd-12 pr0">
-                    <label for="" class="form-title point-font2 mb10">
-                      메뉴명
-                    </label>
-                    <input type="text" class="full-input" ref="menuNm" v-model="viewMenu.menuNm"
-                      :disabled="!editMode" />
-                  </div>
-                </td>
-              </tr>
-              <tr>
-                <td colspan="2">
-                  <div class="gd-12 pl0 pr0">
-                    <label for="" class="point-font2 mb10">메뉴 설명</label>
-                    <textarea style="min-height: 3rem" v-model="viewMenu.menuExpln" :disabled="!editMode"></textarea>
-                  </div>
-                </td>
-              </tr>
-              <tr>
-                <td>
-                  <div class="gd-12 pl0">
-                    <label for="" class="point-font2 mb10">메뉴 타입</label>
-                    <div class="flex">
-                      <div class="gd-2 pd0">
-                        <select class="full-select" ref="menuType" v-model="viewMenu.menuType" :disabled="!editMode">
-                          <option value="">선택</option>
-                          <option v-for="(code, index) in codeList" :key="index" :value="code.cd">
-                            {{ code.cdNm }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="gd-10 pr0" v-show="viewMenu.menuType == 'bbs' ||
-                        viewMenu.menuType == 'conts'
-                        ">
-                        <select class="full-select" ref="menuTypeCtgry" v-model="viewMenu.menuTypeCtgry"
-                          :disabled="!editMode">
-                          <option value="">선택</option>
-                          <option v-for="(ctgry, index) of ctgryList" :key="index" :value="ctgry.id">
-                            {{ ctgry.name }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="gd-10 pr0" v-show="viewMenu.menuType == 'link'">
-                        <input type="text" class="full-input" ref="linkUrl" v-model="viewMenu.linkUrl"
-                          :disabled="!editMode" />
-                      </div>
-                    </div>
-                  </div>
-                </td>
-                <td>
-                  <div class="gd-12 pr0">
-                    <label for="" class="form-title point-font2 mb10">
-                      메뉴 사용자
-                    </label>
-                    <div class="flex align-center no-gutters">
-                      <div class="gd-4">
-                        <input type="radio" name="menuUser" id="menuUserAdm" class="mr5" v-model="viewMenu.menuUser"
-                          value="A" :disabled="!editMode" />
-                        <label for="menuUserAdm">관리자용</label>
-                      </div>
-                      <div class="gd-4">
-                        <input type="radio" name="menuUser" id="menuUserUser" class="mr5" v-model="viewMenu.menuUser"
-                          value="U" :disabled="!editMode" />
-                        <label for="menuUserUser">사용자용</label>
-                      </div>
-                    </div>
-                  </div>
-                </td>
-              </tr>
-              <tr>
-                <td>
-                  <div class="gd-12 pl0">
-                    <label for="" class="form-title point-font2 mb10">
-                      링크유형
-                    </label>
-                    <div class="flex align-center no-gutters">
-                      <div class="gd-4">
-                        <input type="radio" name="linkType" id="linkTypeY" class="mr5" v-model="viewMenu.linkType"
-                          value="0" :disabled="!editMode" />
-                        <label for="linkTypeY">현재창</label>
-                      </div>
-                      <div class="gd-4">
-                        <input type="radio" name="linkType" id="linkTypeN" class="mr5" v-model="viewMenu.linkType"
-                          value="1" :disabled="!editMode" />
-                        <label for="linkTypeN">새창</label>
-                      </div>
-                    </div>
-                  </div>
-                </td>
-                <td>
-                  <div class="gd-12 pr0">
-                    <label for="" class="form-title point-font2 mb10">
-                      만족도 조사 사용 여부
-                    </label>
-                    <div class="flex align-center no-gutters">
-                      <div class="gd-4">
-                        <input type="radio" name="dgstfnExmnUseYn" id="dgstfnExmnUseY" class="mr5"
-                          v-model="viewMenu.dgstfnExmnUseYn" value="Y" :disabled="!editMode" />
-                        <label for="dgstfnExmnUseY">사용</label>
-                      </div>
-                      <div class="gd-4">
-                        <input type="radio" name="dgstfnExmnUseYn" id="dgstfnExmnUseN" class="mr5"
-                          v-model="viewMenu.dgstfnExmnUseYn" value="N" :disabled="!editMode" />
-                        <label for="dgstfnExmnUseN">미사용</label>
-                      </div>
-                    </div>
-                  </div>
-                </td>
-              </tr>
-              <tr>
-                <td>
-                  <div class="gd-12 pl0">
-                    <label for="" class="form-title point-font2 mb10">
-                      메뉴 노출 여부
-                    </label>
-                    <div class="flex align-center no-gutters">
-                      <div class="gd-4">
-                        <input type="radio" name="menuExpsrYn" id="menuExpsrY" class="mr5"
-                          v-model="viewMenu.menuExpsrYn" value="Y" :disabled="!editMode" />
-                        <label for="menuExpsrY">사용</label>
-                      </div>
-                      <div class="gd-4">
-                        <input type="radio" name="menuExpsrYn" id="menuExpsrN" class="mr5"
-                          v-model="viewMenu.menuExpsrYn" value="N" :disabled="!editMode" />
-                        <label for="menuExpsrN">미사용</label>
-                      </div>
-                    </div>
-                  </div>
-                </td>
-                <td>
-                  <div class="gd-12 pr0"></div>
-                </td>
-              </tr>
-              <tr>
-                <td>
-                  <div class="gd-12 pl0">
-                    <label for="" class="point-font2 mb10">등록자</label>
-                    <input type="text" class="full-input" v-model="viewMenu.rgtrNm" disabled />
-                  </div>
-                </td>
-                <td>
-                  <div class="gd-12 pr0">
-                    <label for="" class="point-font2 mb10">등록일</label>
-                    <input type="text" class="full-input" v-model="viewMenu.regDt" disabled />
-                  </div>
-                </td>
-              </tr>
-              <tr>
-                <td>
-                  <div class="gd-12 pl0">
-                    <label for="" class="point-font2 mb10">수정자</label>
-                    <input type="text" class="full-input" v-model="viewMenu.mdfrNm" disabled />
-                  </div>
-                </td>
-                <td>
-                  <div class="gd-12 pr0">
-                    <label for="" class="point-font2 mb10">수정일</label>
-                    <input type="text" class="full-input" v-model="viewMenu.mdfcnDt" disabled />
-                  </div>
-                </td>
-              </tr>
-            </table>
-            <div class="flex justify-end pt15">
-              <div class="gd-1 pl0">
-                <button class="large-btn blue-btn" @click="fnInsert" :disabled="!editMode" v-if="
-                  selectedMenuId != null &&
-                  editMode == true &&
-                  pageAuth.mdfcnAuthrt == 'Y'
-                ">
-                  수정
-                </button>
-                <button class="large-btn blue-btn" @click="fnInsert" :disabled="!editMode"
-                  v-else-if="editMode == true && pageAuth.regAuthrt == 'Y'">
-                  등록
-                </button>
+          <div class="setting-zone">
+            <div class="form-box">
+              <div class="form-box-title">
+                <p>메뉴 정보</p>
               </div>
-              <div class="gd-1 pr0">
-                <button :class="{
-                  'large-btn': true,
-                  'gray-btn': !editMode,
-                  'red-border-btn': editMode,
-                }" :disabled="isFormDisabled" @click="fnDelete" v-if="pageAuth.delAuthrt == 'Y'">
-                  삭제
-                </button>
+              <div class="form-content">
+                <div>
+                  <label class="form-title">상위 메뉴명 </label>
+                  <input type="text" class="form-control sm" v-model="viewMenu.upMenuNm" disabled />
+                </div>
+                <div>
+                  <label class="form-title">메뉴명</label>
+                  <input type="text" class="form-control sm" ref="menuNm" v-model="viewMenu.menuNm"
+                    :disabled="!editMode" />
+                </div>
+                <div class="grid-column">
+                  <label class="form-title">메뉴 설명</label>
+                  <textarea  v-model="viewMenu.menuExpln" :disabled="!editMode" class="form-control lg area"></textarea>
+                </div>
+                <div class="grid-column">
+                  <label class="form-title">메뉴 타입</label>
+                  <div class="input-group">
+                      <select class="form-select sm" ref="menuType" v-model="viewMenu.menuType" :disabled="!editMode">
+                        <option value="">선택</option>
+                        <option v-for="(code, index) in codeList" :key="index" :value="code.cd">
+                          {{ code.cdNm }}
+                        </option>
+                      </select>
+             
+                    <template v-if="viewMenu.menuType == 'bbs' ||
+                      viewMenu.menuType == 'conts'
+                      ">
+                      <select class="form-select sm" ref="menuTypeCtgry" v-model="viewMenu.menuTypeCtgry"
+                        :disabled="!editMode">
+                        <option value="">선택</option>
+                        <option v-for="(ctgry, index) of ctgryList" :key="index" :value="ctgry.id">
+                          {{ ctgry.name }}
+                        </option>
+                      </select>
+                    </template>
+                    <template v-if="viewMenu.menuType == 'link'">
+                      <input type="text" class="form-control sm" ref="linkUrl" v-model="viewMenu.linkUrl"
+                        :disabled="!editMode"  :style="{ width: inputWidth + 'px' }"/>
+                    </template>
+                  </div>
+                </div>
+                <div>
+                  <label class="form-title">메뉴 사용자</label>
+                  <div class="check-area">
+                    <div class="form-check">
+                      <input type="radio" name="menuUser" id="menuUserAdm"  v-model="viewMenu.menuUser"
+                        value="A" :disabled="!editMode" />
+                      <label for="menuUserAdm">관리자용</label>
+                    </div>
+                    <div class="form-check">
+                      <input type="radio" name="menuUser" id="menuUserUser"  v-model="viewMenu.menuUser"
+                        value="U" :disabled="!editMode" />
+                      <label for="menuUserUser">사용자용</label>
+                    </div>
+                  </div>
+                </div>
+                <div>
+                  <label class="form-title">링크유형 </label>
+                  <div class="check-area">
+                    <div class="form-check">
+                      <input type="radio" name="linkType" id="linkTypeY"  v-model="viewMenu.linkType"
+                        value="0" :disabled="!editMode" />
+                      <label for="linkTypeY">현재창</label>
+                    </div>
+                    <div class="form-check">
+                      <input type="radio" name="linkType" id="linkTypeN"  v-model="viewMenu.linkType"
+                        value="1" :disabled="!editMode" />
+                      <label for="linkTypeN">새창</label>
+                    </div>
+                  </div>
+                </div>
+                <div class="gd-12 pr0">
+                  <label for="" class="form-title">만족도 조사 사용 여부 </label>
+                  <div class="check-area">
+                    <div class="form-check">
+                      <input type="radio" name="dgstfnExmnUseYn" id="dgstfnExmnUseY" 
+                        v-model="viewMenu.dgstfnExmnUseYn" value="Y" :disabled="!editMode" />
+                      <label for="dgstfnExmnUseY">사용</label>
+                    </div>
+                    <div class="form-check">
+                      <input type="radio" name="dgstfnExmnUseYn" id="dgstfnExmnUseN" 
+                        v-model="viewMenu.dgstfnExmnUseYn" value="N" :disabled="!editMode" />
+                      <label for="dgstfnExmnUseN">미사용</label>
+                    </div>
+                  </div>
+                </div>
+                <div>
+                  <label class="form-title">메뉴 노출 여부</label>
+                  <div class="check-area">
+                    <div class="form-check">
+                      <input type="radio" name="menuExpsrYn" id="menuExpsrY" 
+                        v-model="viewMenu.menuExpsrYn" value="Y" :disabled="!editMode" />
+                      <label for="menuExpsrY">사용</label>
+                    </div>
+                    <div class="form-check">
+                      <input type="radio" name="menuExpsrYn" id="menuExpsrN" 
+                        v-model="viewMenu.menuExpsrYn" value="N" :disabled="!editMode" />
+                      <label for="menuExpsrN">미사용</label>
+                    </div>
+                  </div>
+                </div>
+                <div>
+                  <label class="form-title">등록자</label>
+                  <input type="text" class="form-control sm" v-model="viewMenu.rgtrNm" disabled />
+                </div>
+                <div>
+                  <label class="form-title">등록일</label>
+                  <input type="text" class="form-control sm" v-model="viewMenu.regDt" disabled />
+                </div>
+                <div>
+                  <label class="form-title">수정자</label>
+                  <input type="text" class="form-control sm" v-model="viewMenu.mdfrNm" disabled />
+                </div>
+                <div>
+                  <label class="form-title">수정일</label>
+                  <input type="text" class="form-control sm" v-model="viewMenu.mdfcnDt" disabled />
+                </div>
               </div>
             </div>
           </div>
-        </div>
       </div>
     </div>
   </div>
+  <div class="btn-wrap">
+        <button class="btn sm primary" @click="fnInsert" :disabled="!editMode" v-if="
+          selectedMenuId != null &&
+          editMode == true &&
+          pageAuth.mdfcnAuthrt == 'Y'
+        ">
+          수정
+        </button>
+        <button class="btn sm primary" @click="fnInsert" :disabled="!editMode"
+          v-else-if="editMode == true && pageAuth.regAuthrt == 'Y'">
+          등록
+        </button>
+        <button :class="{
+          'btn sm red': true,
+          // 'red-border-btn': editMode,
+        }" :disabled="isFormDisabled" @click="fnDelete" v-if="pageAuth.delAuthrt == 'Y'">
+          삭제
+        </button>
+    </div>
 </template>
 
 <script>

       ctgryList: [], // 메뉴 타입 항목
       bbsList: [], // 메뉴 타입 게시판 목록
       contsTypeList: [], // 메뉴 타입 콘텐츠 목록
+      inputWidth: 0,
     };
   },
   created() {

         alert(error.res.data.message);
       }
     },
+
+    updateInputWidth() {
+      this.$nextTick(() => {
+        const containerEl = this.$el; // 부모 컨테이너 전체 너비
+        const selectEl = this.$refs.menuType; // select 요소
+        if (containerEl && selectEl) {
+          const containerWidth = containerEl.clientWidth; // 부모 요소의 전체 너비 (100%)
+          const selectWidth = selectEl.offsetWidth; // select 요소의 실제 너비
+          const gap = 10; // 선택적으로 간격 조정
+          
+          this.inputWidth = containerWidth - selectWidth - gap; // 전체에서 select 너비를 뺀 값 적용
+        }
+      });
+    },
   },
   watch: {
     "viewMenu.menuType"() {

     draggable: draggable,
     Hierachy: Hierachy,
   },
-  mounted() { },
+  mounted() {
+    this.updateInputWidth();
+    window.addEventListener("resize", this.updateInputWidth);
+  },
+  beforeUnmount() {
+    window.removeEventListener("resize", this.updateInputWidth);
+  },
 };
 </script>
 
-<style scoped>
+<!-- <style scoped>
 .tree-node {
   height: 100%;
 }

 .ghost * {
   display: none;
 }
-</style>
+</style> -->

9600e70

4d17fd0

client/views/pages/adm/preferences/commonCodeManagement/CommonCodeManagement.vue

--- client/views/pages/adm/preferences/commonCodeManagement/CommonCodeManagement.vue

+++ client/views/pages/adm/preferences/commonCodeManagement/CommonCodeManagement.vue


   <div class="content-zone">
     <div class="content">
       <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>공통코드관리</p>
           </div>
           <PagiNavigationBar />
-        </div>
+      </div>
       <div class="setting-box">
-
           <div class="node-zone">
-
               <div class="tree">
-                <div class="content overflow-y">
+                <div>
                   <draggable tag="ul" class="tree-node" :list="codeList" :group="{ name: 'menu' }" item-key="id"
                     handle=".handle" ghost-class="ghost">
                     <template #item="{ element }">

               </div>
           </div>
           <div class="setting-zone">
-            <div class="form-content">
-              <div>
-                <label for="" class="form-title">상위코드</label>
-                <input type="text" class="form-control sm" disabled v-model="viewCode.upCd" />
+            <div class="form-box">
+              <div class="form-box-title">
+                <p>공통코드정보</p>
               </div>
-              <div>
-                <label for="" class="form-title">상위코드명</label>
-                <input type="text" class="form-control sm" disabled v-model="viewCode.upCdNm" />
-              </div>
-              <div>
-                <label for="" class="form-title">코드</label>
-                <input type="text" class="form-control sm" :disabled="isFormDisabled || !submitStts"
-                  v-model="viewCode.cd" />
-              </div>
-              <div>
-                <label for="" class="form-title">코드명</label>
-                <input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdNm" />
-              </div>
-              <div>
-                <label for="" class="form-title">코드값</label>
-                <input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdVl" />
-              </div>
-              <div>
-                <label for="" class="form-title">사용여부</label>
-                <div class="check-area">
-                  <div class="form-check">
-                    <input type="radio" name="code" id="y"  value="Y" :disabled="isFormDisabled"
-                      v-model="viewCode.useYn" />
-                    <label for="y">사용</label>
-                  </div>
-                  <div class="form-check">
-                    <input type="radio" name="code" id="n"  value="N" :disabled="isFormDisabled"
-                      v-model="viewCode.useYn" />
-                    <label for="n">미사용</label>
+              <div class="form-content">
+                <div>
+                  <label for="" class="form-title">상위코드</label>
+                  <input type="text" class="form-control sm" disabled v-model="viewCode.upCd" />
+                </div>
+                <div>
+                  <label for="" class="form-title">상위코드명</label>
+                  <input type="text" class="form-control sm" disabled v-model="viewCode.upCdNm" />
+                </div>
+                <div>
+                  <label for="" class="form-title">코드</label>
+                  <input type="text" class="form-control sm" :disabled="isFormDisabled || !submitStts"
+                    v-model="viewCode.cd" />
+                </div>
+                <div>
+                  <label for="" class="form-title">코드명</label>
+                  <input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdNm" />
+                </div>
+                <div>
+                  <label for="" class="form-title">코드값</label>
+                  <input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdVl" />
+                </div>
+                <div>
+                  <label for="" class="form-title">사용여부</label>
+                  <div class="check-area">
+                    <div class="form-check">
+                      <input type="radio" name="code" id="y"  value="Y" :disabled="isFormDisabled"
+                        v-model="viewCode.useYn" />
+                      <label for="y">사용</label>
+                    </div>
+                    <div class="form-check">
+                      <input type="radio" name="code" id="n"  value="N" :disabled="isFormDisabled"
+                        v-model="viewCode.useYn" />
+                      <label for="n">미사용</label>
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div>
-                <label for="textarea" class="form-title">코드설명</label>
-                <textarea class="form-control" id="textarea" :disabled="isFormDisabled" v-model="viewCode.cdExpln"></textarea>
+                <div>
+                  <label for="textarea" class="form-title">코드설명</label>
+                  <textarea class="form-control" id="textarea" :disabled="isFormDisabled" v-model="viewCode.cdExpln"></textarea>
+                </div>
               </div>
             </div>
           </div>

9600e70

4d17fd0

client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementInsert.vue

--- client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementInsert.vue

+++ client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementInsert.vue


     <div class="content">
       <div class="scroll">
         <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>콘텐츠 유형 관리</p>
           </div>
           <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementSelectList.vue

--- client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementSelectList.vue

+++ client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementSelectList.vue


     <div class="content">
       <div class="scroll">
         <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>콘텐츠 유형 관리</p>
           </div>
           <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementSelectListOne.vue

--- client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementSelectListOne.vue

+++ client/views/pages/adm/preferences/contentTypeManagement/ContentTypeManagementSelectListOne.vue


     <div class="content">
       <div class="scroll">
         <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>콘텐츠 유형 관리</p>
           </div>
           <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/adm/system/LoginPolicy/LoginPolicy.vue

--- client/views/pages/adm/system/LoginPolicy/LoginPolicy.vue

+++ client/views/pages/adm/system/LoginPolicy/LoginPolicy.vue


 <template>
-  <div class="content admin-style">
-    <div class="admin-page-title  point-font2 mb30">
-          <p>로그인 정책 설정</p>
-      </div>
-      <details open class="form-table-style mb30">
-          <summary class="point-font2">
-              <p class="summary-style pl10">로그인 정책</p>
-          </summary>
-          <div class="pt10 pb10">
-              <table class="form-table">
-                  <colgroup>
-                      <col width="50%" />
-                      <col width="50%" />
-                  </colgroup>
-                  <tr>
-                      <td>
-                          <div class="gd-12 pl0">
-                              <label for="" class="form-title point-font2 mb10">중복로그인 설정</label>
-                              <label>
-                                <input type="checkbox" v-model="allowMultipleLogin" @change="saveByLoginPolicy" />
-                              </label>
-                              <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>
-                              <p style="color: red;"> ※ 로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.</p>
-                          </div>
-                      </td>
-                      <td>
-                          <div class="gd-12 pl0"> 
-                              <label for="" class="form-title point-font2 ">로그인 방식 설정</label>
-                                <div class="gd-4">
-                                  <input type="radio" class="mr5" value="J" v-model="lgnMode" @change="saveByLoginMode" /> 
-                                  <label>JWT 방식</label>
-                                </div>
-                                <div class="gd-4">
-                                <input type="radio" class="mr5" value="S" v-model="lgnMode" @change="saveByLoginMode" /> 
-                                <label>SESSION 방식</label>
-                              </div>
-                                <span class="ml10 gray">
-                                  현재 로그인 방식은 <strong>{{ loginModeLabel  }}</strong> 입니다.
-                                </span>
-                              
-                          </div>
-                      </td>
-                  </tr>
-              </table>
+  <div class="content-zone">
+    <div class="content">
+      <div class="scroll">
+        <div class="title-zone">
+          <div class="page-title">
+            <p>로그인 정책 설정</p>
           </div>
-      </details>
+            <PagiNavigationBar />
+        </div>
+        <div open class="form-box">
+            <div class="form-box-title">
+                <p class="summary-style pl10">기본 정보</p>
+            </div>
+            <div class="form-content">
+              <div class="gd-12 pl0">
+                  <label class="form-title">중복로그인 설정</label>
+                  <div class="form-group">
+                    <div>
+                      <input type="checkbox" v-model="allowMultipleLogin" @change="saveByLoginPolicy" />
+                      <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>
+                    </div>
+                    <span style="color: red;"> ※ 로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.</span>
+                  </div>
+              </div>
+              <div>
+                    <label class="form-title">중복로그인 설정</label>
+                    <div class="form-group">
+                      <div>
+                        <input type="checkbox" v-model="allowMultipleLogin" @change="saveByLoginPolicy" />
+                        <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>
+                      </div>
+                      <span style="color: red;"> ※ 로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.</span>
+                    </div>
+                </div>
+                <div>
+                    <label class="form-title">중복로그인 설정</label>
+                    <div class="form-group">
+                      <div>
+                        <input type="checkbox" v-model="allowMultipleLogin" @change="saveByLoginPolicy" />
+                        <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>
+                      </div>
+                      <span style="color: red;"> ※ 로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.</span>
+                    </div>
+                </div>
+                <div> 
+                    <label class="form-title">로그인 방식 설정</label>
+                      <div class="form-group">
+                        <div class="check-area">
+                          <div class="form-check">
+                            <input type="radio" class="mr5" value="J" v-model="lgnMode" @change="saveByLoginMode" /> 
+                            <label>JWT 방식</label>
+                          </div>
+                          <div class="form-check">
+                            <input type="radio" class="mr5" value="S" v-model="lgnMode" @change="saveByLoginMode" /> 
+                            <label>SESSION 방식</label>
+                          </div>
+                        </div>
+                        <span class="ml10 gray">
+                          현재 로그인 방식은 <strong>{{ loginModeLabel  }}</strong> 입니다.
+                        </span>
+                      </div>
+                </div>
+            </div>
+        </div>
+      </div>
     </div>
+  </div>
 </template>
   
   <script>

9600e70

4d17fd0

client/views/pages/adm/system/networkAccessControl/NetworkAccessControlInsert.vue

--- client/views/pages/adm/system/networkAccessControl/NetworkAccessControlInsert.vue

+++ client/views/pages/adm/system/networkAccessControl/NetworkAccessControlInsert.vue


         <div class="content">
             <div class="scroll">
                 <div class="title-zone">
-                    <div class="section-title">
+                    <div class="page-title">
                         <p>IP접근제어</p>
                     </div>
                     <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/adm/system/networkAccessControl/NetworkAccessControlSelectList.vue

--- client/views/pages/adm/system/networkAccessControl/NetworkAccessControlSelectList.vue

+++ client/views/pages/adm/system/networkAccessControl/NetworkAccessControlSelectList.vue


     <div class="content">
       <div class="scroll">
         <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>IP접근제어</p>
           </div>
           <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/adm/system/networkAccessControl/NetworkAccessControlSelectListOne.vue

--- client/views/pages/adm/system/networkAccessControl/NetworkAccessControlSelectListOne.vue

+++ client/views/pages/adm/system/networkAccessControl/NetworkAccessControlSelectListOne.vue


     <div class="content">
       <div class="scroll">
         <div class="title-zone">
-          <div class="section-title">
+          <div class="page-title">
             <p>IP접근제어</p>
           </div>
           <PagiNavigationBar />

9600e70

4d17fd0

client/views/pages/login/Login.vue

--- client/views/pages/login/Login.vue

+++ client/views/pages/login/Login.vue


                   class="form-control md"
                   placeholder="비밀번호를 입력하세요"
                   v-model="member['pswd']"
-                  @keyup.enter="fnLogin"
+                  @keydown.enter="fnLogin"
                 />
               </div>
               <button
                 class="btn md primary user-btn"
                 v-if="!isAdminPage"
                 @click="fnLogin"
+                   @keydown.enter="fnLogin"
               >
                 로그인
               </button>

                 class="btn md primary"
                 v-else
                 @click="fnLogin"
+                @keydown.enter="fnLogin"
               >
                 로그인
               </button>

Add a comment

Open 0
Closed 0

List

...	...	@@ -37,13 +37,14 @@
37	37	class="form-control md"
38	38	placeholder="비밀번호를 입력하세요"
39	39	v-model="member['pswd']"
40		- @keyup.enter="fnLogin"
	40	+ @keydown.enter="fnLogin"
41	41	/>
42	42	</div>
43	43	<button
44	44	class="btn md primary user-btn"
45	45	v-if="!isAdminPage"
46	46	@click="fnLogin"
	47	+ @keydown.enter="fnLogin"
47	48	>
48	49	로그인
49	50	</button>
...	...	@@ -51,6 +52,7 @@
51	52	class="btn md primary"
52	53	v-else
53	54	@click="fnLogin"
	55	+ @keydown.enter="fnLogin"
54	56	>
55	57	로그인
56	58	</button>

...	...	@@ -3,136 +3,6 @@
3	3	height: 100%;
4	4	padding: 3rem;
5	5
6		-
7		-
8		- .box-title,
9		- .section-title {
10		- font-size: var(--tk-fz-title-md);
11		- font-weight: 700;
12		- margin-bottom: 1rem;
13		- }
14		-
15		-
16		- .search-bar {
17		- @include flex-layout(flex, center, end);
18		- margin-bottom: 1rem;
19		-
20		- .form-select {
21		- width: 120px;
22		- }
23		-
24		- .form-control {
25		- width: 300px;
26		- margin-left: 1rem;
27		- }
28		-
29		- .btn {
30		- margin-left: 1rem;
31		- }
32		- }
33		-
34		- .btn-wrap {
35		- @include flex-layout(flex, center, end);
36		- padding: 3rem 0;
37		-
38		- button {
39		- margin-left: 1rem
40		- }
41		- }
42		-
43		- .btn-wrap.list {
44		- @include flex-layout(flex, center, space-between);
45		- padding: 3rem 0;
46		- }
47		-
48		- .form-content {
49		- padding: 3rem;
50		- display: grid;
51		- grid-template-columns: 1fr 1fr;
52		- // grid-template-rows: 1fr 1fr;
53		-
54		- >div {
55		- @include flex-layout(flex, center, start);
56		- width: 100%;
57		- padding: 1rem;
58		- border-bottom: 1px solid var(--tk-gray-10);
59		-
60		- .form-title {
61		- width: 180px;
62		- font-weight: 700;
63		-
64		- span {
65		- color: var(--tk-point-40);
66		- margin-right: .5rem;
67		- }
68		- }
69		-
70		-
71		- .form-select {
72		- width: 200px;
73		- }
74		-
75		- .form-control {
76		- max-width: calc(100% - 180px);
77		- }
78		-
79		- .form-group {
80		- width: calc(100% - 180px);
81		-
82		- .form-control {
83		- max-width: 100%;
84		- }
85		-
86		- span {
87		- font-size: var(--tk-fz-detail-sm);
88		- }
89		- }
90		- }
91		-
92		- >div:nth-child(1),
93		- div:nth-child(2) {
94		- padding-top: 0;
95		- }
96		-
97		- >div:last-child {
98		- grid-column: 1/3;
99		- padding-bottom: 0;
100		- border-bottom: 0;
101		- }
102		-
103		- // 자식 div 개수가 짝수일 때 마지막 div의 스타일을 변경
104		- &:has(> div:nth-child(even):last-child) {
105		- >div {
106		- padding-left: 3rem;
107		- }
108		-
109		- >div:last-child {
110		- grid-column: unset;
111		- }
112		-
113		- >div:nth-last-child(2) {
114		- border-bottom: 0;
115		- }
116		- }
117		-
118		- .check-area {
119		- @include flex-layout(flex, center);
120		- gap: 3rem;
121		- }
122		-
123		-
124		- }
125		-
126		-
127		- .title-zone {
128		- @include flex-layout(flex, center, space-between);
129		- margin-bottom: 3rem;
130		-
131		- .section-title {
132		- margin-bottom: 0;
133		- }
134		- }
135		-
136	6	>.content-zone {
137	7	height: calc(100% - 70px);
138	8	background-color: var(--tk-white);
...	...	@@ -146,147 +16,13 @@
146	16	height: 100%;
147	17	overflow-y: auto;
148	18
149		- .top-zone {
150		- >div {
151		- margin-bottom: 5rem;
152	19
153		- .tbl {
154		- .table-title {
155		- @include ellipsis(1);
156		- }
157		-
158		- }
159		- }
160		-
161		- }
162		-
163		- .middle-zone {
164		- @include flex-layout(flex, flex-start, space-between);
165		- gap: 3rem;
166		- margin-bottom: 5rem;
167		-
168		- .first-box,
169		- .two-box,
170		- .three-box {
171		- flex: 0 0 calc(33.333% - 2rem);
172		- max-width: calc(33.333% - 2rem);
173		- padding: 2rem;
174		- border-radius: var(--tk-rd-12);
175		- text-align: center;
176		- border: 1px solid var(--tk-gray-10);
177		-
178		-
179		- }
180		- }
181		-
182		- .chart-wrap {
183		- padding: 3rem;
184		- border: 1px solid var(--tk-gray-10);
185		- @include radius(30);
186		- }
187		-
188		- .form-box {
189		- border: 1px solid var(--tk-gray-10);
190		- @include radius(30);
191		-
192		- .form-box-title {
193		- padding: 1rem 3rem;
194		- background-color: #fbfbfb;
195		- @include flex-layout(flex, center, start);
196		- font-size: var(--tk-fz-title-sm);
197		- border-radius: 3rem 3rem 0 0;
198		-
199		- >p {
200		- margin-right: 1rem;
201		- font-weight: 700;
202		- }
203		-
204		- >p:nth-of-type(2) {
205		- font-size: var(--tk-fz-detail-sm);
206		- background-color: var(--tk-point-5);
207		- border: 1px solid var(--tk-point-40);
208		- padding: .2rem 1rem;
209		- // border-radius: var(--tk-rd-12);
210		- @include radius(30);
211		- font-weight: 400;
212		-
213		- span {
214		- color: var(--tk-point-40);
215		- margin-right: .5rem;
216		- }
217		- }
218		- }
219		-
220		-
221		- }
222	20	}
223	21
224		- .setting-box {
225		- @include flex-layout(flex, start, start);
226		- width: 100%;
227		- height: calc(100% - 38.5px);
	22	+ }
228	23
229		- .node-zone {
230		- width: 325px;
231		- height: 100%;
232		- margin-right: 5rem;
233		- background-color: #fbfbfb;
234		- border-radius: var(--tk-rd-12);
235		-
236		- .tree {
237		- padding: 3rem;
238		- width: 100%;
239		- height: calc(100% - 149px);
240		- overflow-y: auto;
241		-
242		-
243		- }
244		- }
245		-
246		- .setting-zone {
247		- width: calc(100% - 325px - 5rem);
248		- height: 100%;
249		-
250		- .form-content {
251		- padding: 0;
252		-
253		- >div {
254		- padding: 1rem;
255		- }
256		-
257		- >div:nth-child(2),
258		- div:nth-child(4),
259		- div:nth-child(6) {
260		- padding-left: 3rem;
261		- }
262		-
263		- >div:last-child {
264		- align-items: flex-start;
265		- }
266		-
267		- }
268		- }
269		-
270		- .btn-zone {
271		- padding: 3rem;
272		-
273		- button {
274		- min-width: 126px;
275		- margin-left: 1rem;
276		- margin-bottom: 1rem;
277		- }
278		-
279		- button:nth-child(1) {
280		- margin-left: 0;
281		- }
282		-
283		- button:last-child {
284		- min-width: 100%;
285		- margin-left: 0;
286		- margin-bottom: 0;
287		- }
288		- }
289		- }
	24	+ &.full-page {
	25	+ height: 100%;
290	26	}
291	27
292	28	}
...	...	@@ -298,4 +34,302 @@
298	34	.content-zone {
299	35	height: 100%;
300	36	}
	37	+}
	38	+
	39	+.page-title {
	40	+ font-size: var(--tk-fz-title-xlg);
	41	+ font-weight: 700;
	42	+}
	43	+
	44	+.box-title,
	45	+.section-title {
	46	+ font-size: var(--tk-fz-title-md);
	47	+ font-weight: 700;
	48	+ margin-bottom: 1rem;
	49	+}
	50	+
	51	+
	52	+
	53	+.search-bar {
	54	+ @include flex-layout(flex, center, end);
	55	+ margin-bottom: 1rem;
	56	+
	57	+ .form-select {
	58	+ width: 120px;
	59	+ }
	60	+
	61	+ .form-control {
	62	+ width: 300px;
	63	+ margin-left: 1rem;
	64	+ }
	65	+
	66	+ .btn {
	67	+ margin-left: 1rem;
	68	+ }
	69	+}
	70	+
	71	+.btn-wrap {
	72	+ @include flex-layout(flex, center, end);
	73	+ padding: 3rem 0;
	74	+
	75	+ button {
	76	+ margin-left: 1rem
	77	+ }
	78	+
	79	+ &.list {
	80	+ @include flex-layout(flex, center, space-between);
	81	+ padding: 3rem 0;
	82	+ }
	83	+}
	84	+
	85	+
	86	+.form-content {
	87	+ padding: 2rem;
	88	+ display: grid;
	89	+ grid-template-columns: 1fr 1fr;
	90	+ // grid-template-rows: 1fr 1fr;
	91	+
	92	+ >div {
	93	+ @include flex-layout(flex, center, start);
	94	+ width: 100%;
	95	+ padding: 1rem;
	96	+ border-bottom: 1px solid var(--tk-gray-10);
	97	+
	98	+ &:last-child {
	99	+ align-items: flex-start;
	100	+ }
	101	+
	102	+ .form-title {
	103	+ width: 180px;
	104	+ font-weight: 700;
	105	+
	106	+ span {
	107	+ color: var(--tk-point-40);
	108	+ margin-right: .5rem;
	109	+ }
	110	+ }
	111	+
	112	+
	113	+ .form-select {
	114	+ width: 200px;
	115	+ }
	116	+
	117	+ .form-control {
	118	+ max-width: calc(100% - 180px);
	119	+ }
	120	+
	121	+ .form-group {
	122	+ width: calc(100% - 180px);
	123	+
	124	+ .form-control {
	125	+ max-width: 100%;
	126	+ }
	127	+
	128	+ span {
	129	+ font-size: var(--tk-fz-detail-sm);
	130	+ }
	131	+ }
	132	+
	133	+ .input-group{
	134	+ max-width: calc(100% - 180px);
	135	+ }
	136	+
	137	+ &.grid-column {
	138	+ grid-column: 1/3;
	139	+ }
	140	+
	141	+ &:nth-child(1),:nth-child(2){
	142	+ padding-top: 0;
	143	+ }
	144	+
	145	+ &:last-child{
	146	+ grid-column: 1/3;
	147	+ padding-bottom: 0;
	148	+ border-bottom: 0;
	149	+ }
	150	+ }
	151	+
	152	+
	153	+ // 자식 div 개수가 짝수일 때 마지막 div의 스타일을 변경
	154	+ &:has(> div:nth-child(even)) {
	155	+
	156	+ >div{
	157	+
	158	+ &:nth-last-child(-n + 2){
	159	+ border-bottom: 0;
	160	+ }
	161	+
	162	+ &:last-child {
	163	+ grid-column: unset;
	164	+
	165	+ &.grid-column {
	166	+ grid-column: 1/3;
	167	+ }
	168	+ }
	169	+ }
	170	+
	171	+ }
	172	+
	173	+ .check-area {
	174	+ @include flex-layout(flex, center);
	175	+ gap: 3rem;
	176	+ }
	177	+
	178	+
	179	+}
	180	+
	181	+
	182	+.title-zone {
	183	+ @include flex-layout(flex, center, space-between);
	184	+ margin-bottom: 3rem;
	185	+
	186	+ .section-title {
	187	+ margin-bottom: 0;
	188	+ }
	189	+}
	190	+
	191	+
	192	+.form-box {
	193	+ border: 1px solid var(--tk-gray-10);
	194	+ @include radius(30);
	195	+
	196	+ .form-box-title {
	197	+ padding: 1rem 3rem;
	198	+ background-color: #fbfbfb;
	199	+ @include flex-layout(flex, center, start);
	200	+ font-size: var(--tk-fz-title-sm);
	201	+ border-radius: 3rem 3rem 0 0;
	202	+
	203	+ >p {
	204	+ margin-right: 1rem;
	205	+ font-weight: 700;
	206	+ }
	207	+
	208	+ >p:nth-of-type(2) {
	209	+ font-size: var(--tk-fz-detail-sm);
	210	+ background-color: var(--tk-point-5);
	211	+ border: 1px solid var(--tk-point-40);
	212	+ padding: .2rem 1rem;
	213	+ // border-radius: var(--tk-rd-12);
	214	+ @include radius(30);
	215	+ font-weight: 400;
	216	+
	217	+ span {
	218	+ color: var(--tk-point-40);
	219	+ margin-right: .5rem;
	220	+ }
	221	+ }
	222	+ }
	223	+
	224	+
	225	+}
	226	+
	227	+.setting-box {
	228	+ @include flex-layout(flex, start, start);
	229	+ width: 100%;
	230	+ height: calc(100% - 58.5px);
	231	+
	232	+ .node-zone {
	233	+ width: 325px;
	234	+ height: 100%;
	235	+ margin-right: 5rem;
	236	+ background-color: #fbfbfb;
	237	+ border-radius: var(--tk-rd-12);
	238	+
	239	+ .tree {
	240	+ padding: 3rem;
	241	+ width: 100%;
	242	+ height: calc(100% - 149px);
	243	+ overflow-y: auto;
	244	+
	245	+
	246	+ }
	247	+ }
	248	+
	249	+ .setting-zone {
	250	+ width: calc(100% - 325px - 5rem);
	251	+ height: 100%;
	252	+
	253	+ // .form-content {
	254	+ // // padding: 0;
	255	+
	256	+ // >div {
	257	+ // padding: 1rem;
	258	+ //
	259	+ // }
	260	+ // }
	261	+ .btn-wrap {
	262	+ // justify-content: flex-end;
	263	+ padding: 1rem 0;
	264	+ }
	265	+ }
	266	+
	267	+ .btn-zone {
	268	+ padding: 3rem;
	269	+
	270	+ button {
	271	+ min-width: 126px;
	272	+ margin-left: 1rem;
	273	+ margin-bottom: 1rem;
	274	+ }
	275	+
	276	+ button:nth-child(1) {
	277	+ margin-left: 0;
	278	+ }
	279	+
	280	+ button:last-child {
	281	+ min-width: 100%;
	282	+ margin-left: 0;
	283	+ margin-bottom: 0;
	284	+ }
	285	+ }
	286	+}
	287	+
	288	+.top-zone {
	289	+ >div {
	290	+ margin-bottom: 5rem;
	291	+
	292	+ .tbl {
	293	+ .table-title {
	294	+ @include ellipsis(1);
	295	+ }
	296	+
	297	+ }
	298	+ }
	299	+
	300	+}
	301	+
	302	+.middle-zone {
	303	+ @include flex-layout(flex, flex-start, space-between);
	304	+ gap: 3rem;
	305	+ margin-bottom: 5rem;
	306	+
	307	+ .first-box,
	308	+ .two-box,
	309	+ .three-box {
	310	+ flex: 0 0 calc(33.333% - 2rem);
	311	+ max-width: calc(33.333% - 2rem);
	312	+ padding: 2rem;
	313	+ border-radius: var(--tk-rd-12);
	314	+ text-align: center;
	315	+ border: 1px solid var(--tk-gray-10);
	316	+
	317	+
	318	+ }
	319	+}
	320	+
	321	+.chart-wrap {
	322	+ padding: 3rem;
	323	+ border: 1px solid var(--tk-gray-10);
	324	+ @include radius(30);
	325	+}
	326	+
	327	+
	328	+.area{
	329	+ font-size: var(--tk-input-fz-sm);
	330	+}
	331	+
	332	+.form-check{
	333	+ display: flex;
	334	+ align-items: center;
301	335	} (파일 끝에 줄바꿈 문자 없음)

...	...	@@ -28,13 +28,11 @@
28	28	>div.node-wrap.selected{
29	29	border: 1px solid var(--tk-primary);
30	30	border-radius: var(--tk-rd-12);
31		- margin-bottom: 1rem;
	31	+
32	32	}
33	33
34	34	.child-node {
35		- padding: 1rem;
36		- padding-left: 2rem;
37		- background-color: var(--tk-white);
	35	+ padding-left: 1.5rem;
38	36	border-radius: var(--tk-rd-12);
39	37	margin-bottom: 1rem;
40	38

...	...	@@ -3,7 +3,7 @@
3	3	<div class="content">
4	4	<div class="scroll">
5	5	<div class="title-zone">
6		- <div class="section-title">
	6	+ <div class="page-title">
7	7	<p>{{pageTit}}</p>
8	8	</div>
9	9	<PagiNavigationBar />

...	...	@@ -1,222 +1,173 @@
1	1	<template>
2		- <div class="content admin-style">
3		- <div class="admin-page-title point-font2 mb30">
4		- <p>부서관리</p>
5		- </div>
6		- <div class="full-page">
7		- <div class="flex content">
8		- <div class="gd-2 pl0 conten">
9		- <div class="tree-zone content pd15">
10		- <div class="tree">
11		- <div class="content overflow-y">
12		- <draggable
13		- tag="ul"
14		- class="tree-node"
15		- :list="deptList"
16		- :group="{ name: 'menu' }"
17		- item-key="id"
18		- handle=".handle"
19		- ghost-class="ghost"
20		- >
21		- <template #item="{ element }">
22		- <Hierachy
23		- :tasks="element"
24		- :icon="iconPath"
25		- :selectedNode="selectedDeptId"
26		- @changeSelected="fnViewDetail"
27		- />
28		- </template>
29		- </draggable>
30		- </div>
31		- </div>
32		- <div class="btn-zone pt15">
33		- <template v-if="pageAuth.mdfcnAuthrt == 'Y'">
34		- <div class="flex">
35		- <div class="gd-6 pl0">
36		- <button class="large-btn blue-border-btn" @click="topAdd">
37		- TOP+
38		- </button>
39		- </div>
40		- <div class="gd-6 pr0">
41		- <button class="large-btn blue-border-btn" @click="subAdd">
42		- SUB+
43		- </button>
44		- </div>
45		- </div>
46		- <div class="pt15">
47		- <button
48		- class="large-btn blue-border-btn"
49		- @click="fnListUpdate"
50		- >
51		- 메뉴 저장
52		- </button>
53		- </div>
54		- </template>
	2	+ <div class="content-zone full-page">
	3	+ <div class="content">
	4	+ <div class="title-zone">
	5	+ <div class="page-title">
	6	+ <p>부서관리</p>
	7	+ </div>
	8	+ <PagiNavigationBar />
	9	+ </div>
	10	+ <div class="setting-box">
	11	+ <div class="node-zone">
	12	+ <div class="tree">
	13	+ <div>
	14	+ <draggable
	15	+ tag="ul"
	16	+ class="tree-node"
	17	+ :list="deptList"
	18	+ :group="{ name: 'menu' }"
	19	+ item-key="id"
	20	+ handle=".handle"
	21	+ ghost-class="ghost"
	22	+ >
	23	+ <template #item="{ element }">
	24	+ <Hierachy
	25	+ :tasks="element"
	26	+ :icon="iconPath"
	27	+ :selectedNode="selectedDeptId"
	28	+ @changeSelected="fnViewDetail"
	29	+ />
	30	+ </template>
	31	+ </draggable>
55	32	</div>
56	33	</div>
	34	+ <div class="btn-zone">
	35	+ <template v-if="pageAuth.mdfcnAuthrt == 'Y'">
	36	+ <button class="btn top sm secondary" @click="topAdd">TOP+</button>
	37	+ <button class="btn top sm secondary" @click="subAdd">SUB+</button>
	38	+ <button class="btn save sm" @click="fnListUpdate">메뉴 저장</button>
	39	+ </template>
	40	+ </div>
57	41	</div>
58		- <div class="gd-10 pr0 content overflow-y">
59		- <div class="content">
60		- <div class="mb30">
61		- <details open class="form-table-style">
62		- <summary class="point-font2">
63		- <p class="summary-style pl10">부서정보</p>
64		- </summary>
	42	+ <div class="setting-zone">
	43	+ <div>
	44	+ <div class="form-box">
	45	+ <div class="form-box-title">
	46	+ <p>부서 정보</p>
	47	+ </div>
	48	+ <div class="form-content">
65	49	<div>
66		- <table class="form-table">
67		- <colgroup>
68		- <col width="50%" />
69		- <col width="50%" />
70		- </colgroup>
71		- <tr>
72		- <td>
73		- <div class="gd-12 pl0">
74		- <label for="" class="form-title point-font2 mb10"
75		- >상위부서</label
76		- >
77		- <input
78		- type="text"
79		- class="full-input"
80		- disabled
81		- v-model="viewDept.upDeptNm"
82		- />
83		- </div>
84		- </td>
85		- <td>
86		- <div class="gd-12 pr0">
87		- <label for="" class="form-title point-font2 mb10"
88		- >부서명</label
89		- >
90		- <input
91		- type="text"
92		- class="full-input"
93		- :disabled="isFormDisabled"
94		- v-model="viewDept.deptNm"
95		- />
96		- </div>
97		- </td>
98		- </tr>
99		- <tr>
100		- <td colspan="2">
101		- <div class="gd-12 pl0">
102		- <label for="" class="point-font2 mb10"
103		- >부서설명</label
104		- >
105		- <textarea
106		- name=""
107		- id=""
108		- style="min-height: 3rem"
109		- :disabled="isFormDisabled"
110		- v-model="viewDept.deptExpln"
111		- ></textarea>
112		- </div>
113		- </td>
114		- </tr>
115		- <tr>
116		- <td>
117		- <div class="gd-12 pl0">
118		- <label for="" class="form-title point-font2 mb10"
119		- >부서권한</label
120		- >
121		- <select
122		- name=""
123		- id=""
124		- class="full-select"
125		- :disabled="isFormDisabled"
126		- v-model="selectedAuthrt"
127		- >
128		- <option value="">선택</option>
129		- <option
130		- v-for="(item, idx) in authList"
131		- :key="idx"
132		- :value="item.authrtCd"
133		- >
134		- {{ item.authrtNm }}
135		- </option>
136		- </select>
137		- </div>
138		- </td>
139		- </tr>
140		- </table>
	50	+ <label class="form-title">상위부서</label>
	51	+ <input
	52	+ type="text"
	53	+ class="form-control sm"
	54	+ disabled
	55	+ v-model="viewDept.upDeptNm"
	56	+ />
141	57	</div>
142		- </details>
143		- <div class="flex justify-end pt15">
144		- <div class="gd-1">
145		- <button
146		- class="large-btn blue-btn"
	58	+ <div>
	59	+ <label class="form-title">부서명</label>
	60	+ <input
	61	+ type="text"
	62	+ class="form-control sm"
147	63	:disabled="isFormDisabled"
148		- @click="fnSave"
149		- >
150		- <span v-if="submitStts"> 등록 </span>
151		- <span v-else>수정</span>
152		- </button>
	64	+ v-model="viewDept.deptNm"
	65	+ />
153	66	</div>
154		- <div class="gd-1 pr0">
155		- <button
156		- class="large-btn red-btn"
	67	+ <div class="grid-column">
	68	+ <label class="form-title">부서권한</label>
	69	+ <select
	70	+ class="form-select sm"
157	71	:disabled="isFormDisabled"
158		- @click="fnDel"
	72	+ v-model="selectedAuthrt"
159	73	>
160		- 삭제
161		- </button>
	74	+ <option value="">선택</option>
	75	+ <option
	76	+ v-for="(item, idx) in authList"
	77	+ :key="idx"
	78	+ :value="item.authrtCd"
	79	+ >
	80	+ {{ item.authrtNm }}
	81	+ </option>
	82	+ </select>
	83	+ </div>
	84	+ <div class="grid-column">
	85	+ <label class="form-title">부서설명</label>
	86	+ <textarea
	87	+ class="form-control lg area"
	88	+ style="min-height: 3rem"
	89	+ :disabled="isFormDisabled"
	90	+ v-model="viewDept.deptExpln"
	91	+ ></textarea>
162	92	</div>
163	93	</div>
164	94	</div>
165		- <div>
166		- <details open class="form-table-style">
167		- <summary class="point-font2">
168		- <p class="summary-style pl10">부서 사용자</p>
169		- </summary>
170		- <div class="pt10 pb10">
	95	+ <div class="btn-wrap">
	96	+ <button
	97	+ class="btn sm primary"
	98	+ :disabled="isFormDisabled"
	99	+ @click="fnSave"
	100	+ >
	101	+ <span v-if="submitStts"> 등록 </span>
	102	+ <span v-else>수정</span>
	103	+ </button>
	104	+
	105	+
	106	+ <button
	107	+ class="btn sm red"
	108	+ :disabled="isFormDisabled"
	109	+ @click="fnDel"
	110	+ >
	111	+ 삭제
	112	+ </button>
	113	+ </div>
	114	+ </div>
	115	+
	116	+ <div>
	117	+ <div class="form-box">
	118	+ <div class="form-box-title">
	119	+ <p>부서 사용자</p>
	120	+ </div>
	121	+ <div class="form-content">
	122	+ <div class="tbl-wrap">
171	123	<ListTable
172		- :className="'admin-list'"
	124	+ :className="'data'"
173	125	:colgroup="colgroup"
174	126	:thead="thead"
175	127	:tbody="tbody"
176	128	@listClick="clickEvent"
177	129	>
178	130	<template v-slot:checkbox="{ row, idx }">
179		- <input
	131	+ <div class="form-check">
	132	+ <input
180	133	type="checkbox"
181	134	:id="'check_' + idx"
	135	+ class="checkbox md"
182	136	:checked="selectedMbr.includes(row.loginId)"
183	137	@change="() => checkboxChange(row, idx)"
184	138	/>
	139	+ <label for="'check_' + idx"></label>
	140	+ </div>
185	141	</template>
186	142	</ListTable>
187	143	</div>
188		- </details>
189		- <div class="flex justify-between pt15">
190		- <div class="gd-2">
191		- <button
192		- class="large-btn red-btn"
193		- :disabled="isFormDisabled"
194		- @click="deptMbrDel"
195		- v-if="pageAuth.delAuthrt == 'Y'"
196		- >
197		- 선택 사용자 삭제
198		- </button>
199		- </div>
200		- <div class="gd-8">
201		- <!-- <PaginationButton /> -->
202		- </div>
203		- <div class="gd-2 pr0">
204		- <button
205		- class="large-btn blue-btn"
206		- :disabled="isFormDisabled"
207		- @click="modalOpen"
208		- v-if="pageAuth.regAuthrt == 'Y'"
209		- >
210		- 사용자 추가
211		- </button>
212		- </div>
213	144	</div>
	145	+ </div>
	146	+ <div class="btn-wrap">
	147	+ <button
	148	+ class="btn sm primary"
	149	+ :disabled="isFormDisabled"
	150	+ @click="modalOpen"
	151	+ v-if="pageAuth.regAuthrt == 'Y'"
	152	+ >
	153	+ 사용자 추가
	154	+ </button>
	155	+ <button
	156	+ class="btn sm red"
	157	+ :disabled="isFormDisabled"
	158	+ @click="deptMbrDel"
	159	+ v-if="pageAuth.delAuthrt == 'Y'"
	160	+ >
	161	+ 선택 사용자 삭제
	162	+ </button>
214	163	</div>
215	164	</div>
216	165	</div>
217	166	</div>
218	167	</div>
219	168	</div>
	169	+
	170	+
220	171	<Modal :showModal="userListModal">
221	172	<template v-slot:header>
222	173	<div class="box-title point-font2">

...	...	@@ -1,249 +1,182 @@
1	1	<template>
2		- <div class="content admin-style">
3		- <div class="admin-page-title point-font2 mb30">
4		- <p>메뉴관리</p>
5		- </div>
6		- <div class="full-page">
7		- <div class="flex content">
8		- <div class="gd-3 pl0 content">
9		- <div class="tree-zone content pd10">
	2	+ <div class="content-zone">
	3	+ <div class="content">
	4	+ <div class="title-zone">
	5	+ <div class="page-title">
	6	+ <p>메뉴관리</p>
	7	+ </div>
	8	+ <PagiNavigationBar />
	9	+ </div>
	10	+ <div class="setting-box">
	11	+ <div class="node-zone">
10	12	<div class="tree">
11		- <div class="content overflow-y">
12		- <draggable tag="ul" class="tree-node" :list="menuList" :group="{ name: 'menu' }" item-key="id"
13		- handle=".handle" ghost-class="ghost">
14		- <template #item="{ element }">
15		- <Hierachy :tasks="element" :icon="iconPath" :selectedNode="selectedMenuId"
16		- @changeSelected="fnViewDetail" />
17		- </template>
18		- </draggable>
19		- </div>
	13	+ <draggable tag="ul" class="tree-node" :list="menuList" :group="{ name: 'menu' }" item-key="id"
	14	+ handle=".handle" ghost-class="ghost">
	15	+ <template #item="{ element, index }">
	16	+ <Hierachy :tasks="element" :icon="iconPath" :selectedNode="selectedMenuId" :isLastNode="element.childList && index === element.childList.length - 1"
	17	+ @changeSelected="fnViewDetail" />
	18	+ </template>
	19	+ </draggable>
20	20	</div>
21		- <div class="btn-zone pt15" v-if="pageAuth.mdfcnAuthrt == 'Y'">
22		- <div class="flex">
23		- <div class="gd-6 pl0">
24		- <button class="large-btn blue-border-btn" @click="fnTopAdd">
	21	+ <div class="btn-zone" v-if="pageAuth.mdfcnAuthrt == 'Y'">
	22	+ <button class="btn top sm secondary" @click="fnTopAdd">
25	23	TOP+
26	24	</button>
27		- </div>
28		- <div class="gd-6 pr0">
29		- <button class="large-btn blue-border-btn" @click="fnSubAdd">
	25	+ <button class="btn top sm secondary" @click="fnSubAdd">
30	26	SUB+
31	27	</button>
32		- </div>
33		- </div>
34		- <div class="pt15">
35		- <button class="large-btn blue-border-btn" @click="fnListUpdate">
	28	+ <button class="btn save sm" @click="fnListUpdate">
36	29	메뉴 저장
37	30	</button>
38	31	</div>
39		- </div>
40	32	</div>
41		- </div>
42		- <div class="gd-9 pr0 content overflow-y">
43		- <div class="content">
44		- <table class="form-table">
45		- <colgroup>
46		- <col width="50%" />
47		- <col width="50%" />
48		- </colgroup>
49		- <tr>
50		- <td>
51		- <div class="gd-12 pl0 pr0">
52		- <label for="" class="point-font2 mb10">상위 메뉴명 </label>
53		- <input type="text" class="full-input" v-model="viewMenu.upMenuNm" disabled />
54		- </div>
55		- </td>
56		- <td>
57		- <div class="gd-12 pr0">
58		- <label for="" class="form-title point-font2 mb10">
59		- 메뉴명
60		- </label>
61		- <input type="text" class="full-input" ref="menuNm" v-model="viewMenu.menuNm"
62		- :disabled="!editMode" />
63		- </div>
64		- </td>
65		- </tr>
66		- <tr>
67		- <td colspan="2">
68		- <div class="gd-12 pl0 pr0">
69		- <label for="" class="point-font2 mb10">메뉴 설명</label>
70		- <textarea style="min-height: 3rem" v-model="viewMenu.menuExpln" :disabled="!editMode"></textarea>
71		- </div>
72		- </td>
73		- </tr>
74		- <tr>
75		- <td>
76		- <div class="gd-12 pl0">
77		- <label for="" class="point-font2 mb10">메뉴 타입</label>
78		- <div class="flex">
79		- <div class="gd-2 pd0">
80		- <select class="full-select" ref="menuType" v-model="viewMenu.menuType" :disabled="!editMode">
81		- <option value="">선택</option>
82		- <option v-for="(code, index) in codeList" :key="index" :value="code.cd">
83		- {{ code.cdNm }}
84		- </option>
85		- </select>
86		- </div>
87		- <div class="gd-10 pr0" v-show="viewMenu.menuType == 'bbs' \|\|
88		- viewMenu.menuType == 'conts'
89		- ">
90		- <select class="full-select" ref="menuTypeCtgry" v-model="viewMenu.menuTypeCtgry"
91		- :disabled="!editMode">
92		- <option value="">선택</option>
93		- <option v-for="(ctgry, index) of ctgryList" :key="index" :value="ctgry.id">
94		- {{ ctgry.name }}
95		- </option>
96		- </select>
97		- </div>
98		- <div class="gd-10 pr0" v-show="viewMenu.menuType == 'link'">
99		- <input type="text" class="full-input" ref="linkUrl" v-model="viewMenu.linkUrl"
100		- :disabled="!editMode" />
101		- </div>
102		- </div>
103		- </div>
104		- </td>
105		- <td>
106		- <div class="gd-12 pr0">
107		- <label for="" class="form-title point-font2 mb10">
108		- 메뉴 사용자
109		- </label>
110		- <div class="flex align-center no-gutters">
111		- <div class="gd-4">
112		- <input type="radio" name="menuUser" id="menuUserAdm" class="mr5" v-model="viewMenu.menuUser"
113		- value="A" :disabled="!editMode" />
114		- <label for="menuUserAdm">관리자용</label>
115		- </div>
116		- <div class="gd-4">
117		- <input type="radio" name="menuUser" id="menuUserUser" class="mr5" v-model="viewMenu.menuUser"
118		- value="U" :disabled="!editMode" />
119		- <label for="menuUserUser">사용자용</label>
120		- </div>
121		- </div>
122		- </div>
123		- </td>
124		- </tr>
125		- <tr>
126		- <td>
127		- <div class="gd-12 pl0">
128		- <label for="" class="form-title point-font2 mb10">
129		- 링크유형
130		- </label>
131		- <div class="flex align-center no-gutters">
132		- <div class="gd-4">
133		- <input type="radio" name="linkType" id="linkTypeY" class="mr5" v-model="viewMenu.linkType"
134		- value="0" :disabled="!editMode" />
135		- <label for="linkTypeY">현재창</label>
136		- </div>
137		- <div class="gd-4">
138		- <input type="radio" name="linkType" id="linkTypeN" class="mr5" v-model="viewMenu.linkType"
139		- value="1" :disabled="!editMode" />
140		- <label for="linkTypeN">새창</label>
141		- </div>
142		- </div>
143		- </div>
144		- </td>
145		- <td>
146		- <div class="gd-12 pr0">
147		- <label for="" class="form-title point-font2 mb10">
148		- 만족도 조사 사용 여부
149		- </label>
150		- <div class="flex align-center no-gutters">
151		- <div class="gd-4">
152		- <input type="radio" name="dgstfnExmnUseYn" id="dgstfnExmnUseY" class="mr5"
153		- v-model="viewMenu.dgstfnExmnUseYn" value="Y" :disabled="!editMode" />
154		- <label for="dgstfnExmnUseY">사용</label>
155		- </div>
156		- <div class="gd-4">
157		- <input type="radio" name="dgstfnExmnUseYn" id="dgstfnExmnUseN" class="mr5"
158		- v-model="viewMenu.dgstfnExmnUseYn" value="N" :disabled="!editMode" />
159		- <label for="dgstfnExmnUseN">미사용</label>
160		- </div>
161		- </div>
162		- </div>
163		- </td>
164		- </tr>
165		- <tr>
166		- <td>
167		- <div class="gd-12 pl0">
168		- <label for="" class="form-title point-font2 mb10">
169		- 메뉴 노출 여부
170		- </label>
171		- <div class="flex align-center no-gutters">
172		- <div class="gd-4">
173		- <input type="radio" name="menuExpsrYn" id="menuExpsrY" class="mr5"
174		- v-model="viewMenu.menuExpsrYn" value="Y" :disabled="!editMode" />
175		- <label for="menuExpsrY">사용</label>
176		- </div>
177		- <div class="gd-4">
178		- <input type="radio" name="menuExpsrYn" id="menuExpsrN" class="mr5"
179		- v-model="viewMenu.menuExpsrYn" value="N" :disabled="!editMode" />
180		- <label for="menuExpsrN">미사용</label>
181		- </div>
182		- </div>
183		- </div>
184		- </td>
185		- <td>
186		- <div class="gd-12 pr0"></div>
187		- </td>
188		- </tr>
189		- <tr>
190		- <td>
191		- <div class="gd-12 pl0">
192		- <label for="" class="point-font2 mb10">등록자</label>
193		- <input type="text" class="full-input" v-model="viewMenu.rgtrNm" disabled />
194		- </div>
195		- </td>
196		- <td>
197		- <div class="gd-12 pr0">
198		- <label for="" class="point-font2 mb10">등록일</label>
199		- <input type="text" class="full-input" v-model="viewMenu.regDt" disabled />
200		- </div>
201		- </td>
202		- </tr>
203		- <tr>
204		- <td>
205		- <div class="gd-12 pl0">
206		- <label for="" class="point-font2 mb10">수정자</label>
207		- <input type="text" class="full-input" v-model="viewMenu.mdfrNm" disabled />
208		- </div>
209		- </td>
210		- <td>
211		- <div class="gd-12 pr0">
212		- <label for="" class="point-font2 mb10">수정일</label>
213		- <input type="text" class="full-input" v-model="viewMenu.mdfcnDt" disabled />
214		- </div>
215		- </td>
216		- </tr>
217		- </table>
218		- <div class="flex justify-end pt15">
219		- <div class="gd-1 pl0">
220		- <button class="large-btn blue-btn" @click="fnInsert" :disabled="!editMode" v-if="
221		- selectedMenuId != null &&
222		- editMode == true &&
223		- pageAuth.mdfcnAuthrt == 'Y'
224		- ">
225		- 수정
226		- </button>
227		- <button class="large-btn blue-btn" @click="fnInsert" :disabled="!editMode"
228		- v-else-if="editMode == true && pageAuth.regAuthrt == 'Y'">
229		- 등록
230		- </button>
	33	+ <div class="setting-zone">
	34	+ <div class="form-box">
	35	+ <div class="form-box-title">
	36	+ <p>메뉴 정보</p>
231	37	</div>
232		- <div class="gd-1 pr0">
233		- <button :class="{
234		- 'large-btn': true,
235		- 'gray-btn': !editMode,
236		- 'red-border-btn': editMode,
237		- }" :disabled="isFormDisabled" @click="fnDelete" v-if="pageAuth.delAuthrt == 'Y'">
238		- 삭제
239		- </button>
	38	+ <div class="form-content">
	39	+ <div>
	40	+ <label class="form-title">상위 메뉴명 </label>
	41	+ <input type="text" class="form-control sm" v-model="viewMenu.upMenuNm" disabled />
	42	+ </div>
	43	+ <div>
	44	+ <label class="form-title">메뉴명</label>
	45	+ <input type="text" class="form-control sm" ref="menuNm" v-model="viewMenu.menuNm"
	46	+ :disabled="!editMode" />
	47	+ </div>
	48	+ <div class="grid-column">
	49	+ <label class="form-title">메뉴 설명</label>
	50	+ <textarea v-model="viewMenu.menuExpln" :disabled="!editMode" class="form-control lg area"></textarea>
	51	+ </div>
	52	+ <div class="grid-column">
	53	+ <label class="form-title">메뉴 타입</label>
	54	+ <div class="input-group">
	55	+ <select class="form-select sm" ref="menuType" v-model="viewMenu.menuType" :disabled="!editMode">
	56	+ <option value="">선택</option>
	57	+ <option v-for="(code, index) in codeList" :key="index" :value="code.cd">
	58	+ {{ code.cdNm }}
	59	+ </option>
	60	+ </select>
	61	+
	62	+ <template v-if="viewMenu.menuType == 'bbs' \|\|
	63	+ viewMenu.menuType == 'conts'
	64	+ ">
	65	+ <select class="form-select sm" ref="menuTypeCtgry" v-model="viewMenu.menuTypeCtgry"
	66	+ :disabled="!editMode">
	67	+ <option value="">선택</option>
	68	+ <option v-for="(ctgry, index) of ctgryList" :key="index" :value="ctgry.id">
	69	+ {{ ctgry.name }}
	70	+ </option>
	71	+ </select>
	72	+ </template>
	73	+ <template v-if="viewMenu.menuType == 'link'">
	74	+ <input type="text" class="form-control sm" ref="linkUrl" v-model="viewMenu.linkUrl"
	75	+ :disabled="!editMode" :style="{ width: inputWidth + 'px' }"/>
	76	+ </template>
	77	+ </div>
	78	+ </div>
	79	+ <div>
	80	+ <label class="form-title">메뉴 사용자</label>
	81	+ <div class="check-area">
	82	+ <div class="form-check">
	83	+ <input type="radio" name="menuUser" id="menuUserAdm" v-model="viewMenu.menuUser"
	84	+ value="A" :disabled="!editMode" />
	85	+ <label for="menuUserAdm">관리자용</label>
	86	+ </div>
	87	+ <div class="form-check">
	88	+ <input type="radio" name="menuUser" id="menuUserUser" v-model="viewMenu.menuUser"
	89	+ value="U" :disabled="!editMode" />
	90	+ <label for="menuUserUser">사용자용</label>
	91	+ </div>
	92	+ </div>
	93	+ </div>
	94	+ <div>
	95	+ <label class="form-title">링크유형 </label>
	96	+ <div class="check-area">
	97	+ <div class="form-check">
	98	+ <input type="radio" name="linkType" id="linkTypeY" v-model="viewMenu.linkType"
	99	+ value="0" :disabled="!editMode" />
	100	+ <label for="linkTypeY">현재창</label>
	101	+ </div>
	102	+ <div class="form-check">
	103	+ <input type="radio" name="linkType" id="linkTypeN" v-model="viewMenu.linkType"
	104	+ value="1" :disabled="!editMode" />
	105	+ <label for="linkTypeN">새창</label>
	106	+ </div>
	107	+ </div>
	108	+ </div>
	109	+ <div class="gd-12 pr0">
	110	+ <label for="" class="form-title">만족도 조사 사용 여부 </label>
	111	+ <div class="check-area">
	112	+ <div class="form-check">
	113	+ <input type="radio" name="dgstfnExmnUseYn" id="dgstfnExmnUseY"
	114	+ v-model="viewMenu.dgstfnExmnUseYn" value="Y" :disabled="!editMode" />
	115	+ <label for="dgstfnExmnUseY">사용</label>
	116	+ </div>
	117	+ <div class="form-check">
	118	+ <input type="radio" name="dgstfnExmnUseYn" id="dgstfnExmnUseN"
	119	+ v-model="viewMenu.dgstfnExmnUseYn" value="N" :disabled="!editMode" />
	120	+ <label for="dgstfnExmnUseN">미사용</label>
	121	+ </div>
	122	+ </div>
	123	+ </div>
	124	+ <div>
	125	+ <label class="form-title">메뉴 노출 여부</label>
	126	+ <div class="check-area">
	127	+ <div class="form-check">
	128	+ <input type="radio" name="menuExpsrYn" id="menuExpsrY"
	129	+ v-model="viewMenu.menuExpsrYn" value="Y" :disabled="!editMode" />
	130	+ <label for="menuExpsrY">사용</label>
	131	+ </div>
	132	+ <div class="form-check">
	133	+ <input type="radio" name="menuExpsrYn" id="menuExpsrN"
	134	+ v-model="viewMenu.menuExpsrYn" value="N" :disabled="!editMode" />
	135	+ <label for="menuExpsrN">미사용</label>
	136	+ </div>
	137	+ </div>
	138	+ </div>
	139	+ <div>
	140	+ <label class="form-title">등록자</label>
	141	+ <input type="text" class="form-control sm" v-model="viewMenu.rgtrNm" disabled />
	142	+ </div>
	143	+ <div>
	144	+ <label class="form-title">등록일</label>
	145	+ <input type="text" class="form-control sm" v-model="viewMenu.regDt" disabled />
	146	+ </div>
	147	+ <div>
	148	+ <label class="form-title">수정자</label>
	149	+ <input type="text" class="form-control sm" v-model="viewMenu.mdfrNm" disabled />
	150	+ </div>
	151	+ <div>
	152	+ <label class="form-title">수정일</label>
	153	+ <input type="text" class="form-control sm" v-model="viewMenu.mdfcnDt" disabled />
	154	+ </div>
240	155	</div>
241	156	</div>
242	157	</div>
243		- </div>
244	158	</div>
245	159	</div>
246	160	</div>
	161	+ <div class="btn-wrap">
	162	+ <button class="btn sm primary" @click="fnInsert" :disabled="!editMode" v-if="
	163	+ selectedMenuId != null &&
	164	+ editMode == true &&
	165	+ pageAuth.mdfcnAuthrt == 'Y'
	166	+ ">
	167	+ 수정
	168	+ </button>
	169	+ <button class="btn sm primary" @click="fnInsert" :disabled="!editMode"
	170	+ v-else-if="editMode == true && pageAuth.regAuthrt == 'Y'">
	171	+ 등록
	172	+ </button>
	173	+ <button :class="{
	174	+ 'btn sm red': true,
	175	+ // 'red-border-btn': editMode,
	176	+ }" :disabled="isFormDisabled" @click="fnDelete" v-if="pageAuth.delAuthrt == 'Y'">
	177	+ 삭제
	178	+ </button>
	179	+ </div>
247	180	</template>
248	181
249	182	<script>
...	...	@@ -286,6 +219,7 @@
286	219	ctgryList: [], // 메뉴 타입 항목
287	220	bbsList: [], // 메뉴 타입 게시판 목록
288	221	contsTypeList: [], // 메뉴 타입 콘텐츠 목록
	222	+ inputWidth: 0,
289	223	};
290	224	},
291	225	created() {
...	...	@@ -595,6 +529,20 @@
595	529	alert(error.res.data.message);
596	530	}
597	531	},
	532	+
	533	+ updateInputWidth() {
	534	+ this.$nextTick(() => {
	535	+ const containerEl = this.$el; // 부모 컨테이너 전체 너비
	536	+ const selectEl = this.$refs.menuType; // select 요소
	537	+ if (containerEl && selectEl) {
	538	+ const containerWidth = containerEl.clientWidth; // 부모 요소의 전체 너비 (100%)
	539	+ const selectWidth = selectEl.offsetWidth; // select 요소의 실제 너비
	540	+ const gap = 10; // 선택적으로 간격 조정
	541	+
	542	+ this.inputWidth = containerWidth - selectWidth - gap; // 전체에서 select 너비를 뺀 값 적용
	543	+ }
	544	+ });
	545	+ },
598	546	},
599	547	watch: {
600	548	"viewMenu.menuType"() {
...	...	@@ -616,11 +564,17 @@
616	564	draggable: draggable,
617	565	Hierachy: Hierachy,
618	566	},
619		- mounted() { },
	567	+ mounted() {
	568	+ this.updateInputWidth();
	569	+ window.addEventListener("resize", this.updateInputWidth);
	570	+ },
	571	+ beforeUnmount() {
	572	+ window.removeEventListener("resize", this.updateInputWidth);
	573	+ },
620	574	};
621	575	</script>
622	576
623		-<style scoped>
	577	+<!-- <style scoped>
624	578	.tree-node {
625	579	height: 100%;
626	580	}
...	...	@@ -634,4 +588,4 @@
634	588	.ghost * {
635	589	display: none;
636	590	}
637		-</style> (파일 끝에 줄바꿈 문자 없음)
	591	+</style> --> (파일 끝에 줄바꿈 문자 없음)

...	...	@@ -2,17 +2,15 @@
2	2	<div class="content-zone">
3	3	<div class="content">
4	4	<div class="title-zone">
5		- <div class="section-title">
	5	+ <div class="page-title">
6	6	<p>공통코드관리</p>
7	7	</div>
8	8	<PagiNavigationBar />
9		- </div>
	9	+ </div>
10	10	<div class="setting-box">
11		-
12	11	<div class="node-zone">
13		-
14	12	<div class="tree">
15		- <div class="content overflow-y">
	13	+ <div>
16	14	<draggable tag="ul" class="tree-node" :list="codeList" :group="{ name: 'menu' }" item-key="id"
17	15	handle=".handle" ghost-class="ghost">
18	16	<template #item="{ element }">
...	...	@@ -37,46 +35,51 @@
37	35	</div>
38	36	</div>
39	37	<div class="setting-zone">
40		- <div class="form-content">
41		- <div>
42		- <label for="" class="form-title">상위코드</label>
43		- <input type="text" class="form-control sm" disabled v-model="viewCode.upCd" />
	38	+ <div class="form-box">
	39	+ <div class="form-box-title">
	40	+ <p>공통코드정보</p>
44	41	</div>
45		- <div>
46		- <label for="" class="form-title">상위코드명</label>
47		- <input type="text" class="form-control sm" disabled v-model="viewCode.upCdNm" />
48		- </div>
49		- <div>
50		- <label for="" class="form-title">코드</label>
51		- <input type="text" class="form-control sm" :disabled="isFormDisabled \|\| !submitStts"
52		- v-model="viewCode.cd" />
53		- </div>
54		- <div>
55		- <label for="" class="form-title">코드명</label>
56		- <input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdNm" />
57		- </div>
58		- <div>
59		- <label for="" class="form-title">코드값</label>
60		- <input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdVl" />
61		- </div>
62		- <div>
63		- <label for="" class="form-title">사용여부</label>
64		- <div class="check-area">
65		- <div class="form-check">
66		- <input type="radio" name="code" id="y" value="Y" :disabled="isFormDisabled"
67		- v-model="viewCode.useYn" />
68		- <label for="y">사용</label>
69		- </div>
70		- <div class="form-check">
71		- <input type="radio" name="code" id="n" value="N" :disabled="isFormDisabled"
72		- v-model="viewCode.useYn" />
73		- <label for="n">미사용</label>
	42	+ <div class="form-content">
	43	+ <div>
	44	+ <label for="" class="form-title">상위코드</label>
	45	+ <input type="text" class="form-control sm" disabled v-model="viewCode.upCd" />
	46	+ </div>
	47	+ <div>
	48	+ <label for="" class="form-title">상위코드명</label>
	49	+ <input type="text" class="form-control sm" disabled v-model="viewCode.upCdNm" />
	50	+ </div>
	51	+ <div>
	52	+ <label for="" class="form-title">코드</label>
	53	+ <input type="text" class="form-control sm" :disabled="isFormDisabled \|\| !submitStts"
	54	+ v-model="viewCode.cd" />
	55	+ </div>
	56	+ <div>
	57	+ <label for="" class="form-title">코드명</label>
	58	+ <input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdNm" />
	59	+ </div>
	60	+ <div>
	61	+ <label for="" class="form-title">코드값</label>
	62	+ <input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdVl" />
	63	+ </div>
	64	+ <div>
	65	+ <label for="" class="form-title">사용여부</label>
	66	+ <div class="check-area">
	67	+ <div class="form-check">
	68	+ <input type="radio" name="code" id="y" value="Y" :disabled="isFormDisabled"
	69	+ v-model="viewCode.useYn" />
	70	+ <label for="y">사용</label>
	71	+ </div>
	72	+ <div class="form-check">
	73	+ <input type="radio" name="code" id="n" value="N" :disabled="isFormDisabled"
	74	+ v-model="viewCode.useYn" />
	75	+ <label for="n">미사용</label>
	76	+ </div>
74	77	</div>
75	78	</div>
76		- </div>
77		- <div>
78		- <label for="textarea" class="form-title">코드설명</label>
79		- <textarea class="form-control" id="textarea" :disabled="isFormDisabled" v-model="viewCode.cdExpln"></textarea>
	79	+ <div>
	80	+ <label for="textarea" class="form-title">코드설명</label>
	81	+ <textarea class="form-control" id="textarea" :disabled="isFormDisabled" v-model="viewCode.cdExpln"></textarea>
	82	+ </div>
80	83	</div>
81	84	</div>
82	85	</div>

...	...	@@ -1,51 +1,71 @@
1	1	<template>
2		- <div class="content admin-style">
3		- <div class="admin-page-title point-font2 mb30">
4		- <p>로그인 정책 설정</p>
5		- </div>
6		- <details open class="form-table-style mb30">
7		- <summary class="point-font2">
8		- <p class="summary-style pl10">로그인 정책</p>
9		- </summary>
10		- <div class="pt10 pb10">
11		- <table class="form-table">
12		- <colgroup>
13		- <col width="50%" />
14		- <col width="50%" />
15		- </colgroup>
16		- <tr>
17		- <td>
18		- <div class="gd-12 pl0">
19		- <label for="" class="form-title point-font2 mb10">중복로그인 설정</label>
20		- <label>
21		- <input type="checkbox" v-model="allowMultipleLogin" @change="saveByLoginPolicy" />
22		- </label>
23		- <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>
24		- <p style="color: red;"> ※ 로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.</p>
25		- </div>
26		- </td>
27		- <td>
28		- <div class="gd-12 pl0">
29		- <label for="" class="form-title point-font2 ">로그인 방식 설정</label>
30		- <div class="gd-4">
31		- <input type="radio" class="mr5" value="J" v-model="lgnMode" @change="saveByLoginMode" />
32		- <label>JWT 방식</label>
33		- </div>
34		- <div class="gd-4">
35		- <input type="radio" class="mr5" value="S" v-model="lgnMode" @change="saveByLoginMode" />
36		- <label>SESSION 방식</label>
37		- </div>
38		- <span class="ml10 gray">
39		- 현재 로그인 방식은 <strong>{{ loginModeLabel }}</strong> 입니다.
40		- </span>
41		-
42		- </div>
43		- </td>
44		- </tr>
45		- </table>
	2	+ <div class="content-zone">
	3	+ <div class="content">
	4	+ <div class="scroll">
	5	+ <div class="title-zone">
	6	+ <div class="page-title">
	7	+ <p>로그인 정책 설정</p>
46	8	</div>
47		- </details>
	9	+ <PagiNavigationBar />
	10	+ </div>
	11	+ <div open class="form-box">
	12	+ <div class="form-box-title">
	13	+ <p class="summary-style pl10">기본 정보</p>
	14	+ </div>
	15	+ <div class="form-content">
	16	+ <div class="gd-12 pl0">
	17	+ <label class="form-title">중복로그인 설정</label>
	18	+ <div class="form-group">
	19	+ <div>
	20	+ <input type="checkbox" v-model="allowMultipleLogin" @change="saveByLoginPolicy" />
	21	+ <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>
	22	+ </div>
	23	+ <span style="color: red;"> ※ 로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.</span>
	24	+ </div>
	25	+ </div>
	26	+ <div>
	27	+ <label class="form-title">중복로그인 설정</label>
	28	+ <div class="form-group">
	29	+ <div>
	30	+ <input type="checkbox" v-model="allowMultipleLogin" @change="saveByLoginPolicy" />
	31	+ <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>
	32	+ </div>
	33	+ <span style="color: red;"> ※ 로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.</span>
	34	+ </div>
	35	+ </div>
	36	+ <div>
	37	+ <label class="form-title">중복로그인 설정</label>
	38	+ <div class="form-group">
	39	+ <div>
	40	+ <input type="checkbox" v-model="allowMultipleLogin" @change="saveByLoginPolicy" />
	41	+ <p>{{ allowMultipleLogin ? '중복 로그인을 허용하고 있습니다.' : '중복 로그인을 허용하지 않습니다.' }}</p>
	42	+ </div>
	43	+ <span style="color: red;"> ※ 로그인 방식을 변경하면 전체 사용자가 로그아웃됩니다.</span>
	44	+ </div>
	45	+ </div>
	46	+ <div>
	47	+ <label class="form-title">로그인 방식 설정</label>
	48	+ <div class="form-group">
	49	+ <div class="check-area">
	50	+ <div class="form-check">
	51	+ <input type="radio" class="mr5" value="J" v-model="lgnMode" @change="saveByLoginMode" />
	52	+ <label>JWT 방식</label>
	53	+ </div>
	54	+ <div class="form-check">
	55	+ <input type="radio" class="mr5" value="S" v-model="lgnMode" @change="saveByLoginMode" />
	56	+ <label>SESSION 방식</label>
	57	+ </div>
	58	+ </div>
	59	+ <span class="ml10 gray">
	60	+ 현재 로그인 방식은 <strong>{{ loginModeLabel }}</strong> 입니다.
	61	+ </span>
	62	+ </div>
	63	+ </div>
	64	+ </div>
	65	+ </div>
	66	+ </div>
48	67	</div>
	68	+ </div>
49	69	</template>
50	70
51	71	<script>

Delete comment