diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.scss b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.scss
index a1758367..236c426b 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.scss
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.scss
@@ -2,6 +2,7 @@
display: flex;
flex-direction: row;
padding: 14px;
+ min-width: 200px;
.file-img {
display: inline-flex;
width: 50px;
@@ -102,13 +103,13 @@
height: 100%;
}
}
- &.expired{
- li{
- width:100%;
+ &.expired {
+ li {
+ width: 100%;
white-space: nowrap;
- color:#999999;
+ color: #999999;
align-items: center;
- line-height:40px;
+ line-height: 40px;
}
}
}
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/file.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/file.component.ts
index 1c089d36..9e889c19 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/file.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/file.component.ts
@@ -51,10 +51,14 @@ export class FileComponent implements OnInit {
}
onClickFileViewer(fileInfo: FileEventJson) {
- this.fileViewer.emit(fileInfo);
+ if (!this.getExpiredFile()) {
+ this.fileViewer.emit(fileInfo);
+ }
}
onSave(value: string) {
- this.save.emit({ fileInfo: this.fileInfo, type: value });
+ if (!this.getExpiredFile()) {
+ this.save.emit({ fileInfo: this.fileInfo, type: value });
+ }
}
}
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.html
index 08f637dc..cc124b16 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.html
@@ -1,3 +1,10 @@
-
+
+
+ 기간이 만료된 파일입니다
+
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.scss b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.scss
index b8b6c028..5d3d13e0 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.scss
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.scss
@@ -1,7 +1,24 @@
-.bubble-main{
- padding:10px;
- img{
- height:140px;
- width:auto;
+.bubble-main {
+ padding: 10px;
+ position: relative;
+
+ img {
+ height: 140px;
+ width: auto;
}
-}
\ No newline at end of file
+
+ .expired-text {
+ position: absolute;
+ background-color: rgb(255, 255, 255, 0.6);
+ width: calc(100% - 20px);
+ height: calc(100% - 20px);
+ text-align: center;
+ display: table;
+
+ span {
+ color: #666666;
+ display: table-cell;
+ vertical-align: middle;
+ }
+ }
+}
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.ts
index 0c66d5fa..1416288b 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/image.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, Input } from '@angular/core';
+import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
import { NGXLogger } from 'ngx-logger';
import { FileEventJson } from '@ucap-webmessenger/protocol-event';
@@ -13,7 +13,24 @@ export class ImageComponent implements OnInit {
@Input()
expired = false;
+ showExpired = false;
+
constructor(private logger: NGXLogger) {}
ngOnInit() {}
+
+ mouseEnter(event: MouseEvent): void {
+ if (this.expired) {
+ this.showExpired = true;
+ }
+ event.stopPropagation();
+ event.preventDefault();
+ }
+ mouseLeave(event: MouseEvent): void {
+ if (this.expired) {
+ this.showExpired = false;
+ }
+ event.stopPropagation();
+ event.preventDefault();
+ }
}