contract-personinfo.html

<ion-header>
  <ion-navbar>
    <ion-title>个人信息</ion-title>

    <ion-buttons start>
      <button ion-button (click)="editCancel()">
        <span start *ngIf="edit"   class="margin-right-10 color-fff">取消</span>
      </button>
    </ion-buttons>
    <ion-buttons end>
      <button ion-button (click)="editDone()">
        <span end *ngIf="edit"  class="margin-right-10 color-fff">完成</span>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>


<ion-content class="content">


  <ion-list>
    <p class="person-tips">基础信息(如需修改，请联系人事处)</p>
    <ion-item>
      <div class="info-item">
        <span class="info-span">头像</span>
        <div class="info-item-content">
          <ng-container *ngIf="contactPersonInfo?.picUrl && contactPersonInfo?.picUrl != ''">
            <img src="{{picture+contactPersonInfo.picUrl}}" class="contact-img">
          </ng-container>
          <ng-container *ngIf="!contactPersonInfo?.picUrl || contactPersonInfo?.picUrl == ''">
            <img src="./assets/imgs/head.png" class="contact-img" >
          </ng-container>
        </div>
      </div>
    </ion-item>
    <ion-item>
      <div class="info-item">
        <span class="info-span">姓名</span>
        <div class="info-item-content">
          <span class="info">{{contactPersonInfo.name}}</span>
        </div>
      </div>
    </ion-item>
    <ion-item>
      <div class="info-item">
        <span class="info-span">手机号</span>
        <div class="info-item-content">
          <span class="info">{{contactPersonInfo.mobile}}</span>
        </div>
      </div>
    </ion-item>
    <ion-item>
      <div class="info-item">
        <span class="info-span">性别</span>
        <div class="info-item-content">
          <span class="info">
            <span *ngIf="contactPersonInfo.gender == '1' || contactPersonInfo.gender == null">男</span>
            <span *ngIf="contactPersonInfo.gender == 0">女</span>
          </span>
        </div>
      </div>
    </ion-item>
    <p  class="person-tips">补充信息</p>
    <ion-item>
      <div class="info-item">
        <span class="info-span">房间号</span>
        <div class="info-item-content">

          <ng-container *ngIf="(role.includes(1)|| role.includes(5)) && orgName == nowOrgName">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="abbreviation">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>
          <ng-container *ngIf="role.includes(2) && orgName == nowOrgName">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="abbreviation">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>
          <ng-container *ngIf="role.includes(3)">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="abbreviation">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>
          <ng-container *ngIf="role.includes(0) && role.length == 1">
            {{abbreviation}}
          </ng-container>
        </div>
      </div>
    </ion-item>
    <ion-item>
      <div class="info-item">
        <span class="info-span">座机</span>
        <div  class="info-item-content" >
          <ng-container *ngIf="(role.includes(1) || role.includes(5)) && orgName == nowOrgName">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="telephone">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>
          <ng-container *ngIf="role.includes(2) && orgName == nowOrgName">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="telephone">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>
          <ng-container *ngIf="role.includes(3)">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="telephone">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>
          <ng-container *ngIf="role.includes(0) && role.length == 1">
            {{telephone}}
          </ng-container>
        </div>
      </div>
    </ion-item>


    <ion-item>
      <div class="info-item">
        <span class="info-span">邮箱</span>
        <div  class="info-item-content">
          <ng-container *ngIf="(role.includes(1) || role.includes(5)) && orgName == nowOrgName">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="email">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>
          <ng-container *ngIf="role.includes(2) && orgName == nowOrgName">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="email">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>

          <ng-container *ngIf="role.includes(3)">
            <label  (click)="editFun()">
              <input type="text" [(ngModel)]="email">
              <ion-icon ios="ios-create-outline" md="md-create-outline"></ion-icon>
            </label>
          </ng-container>
          <ng-container *ngIf="role.includes(0) && role.length == 1">
            {{email}}
          </ng-container>
        </div>
      </div>
    </ion-item>
  </ion-list>


  <button class="call-btn" (click)="call(contactPersonInfo.telephone)">拨打座机</button>

  <button class="call-btn" (click)="call(contactPersonInfo.mobile)">拨打手机</button>

  <button class="call-btn" (click)="addcontactPersons()" *ngIf="isContact == 0">添加常用联系人</button>

  <button class="call-btn" (click)="cancelGenaralPersons()" *ngIf="isContact == 1">移除常用联系人</button>

  <button class="call-btn" (click)="usualContactSet()">设置分组</button>

</ion-content>