[#734][3.0] Tree 컴포넌트 이벤트 동작 안하는 문제로 package-lock 파일 다시 추가

########### - Tree 컴포넌트 이벤트 동작 안하는 문제로 package-lock 파일 다시 추가
ex-em · Dec 16, 2020 · 6a90c01 · 6a90c01
1 parent ecc62b5
commit 6a90c01
Show file tree

Hide file tree

Showing 4 changed files with 2,086 additions and 1,786 deletions.
diff --git a/docs/views/tree/api/tree.md b/docs/views/tree/api/tree.md
@@ -12,12 +12,12 @@
 
  | 이름 | 타입 | 디폴트 | 설명 | 종류 |
   |------|--------|------|------|------|
-  | data | Array | - | 트리 컴포넌트에 사용될 데이터|  |
+  | data | Array | [] | 트리 컴포넌트에 사용될 데이터|  |
   | use-checkbox | Boolean | false | 체크 박스를 사용 유무 |  |
-  | empty-text | String | No Data | 트리 데이터가 없을 경우 나타낼 문구 | |
+  | empty-text | String | 'No Data' | 트리 데이터가 없을 경우 나타낼 문구 | |
   | expand-icon | String | 'ev-icon-arrow-right' 아이콘 | 트리를 펼쳤을 때 보여질 아이콘 | |
   | collapse-icon | String | 'ev-icon-arrow-down' 아이콘 | 트리를 접었을 때 보여질 아이콘 | |
-  | context-menu-items | Array | - | 우클릭 시 보여지는 컨텍스트 메뉴, 사용하지 않을 경우 컨텍스트 메뉴는 보이지 않음 | | 
+  | context-menu-items | Array | [] | 우클릭 시 보여지는 컨텍스트 메뉴, 사용하지 않을 경우 컨텍스트 메뉴는 보이지 않음 | | 
 
 >### Event
 

diff --git a/docs/views/tree/example/Default.vue b/docs/views/tree/example/Default.vue
@@ -4,12 +4,16 @@
     <ev-tree
       :data="commonData"
       :context-menu-items="menuItems"
-      expand-icon="ev-icon-square-plus"
-      collapse-icon="ev-icon-square-minus"
       @change-checked-node="getCheckedNode"
       @click-content="getClickedNode"
       @dblclick-content="getDblClickedNode"
     />
+    <div class="description">
+      <div class="badge yellow">
+        클릭된 노드
+      </div>
+      {{ clickedNodeInfo }}
+    </div>
   </div>
   <div class="case">
     <p class="case-title">Checkbox</p>
@@ -22,6 +26,48 @@
       @click-content="getClickedNode"
       @dblclick-content="getDblClickedNode"
     />
+    <div class="description">
+      <div class="badge yellow">
+        체크박스 선택된 노드들
+      </div>
+      {{ checkedNodeInfo }}
+    </div>
+  </div>
+  <div class="case">
+    <p class="case-title">Disabled</p>
+    <ev-tree
+      :data="commonData"
+      :context-menu-items="menuItems"
+      expand-icon="ev-icon-square-plus"
+      collapse-icon="ev-icon-square-minus"
+      @change-checked-node="getCheckedNode"
+      @click-content="getClickedNode"
+      @dblclick-content="getDblClickedNode"
+    />
+    <div class="description">
+      <div class="badge yellow">
+        작업해야햄@_@
+      </div>
+      {{ clickedNodeInfo }}
+    </div>
+  </div>
+  <div class="case">
+    <p class="case-title">ContextMenu</p>
+    <ev-tree
+      :data="commonData"
+      :context-menu-items="menuItems"
+      expand-icon="ev-icon-square-plus"
+      collapse-icon="ev-icon-square-minus"
+      @change-checked-node="getCheckedNode"
+      @click-content="getClickedNode"
+      @dblclick-content="getDblClickedNode"
+    />
+    <div class="description">
+      <div class="badge yellow">
+        컨텍스메뉴 클리한거 뜨도록 작업해야 햅햅햅
+      </div>
+      {{ clickedNodeInfo }}
+    </div>
   </div>
 </template>
 
@@ -38,12 +84,12 @@ export default {
           {
             title: 'Parent A',
             expand: true,
-            icon: 'ev-icon-folder',
+            iconClass: 'ev-icon-folder',
             children: [
               {
                 title: 'Leaf AA',
                 expand: true,
-                icon: 'ev-icon-document-vertically',
+                iconClass: 'ev-icon-document-vertically',
               },
               {
                 title: 'Leaf AB',
@@ -53,7 +99,7 @@ export default {
           {
             title: 'Parent B',
             expand: true,
-            icon: 'ev-icon-folder2',
+            iconClass: 'ev-icon-folder2',
             children: [
               {
                 title: 'Leaf BA',
@@ -77,11 +123,11 @@ export default {
             children: [
               {
                 title: 'Child AA',
-                expand: false,
+                expand: true,
                 children: [
                   {
                     title: 'GrandChild A',
-                    disabled: true,
+                    checked: true,
                   },
                 ],
               },
@@ -99,6 +145,7 @@ export default {
               },
               {
                 title: 'Child BB',
+                checked: true,
               },
             ],
           },
@@ -112,12 +159,18 @@ export default {
       },
     ]);
 
+    const clickedNodeInfo = ref({});
+
+    const checkedNodeInfo = ref({});
+
     function getCheckedNode(checkedNode) {
       console.log('getCheckedNode', checkedNode);
+      checkedNodeInfo.value = checkedNode;
     }
 
     function getClickedNode(clickedNode) {
       console.log('getClickedNode', clickedNode);
+      clickedNodeInfo.value = clickedNode;
     }
 
     function getDblClickedNode(clickedNode) {
@@ -128,6 +181,8 @@ export default {
       commonData,
       checkboxExampleData,
       menuItems,
+      clickedNodeInfo,
+      checkedNodeInfo,
       getCheckedNode,
       getClickedNode,
       getDblClickedNode,