ShangHaiYuan-AnXin/src/app/plan-audit/wait-examineer/wait-examineer.component.html

<div class="box">
  <div class="boxleft">
    <div class="lefthead">
      <form (ngSubmit)="onSubmit(form.value)" #form="ngForm">
        <div class="headdiv" style="margin-top: 30px;">
          <span>操作类型：</span>
          <input type="radio" name="level" value="" [(ngModel)]="level"><span>全部</span>
          <input type="radio" name="level" value="1" [(ngModel)]="level"><span>更新</span>
          <input type="radio" name="level" value="0" [(ngModel)]="level"><span>新增</span>
          <input type="radio" name="level" value="2" [(ngModel)]="level"><span>删除</span>
          <div class="count">
            <span>共计：{{count}}条</span>
          </div>
        </div>
        <div class="headthree">
          <div class="headthreeone">
            <span>类型：</span>
            <mat-form-field>
              <mat-select placeholder='请选择单位类型' name="unittype" [(ngModel)]="projectlevel">
                <!-- <mat-option value="1">Ⅰ级预案</mat-option>
                <mat-option value="2">Ⅱ级预案</mat-option> -->
                <mat-option value="3">Ⅲ级预案</mat-option>
                <mat-option value="4">Ⅳ级预案</mat-option>
                <mat-option value="5">Ⅴ级预案</mat-option>
                <!-- <mat-option value="6">应急预案(国家级)</mat-option>
                <mat-option value="7">应急预案(市级)</mat-option>
                <mat-option value="8">类型预案</mat-option> -->
                <mat-option value="11">重点单位</mat-option>
                <!-- <mat-option value="12">消防水源</mat-option>
                <mat-option value="13">消防力量</mat-option>
                <mat-option value="14">联动力量</mat-option> -->
              </mat-select>
            </mat-form-field>
            <span class="bzjb">编制级别：</span>
            <mat-form-field>
              <mat-select name="preparelevel" placeholder='请选择编制级别' [(ngModel)]="PlanLevel">
                <mat-option *ngFor="let item of preparelevels" [value]="item.value">{{item.name}}</mat-option>
              </mat-select>
            </mat-form-field>
          </div>
          <div class="headthreetwo">
            <span>状态：</span>
            <mat-form-field>
              <mat-select placeholder='请选择状态' name="IsNewData" [(ngModel)]="IsNewData" [multiple]="true">
                <mat-option value=true>新增</mat-option>
                <mat-option value=false>维护更新</mat-option>
              </mat-select>
            </mat-form-field>
            <span class="bzjb">预案类型：</span>
            <mat-form-field>
              <mat-select placeholder='请选择预案类型' name="unittype" [(ngModel)]="plantypes" [multiple]="true">
                <mat-option value="1">二维预案</mat-option>
                <mat-option value="2">三维预案</mat-option>
                <mat-option value="4">其他预案</mat-option>
                <mat-option value="16">文本预案</mat-option>
              </mat-select>
            </mat-form-field>
          </div>
        </div>
        <div class="btnbox">
          <button mat-raised-button color="primary" type="submit">查询</button>
          <button mat-raised-button color="primary" type="button" (click)='record()'>重置</button>
        </div>
      </form>


    </div>
    <div class="tablediv">
      <table class="theader" cellspacing="0" cellpadding="0" style="margin-top: 10px;margin-bottom: 5px;">
        <thead>
          <th style="width: 10%;margin-left: 5px;">状态</th>
          <th style="width: 10%;">类型</th>
          <th style="width: 10%;">预案类型</th>
          <th style="width: 15%;">名称</th>
          <th style="width: 5%;">操作</th>
          <th style="width: 20%;">所属组织</th>
          <th style="width: 10%;">审核状态</th>
          <th style="width: 7%;">提交人</th>
          <th style="width: 13%;">提交时间</th>
        </thead>
      </table>
      <div class="tbodycss" id="tbodydiv">
        <table cellspacing="0" cellpadding="0" id="table">
          <tr [ngClass]="{'selectedTr': item.id == id}" *ngFor="let item of tableDate;let key = index"
            (click)='radioClick($event,item)'>
            <td style="width: 10%;"
              [ngClass]="{'green': item.itemMaintenanceState == '0','yellow':item.itemMaintenanceState != '0'}">
              <mat-checkbox color="primary" (change)='radioClick($event,item)' style="float: left;margin-bottom:'2px'">
              </mat-checkbox>
              {{item.itemMaintenanceState=='0'?'新增':'维护'}}
            </td>
            <td style="width: 10%;">

              {{item.contentType=='1'?'Ⅰ级预案':item.contentType=='2'?'Ⅱ级预案':item.contentType=='3'?'Ⅲ级预案':item.contentType=='4'?'Ⅳ级预案':item.contentType=='5'?
              'Ⅴ级预案':item.contentType=='6'?'应急预案（国家级）':item.contentType=='7'?'应急预案（市级）':item.contentType=='8'?'类型预案':item.contentType=='11'?'重点单位':item.contentType=='12'?'水源':item.contentType=='13'?'消防力量':item.contentType=='14'?'联动力量':'未知'}}
            </td>
            <td style="width: 10%;">
              {{item.planType=='1'?'二维预案':item.planType=='2'?'三维预案':item.planType=='4'?'其它预案':item.planType=='16'?'文本预案':''}}
            </td>
            <td style="width: 15%;">{{item.title}}</td>
            <td style="width: 5%;"
              [ngClass]="{'green': item.operation == '0','red':item.operation == '2','yellow':item.operation == '1'}">
              {{item.operation=='0'?'新增':item.operation=='1'?'更新':'删除'}}</td>
            <td style="width: 20%;">{{item.organizationName}}</td>
            <td style="width: 10%;"
              [ngClass]="{'green': item.verifyState == '1'||item.verifyState == '4','red':item.verifyState == '2'||item.verifyState == '5'}">
              {{item.verifyState=='0'?'待初审':item.verifyState=='1'?
              '初审通过':item.verifyState=='2'?'初审驳回':item.verifyState=='3'?'待终审':item.verifyState=='4'?'终审通过':'终审驳回'}}
            </td>
            <td style="width: 7%;">{{item.creatorName}}</td>
            <td style="width: 13%;">{{item.createTime|date:'yyyy-MM-dd'}}</td>
          </tr>
        </table>
        <mat-paginator [length]="count" [pageIndex]="PageNumber - 1" [pageSize]="10" (page)="chagePage($event)">
        </mat-paginator>
      </div>
    </div>
    <div class="mask" *ngIf="isTableData">
      <mat-spinner [diameter]="30"></mat-spinner>
    </div>
  </div>

  <div class="boxright" id="waitexamineergis">
    <!-- 头部按钮栏 -->
    <div class="righthead">
      <div class="rightheadtwo">
        <button mat-raised-button color="primary" style="float: right;" (click)='lookNew()'
          *ngIf="showtype == 0||bianzhi">查看详情</button>
        <button mat-raised-button style="color: #FFFFFF;background-color: #FF7161;float: right;"
          (click)='refuse()'>拒绝</button>
        <button mat-raised-button style="color: #FFFFFF;background-color: #38D984;float: right;"
          (click)='agree()'>同意</button>
      </div>
      <div class="rightheadone" style="display: block;" *ngIf="showtype == 3">
        <button mat-raised-button color="primary" (click)="buttonChange()">{{isallDate?'显示变更数据':'显示完整数据'}} </button>
        <!-- <button mat-raised-button *ngIf="isallDate" style="background-color: #FFCC00; color: #FFFFFF;"
          (click)="preview()"><img src="../../../assets/images/change.png" style="margin-bottom: 2px;"> 预览得分</button> -->
      </div>
    </div>

    <!-- 数据变更div -->
    <div *ngIf="!isallDate" style="flex: 1;overflow-y: auto;">
      <div *ngIf="showtype == 3" id="firefacilities" style="margin: 10px;">
        <mat-accordion *ngIf="selectedItem.differentContent" class="tableContent" multi>
          <!-- 基本信息 -->
          <mat-expansion-panel
            *ngIf="this.differentContentOfUnitInfo && this.differentContentOfUnitInfo.length != 0 && this.differentContentOfUnitInfo[0].childrens.length != 0"
            expanded>
            <mat-expansion-panel-header collapsedHeight='40px' expandedHeight='40px' class="panelhead"
              style="background-color: #2196F3;">
              <mat-panel-title style="font-size: 16px;color: #FFFFFF;">
                基本信息
              </mat-panel-title>
            </mat-expansion-panel-header>
            <div class="accordingin">
              <mat-accordion>
                <mat-expansion-panel expanded hideToggle>
                  <mat-expansion-panel-header collapsedHeight='30px' expandedHeight='30px' class="panelhead">
                    <mat-panel-title style="font-size: 16px;color:#2196F3;">
                      <mat-icon style="font-size: 18px;width: 18px;height: 18px;">border_color</mat-icon>
                      <span>修改-{{selectedItem.title}}</span>
                    </mat-panel-title>
                  </mat-expansion-panel-header>
                  <table>
                    <tr *ngFor="let i of this.differentContentOfUnitInfo[0].childrens">
                      <th>{{i.displayName}} ：</th>
                      <ng-container *ngIf="i.propertyName == 'imageUrl'; else elseTemplate">
                        <td>
                          <span class="spantext" style="vertical-align: top;">由</span>
                          <img (click)="lookImg(i.oldValue,true)" class="spantext" style="width: 150px;height: 105px;"
                            [src]="i.oldValue ? i.oldValue : '/assets/images/noImg.png'" alt="">
                          <span class="spantext" style="vertical-align: top;">变更为</span>
                          <img (click)="lookImg(i.newValue,true)" class="spantext" style="width: 150px;height: 105px;"
                            [src]="i.newValue ? i.newValue : '/assets/images/noImg.png'" alt="">
                        </td>
                      </ng-container>
                      <ng-template #elseTemplate>
                        <ng-container *ngIf="i.propertyName == 'location'; else elseTemplate">
                          <td>
                            <span class="spantext buleColor">
                              {{i.displayName}} 发生变化
                            </span>
                          </td>

                        </ng-container>
                        <ng-template #elseTemplate>
                          <td>
                            <span class="spantext">由</span>
                            <span class="spantext buleColor">{{i.oldValue | differentContentTitle}}</span>
                            <span class="spantext">变更为</span>
                            <span class="spantext buleColor">{{i.newValue | differentContentTitle}}</span>
                          </td>
                        </ng-template>
                      </ng-template>
                    </tr>
                  </table>
                </mat-expansion-panel>
              </mat-accordion>
            </div>
          </mat-expansion-panel>
          <!-- 建筑信息 -->
          <mat-expansion-panel
            *ngIf="this.differentContentOfBuildingsInfo && this.differentContentOfBuildingsInfo.childrens.length != 0"
            expanded>
            <mat-expansion-panel-header collapsedHeight='40px' expandedHeight='40px' class="panelhead"
              style="background-color: #2196F3;">
              <mat-panel-title style="font-size: 16px;color: #FFFFFF;">
                建筑信息
              </mat-panel-title>
            </mat-expansion-panel-header>
            <div class="accordingin">
              <mat-accordion *ngFor="let item of this.differentContentOfBuildingsInfo.childrens">
                <mat-expansion-panel expanded hideToggle>
                  <mat-expansion-panel-header collapsedHeight='30px' expandedHeight='30px' class="panelhead">
                    <mat-panel-title style="font-size: 16px;color:#2196F3;">
                      <mat-icon style="font-size: 18px;width: 18px;height: 18px;">border_color</mat-icon>
                      <span>{{item.propertyName}}
                        -<span *ngIf="item.operation == 1">修改</span>
                        <span *ngIf="item.operation == 0">新增</span>
                        <span *ngIf="item.operation == 2">删除</span>
                      </span>
                    </mat-panel-title>
                  </mat-expansion-panel-header>
                  <table>
                    <tr *ngFor="let i of item.difData">
                      <th>{{i.path[i.path.length - 2]}}-{{i.path[i.path.length - 1]}}：</th>
                      <td>
                        <span class="spantext">由</span>
                        <span class="spantext buleColor">{{i.oldValue | differentContentTitle}}</span>
                        <span class="spantext">变更为</span>
                        <span class="spantext buleColor">{{i.newValue | differentContentTitle}}</span>
                      </td>
                    </tr>
                  </table>
                </mat-expansion-panel>
              </mat-accordion>
            </div>
          </mat-expansion-panel>
          <!-- 功能分区 -->
          <mat-expansion-panel *ngIf="this.differentContentOfFunction && this.differentContentOfFunction.length != 0"
            expanded>
            <mat-expansion-panel-header collapsedHeight='40px' expandedHeight='40px' class="panelhead"
              style="background-color: #2196F3;">
              <mat-panel-title style="font-size: 16px;color: #FFFFFF;">
                功能分区
              </mat-panel-title>
            </mat-expansion-panel-header>
            <div class="accordingin">
              <mat-accordion *ngFor="let item of this.differentContentOfFunction">
                <mat-expansion-panel expanded hideToggle>
                  <mat-expansion-panel-header collapsedHeight='30px' expandedHeight='30px' class="panelhead">
                    <mat-panel-title style="font-size: 16px;color:#2196F3;">
                      <mat-icon style="font-size: 18px;width: 18px;height: 18px;">border_color</mat-icon>
                      <span>{{item.propertyName}}</span>
                    </mat-panel-title>
                  </mat-expansion-panel-header>
                  <table>
                    <tr *ngFor="let i of item.childrens[0].childrens">
                      <th>{{i.displayName}} ：</th>
                      <td>
                        <span class="spantext">由</span>
                        <span class="spantext buleColor">{{i.oldValue | differentContentTitle}}</span>
                        <span class="spantext">变更为</span>
                        <span class="spantext buleColor">{{i.newValue | differentContentTitle}}</span>
                      </td>
                    </tr>
                  </table>
                </mat-expansion-panel>
              </mat-accordion>
            </div>
          </mat-expansion-panel>
          <!-- 实景图 -->
          <mat-expansion-panel
            *ngIf="this.differentContentOfPicture && this.differentContentOfPicture.length != 0 && this.differentContentOfPicture[0].childrens.length != 0"
            expanded>
            <mat-expansion-panel-header collapsedHeight='40px' expandedHeight='40px' class="panelhead"
              style="background-color: #2196F3;">
              <mat-panel-title style="font-size: 16px;color: #FFFFFF;">
                实景图
              </mat-panel-title>
            </mat-expansion-panel-header>
            <div class="accordingin">
              <mat-accordion *ngFor="let item of this.differentContentOfPicture[0].childrens">
                <mat-expansion-panel expanded hideToggle>
                  <mat-expansion-panel-header collapsedHeight='30px' expandedHeight='30px' class="panelhead">
                    <mat-panel-title style="font-size: 16px;color:#2196F3;">
                      <mat-icon style="font-size: 18px;width: 18px;height: 18px;">border_color</mat-icon>
                      <!-- 文件夹名字 -->
                      <span *ngIf="item.operation == 1">修改</span>
                      <span *ngIf="item.operation == 0">新增</span>
                      <span *ngIf="item.operation == 2">删除</span>
                      文件夹 -
                      <span>{{item.propertyName}}</span>

                    </mat-panel-title>
                  </mat-expansion-panel-header>
                  <!-- 新增文件夹 -->
                  <table *ngIf="item.operation == 0" class="addFiles">
                    <tr>
                      <th>新增图片</th>
                      <td>
                        <img (click)="lookImg(i.imageUrl)" *ngFor="let i of item.newValue"
                          [src]="'/api/Objects/PlanPlatform/'+i.imageUrl" alt="">
                      </td>
                    </tr>
                  </table>
                  <!-- 修改文件夹内容 -->
                  <table *ngIf="item.operation == 1" class="addFiles">
                    <tr *ngFor="let i of item.childrens[0].childrens">
                      <th *ngIf="i.operation == '0'">新增图片</th>
                      <th *ngIf="i.operation == '1'">修改图片名称</th>
                      <th *ngIf="i.operation == '2'">删除图片</th>
                      <td *ngIf="i.operation != '1'">
                        <img (click)="lookImg(i.newValue)" [src]="'/api/Objects/PlanPlatform/'+i.newValue" alt="">
                      </td>
                      <td *ngIf="i.operation == '1'">
                        <span class="spantext">由</span>
                        <span class="spantext buleColor">{{i.childrens[0].oldValue}}</span>
                        <span class="spantext">变更为</span>
                        <span class="spantext buleColor">{{i.childrens[0].newValue}}</span>
                      </td>

                    </tr>
                  </table>
                </mat-expansion-panel>
              </mat-accordion>
            </div>
          </mat-expansion-panel>
        </mat-accordion>
      </div>
    </div>

    <!-- 点击每条表格右边显示内容 -->
    <div style="height: 100%;" *ngIf="isallDate">
      <!-- word文档 -->
      <div class="word" *ngIf="showtype == 0">
        <div class="shadow" *ngIf="!iftrue">
          <mat-spinner [diameter]="30"></mat-spinner>
        </div>
        <iframe [src]='iframeSrc' (load)='ifranmeLoad()' id="myiframe"></iframe>
      </div>
      <!-- 全景图 -->
      <div id="viewer" *ngIf="showtype == 1"></div>
      <div class="twoD" *ngIf="showtype == 2">
        <div class="planBox">
          <span>单位名称: </span>
          <span>{{compantData.name?compantData.name : '暂无数据'}}</span>
        </div>
        <div class="planBox">
          <span>消防救援站: </span>
          <span>{{organizationName}}</span>
        </div>
        <div class="planBox">
          <span>单位类型: </span>
          <span>{{compantData.buildingTypes.length?compantData.buildingTypes[0].name : '暂无数据'}}</span>
        </div>
        <div class="planBox">
          <span>单位地址: </span>
          <span>{{compantData.address?compantData.address : '暂无数据'}}</span>
        </div>
        <div class="planBox">
          <span style="color: #2196F3;cursor:pointer;" (click)='oopen3Dshow()'>查看详情</span>
        </div>

        <div class="mask" *ngIf="downloadisLoading">
          <span style="font-size: 13px;">下载中...</span>
          <mat-progress-bar mode="determinate" [value]="downloadProgress" class="progress"></mat-progress-bar>
        </div>
      </div>
      <!-- 重点单位 -->
      <div id="company" *ngIf="showtype == 3">
        <mat-tab-group class="company" [selectedIndex]="selected.value"
          (selectedIndexChange)="selectedIndexChange($event)">
          <mat-tab label="基本信息">
            <ng-template matTabContent>
              <app-basic-info></app-basic-info>
            </ng-template>
          </mat-tab>
          <mat-tab label="总平面图">
            <ng-template matTabContent>
              <app-plan-list [planType]="planTypeIndex"></app-plan-list>
            </ng-template>
          </mat-tab>
          <mat-tab label="层平面图">
            <ng-template matTabContent>
              <app-plan-list [planType]="planTypeIndex"></app-plan-list>
            </ng-template>
          </mat-tab>
          <mat-tab label="四周毗邻">
            <ng-template matTabContent>
              <app-allaround></app-allaround>
            </ng-template>
          </mat-tab>
          <mat-tab label="消防设施">
            <ng-template matTabContent>
              <app-fire-facilities></app-fire-facilities>
            </ng-template>
          </mat-tab>
          <mat-tab label="重点部位">
            <ng-template matTabContent>
              <app-key-site-look></app-key-site-look>
            </ng-template>
          </mat-tab>
          <mat-tab label="功能分区">
            <ng-template matTabContent>
              <app-function-partition></app-function-partition>
            </ng-template>
          </mat-tab>
          <mat-tab label="实景图">
            <ng-template matTabContent>
              <app-realistic-picture-look></app-realistic-picture-look>
            </ng-template>
          </mat-tab>
          <mat-tab label="CAD">
            <ng-template matTabContent>
              <app-cad-draw></app-cad-draw>
            </ng-template>
          </mat-tab>
        </mat-tab-group>
      </div>
      <!-- 水源审核 -->
      <div class="waterAudit" *ngIf="showtype == 12">
        <app-water-audit [waterData]="waterData"></app-water-audit>
      </div>
      <!-- 消防力量审核 -->
      <div class="fireForceAudit" *ngIf="showtype == 13">
        <app-fireforce-audit [FireForceDetailInfo]="fireForceDetailInfo" [level]="postlevel"></app-fireforce-audit>
      </div>
      <!-- 联动力量审核 -->
      <div class="LinkageForcesAudit" *ngIf="showtype == 14">
        <app-linkageforces-audit [LinkageForceDetailInfo]="LinkageForceDetailInfo"></app-linkageforces-audit>
      </div>
      <div class="emptyContent" *ngIf="showtype == 666">
        <span>该提交内容为空，从未保存过，请驳回该审核</span>
      </div>
    </div>
  </div>
</div>

<div class="echarts" *ngIf="previewshow">
  <div class="bar" id="indexbar"></div>
  <div class="zhu" id="zhu"></div>
</div>

<div id="viewerjs">

</div>