next-ucap-messenger/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.html

<div class="event-main bg-accent-dark">
  <div class="event-header">
    <ng-container
      *ngIf="!!message.sentMessageJson && !!message.sentMessageJson.contents"
    >
      <ng-container [ngSwitch]="message.sentMessageJson.contents">
        <ng-container *ngSwitchCase="VideoConferenceContentsType.Now">
          {{ 'chat.event.videoConferenceTypeNow' | translate }}
        </ng-container>
        <ng-container *ngSwitchCase="VideoConferenceContentsType.New">
          {{ 'chat.event.videoConferenceTypeNew' | translate }}
        </ng-container>
        <ng-container *ngSwitchCase="VideoConferenceContentsType.Update">
          {{ 'chat.event.videoConferenceTypeUpdate' | translate }}
        </ng-container>
        <ng-container *ngSwitchCase="VideoConferenceContentsType.Delete">
          {{ 'chat.event.videoConferenceTypeDelete' | translate }}
        </ng-container>
      </ng-container>
    </ng-container>
  </div>
  <ul class="event-info">
    <li class="event-date bg-accent-brightest">
      <span class="text-accent-darkest">{{
        'chat.event.videoConferenceRegister' | translate
      }}</span
      >{{ message.sentMessageJson.register }}
    </li>
    <li class="event-time bg-accent-brightest">
      <span class="text-accent-darkest">{{
        'chat.event.videoConferenceAttendee' | translate
      }}</span
      >{{ message.sentMessageJson.attendee }}
    </li>
    <li class="event-time bg-accent-brightest">
      <span class="text-accent-darkest">{{
        'chat.event.videoConferenceDate' | translate
      }}</span
      >{{
        message.sentMessageJson.startDate | ucapDate: 'YYYY.MM.DD (ddd) a hh:mm'
      }}
    </li>
    <li class="event-content">
      {{ message.sentMessageJson.title }}
    </li>
  </ul>

  <div class="btn-box">
    <ul>
      <li>
        <button mat-button (click)="onClickDetailView()">
          {{ 'chat.detailView' | translate }}
        </button>
      </li>
      <li>
        <button mat-button (click)="onClickEnjoyConference()">
          {{ 'chat.event.videoConferenceEnjoy' | translate }}
        </button>
      </li>
    </ul>
  </div>
</div>