examSystem-Anxin/src/app/examiner/examiner-index/examiner-index.component.html

<!--
 * @Descripttion: 
 * @version: 
 * @Author: sueRimn
 * @Date: 2020-12-11 09:06:03
 * @LastEditors: sueRimn
 * @LastEditTime: 2020-12-15 14:40:26
-->
<div class="content">
    <div class="header">
        <div class="queryBox">
            <div class="queryField">
                <label style="margin-right: 10px;font-size: 18px;">消防救援站:</label>
                <!-- <input list="cars" placeholder="请输入用户账号" [(ngModel)]="accound" />
                <datalist id="cars" (onchange)="getoption()">
	            <option *ngFor="let item of helpName" [value]="item.id" id={{item.id}} >{{item.name}}</option>
                </datalist> -->
                <select [(ngModel)]="accound">
                    <option style="height: 10px;font-size: 16px;" *ngFor="let item of helpName" [value]="item.id">{{item.name}}</option>
                </select>
                <!-- <mat-form-field appearance="fill">
                    <mat-label>请选择</mat-label>
                    <mat-select [(ngModel)]="accound">
                      <mat-option *ngFor="let food of helpName" [value]="food.id">
                        {{food.name}}
                      </mat-option>
                    </mat-select>
                  </mat-form-field> -->
                  
            </div>
            <div class="queryField">
                <button   style="background-color: #07CDCF;" (click)="findClick()">查询</button>
                <button   style="margin-left: 10px; background-color: #FF8678;" (click)="Reset()">重置</button>
            </div>
            <div class="queryField" style="margin-left: 720px;">
                <button style="background-color: #07CDCF;" (click)="newExamination()"><img style="position: relative;top: 3px;" src="../../../assets/images/add.png"> 新增考题</button>
            </div>
        </div>
    </div>
    <div class="centertable">
        <!-- <table mat-table [dataSource]="dataSource" >
            <ng-container matColumnDef="name">
                <th mat-header-cell *matHeaderCellDef>试卷名称</th>
                <td mat-cell *matCellDef="let element">{{element.name}}</td>
            </ng-container>
          
           
        </table> -->
        <table >
            <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: 20%;">操作</th>
            </thead>
            <tbody>
                <tr *ngFor="let item of tabledataSource">
                    <td>{{item.title}}</td>
                    <td>广西总队</td>
                    <td>{{item.startTime|date:'yyyy-MM-dd hh:mm'}}</td>
                    <td>{{item.endTime|date:'yyyy-MM-dd hh:mm'}}</td>
                    <!-- <td [ngClass]="{'green': item.testState == '开考中','red':item.testState == '已结束'}">{{item.testState}}</td> -->
                    <td [ngClass]="{'green': item.status == '1','red':item.status == '2'}">{{item.status=="2"?"已结束":item.status=="0"?"未开考":"开考中"}}</td>
                    <td>
                        <span style="color: #07CDCF;margin-right: 10px;">编辑</span>    
                        <span style="color: #07CDCF;">详情</span>
                        <span *ngIf="item.status=='0'" style="color: #FF8678;margin-left: 10px;cursor: pointer;" (click)="deleteExam(item.id)">删除</span>
                    </td>
                </tr>
            </tbody>
            
        </table>
        <mat-paginator [length]="length"
                [pageSize]="pageSize"
                [pageSizeOptions]="pageSizeOptions"
                (page)="chagePage($event)">
            </mat-paginator>
    </div>
    
</div>