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

2019-12-09 13:42:48 +09:00 · 2019-12-09 13:42:48 +09:00 · 5c05a04cca
commit 5c05a04cca
parent e927163f95 73d7f181ea
6 changed files with 148 additions and 38 deletions
--- a/projects/ucap-webmessenger-ui-message/src/lib/components/write.component.html
+++ b/projects/ucap-webmessenger-ui-message/src/lib/components/write.component.html
@ -10,6 +10,7 @@
        class="ucap-message-write-editor"
        contenteditable="true"
        (paste)="onPasteEditor($event)"
+        (input)="onInputEditor()"
      ></div>
      <input type="file" #fileInput style="display: none" multiple />
      <mat-list>
@ -52,6 +53,15 @@
        </button>
      </div>
      <div class="editor-actions-spacer"></div>
+      <div>
+        <span
+          [class.editor-length-invalid]="
+            0 === contentLength || 1000 < contentLength
+          "
+          >{{ contentLength }}</span
+        >/1000
+      </div>
+      <div class="editor-actions-spacer"></div>
      <div class="editor-actions">
        <button
          mat-stroked-button
@ -67,10 +77,18 @@
          </button>
        </mat-menu>

-        <ucap-split-button [menu]="appMenu" (buttonClick)="onClickSend()"
+        <ucap-split-button
+          [menu]="appMenu"
+          (buttonClick)="onClickSend()"
+          [disabled]="
+            messageWriteForm.invalid ||
+            !receiverList ||
+            0 === receiverList.length ||
+            0 === contentLength ||
+            1000 < contentLength
+          "
          >보내기</ucap-split-button
        >
-        <!-- [disabled]="messageWriteForm.invalid" -->
      </div>
    </mat-card-actions>
  </form>
--- a/projects/ucap-webmessenger-ui-message/src/lib/components/write.component.scss
+++ b/projects/ucap-webmessenger-ui-message/src/lib/components/write.component.scss
@ -22,12 +22,10 @@
    }

    [contenteditable] {
-      transition: padding 0.3s ease-in-out;
    }

    [contenteditable]:hover,
    [contenteditable]:focus {
-      padding: 0.25em;
    }

    [contenteditable]:hover {
@ -39,6 +37,10 @@
    }
  }

+  .editor-length-invalid {
+    color: crimson;
+  }
+
  mat-card-actions {
    display: flex;
    width: 100%;
--- a/projects/ucap-webmessenger-ui-message/src/lib/components/write.component.ts
+++ b/projects/ucap-webmessenger-ui-message/src/lib/components/write.component.ts
@ -77,6 +77,7 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {
  attachmentList: File[];
  fileUploadItem: FileUploadItem;
  receiverList: UserInfo[] = [];
+  contentLength = 0;

  constructor(
    private formBuilder: FormBuilder,
@ -87,8 +88,7 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {

  ngOnInit() {
    this.messageWriteForm = this.formBuilder.group({
-      receiverList: ['', [Validators.required]],
-      title: ['', [Validators.required]]
+      title: ['', []]
    });
  }

@ -143,9 +143,15 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {
    );
    this.insertNode(text, true);

+    this.checkContentLength();
+
    return false;
  }

+  onInputEditor() {
+    this.checkContentLength();
+  }
+
  onRemovedReceiver(receiver: UserInfo) {
    const index = this.receiverList.indexOf(receiver);

@ -183,32 +189,39 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {
    }
  }

-  private sendMessage(reservationDate?: moment.Moment) {
-    const contentList: Content[] = this.generateContent();
-    if (!contentList || 0 === contentList.length) {
+  private checkContentLength() {
+    const result = this.parseContent();
+    if (!result) {
      return;
    }

-    const listOrder: ContentType[] = [];
-    const textContent: { text: string }[] = [];
-    const recvUserList: { userSeq: number; userName: string }[] = [];
-    const files: File[] = [];
-    const title = this.messageWriteForm.get('title').value;
+    const { textContent } = result;

-    contentList.forEach(v => {
-      listOrder.push(v.contentType);
-      switch (v.contentType) {
-        case ContentType.Text:
-          textContent.push({ text: v.content as string });
-          break;
-        case ContentType.Image:
-        case ContentType.AttachFile:
-          files.push(v.content as File);
-          break;
-        default:
-          break;
-      }
+    if (!textContent || 0 === textContent.length) {
+      this.contentLength = 0;
+    } else {
+      let len = 0;
+      textContent.forEach(c => {
+        len += c.text.length;
      });
+      this.contentLength = len;
+    }
+  }
+
+  private sendMessage(reservationDate?: moment.Moment) {
+    const result = this.parseContent();
+    if (!result) {
+      return;
+    }
+
+    const { listOrder, textContent, files } = result;
+
+    if (!listOrder || 0 === listOrder.length) {
+      return;
+    }
+
+    const recvUserList: { userSeq: number; userName: string }[] = [];
+    const title = this.messageWriteForm.get('title').value;

    this.receiverList.forEach(v => {
      recvUserList.push({
@ -234,6 +247,48 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {
    });
  }

+  private parseContent():
+    | {
+        listOrder: ContentType[];
+        textContent: { text: string }[];
+        files: File[];
+      }
+    | undefined {
+    const contentList: Content[] = this.generateContent();
+    if (!contentList || 0 === contentList.length) {
+      return;
+    }
+
+    const listOrder: ContentType[] = [];
+    const textContent: { text: string }[] = [];
+    const files: File[] = [];
+
+    contentList.forEach(v => {
+      listOrder.push(v.contentType);
+      switch (v.contentType) {
+        case ContentType.Text:
+          let content = v.content as string;
+          if ('\n' === content.charAt(content.length - 1)) {
+            content = content.substring(0, content.length - 2);
+          }
+          textContent.push({ text: content });
+          break;
+        case ContentType.Image:
+        case ContentType.AttachFile:
+          files.push(v.content as File);
+          break;
+        default:
+          break;
+      }
+    });
+
+    return {
+      listOrder,
+      textContent,
+      files
+    };
+  }
+
  private generateContent(): Content[] {
    const contentList: Content[] = [];

--- a/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.html
+++ b/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.html
@ -101,14 +101,30 @@
    </div>
  </mat-card-content>
  <mat-card-actions>
-    <div class="editor-actions-spacer"></div>
-    <div class="editor-actions">
-      <button mat-stroked-button (click)="onClickCancel()" class="mat-primary">
+    <div class="actions-container">
+      <div class="actions-message">
+        <span *ngIf="dateIsToEarly">
+          현재 시각으로부터 30분 이후로만 설정 가능합니다.
+        </span>
+      </div>
+      <div class="actions-spacer"></div>
+      <div class="actions">
+        <button
+          mat-stroked-button
+          (click)="onClickCancel()"
+          class="mat-primary"
+        >
          취소
        </button>
-      <button mat-stroked-button (click)="onClickSend()" class="mat-primary">
+        <button
+          mat-stroked-button
+          [disabled]="dateIsToEarly"
+          (click)="onClickSend()"
+          class="mat-primary"
+        >
          예약 발송
        </button>
      </div>
+    </div>
  </mat-card-actions>
 </mat-card>
--- a/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.scss
+++ b/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.scss
@ -1,3 +1,18 @@
 .preset-button {
  width: 100%;
 }
+
+.actions-container {
+  display: flex;
+  position: fixed;
+
+  .actions-message {
+  }
+
+  .actions-spacer {
+    flex: 1 1 auto;
+  }
+
+  .actions {
+  }
+}
--- a/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.ts
+++ b/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.ts
@ -23,6 +23,8 @@ export class ScheduleSendDialogComponent implements OnInit {
  hourStep = 1;
  minuteStep = 10;

+  dateIsToEarly = false;
+
  get selectedDate() {
    return this._selectedDate;
  }
@ -31,6 +33,8 @@ export class ScheduleSendDialogComponent implements OnInit {
      this.minuteStep * Math.round(v.minute() / this.minuteStep)
    );
    this._selectedDate = v;
+    const aa = moment().add(30, 'minutes');
+    this.dateIsToEarly = v.isBefore(moment().add(30, 'minutes'));
  }
  // tslint:disable-next-line: variable-name
  private _selectedDate: moment.Moment;
@ -59,10 +63,10 @@ export class ScheduleSendDialogComponent implements OnInit {
  }

  onHourSelected(hour: number) {
-    this.selectedDate.hour(hour);
+    this.selectedDate = this.selectedDate.hour(hour);
  }
  onMinuteSelected(minute: number) {
-    this.selectedDate.minute(minute);
+    this.selectedDate = this.selectedDate.minute(minute);
  }

  onClickPresetTommorowMorning() {