modify message-box :: date-splitter
This commit is contained in:
parent
601e0861a8
commit
da0ba9acbd
@ -0,0 +1,4 @@
|
|||||||
|
<p>
|
||||||
|
<!-- {{ message.sendDate | date: 'short' }} -->
|
||||||
|
{{ dateInfo }}
|
||||||
|
</p>
|
@ -1,4 +1,6 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit, Input } from '@angular/core';
|
||||||
|
import { Info } from '@ucap-webmessenger/protocol-event';
|
||||||
|
import { DatePipe } from '@angular/common';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'ucap-chat-message-box-date-splitter',
|
selector: 'ucap-chat-message-box-date-splitter',
|
||||||
@ -6,7 +8,17 @@ import { Component, OnInit } from '@angular/core';
|
|||||||
styleUrls: ['./date-splitter.component.scss']
|
styleUrls: ['./date-splitter.component.scss']
|
||||||
})
|
})
|
||||||
export class DateSplitterComponent implements OnInit {
|
export class DateSplitterComponent implements OnInit {
|
||||||
constructor() {}
|
@Input()
|
||||||
|
message: Info;
|
||||||
|
|
||||||
ngOnInit() {}
|
dateInfo: string;
|
||||||
|
|
||||||
|
constructor(private datePipe: DatePipe) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.dateInfo = this.datePipe.transform(
|
||||||
|
this.message.sendDate,
|
||||||
|
'yyyy-MM-dd EEE'
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -2,7 +2,4 @@
|
|||||||
<span>
|
<span>
|
||||||
{{ message.sentMessage }}
|
{{ message.sentMessage }}
|
||||||
</span>
|
</span>
|
||||||
<span>
|
|
||||||
{{ message.sendDate | date: 'short' }}
|
|
||||||
</span>
|
|
||||||
</p>
|
</p>
|
||||||
|
@ -4,6 +4,9 @@
|
|||||||
me: message.senderSeq === loginRes.userSeq,
|
me: message.senderSeq === loginRes.userSeq,
|
||||||
contact: message.senderSeq !== loginRes.userSeq
|
contact: message.senderSeq !== loginRes.userSeq
|
||||||
}">
|
}">
|
||||||
|
<ucap-chat-message-box-date-splitter *ngIf="getDateSplitter(i)" [message]="message">
|
||||||
|
</ucap-chat-message-box-date-splitter>
|
||||||
|
|
||||||
<div *ngIf="message.type !== EventType.Join && message.type !== EventType.Exit">
|
<div *ngIf="message.type !== EventType.Join && message.type !== EventType.Exit">
|
||||||
<ul>
|
<ul>
|
||||||
<li *ngIf="getUserProfile(message.senderSeq) != ''">
|
<li *ngIf="getUserProfile(message.senderSeq) != ''">
|
||||||
@ -30,8 +33,6 @@
|
|||||||
</ucap-chat-message-box-sticker>
|
</ucap-chat-message-box-sticker>
|
||||||
<ucap-chat-message-box-text *ngSwitchCase="EventType.Character" [message]="message"></ucap-chat-message-box-text>
|
<ucap-chat-message-box-text *ngSwitchCase="EventType.Character" [message]="message"></ucap-chat-message-box-text>
|
||||||
<div *ngSwitchDefault>
|
<div *ngSwitchDefault>
|
||||||
date splitter
|
|
||||||
<ucap-chat-message-box-date-splitter></ucap-chat-message-box-date-splitter>
|
|
||||||
mass-translation
|
mass-translation
|
||||||
<ucap-chat-message-box-mass-translation></ucap-chat-message-box-mass-translation>
|
<ucap-chat-message-box-mass-translation></ucap-chat-message-box-mass-translation>
|
||||||
notice
|
notice
|
||||||
|
@ -9,6 +9,7 @@ import { NGXLogger } from 'ngx-logger';
|
|||||||
import { SessionStorageService } from '@ucap-webmessenger/web-storage';
|
import { SessionStorageService } from '@ucap-webmessenger/web-storage';
|
||||||
import { KEY_VER_INFO, VerInfo2 } from '@app/types/ver-info.type';
|
import { KEY_VER_INFO, VerInfo2 } from '@app/types/ver-info.type';
|
||||||
import { FileInfo } from '../models/file-info.json';
|
import { FileInfo } from '../models/file-info.json';
|
||||||
|
import { DatePipe } from '@angular/common';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'ucap-chat-messages',
|
selector: 'ucap-chat-messages',
|
||||||
@ -35,7 +36,8 @@ export class MessagesComponent implements OnInit {
|
|||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private logger: NGXLogger,
|
private logger: NGXLogger,
|
||||||
private sessionStorageService: SessionStorageService
|
private sessionStorageService: SessionStorageService,
|
||||||
|
private datePipe: DatePipe
|
||||||
) {}
|
) {}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
@ -70,14 +72,37 @@ export class MessagesComponent implements OnInit {
|
|||||||
return '';
|
return '';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** Date Splitter check */
|
||||||
|
getDateSplitter(curIndex: number): boolean {
|
||||||
|
if (curIndex === 0) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
if (curIndex > 0) {
|
||||||
|
return (
|
||||||
|
this.datePipe.transform(
|
||||||
|
this.messages[curIndex].sendDate,
|
||||||
|
'yyyyMMdd'
|
||||||
|
) !==
|
||||||
|
this.datePipe.transform(
|
||||||
|
this.messages[curIndex - 1].sendDate,
|
||||||
|
'yyyyMMdd'
|
||||||
|
)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** [Event] MassTalk Detail View */
|
||||||
onMassDetail(value: number) {
|
onMassDetail(value: number) {
|
||||||
this.massDetail.emit(value);
|
this.massDetail.emit(value);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** [Event] Image Viewer */
|
||||||
onImageViewer(value: FileInfo) {
|
onImageViewer(value: FileInfo) {
|
||||||
this.imageViewer.emit(value);
|
this.imageViewer.emit(value);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** [Event] Attach File Save & Save As */
|
||||||
onSave(value: { fileInfo: FileInfo; type: string }) {
|
onSave(value: { fileInfo: FileInfo; type: string }) {
|
||||||
this.save.emit(value);
|
this.save.emit(value);
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { NgModule, ModuleWithProviders } from '@angular/core';
|
import { NgModule, ModuleWithProviders } from '@angular/core';
|
||||||
import { CommonModule } from '@angular/common';
|
import { CommonModule, DatePipe } from '@angular/common';
|
||||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
||||||
|
|
||||||
import { FlexLayoutModule } from '@angular/flex-layout';
|
import { FlexLayoutModule } from '@angular/flex-layout';
|
||||||
@ -49,6 +49,7 @@ const COMPONENTS = [
|
|||||||
MBVideoConferenceComponent
|
MBVideoConferenceComponent
|
||||||
];
|
];
|
||||||
const SERVICES = [];
|
const SERVICES = [];
|
||||||
|
const PROVIDERS = [DatePipe];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [
|
imports: [
|
||||||
@ -62,7 +63,8 @@ const SERVICES = [];
|
|||||||
MatButtonModule
|
MatButtonModule
|
||||||
],
|
],
|
||||||
exports: [...COMPONENTS],
|
exports: [...COMPONENTS],
|
||||||
declarations: [...COMPONENTS]
|
declarations: [...COMPONENTS],
|
||||||
|
providers: [...PROVIDERS]
|
||||||
})
|
})
|
||||||
export class UCapUiChatModule {
|
export class UCapUiChatModule {
|
||||||
public static forRoot(): ModuleWithProviders<UCapUiChatModule> {
|
public static forRoot(): ModuleWithProviders<UCapUiChatModule> {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user