Sinopec-Anxin/src/app/pages/left-domain/left-domain.component.html

<div class="childContent">

  <div class="childCenter">
    <!-- 基本信息 -->
    <div class="publicBox baseInfo" *ngIf="beforeFence === 0">
      <div class="interval">
        <p class="title">北京市第十九加油站<button class="titleBotton">自营</button></p>
        <p class="text"><img src="../../../assets/images/baseInfo/position.png" class="textIcon">北京市朝阳区朝外大街关东店33号</p>
        <p class="text"><img src="../../../assets/images/baseInfo/building.png" class="textIcon">山东省淄博市</p>
        <p class="text"><img src="../../../assets/images/baseInfo/date.png" class="textIcon">2020.7.26开业</p>
        <p class="text"><img src="../../../assets/images/baseInfo/road.png" class="textIcon">4车道</p>
      </div>
      <div class="interval">
        <p class="title">营业执照</p>
        <p class="textImage"><img src="../../../assets/images/upload.png"></p>
      </div>
    </div>
    <!-- 基本信息 -->
    <!-- 加油机 -->
    <div class="publicBox refueller" *ngIf="beforeFence === 1">
      <div class="interval">
        <p class="title">1类加油机</p>
        <div class="table">
          <div class="tableHeader">
            <p>品牌</p>
            <p>超大牌</p>
            <p>油枪数量</p>
            <p>油品品号</p>
            <p>油泵类型</p>
          </div>
          <div class="tableContent">
            <p>超大牌</p>
            <p>2</p>
            <p>4</p>
            <p>92#</p>
            <p>自吸泵</p>
          </div>
        </div>
      </div>
    </div>
    <!-- 加油机 -->
    <!-- 油罐设备 -->
    <div class="publicBox refueller oilTank" *ngIf="beforeFence === 2">
      <div class="interval">
        <p class="title">1号油罐</p>
        <div class="table">
          <div class="tableHeader">
            <p>油品品号</p>
            <p>油罐容积</p>
            <p>安全容积</p>
            <p>数量</p>
            <p>罐区</p>
            <p>油罐类型</p>
          </div>
          <div class="tableContent">
            <p>92#</p>
            <p>200L</p>
            <p>180L</p>
            <p>1</p>
            <p>独立罐区</p>
            <p>防渗罐池</p>
          </div>
        </div>
      </div>
    </div>
    <!-- 油罐设备 -->
    <!-- 消防设施 -->
    <div class="publicBox fireFacilities" *ngIf="beforeFence === 3">
      <nz-tree [nzData]="treeData" [nzTreeTemplate]="nzTreeTemplate" (nzClick)="nzClick($event)"></nz-tree>
      <ng-template #nzTreeTemplate let-node let-origin="origin">
        <div class="treeRow"><p>{{node.title}}</p><p><i nz-icon nzType="eye" nzTheme="outline" *ngIf="node.isSelected"></i>{{getFacilityNum(node.key)}}</p></div>
      </ng-template>
    </div>
    <!-- 消防设施 -->
  </div>

  <div class="childBottom" *ngIf="beforeFence === 0">
    <button (click)="editInfo()"><i nz-icon nzType="edit" nzTheme="outline"></i>编辑信息</button>
    <button (click)="deriveExcel()"><i nz-icon nzType="file-excel" nzTheme="outline"></i>导出Excel</button>
  </div>

</div>