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

<div class="box">
    <div class="boxleft">
        <div class="lefthead">
            <div class="headdiv" style="margin-top: 30px;">
                <span>操作类型：</span>
                <input type="radio" name="level"><span>全部</span> 
                <input type="radio" name="level" style="margin-left: 50px;"><span>更新</span>
                <input type="radio" name="level" style="margin-left: 50px;"><span>新增</span>
                <input type="radio" name="level" style="margin-left: 50px;"><span>删除</span>
                <span style="margin-left: 100px;">共计：80条</span>
            </div>
            <div class="headthree">
                <span>类型：</span>
                <mat-form-field>
                    <mat-select placeholder='请选择单位类型' name="unittype" [(ngModel)]="level">
                      <mat-option value="1">Ⅰ级</mat-option>
                      <mat-option value="2">Ⅱ级</mat-option>
                    </mat-select>
                </mat-form-field>
                <span style="margin-left: 30px;">编制级别：</span>
                <mat-form-field>
                    <mat-select placeholder='请选择编制级别' name="js" [(ngModel)]="js">
                      <mat-option value="1">Ⅰ级</mat-option>
                      <mat-option value="2">Ⅱ级</mat-option>
                    </mat-select>
                </mat-form-field>
                  <button mat-raised-button color="primary" style="margin-left: 80px;"><img src="../../../assets/images/refresh.png" > 刷新</button>
            </div>
            <div class="tablediv">
                <table  cellspacing="0" cellpadding="0">
                    <thead>
                        <th style="width: 15%;">类型</th>
                        <th style="width: 15%;">操作</th>
                        <th style="width: 15%;">所属组织</th>
                        <th style="width: 15%;">审核状态</th>
                        <th style="width: 15%;">提交人</th>
                        <th style="width: 25%;">提交时间</th>
                    </thead>
                    <tbody>
                        <tr *ngFor="let item of tableDate">
                            <td>{{item.level}}</td>
                            <td [ngClass]="{'green': item.option == '更新','red':item.option == '删除','blue':item.option == '新增'}">{{item.option}}</td>
                            <td>{{item.orgication}}</td>
                            <td [ngClass]="{'green': item.unitstate == '已通过','red':item.unitstate == '已拒绝'}">{{item.unitstate}}</td>
                            <td>{{item.addname}}</td>
                            <td>{{item.addtime}}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        
    </div>
    <div class="boxright">
      <div class="righthead">
        <div class="rightheadone">
          <button mat-raised-button color="primary" (click)="buttonChange()"><img src="../../../assets/images/preview.png" style="margin-right: 3px;margin-bottom: 3px;">{{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 class="rightheadtwo">
          <button mat-raised-button style="color: #FFFFFF;background-color: #FF7161;float: right;">拒绝</button>
          <button mat-raised-button style="color: #FFFFFF;background-color: #38D984;float: right;">同意</button>
        </div>
        
      </div>
        <mat-tab-group *ngIf="isallDate" style="flex: 1;overflow-y: auto;margin-top: 10px;" [selectedIndex]="selected.value" (selectedIndexChange)="selected.setValue($event)">

            <mat-tab label="基本信息">
              <ng-template matTabContent>
                <app-basic-info></app-basic-info>
              </ng-template>
            </mat-tab>
            <mat-tab label="平面图">
              <ng-template matTabContent>
                平面图
              </ng-template>
            </mat-tab>
            <mat-tab label="四周毗邻">
              <ng-template matTabContent>
                四周毗邻
              </ng-template>
            </mat-tab>
            <mat-tab label="消防设施">
              <ng-template matTabContent>
                消防设施
              </ng-template>
            </mat-tab>
            <mat-tab label="重点部位">
              <ng-template matTabContent>
                重点部位
              </ng-template>
            </mat-tab>
            <mat-tab label="功能分区">
              <ng-template matTabContent>
                功能分区
              </ng-template>
            </mat-tab>
            <mat-tab label="实景图">
              <ng-template matTabContent>
                实景图
              </ng-template>
            </mat-tab>
            <mat-tab label="CAD">
              <ng-template matTabContent>
                cad
              </ng-template>
            </mat-tab>
            <!-- <mat-tab label="六熟悉">
              <ng-template matTabContent>
                六熟悉
              </ng-template>
            </mat-tab>
            <mat-tab label="实战演练">
              <ng-template matTabContent>
                实战演练
              </ng-template>
            </mat-tab> -->
        
        </mat-tab-group>
        <div id="firefacilities" *ngIf="!isallDate"  style="margin: 10px;">
          <mat-accordion class="tableContent" >
            <mat-expansion-panel expanded style="box-shadow: 0 0 black;border: 1px solid #EEF1F5;">
                <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 style="box-shadow: 0 0 black;border: 1px solid #EEF1F5;">
                      <mat-expansion-panel-header collapsedHeight ='30px' expandedHeight='30px' class="panelhead" >
                        <mat-panel-title style="font-size: 16px;color:#2196F3;" >
                          <img src="../../../assets/images/update.png"><span>修改-沃尔玛（上海）职业发展有限公司</span> 
                        </mat-panel-title>
                      </mat-expansion-panel-header>
                      <table>
                        <tr>
                          <th>单位地址 ：</th>
                          <td><span style="margin-left: 7px;">由</span> <span style="color: #2196F3;">上海市上海市黄浦区武胜路333号</span>变更为
                            <span style="color: #2196F3;">上海市上海市黄浦区金陵西路28号</span></td>
                        </tr>
                        <tr>
                          <th>联系电话 ：</th>
                          <td><span style="margin-left: 7px;">由</span><span style="color: #2196F3;">15069853369</span>变更为
                            <span style="color: #2196F3;">13869877764</span></td>
                        </tr>
                        <tr>
                          <th>始建于（年）：</th>
                          <td><span style="margin-left: 7px;">由</span><span style="color: #2196F3;">1991</span>变更为
                            <span style="color: #2196F3;">2003</span></td>
                        </tr>
                      </table>
                    </mat-expansion-panel>
                  </mat-accordion>
                </div>
                
                
              </mat-expansion-panel>
        </mat-accordion>
        <mat-accordion class="tableContent" >
          <mat-expansion-panel *ngIf="!isallDate" style="box-shadow: 0 0 black;border: 1px solid #EEF1F5;">
              <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 style="box-shadow: 0 0 black;border: 1px solid #EEF1F5;">
                    <mat-expansion-panel-header collapsedHeight ='30px' expandedHeight='30px' class="panelhead" >
                      <mat-panel-title style="font-size: 16px;color:#2196F3;" >
                        <img src="../../../assets/images/update.png"><span>一号建筑</span> 
                      </mat-panel-title>
                    </mat-expansion-panel-header>
                    <div class="onebuilding">
                      <div class="accordingleft">
                        <span>一号建筑：</span>
                      </div>
                      <div class="accordingright">
                        <span>由</span><img src="../../../assets/images/chatchange.png">
                        <span>变更为</span><img src="../../../assets/images/chatchange.png">
                      </div>
                    </div>
                  </mat-expansion-panel>
                </mat-accordion>
              </div>
              
            </mat-expansion-panel>
      </mat-accordion>
      <mat-accordion class="tableContent" >
        <mat-expansion-panel *ngIf="!isallDate" style="box-shadow: 0 0 black;border: 1px solid #EEF1F5;">
            <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 style="box-shadow: 0 0 black;border: 1px solid #EEF1F5;">
                  <mat-expansion-panel-header collapsedHeight ='30px' expandedHeight='30px' class="panelhead" >
                    <mat-panel-title style="font-size: 16px;color:#2196F3;" >
                      <img src="../../../assets/images/update.png"><span>室内消火栓</span> 
                    </mat-panel-title>
                  </mat-expansion-panel-header>
                  <table>
                    <tr>
                      <th>总数：</th>
                      <td><span style="margin-left: 7px;">由</span><span style="color: #2196F3;">5</span>变更为
                        <span style="color: #2196F3;">8</span></td>
                    </tr>
                  </table>
                </mat-expansion-panel>
              </mat-accordion>
            </div>
            
          </mat-expansion-panel>
    </mat-accordion>
        </div>
        
    </div>
</div>
<div class="echarts" *ngIf="previewshow" ><!-- [style.display]="previewshow==true?'block':'none'" -->
  <div class="bar" id="indexbar" ></div>
  <div class="zhu" id="zhu" ></div>
</div>