diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html index bf6b7dcd..a3250c41 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html @@ -127,6 +127,13 @@ > 파일함 + + + {{ curIndex }} / {{ totalCount }} + + +
+ + + +
+ diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.scss b/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.spec.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.spec.ts new file mode 100644 index 00000000..43729199 --- /dev/null +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SearchComponent } from './search.component'; + +describe('SearchComponent', () => { + let component: SearchComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SearchComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SearchComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.ts new file mode 100644 index 00000000..e07dbddd --- /dev/null +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.ts @@ -0,0 +1,65 @@ +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; +import { FormGroup, FormBuilder } from '@angular/forms'; +import { NGXLogger } from 'ngx-logger'; + +@Component({ + selector: 'ucap-chat-search', + templateUrl: './search.component.html', + styleUrls: ['./search.component.scss'] +}) +export class SearchComponent implements OnInit { + @Input() + totalCount = 0; + @Input() + curIndex = 0; + + @Output() + searchText = new EventEmitter(); + @Output() + prevSearch = new EventEmitter(); + @Output() + nextSearch = new EventEmitter(); + @Output() + searchAndPrev = new EventEmitter(); + @Output() + closeSearchArea = new EventEmitter(); + + fgSearch: FormGroup; + isSearch = false; + + constructor(private formBuilder: FormBuilder, private logger: NGXLogger) {} + + ngOnInit() { + this.fgSearch = this.formBuilder.group({ + searchInput: null + }); + } + + onClickSearchCancel() { + this.isSearch = false; + this.fgSearch.reset(); + this.closeSearchArea.emit(); + } + + onKeyDownEnter(event: KeyboardEvent, search: string) { + event.preventDefault(); + event.stopPropagation(); + + if (search.trim().length > 0) { + this.isSearch = true; + this.searchText.emit(search.trim()); + } else { + this.isSearch = false; + } + } + + onClickPrevSearch() { + this.prevSearch.emit(); + } + onClickNextSearch() { + this.nextSearch.emit(); + } + onClickSearchAndPrev() { + this.searchAndPrev.emit(); + } +} diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts b/projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts index 6df9d258..0b239885 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts +++ b/projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts @@ -31,10 +31,12 @@ import { TextComponent as MBTextComponent } from './components/message-box/text. import { TranslationComponent as MBTranslationComponent } from './components/message-box/translation.component'; import { VideoComponent as MBVideoComponent } from './components/message-box/video.component'; import { VideoConferenceComponent as MBVideoConferenceComponent } from './components/message-box/video-conference.component'; +import { SearchComponent } from './components/search.component'; const COMPONENTS = [ FormComponent, MessagesComponent, + SearchComponent, MBDateSplitterComponent, MBFileComponent, diff --git a/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.ts b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.ts index b2e221f1..92b0ae0d 100644 --- a/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.ts +++ b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.ts @@ -18,6 +18,9 @@ export class StickerSelectorComponent implements OnInit { @Output() selectedSticker = new EventEmitter(); + @Output() + closeSticker = new EventEmitter(); + stickerBasePath = 'assets/sticker/'; stickerInfoList: StickerInfo[] = []; stickerFileInfoList: StickerFilesInfo[] = []; @@ -87,4 +90,8 @@ export class StickerSelectorComponent implements OnInit { this.currentSticker = sticker; this.selectedSticker.emit(sticker); } + + onClickClose() { + this.closeSticker.emit(); + } }