ucap-doc/documents/업무/5월/3째주/Untitled-3.html

<div fxFlexFill class="profile-container">
  <div class="ucap-organization-profile-01-container">
    <!--Profile -->
    <div class="profile-card-box">
      <div class="user-profile-info">
        <!--[[ 대화상대 프로필-->
        <!-- 모바일이 온라인일 경우 + mobile-ing -->
        <div class="user-profile-thumb">
          <span
            class="presence"
            [ngClass]="getPresence(PresenceType.PC)"
            [matTooltip]="getPresenceMsg()"
            matTooltipPosition="after"
          ></span>
          <div class="profileImage" (click)="onProfileImageView()">
            <img
              src="../../../assets/images/ico/img_nophoto.svg"
              style="width: 122px; height: 122px;"
            />
          </div>
          <!--[[ 내프로필-->
          <div
            *ngIf="
              !!userInfo &&
              !!loginRes &&
              userInfo.seq === String(loginRes.userInfo?.seq)
            "
            class="btn-profile-ctrl"
          >
            <button
              mat-mini-fab
              color="primary"
              class="mat-mini36-fab"
              (click)="profileImageFileInput.click()"
            >
              <mat-icon class="material-icons-outlined">camera_alt</mat-icon>
            </button>
            <input
              type="file"
              #profileImageFileInput
              style="display: none;"
              (change)="onChangeFileInput()"
            />
          </div>
          <!--]]-->
        </div>
        <!--]]-->
        <div class="userInfo">
          <div class="user-n-g">
            <div class="name">{{ userInfo?.name }}</div>
            <div class="grade">{{ userInfo?.grade }}</div>
          </div>
          <div class="deptName">({{ userInfo?.nameEn }})</div>

          <ng-container
            *ngIf="
              !!userInfo &&
              !!loginRes &&
              userInfo.seq !== String(loginRes.userInfo?.seq)
            "
          >
            <!-- + 대화상대 프로필 추가 -->
            <div class="nickName">
              <div class="nickName-info">
                <mat-form-field
                  class="example-full-width my-in-input"
                  appearance="none"
                >
                  <mat-label></mat-label>
                  <input
                    #nicknameInput
                    matInput
                    placeholder="닉네임 미설정"
                    value=""
                  />
                </mat-form-field>
              </div>
              <button
                mat-icon-button
                aria-label="icon create"
                class="color-white"
                (click)="onChangeNickname(nicknameInput.value)"
              >
                <mat-icon>create</mat-icon>
              </button>
            </div>
            <!--]]-->
          </ng-container>
          <ng-container
            *ngIf="
              !!userInfo &&
                !!loginRes &&
                userInfo.seq === String(loginRes.userInfo?.seq);
              then mineProfileIntro;
              else otherProfileIntro
            "
          >
          </ng-container>
          <ng-template #otherProfileIntro>
            <div class="address-txt">
              {{ userInfo?.intro }}
            </div>
          </ng-template>
          <ng-template #mineProfileIntro>
            <div class="my-input inputtype">
              <mat-form-field
                class="example-full-width my-in-input"
                appearance="none"
              >
                <mat-label></mat-label>
                <input
                  #myProfileIntro
                  matInput
                  placeholder=""
                  value="{{ userInfo?.intro }}"
                />
              </mat-form-field>
              <button
                mat-icon-button
                aria-label="icon create"
                class="color-white"
                (click)="onChangeIntro(myProfileIntro.value)"
              >
                <mat-icon>create</mat-icon>
              </button>
            </div>
          </ng-template>
        </div>

        <div
          *ngIf="
            !!userInfo &&
            !!loginRes &&
            userInfo.seq !== String(loginRes.userInfo?.seq)
          "
          class="btn-profile-add"
        >
          <button
            mat-icon-button
            class="btn-star-add"
            aria-label="Example icon-button with a heart icon"
            *ngIf="isBuddy"
          >
            <img
              src="../../../assets/images/ico/btn_favorite_w24_s.svg"
              alt=""
            />
          </button>
          <button
            mat-icon-button
            class="btn-star-add"
            aria-label="Example icon-button with a heart icon"
          >
            <img
              src="../../../assets/images/ico/btn_group_add_w24.svg"
              alt=""
            />
          </button>
          <button
            mat-icon-button
            class="btn-star-add"
            aria-label="Example icon-button with a heart icon"
          >
            <img
              src="../../../assets/images/ico/btn_group_add_w24.svg"
              alt=""
            />
          </button>
        </div>
        <div
          *ngIf="
            !!userInfo &&
            !!loginRes &&
            userInfo.seq !== String(loginRes.userInfo?.seq)
          "
          class="btn-partner-set"
        >
          <button mat-icon-button aria-label="chat">
            <img
              src="../../../assets/images/ico/btn_lise_chat_a24.svg"
              alt=""
            />
          </button>
          <button mat-icon-button aria-label="message">
            <img
              src="../../../assets/images/ico/btn_list_message_a24.svg"
              alt=""
            />
          </button>
          <button
            mat-icon-button
            aria-label="mobile"
            (click)="onSendCall('MOBILE')"
          >
            <img
              src="../../../assets/images/ico/btn_list_mobile_a24.svg"
              alt=""
            />
          </button>
          <button
            mat-icon-button
            aria-label="call"
            (click)="onSendCall('LINE')"
          >
            <img
              src="../../../assets/images/ico/btn_list_call_a24.svg"
              alt=""
            />
          </button>
          <button mat-icon-button aria-label="vc">
            <img src="../../../assets/images/ico/btn_list_vc-a24.svg" alt="" />
          </button>
        </div>
      </div>
      <div class="user-profile-info-list">
        <ul>
          <li>
            <span>{{ 'profile.labels.company' | ucapI18n }}</span>
            {{ userInfo?.companyName }}
          </li>
          <li>
            <span>{{ 'profile.labels.department' | ucapI18n }}</span>
            {{ userInfo?.deptName }}
          </li>
          <li>
            <span>{{ 'profile.labels.email' | ucapI18n }}</span>
            {{ userInfo?.email }}
          </li>
          <li>
            <span>{{ 'profile.labels.linePhoneNumber' | ucapI18n }}</span>
            {{ userInfo?.lineNumber }}
          </li>
          <li>
            <span>{{ 'profile.labels.mobilePhoneNumber' | ucapI18n }}</span>
            {{ userInfo?.hpNumber }}
          </li>
        </ul>
      </div>
    </div>
    <!-- //Profile-->
  </div>
</div>