<div class="content-heading  justify-content-between">
  <div *ngIf="std">{{std.std_name}} （{{std.cert_id}}）</div>
  <div class="float-right">

    <div class="row">
      <div>
        <input class="form-control " type="text" [(ngModel)]="searchText" placeholder="输入关键字进行搜索"
               onfocus="this.select()" onmouseover="this.focus()" autocomplete="false"
               (keyup.enter)="searchStd()"/>
      </div>
      <div class="btn-group mr-4 ml-3" dropdown *ngIf="std !== undefined">
        <button class="btn dropdown-toggle btn-secondary btn-sm" type="button" dropdownToggle>考生管理
          <span class="caret"></span>
        </button>
        <div *dropdownMenu class="dropdown-menu modal-lg" role="menu">
          <a class="dropdown-item text-danger" href="#"
             (click)="ajaxEnrol.optrRecord('std/reg/delete.htm',{std_id:std.std_id}, {confirmMsg:'确定要删除该考生吗？请谨慎进行此操作！',callback:searchStd.bind(this)})">删除考生</a>
          <div class="dropdown-divider"></div>
        </div>
      </div>
    </div>
  </div>
</div>

<frame-ajax #ajaxEnrol [url]="'std/enrol/map.htm'" [ajaxType]="'Map'" [autoRequest]="false"></frame-ajax>
<tabset class="bg-white p-0" justified="true" *ngIf="std !== undefined">
  <!-- 基本信息 -->
  <tab>
    <ng-template tabHeading>
      <span class="table-sort" (click)="ajaxEnrol.reload({std_id:std.std_id})"><em
        class="far fa-address-card fa-fw"></em> 基本信息</span>
    </ng-template>
    <div class="row mt-2">
      <div class="col-xl-4">
        <div class="card card-default">
          <div class="card-header">
            <div class="card-title">考生信息</div>
          </div>
          <div class="list-group">
            <div class="list-group-item">
              <div class="media">
                <div class="align-self-start mr-2">
                            <span class="fa-stack">
                                    <em class="fa fa-circle fa-stack-2x text-purple"></em>
                                    <em class="fas fa-cloud-upload-alt fa-stack-1x fa-inverse text-white"></em>
                                 </span>
                </div>
                <div class="media-body text-truncate">
                  <p class="mb-1"><span class="text-purple m-0 text-1-4" href="#">{{std.province_name}}</span>
                  </p>
                  <p class="m-0">
                    <span class="text-1-2">{{std.exam_id}}</span>
                  </p>
                </div>
                <div class="ml-auto">
                  <small class="text-muted ml-2"></small>
                </div>
              </div>
            </div>
            <div class="list-group-item">
              <div class="media">
                <div class="align-self-start mr-2">
                            <span class="fa-stack">
                                    <em class="fa fa-circle fa-stack-2x text-info"></em>
                                    <em class="far fa-file-alt fa-stack-1x fa-inverse text-white"></em>
                                 </span>
                </div>
                <div class="media-body text-truncate">
                  <p class="mb-1"><span class="text-1-4">{{std.cert_id}}</span>
                  </p>
                  <p class="m-0">
                    <small>{{std.cert_type | frameDict: 'StdCertType'}}</small>
                  </p>
                </div>
              </div>
            </div>
            <div class="list-group-item">
              <div class="media">
                <div class="align-self-start mr-2">
                            <span class="fa-stack">
                                    <em class="fa fa-circle fa-stack-2x text-success"></em>
                                    <em class="far fa-clock fa-stack-1x fa-inverse text-white"></em>
                                 </span>
                </div>
                <div class="media-body text-truncate">
                  <p class="mb-1"><span class="text-1-4">{{std.std_name}}</span>
                  </p>
                  <p class="m-0">
                    <small>{{std.std_sex}}</small>
                  </p>
                </div>
              </div>
            </div>

            <div class="list-group-item">
              <div class="media">
                <div class="align-self-start mr-2">
                            <span class="fa-stack">
                                    <em class="fa fa-circle fa-stack-2x"></em>
                                    <em class="fas fa-mobile-alt fa-stack-1x fa-inverse text-white"></em>
                                 </span>
                </div>
                <div class="media-body text-truncate">
                  <p class="mb-1"><span class="text-1-4">{{std.std_mobile1}}</span>
                  </p>
                  <p class="m-0">
                    <small>{{std.std_mobile2}}</small>
                  </p>
                </div>
              </div>
            </div>
            <div class="list-group-item">
              <div class="media">
                <div class="align-self-start mr-2">
                            <span class="fa-stack">
                                    <em class="fa fa-circle fa-stack-2x"></em>
                                    <em class="fas fa-warehouse fa-stack-1x fa-inverse text-white"></em>
                                 </span>
                </div>
                <div class="media-body text-truncate">
                  <p class="mb-1"><span>{{std.link_addr}}</span>
                  </p>
                  <p class="m-0">
                    <small>{{std.std_city}}</small>
                  </p>
                </div>
              </div>
            </div>

            <div class="list-group-item" *ngIf="std.std_type!== undefined && std.std_type>0">
              <div class="media">
                <div class="align-self-start mr-2">
                            <span class="fa-stack">
                                    <em class="fa fa-circle fa-stack-2x"></em>
                                    <em class="fas fa-warehouse fa-stack-1x fa-inverse text-white"></em>
                                 </span>
                </div>
                <div class="media-body text-truncate">
                  <p class="mb-1"><span>{{std.std_type}}</span>
                  </p>
                  <p class="m-0">
                    <small>考生类型</small>
                  </p>
                </div>
              </div>
            </div>
            <div class="list-group-item" *ngIf="std.std_school!== undefined && std.std_school.length>0">
              <div class="media">
                <div class="align-self-start mr-2">
                            <span class="fa-stack">
                                    <em class="fa fa-circle fa-stack-2x"></em>
                                    <em class="fas fa-warehouse fa-stack-1x fa-inverse text-white"></em>
                                 </span>
                </div>
                <div class="media-body text-truncate">
                  <p class="mb-1"><span>{{std.std_school}}</span>
                  </p>
                  <p class="m-0">
                    <small></small>
                  </p>
                </div>
              </div>
            </div>
            <div class="list-group-item" *ngIf="std.link_addr!== undefined && std.link_addr.length>0">
              <div class="media">
                <div class="align-self-start mr-2">
                            <span class="fa-stack">
                                    <em class="fa fa-circle fa-stack-2x"></em>
                                    <em class="fas fa-warehouse fa-stack-1x fa-inverse text-white"></em>
                                 </span>
                </div>
                <div class="media-body text-truncate">
                  <p class="mb-1"><span>{{std.link_addr}}</span>
                  </p>
                  <p class="m-0">
                    <small>{{std.link_man}}</small>
                  </p>
                </div>
              </div>
            </div>
          </div>


          <div class="card-footer"><a class="text-sm" href="#" (click)="changeCert()">信息修改</a>
          </div>
          <!-- END card-footer-->
        </div>
        <!-- END messages and activity-->
      </div>
      <div class="col-xl-4">
        <div class="card card-default" *ngIf="std.std_image">
          <div class="card-body">
            <div class="">免冠证件照</div>
            <div class="text-center">
              <div class="px-2">
                <img class="img-fluid rounded id_card"
                     [src]="frameService.getParamValue('MateialWebPath') + '/StdUpload/' + std.std_image"
                     alt="" ngxViewer/>
              </div>
            </div>
          </div>
          <div class="card-footer" *ngIf="materialMap['NoCrownPhoto']">
            <p class="">
              <span>上传时间：</span>
              <span class="float-right">
                  <button class="btn btn-danger btn-sm" type="button"
                         *ngIf="materialMap['NoCrownPhoto']['verify_status'] === 'Active'"
                         (click)="refuseMaterial(materialMap['NoCrownPhoto'])">打回重传</button>
                 <button class="btn btn-info btn-sm" type="button"
                         *ngIf="materialMap['NoCrownPhoto']['verify_status'] !== 'Active'"
                         (click)="ajax.optrRecord('std/material/accept.htm', {material_id: materialMap['NoCrownPhoto'].material_id}, {successMsg:'该考生证件材料已通过审核', successMsgType:'Swal', confirmMsg:'确定要通过该考生的材料审核吗？',callback: queryStd.bind(this) })">通过审核</button> 
              </span>
            </p>
          </div>
        </div>
      </div>
    </div>
  </tab>
  <!-- 报考及订单 -->
  <tab>
    <ng-template tabHeading>
      <span class="table-sort" (click)="ajaxEnrol.reload({std_id: std.std_id})"><em
        class="fab fa-cc-visa fa-fw"></em> 报考及订单
      </span>

    </ng-template>
    <fieldset>
      <div class="card card-default">
        <div class="card-header">报考专业信息
        </div>
        <div class="card-body">
          <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>
            <ng-container *ngIf="ajaxEnrol.getMap()">
              <tr *ngFor="let v of ajaxEnrol.getMap()['StdEnrolArray']; let i = index">
                <td>{{v.school_name}}</td>
                <td>{{v.aspect_name}}（{{v.aspect_code}}）</td>
                <td>{{v.enrol_time}}</td>
                <td>{{v.fee_amount / 100 | currency: 'CNY'}}</td>
                <td [innerHTML]="v.pay_status | frameStatusCustom: ['已缴费','未缴费']"></td>
                <td><span [tooltip]="v.pay_time">{{v.bill_no}}</span></td>
                <td>
                  <span *ngIf="v.aspect_ticket_num"> {{v.aspect_ticket_num}}</span>
                  <ng-container *ngIf="v.aspect_ticket_num === undefined && v.pay_status==='Active'">
                    <div class="btn-group" dropdown style="margin-top: -5px;">
                      <button class="btn dropdown-toggle btn-secondary " type="button" dropdownToggle>专业管理
                        <span class="caret"></span>
                      </button>
                      <div *dropdownMenu class="dropdown-menu" role="menu">
                        <a class="dropdown-item text-danger" href="#" (click)="changeAspect(v)">更改专业/品种</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item text-danger" href="#" (click)="deleteAspect(v)">删除专业</a>
                        <div class="dropdown-divider"></div>

                      </div>
                    </div>
                  </ng-container>
                </td>
              </tr>
            </ng-container>

            </tbody>
          </table>
        </div>
      </div>
    </fieldset>
    <fieldset>
      <div class="card card-default">
        <div class="card-header">订单信息</div>
        <div class="card-body">
          <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>
            <ng-container *ngIf="ajaxEnrol.getMap()">
              <tr *ngFor="let v of ajaxEnrol.getMap()['PayBillArray']; let i = index">
                <td>{{v.bill_no}}</td>
                <td>{{v.channel_id}}</td>
                <td>{{v.bill_amount / 100 | currency: 'CNY'}}</td>
                <td>{{v.bill_time}}</td>
                <td><span
                  [ngClass]="{'text-success': v.bill_status === 'Complete', 'text-muted':v.bill_status==='Reply', 'text-warning':v.bill_status==='Refund'}">{{v.bill_status | frameDict: 'PayBillStatus'}}</span>
                </td>
                <td>{{v.reply_time}}</td>
                <td>{{v.channel_no}}</td>
              </tr>
            </ng-container>

            </tbody>
          </table>
        </div>
      </div>
    </fieldset>
  </tab>
  <!-- 登录日志 -->
  <tab>
    <ng-template tabHeading>
      <span class="table-sort" (click)="loginPager.reload({std_id:std.std_id})">
        <em class="far fa-clone fa-fw"></em> 登录日志
      </span>
    </ng-template>
    <table class="table table-striped table-hover table-bordered" *ngIf="loginPager.getRecords()">
      <thead>
      <tr>
        <th>登录时间</th>
        <th>浏览器类型</th>
        <th>浏览器版本</th>
        <th>系统类型</th>
        <th>系统平台</th>
        <th>系统版本</th>
        <th>登录地址</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let v of loginPager.getRecords(); let i = index">
        <td>{{v.login_time}}</td>
        <td>{{v.browser_type}}</td>
        <td>{{v.browser_version}}</td>
        <td>{{v.platform_type}}</td>
        <td>{{v.platform_series}}</td>
        <td>{{v.platform_version}}</td>
        <td>{{v.login_addr}}</td>
      </tr>
      </tbody>
    </table>
    <frame-pager [url]="'./std/reg/login/page.htm'" [autoRequest]="false" [pagerParams]="{std_id: std.std_id}"
                 [hidden]="true"
                 #loginPager></frame-pager>
  </tab>
  <!-- 业务日志 -->
  <tab>
    <ng-template tabHeading><span class="table-sort" (click)="logPager.reload({std_id:std.std_id})">
      <em class="far fa-sticky-note fa-fw"></em> 业务日志</span>
    </ng-template>
    <table class="table table-striped table-hover table-bordered" *ngIf="logPager.getRecords()">
      <thead>
      <tr>
        <th>记录时间</th>
        <th>业务类型</th>
        <th>日志值</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let v of logPager.getRecords(); let i = index">
        <td>{{v.log_time}}</td>
        <td>{{v.log_type}}</td>
        <td>{{v.log_value}}</td>
      </tr>
      </tbody>
    </table>
    <frame-pager [url]="'./std/reg/log/page.htm'" [autoRequest]="false" [hidden]="true" #logPager></frame-pager>
  </tab>
  <!-- 考试安排
  <tab>
    <ng-template tabHeading>
      <em class="fas fa-ticket-alt fa-fw"></em> <span class="table-sort"
                                                      (click)="ticketAjax.reload({std_id:std.std_id})">考试安排</span>
    </ng-template>
    <div class="card border" *ngFor="let ticket of ticketAjax.getMap()['TicketArray']">
      <div class="card-header font-weight-bold text-1-5">【{{ticket.category_name}}】【{{ticket.agent_name}}
        】【{{ticket.ticket_no}}】
      </div>
      <div class="card-body">
 
        <table class="table table-striped table-hover table-bordered "
               *ngIf="ticketAjax.getMap()['WrittenArray_' + ticket.ly_ticket_id].length>0">
          <thead>
          <tr>
            <th style="width: 60px;"></th>
            <th>考试日期</th>
            <th>考试时间</th>
            <th>考试科目</th>
            <th>考场地址</th>
          </tr>
          </thead>
          <tbody>
          <ng-container
            *ngFor="let sb of ticketAjax.getMap()['WrittenArray_' + ticket.ly_ticket_id]; let sbIndex = index;">
            <tr>
              <td [rowSpan]="ticketAjax.getMap()['WrittenArray_' + ticket.ly_ticket_id].length + 1" class="align-middle"
                  *ngIf="sbIndex === 0">笔试安排
              </td>
              <td [rowSpan]="sb.row_colspan" class="align-middle"
                  *ngIf="sb.row_colspan>0">{{frameService.shortDateString(sb.ly_exam_date)}}</td>
              <td [rowSpan]="sb.time_row_colspan" *ngIf="sb.time_row_colspan>0">{{sb.ly_exam_time}}</td>
              <td class="align-middle">{{sb.subject_name}}</td>
              <td [rowSpan]="sb.addr_row_colspan" *ngIf="sb.addr_row_colspan>0"
                  class="align-middle">{{sb.ly_room_addr}}</td>
            </tr>
          </ng-container>

          </tbody>
        </table>

        <table class="table table-striped table-hover table-bordered "
               *ngIf="ticketAjax.getMap()['InterviewArray_' + ticket.ly_ticket_id].length>0">
          <thead>
          <tr>
            <th style="width: 60px;" class="text-center"> <span class="table-button" *ngIf="ticket.allow_modify" tooltip="调整考试安排" (click)="modifyInterview(ticket,ticketAjax.getMap()['InterviewArray_' + ticket.ly_ticket_id] )"><em
              class="fa-lg fas fa-edit"></em></span></th>
            <th>考试日期</th>
            <th>考试时间</th>
            <th>考试科目</th>
            <th>考场地址</th>
          </tr>
          </thead>
          <tbody>
          <ng-container
            *ngFor="let sb of ticketAjax.getMap()['InterviewArray_' + ticket.ly_ticket_id]; let sbIndex = index;">
            <tr>
              <td [rowSpan]="ticketAjax.getMap()['InterviewArray_' + ticket.ly_ticket_id].length + 1"
                  class="align-middle"
                  *ngIf="sbIndex === 0">面试安排
              </td>
              <td [rowSpan]="sb.row_colspan" class="align-middle"
                  *ngIf="sb.row_colspan>0">{{frameService.shortDateString(sb.ly_exam_date)}}</td>
              <td [rowSpan]="sb.time_row_colspan" *ngIf="sb.time_row_colspan>0"
                  class="align-middle">{{sb.ly_exam_time}}</td>
              <td class="align-middle">{{sb.subject_name}}</td>
              <td [rowSpan]="sb.addr_row_colspan" *ngIf="sb.addr_row_colspan>0"
                  class="align-middle">{{sb.ly_room_addr}}</td>
            </tr>
          </ng-container>

          </tbody>
        </table>
      </div>
    </div>

    <frame-ajax [url]="'./std/layout/ticket.htm'" [ajaxType]="'Map'" [autoRequest]="false"
                [callback]="prepareTicketSubject.bind(this)" #ticketAjax></frame-ajax>

  </tab>
-->
  <!--
  <tab>
    <ng-template tabHeading>
      <em class="fa icon-camrecorder fa-fw"></em> 考试日志
    </ng-template>
    <div class="row">
    </div>
  </tab>-->
  <!-- 专业成绩 
  <tab>
    <ng-template tabHeading>
      <div (click)="aspectScoreAjax.reload({std_id:std.std_id})">
        <em class="fa icon-file-alt fa-fw"></em> 专业成绩
      </div>
    </ng-template>
    <div class="card border" *ngFor="let ap of aspectScoreAjax.getMap()['AspectArray']">
      <div class="card-header font-weight-bold text-1-5">专业：【{{ap.aspect_name}}】 总分:【{{ap.aspect_final_score}}】
        <span *ngIf="ap.aspect_final_level">排名：【{{ap.aspect_final_level}}】</span>
        <span *ngIf="ap.qualified_text">【<span class="text-success"
                                               *ngIf="ap.qualified_status==='Active'">{{ap.qualified_text}}</span><span
          class="text-danger" *ngIf="ap.qualified_status==='InActive'">{{ap.qualified_text}}</span>】</span>
      </div>
      <div class="card-body">
        <table class="table table-striped table-hover table-bordered">
          <thead>
          <tr>
            <th class="th-index"></th>
            <th>科目名称</th>
            <th>科目类型</th>
            <th>科目成绩</th>
          </tr>
          </thead>
          <tbody>
          <tr *ngFor="let sb of aspectScoreAjax.getMap()['SubjectArray_' + ap.score_id];">
            <td>{{sb.subject_order}} </td>
            <td>{{sb.subject_name}} </td>
            <td>{{sb.subject_type | frameDict: 'ConfSubjectType'}} </td>
            <td>{{sb.subject_final_score}} </td>
          </tr>

          </tbody>
        </table>
      </div>
    </div>

    <frame-ajax [url]="'./std/score/aspect.htm'" [ajaxType]="'Map'" [autoRequest]="false"
                #aspectScoreAjax></frame-ajax>

  </tab>
-->

</tabset>

<frame-ajax [autoRequest]="false" #ajax></frame-ajax>
