examSystem-Anxin/src/app/student/examination-details/examination-details.component.html

<div class="content">
  <div class="countdown"><mat-icon>alarm</mat-icon><countdown #countdown [config]="{ leftTime: surplusTime,notify: [600],formatDate: formatDate }" (event)="handleEvent($event)"></countdown></div>
  <div style="min-height: 60px;"><app-tabbar></app-tabbar></div>
  <div class="center">

    <div class="left">
      <div class="headerLeft">
        <div>单位列表</div>
        <div style="text-align: right;">总分: 
          <label style="color: #07CDCF;">{{examScore}}</label>
        </div>
      </div>
      <div class="centerLeft" style="background: #F5FDFE;"><div class="overflowText">单位名称</div><div class="overflowText">总分</div></div>
      <div class="centerLeft" *ngFor="let item of paperCompanyData" [ngClass]="{'selectPaper': selectPaper.id == item.id}" (click)='togglePaper(item)'>
        <div class="overflowText">{{item.companyInfo.name}}</div>
        <div class="overflowText">{{item.score}}+{{item.planScore || 0}}</div>
      </div>
    </div>
    <div class="right">
      <div class="headerRight">
        <label (click)='togglePaperType(1)' [ngClass]="{'selectPaperType': selectPaperType == '1'}">基本信息</label>
        <label (click)='togglePaperType(2)' [ngClass]="{'selectPaperType': selectPaperType == '2'}">作战部署</label>
        <button (click)='uploadPaper()'>交卷</button>
      </div>
      <div class="centerRight">
        <div class="paperCenter" *ngIf="selectPaperType == '1'">

          <mat-accordion multi>
            <!-- 基本信息 -->
            <mat-expansion-panel *ngIf="selectPaper.basicInfoData && selectPaper.basicInfoData.length">
              <mat-expansion-panel-header class="panelHeader">
                <label class="mariginRight">基本信息</label>
                <label>总分: <label class="mark"> {{selectPaper.basicInfoScore}}</label>分, </label><label>单项<label class="mark"> {{selectPaper.basicInfoItemScore}}</label>分</label>
              </mat-expansion-panel-header>
              <div class="publicTest" *ngFor="let item of selectPaper.basicInfoData;let itemkey = index">
                <div class="publicTitle">{{item.name}}</div>
                <div class="publicTable" *ngIf="item.tabledata && item.tabledata.length">
                  <div class="tableRow" *ngFor="let element of item.tabledata; let key = index">
                    <div class="tabelHeader overflowText" title="{{element.propertyName}}">{{element.propertyName}}</div>
                    <ng-container *ngFor="let elements of element.data">
                      <div class="tabelCenter" *ngIf="rowIsShow(selectPaper.basicInfoData[itemkey].children,elements.tag)">
                        <label *ngIf="key===0" class="overflowText">{{elements.result}}</label>
                        <input type="text" [(ngModel)]="elements.userAnswer" name="userAnswer" *ngIf="key!=0">
                      </div>
                    </ng-container>
                  </div>
                </div>
                <ng-container *ngIf="!item.tabledata || !item.tabledata.length">
                  <div class="publicInput" *ngFor="let element of item.children"><label>{{element.name}}:</label><input type="text" [(ngModel)]="element.userAnswer" name="userAnswer"></div>
                </ng-container>
              </div>
            </mat-expansion-panel>
            <!-- 基本信息 -->
            <!-- 四周毗邻 -->
            <mat-expansion-panel *ngIf="selectPaper.adjoinData && selectPaper.adjoinData.length">
              <mat-expansion-panel-header class="panelHeader">
                <label class="mariginRight">四周毗邻</label>
                <label>总分: <label class="mark"> {{selectPaper.adjoinScore}}</label>分, </label><label>单项<label class="mark"> {{selectPaper.adjoinItemScore}}</label>分</label>
              </mat-expansion-panel-header>
              <div class="publicTest" *ngFor="let item of selectPaper.adjoinData">
                <div class="publicTitle">{{item.name}}</div>
                <div class="publicInput" *ngFor="let element of item.children"><label>{{element.name}}:</label><input type="text" [(ngModel)]="element.userAnswer" name="userAnswer"></div>
              </div>
            </mat-expansion-panel>
            <!-- 四周毗邻 -->
            <!-- 重点部位 -->
            <mat-expansion-panel *ngIf="selectPaper.importLocationData && selectPaper.importLocationData.length">
              <mat-expansion-panel-header class="panelHeader">
                <label class="mariginRight">重点部位</label>
                <label>总分: <label class="mark"> {{selectPaper.importLocationScore}}</label>分, </label><label>单项<label class="mark"> {{selectPaper.importLocationItemScore}}</label>分</label>
              </mat-expansion-panel-header>
              <div class="publicTest" *ngFor="let item of selectPaper.importLocationData">
                <div class="publicTitle">{{item.name}}</div>
                <div class="publicTable">
                  <div class="tableRow" *ngFor="let element of item.tabledata; let key = index">
                    <div class="tabelHeader overflowText" title="{{element.propertyName}}">{{element.propertyName}}</div>
                    <div class="tabelCenter" *ngFor="let elements of element.data">
                      <label *ngIf="key===0" class="overflowText">{{elements.result}}</label>
                      <input type="text" [(ngModel)]="elements.userAnswer" name="userAnswer" *ngIf="key!=0">
                    </div>
                  </div>
                </div>
              </div>
            </mat-expansion-panel>
            <!-- 重点部位 -->
            <!-- 功能分区 -->
            <mat-expansion-panel *ngIf="selectPaper.functionalDivisionData && selectPaper.functionalDivisionData.length">
              <mat-expansion-panel-header class="panelHeader">
                <label class="mariginRight">功能分区</label>
                <label>总分: <label class="mark"> {{selectPaper.functionalDivisionScore}}</label>分, </label><label>单项<label class="mark"> {{selectPaper.functionalDivisionItemSocre}}</label>分</label>
              </mat-expansion-panel-header>
              <div class="publicTest" *ngFor="let item of selectPaper.functionalDivisionData">
                <div class="publicTitle">{{item.name}}</div>
                <div class="publicTable">
                  <div class="tableRow" *ngFor="let element of item.tabledata; let key = index">
                    <div class="tabelHeader overflowText" title="{{element.propertyName}}">{{element.propertyName}}</div>
                    <div class="tabelCenter" *ngFor="let elements of element.data">
                      <label *ngIf="key===0" class="overflowText">{{elements.result}}</label>
                      <input type="text" [(ngModel)]="elements.userAnswer" name="userAnswer" *ngIf="key!=0">
                    </div>
                  </div>
                </div>
              </div>
            </mat-expansion-panel>
            <!-- 功能分区 -->
            <!-- 数据核验 -->
            <mat-expansion-panel *ngIf="selectPaper.facilityData && selectPaper.facilityData.length">
              <mat-expansion-panel-header class="panelHeader">
                <label class="mariginRight">数据核验</label>
                <label>总分: <label class="mark"> {{selectPaper.facilityScore}}</label>分, </label><label>单项<label class="mark"> {{selectPaper.facilityItemScore}}</label>分</label>
              </mat-expansion-panel-header>
              <div class="publicTest" *ngFor="let item of selectPaper.facilityData">
                <div class="publicTitle">{{item.name}}</div>
                <div class="publicInput" *ngFor="let element of item.children"><label>{{element.name}}:</label><input type="text" [(ngModel)]="element.userAnswer" name="userAnswer"></div>
              </div>
            </mat-expansion-panel>
            <!-- 数据核验 -->
          </mat-accordion>

        </div>
        <!-- 作战部署 -->
        <div class="paperCenter" *ngIf="selectPaperType == '2'">
          <div class="planList">
            <table>
                <tr>
                  <td>预案名称</td>
                  <td>添加人</td>
                  <td>修改时间</td>
                  <td>是否公开</td>
                  <td>编制级别</td>
                  <td>设置分数</td>
                  <td>操作</td>
                </tr>
                <tr *ngFor="let item of selectPaper.planList">
                  <td>{{item.title}}</td>
                  <td>{{item.creatorName}}</td>
                  <td>{{item.modifiedTime | date:'yyyy-MM-dd'}}</td>
                  <td>{{item.isPublic ? '已公开' : '未公开'}}</td>
                  <td>{{item.planLevel | planlevel}}</td>
                  <td style="color: #FF8678;">{{item.score}}分</td>
                  <td>
                    <span style="color: #07CDCF;" (click)="enterExam(item)">进入</span>
                  </td>
                </tr>
            </table>
          </div>
        </div>
        <!-- 作战部署 -->
      </div>
    </div>

  </div>
</div>