Merge branch 'master' of http://10.81.13.221:6990/Web/next-ucap-messenger

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/organization.component.html

@@ -44,7 +44,7 @@
     <div *ngIf="selectedDepartmentProcessing">
       <mat-progress-bar mode="indeterminate"></mat-progress-bar>
     </div>
-    <div class="search-list">
+    <div *ngIf="!isShowSearch" class="search-list">
       <cdk-virtual-scroll-viewport
         itemSize="80"
         #cvsvDeptUser

projects/ucap-webmessenger-ui-organization/src/lib/components/tree.component.html

@@ -24,10 +24,14 @@
         <div class="tree-node-closer-top"></div>
         <div
           class="tree-node-closer-bottom"
-          [attr.lastNode]="isLastNode(node) ? '' : null"
+          [attr.last-node]="isLastNode(node) ? '' : null"
         ></div>
       </div>
-      <li (click)="onClickNode(node)" matRipple>
+      <li
+        (click)="onClickNode(node)"
+        matRipple
+        [attr.sub-node]="isParentLastNode(node) ? '' : null"
+      >
         <div class="tree-node-body">{{ node.name }}</div>
       </li>
     </mat-tree-node>
@@ -43,10 +47,14 @@
         <div
           class="tree-node-closer-bottom"
           [attr.expanded]="treeControl.isExpanded(node) ? '' : null"
-          [attr.lastNode]="isLastNode(node) ? '' : null"
+          [attr.last-node]="isLastNode(node) ? '' : null"
         ></div>
       </div>
-      <li (click)="onClickNode(node)" matRipple>
+      <li
+        (click)="onClickNode(node)"
+        matRipple
+        [attr.sub-node]="isParentLastNode(node) ? '' : null"
+      >
         <div class="tree-node-body">
           <span class="horizontal-line"></span>
           <button

projects/ucap-webmessenger-ui-organization/src/lib/components/tree.component.scss

@@ -28,7 +28,7 @@
     .tree-node-closer-bottom[expanded] {
       border-width: 0 0 1px 0px;
     }
-    .tree-node-closer-bottom[lastNode] {
+    .tree-node-closer-bottom[last-node] {
       border-width: 0 0 1px 0px;
     }
   }
@@ -39,6 +39,11 @@
     list-style-type: none;
   }
 
+  // li[sub-node] {
+  //   border: 1px dotted grey;
+  //   border-width: 0 0 0 1px;
+  // }
+
   // li:last-child {
   //   border-left: 1px solid white;
   //   margin-left: -41px;

projects/ucap-webmessenger-ui-organization/src/lib/components/tree.component.ts

@@ -154,9 +154,7 @@ export class TreeComponent implements OnInit, OnDestroy, AfterViewInit {
   hasChild = (_: number, node: FlatNode) => node.expandable;
 
   isLastNode(node: FlatNode): boolean {
-    const i = this.dataSource.expandedDataSubject.value.findIndex(n => {
+    const i = this.findNodeIndex(node);
-      return node.deptInfo.seq === n.deptInfo.seq;
-    });
 
     if (i === this.dataSource.expandedDataSubject.value.length - 1) {
       return true;
@@ -168,7 +166,38 @@ export class TreeComponent implements OnInit, OnDestroy, AfterViewInit {
     return false;
   }
 
+  isParentLastNode(node: FlatNode): boolean {
+    const pi = this.findParentNodeIndex(node);
+    if (-1 === pi) {
+      return false;
+    }
+    return this.isLastNode(this.dataSource.expandedDataSubject.value[pi]);
+  }
+
   onClickNode(node: OrganizationNode) {
     this.selected.emit(node.deptInfo);
   }
+
+  private findNodeIndex(node: FlatNode): number {
+    return this.dataSource.expandedDataSubject.value.findIndex(n => {
+      return node.deptInfo.seq === n.deptInfo.seq;
+    });
+  }
+
+  private findParentNodeIndex(node: FlatNode): number {
+    const i = this.findNodeIndex(node);
+    if (-1 === i) {
+      return -1;
+    }
+
+    for (let idx = i - 1; idx >= 0; idx--) {
+      if (
+        this.dataSource.expandedDataSubject.value[idx].level ===
+        node.level - 1
+      ) {
+        return idx;
+      }
+    }
+    return -1;
+  }
 }

projects/ucap-webmessenger-ui-settings/src/lib/components/general.component.html

@@ -1,6 +1,12 @@
 <div>
   <mat-list>
     <h1 mat-subheader>테마</h1>
+
+    <ul  class="theme-list">
+      <li class="theme-box default on"></li>
+      <li class="theme-box lgRed"></li>
+    </ul>
+
     <mat-list-item>
       <span>기본값</span>
       <span>어둡게</span>

projects/ucap-webmessenger-ui-settings/src/lib/components/general.component.scss

@@ -0,0 +1,28 @@
+.theme-list {
+  position: relative;
+  display: flex;
+  flex-flow: row;
+  margin: 10px;
+  height: 120px;
+
+  .theme-box{
+    width: 140px;
+    height:98px;
+    margin-right:10px;
+    border: 1px solid #dddddd;
+    background-size:100% auto;
+    background-repeat: no-repeat;
+    opacity: 0.7;
+    &.default{
+      background-image: url("../../../../ucap-webmessenger-app/src/assets/images/theme/theme-default.png");
+    }
+    &.lgRed{
+     background-image: url("../../../../ucap-webmessenger-app/src/assets/images/theme/theme-lgRed.png");
+     }
+    &.on{
+      border:1px solid #333333;
+       opacity: 1;
+    }
+  }
+
+}