diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.html index 4ad695c3..71c23e2c 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.html @@ -45,6 +45,7 @@ #groupExpansionPanel [groupBuddyList]="groupBuddyList$ | async" [favoritBuddyList]="favoritBuddyList$ | async" + (more)="onMoreGroup($event)" > Action 2 + +
+ + + + + + + + + diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts index f02be450..246d625a 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts @@ -53,6 +53,11 @@ export class GroupComponent implements OnInit { profileContextMenuPosition = { x: '0px', y: '0px' }; + @ViewChild('groupContextMenu', { static: true }) + groupContextMenu: MatMenu; + + groupContextMenuPosition = { x: '0px', y: '0px' }; + groupBuddyList$: Observable< { group: GroupDetailData; buddyList: UserInfo[] }[] >; @@ -198,12 +203,18 @@ export class GroupComponent implements OnInit { event: MouseEvent; userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN; }) { - params.event.preventDefault(); this.profileContextMenuPosition.x = params.event.clientX + 'px'; this.profileContextMenuPosition.y = params.event.clientY + 'px'; const profileContextMenuTrigger = this.menuTriggerList.toArray()[1]; - profileContextMenuTrigger.menu = this.profileContextMenu; profileContextMenuTrigger.menuData = { userInfo: params.userInfo }; profileContextMenuTrigger.openMenu(); } + + onMoreGroup(params: { event: MouseEvent; group: GroupDetailData }) { + this.groupContextMenuPosition.x = params.event.clientX + 'px'; + this.groupContextMenuPosition.y = params.event.clientY + 'px'; + const groupContextMenuTrigger = this.menuTriggerList.toArray()[2]; + groupContextMenuTrigger.menuData = { group: params.group }; + groupContextMenuTrigger.openMenu(); + } } diff --git a/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html b/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html index 6448fcf7..fab50538 100644 --- a/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html +++ b/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html @@ -1,5 +1,8 @@ - + 즐겨찾기 @@ -21,10 +24,22 @@
--> - + {{ groupBuddy.group.name }} - + + + + diff --git a/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.scss b/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.scss index 0044a582..4e887a03 100644 --- a/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.scss +++ b/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.scss @@ -3,50 +3,7 @@ flex: 1; flex-direction: column; - .contact { - white-space: normal; - text-align: left; - letter-spacing: 0.01em; - min-height: 88px; - border-bottom: 1px solid; - padding: 16px; - font-weight: 400; - border-radius: 0; - - .avatar-wrapper { - .avatar { - margin-right: 16px; - } - } - - .contact-name { - font-size: 16px; - white-space: nowrap; - text-overflow: ellipsis; - } - - .contact-last-message { - line-height: normal; - margin-top: 0; - } - - .contact-last-message-time { - font-size: 12px; - margin-top: 4px; - } - - .contact-mood { - line-height: normal; - margin: 0; - } - - .unread-message-count { - font-size: 12px; - border-radius: 50%; - text-align: center; - width: 20px; - height: 20px; - line-height: 20px; - } + .more-spacer { + flex: 1 1 auto; } } diff --git a/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.ts b/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.ts index d9b43202..f815e831 100644 --- a/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.ts +++ b/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.ts @@ -28,6 +28,12 @@ export class ExpansionPanelComponent implements OnInit { @Input() favoritBuddyList: UserInfo[]; + @Output() + more = new EventEmitter<{ + event: MouseEvent; + group: GroupDetailData; + }>(); + @ContentChild(ExpansionPanelItemDirective, { read: TemplateRef, static: true @@ -47,4 +53,11 @@ export class ExpansionPanelComponent implements OnInit { expandLess() { this.groupAccordion.closeAll(); } + + onClickMore(event: MouseEvent, group: GroupDetailData) { + event.preventDefault(); + event.stopPropagation(); + + this.more.emit({ event, group }); + } } diff --git a/projects/ucap-webmessenger-ui-group/src/lib/ucap-ui-group.module.ts b/projects/ucap-webmessenger-ui-group/src/lib/ucap-ui-group.module.ts index 2130fef3..23da00ab 100644 --- a/projects/ucap-webmessenger-ui-group/src/lib/ucap-ui-group.module.ts +++ b/projects/ucap-webmessenger-ui-group/src/lib/ucap-ui-group.module.ts @@ -4,7 +4,9 @@ import { ReactiveFormsModule } from '@angular/forms'; import { FlexLayoutModule } from '@angular/flex-layout'; +import { MatButtonModule } from '@angular/material/button'; import { MatExpansionModule } from '@angular/material/expansion'; +import { MatIconModule } from '@angular/material/icon'; import { ExpansionPanelComponent } from './components/expansion-panel.component'; import { ExpansionPanelItemDirective } from './directives/expansion-panel-item.directive'; @@ -20,7 +22,9 @@ const SERVICES = []; UCapUiProfileModule, ReactiveFormsModule, FlexLayoutModule, - MatExpansionModule + MatButtonModule, + MatExpansionModule, + MatIconModule ], exports: [...COMPONENTS, ...DIRECTIVES], declarations: [...COMPONENTS, ...DIRECTIVES] diff --git a/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts b/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts index 13dbe491..0ded962d 100644 --- a/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts +++ b/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts @@ -113,6 +113,8 @@ export class UserListItemComponent implements OnInit, OnDestroy { event: MouseEvent, userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN ) { + event.preventDefault(); + event.stopPropagation(); this.contextMenu.emit({ event, userInfo }); } }