<div class="modal-header">
  <h4 class="modal-title pull-left">【{{ResponseEntity.group.group_name}}】第【{{ResponseEntity.room_seq}}】考场-考生列表</h4>
</div>
<tabset class="bg-white p-0" justified="true">

  <tab>
    <ng-template tabHeading>
      <span class="table-sort">
        <em class="far fa-user fa-fw"></em> 已播放视频考生</span>
    </ng-template>
    <table class="table table-striped table-hover table-bordered">
      <thead>
      <tr>
        <th>考试序号</th>
        <th>生源地</th>
        <th>证件号码</th>
        <th>考生姓名</th>
        <th>性别</th>
        <th>视频时长</th>
        <th></th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let v of havePlayPager.getRecords();let i=index">
        <td class="align-middle">{{v.score_exam_seq}}</td>
        <td class="align-middle">{{v.province_name}}</td>
        <td class="align-middle">{{v.cert_id}}</td>
        <td class="align-middle">{{v.std_name}}</td>
        <td class="align-middle">{{v.std_sex}}</td>
        <td class="align-middle">{{v.video_length}}</td>
        <td class="align-middle">
          <span class="table-button" title="考试视频" (click)="startVideo(videoTplModal, v.video_file)"><em  class="fas fa-camera text-primary"></em></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <span class="table-button" title="监控视频" (click)="startVideo(videoTplModal, v.video_file_related)"><em  class="fas fa-film text-primary"></em></span>&nbsp;&nbsp;
        </td>
      </tr>
      </tbody>
    </table>
    <frame-pager [url]="'./exam/video/room/video/page.htm'"  [showSearch]="true" [pagerLimit] = 10
                 [pagerParams]="{ly_room_id:ResponseEntity.ly_room_id, video_status: 'Active'}"   #havePlayPager></frame-pager>
  </tab>

  <tab>
    <ng-template tabHeading>
      <span class="table-sort">
        <em class="far fa-user fa-fw"></em> 未播放视频考生</span>
    </ng-template>
    <table class="table table-striped table-hover table-bordered">
      <thead>
      <tr>
        <th>考试序号</th>
        <th>生源地</th>
        <th>证件号码</th>
        <th>考生姓名</th>
        <th>性别</th>
        <th>视频时长</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let v of noPlayPager.getRecords();let i=index">
        <td class="align-middle">{{v.score_exam_seq}}</td>
        <td class="align-middle">{{v.province_name}}</td>
        <td class="align-middle">{{v.cert_id}}</td>
        <td class="align-middle">{{v.std_name}}</td>
        <td class="align-middle">{{v.std_sex}}</td>
        <td class="align-middle">{{v.video_length}}</td>
      </tr>
      </tbody>
    </table>
    <frame-pager [url]="'./exam/video/room/video/page.htm'"  [showSearch]="true" [pagerLimit] = 10
                 [pagerParams]="{ly_room_id:ResponseEntity.ly_room_id, video_status: 'InActive'}"   #noPlayPager></frame-pager>
  </tab>

  <tab>
    <ng-template tabHeading>
      <span class="table-sort"><em
        class="far fa-user fa-fw"></em> 全部考生</span>
    </ng-template>
    <table class="table table-striped table-hover table-bordered">
      <thead>
      <tr>
        <th>考试序号</th>
        <th>生源地</th>
        <th>证件号码</th>
        <th>考生姓名</th>
        <th>性别</th>
        <th>视频时长</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let v of allStdPager.getRecords();let i=index">
        <td class="align-middle">{{v.score_exam_seq}}</td>
        <td class="align-middle">{{v.province_name}}</td>
        <td class="align-middle">{{v.cert_id}}</td>
        <td class="align-middle">{{v.std_name}}</td>
        <td class="align-middle">{{v.std_sex}}</td>
        <td class="align-middle">{{v.video_length}}</td>
      </tr>
      </tbody>
    </table>
    <frame-pager [url]="'./exam/video/room/video/page.htm'"  [showSearch]="true" [pagerLimit] = 10
    [pagerParams]="{ly_room_id: ResponseEntity.ly_room_id}"   #allStdPager></frame-pager>
  </tab>

 
</tabset>
<div class="modal-footer">
  <button class="btn btn-secondary" type="button" (click)="closeWindow()">关闭窗口</button>
</div>

<!---播放界面-->
<ng-template #videoTplModal>
	<div class="modal-content">
		<div class="modal-header info-success-qm">
			<div class="pull-left">
				<em class="fa-lg fas fa-edit "></em> <span >考生视频</span> 
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				<font *ngIf="VideoTotal" style="font-size: 15px;font-weight: bold; color: red;">
				</font>  
			</div>
			<button type="button" class="close" (click)="hideModal()">×</button>
		</div>

		<div class="row">
			<div class="col-lg-4"></div>
			<div class="col-lg-4 mt-10">
			</div>
			<div class="col-lg-4"></div>
		</div>
	
		<div class="modal-body">
				<div id="aliPlayer"></div><br>
				&nbsp;&nbsp;&nbsp;&nbsp;
				<!-- ng-if="param.score_seq>0 && param.pause==false" -->
				<button class="btn btn-primary" (click)="pauseVideo()">
					<li class="glyphicon fa  fa-pause "></li> &nbsp;视频暂停
				</button>
				&nbsp;&nbsp;
				<!-- ng-if="param.score_seq>0 && param.pause==true" -->
				<button class="btn btn-primary" (click)="playVideo()">
					<li class="glyphicon fa   fa-play "></li> &nbsp;继续播放
				</button>

		</div>

		<div class="modal-footer">
		<button class="btn btn-default" (click)="hideModal()">
			<i class="icon-close"> </i> 取消
		</button>
		</div>
	</div>
</ng-template>