<div class="panel panel-default">
    <!--标题-->
    <div class="panel-title">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <!-- TODO -->
                <li class="breadcrumb-item">考生备案管理</li>
                <li class="breadcrumb-item active" aria-current="page">网络助学转学转专业审核</li>
            </ol>
        </nav>
    </div>
    <div class="panel-body ml-sm" [hidden]="editShowType=='only'">
        <div class="card card-default">
            <div class="card-body">
                <!--查询条件-->
                <div class="row mb-3 ml-1" [hidden]="editShowType=='only'">
                    <div class="col-lg-12">
                        <form (ngSubmit)="framePager.goSearch()" class="form-inline">
                            <table><tr>
                                <td>
                            <div class="input-group mr-1 input-group-sm">
                                <label>&nbsp;&nbsp;&nbsp;&nbsp;关键字：</label>
                                <input name="keyword" [(ngModel)]="query.query" class="input-sm form-control"
                                    type="text" value="" maxlength="64" placeholder="请输入查询关键字">

                            </div>
                        </td>
                        <td>
                            <div class="input-group mr-1 input-group-sm">
                               
                                <label>审核状态：</label>
                                <select name="status" [(ngModel)]="query.apply_status"class="form-control">
                                    <option value="">--请选择--</option>
                                    <option value="待提交">待提交</option>
                                    <option value="待考试院审核">待考试院审核</option>
                                    <option value="审核通过并归档">审核通过并归档</option>
                                    <option value="审核驳回">审核驳回</option>
                                </select>

                            </div>
                            </td>
                            </tr>
                            <tr>
                                <td>
                            <div class="input-group mr-1 input-group-sm">
                                    <label>主考学校：</label>
                                    <flex-select [allowClear]="true" [url]="SCHOOL_URL" respDataPath="array" optionValueField="id"
                                      optionTextField="org_name" [(ngModel)]="query.school_id" placeholder="请选择"
                                      [ngModelOptions]="{standalone: true}" width="110" noResultsFound="无数据">
                                    </flex-select>

                              </div>
                            </td>
                            <td>
                              <div class="input-group mr-1 input-group-sm">
                                    <label>衔接学校：</label>
                                    <flex-select [allowClear]="true" [(items)]="joinSchoolList" optionValueField="id"
                                    optionTextField="org_name" [(ngModel)]="query.join_school_id" placeholder="请选择"
                                    [ngModelOptions]="{standalone: true}" width="110" noResultsFound="无数据">
                                    </flex-select>

                              </div>
                            </td>
                            <td>
                            <button class="btn btn-primary btn-rounded btn-outline btn-sm  mr-1"
                                (click)="framePager.goSearch()">
                                <i class="fa fa-search"></i> 查询</button>
                            <button class="btn btn-primary btn-rounded btn-outline btn-sm  mr-1" (click)="reset()">
                                <i class="fa fa-undo"></i> 重置</button>

                                <button class="btn btn-primary mr-1 btn-sm" data-toggle="tooltip" data-placement="left"
                                (click)="callback()" title="撤回">
                                <i class="fa fa-plus"></i> 撤回</button>
                                </td>
                            </tr></table>
                            </form>
                    </div>
                </div>

                

                <!--表格-->
                <div class="row">
                    <div class="col-lg-12 ml-0" [hidden]="editShowType=='only'">
                        <table class="table table-sm table-striped table-hover table-bordered bg-white">
                            <thead>
                                
                                <tr>
                                    
                                    <th>
                                        <div class="checkbox c-checkbox">
                                            <label>
                                                <input type="checkbox"
                                                    (change)="framePager.checkedMasterToggle($event)" />
                                                <span class="fa fa-check"></span>
                                            </label>
                                        </div>
                                    </th>
                                    
                                    <th>序号</th>
                                    <th>申请主题</th>
                                    <th>申请说明</th>
                                    <th>审批状态</th>
                                    <th>申请人</th>
                                    <th align="center">申请时间</th>
                                    <th>审核类型</th>
                                    <th>审核人</th>
                                    <th>审批意见</th>
                                    
                                    

                                    <th style="width: 80px;" align="center">操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr *ngFor="let item of framePager.getRecords(); let i = index">
                                    
                                    <td>
                                        <div class="checkbox c-checkbox input-group-sm">
                                            <label>
                                                <input type="checkbox" [value]="item.id" [(checked)]="item.isChecked"
                                                    [(ngModel)]="item.isChecked" />
                                                <span class="fa fa-check"></span>
                                            </label>
                                        </div>
                                    </td>
                                    
                                    <td>{{framePager.pageStart+i}}</td>
                                    <td>{{item.apply_topic}}</td>
                                    <td>{{item.apply_remark}}</td>
                                    <td>{{item.apply_status}}</td>
                                    <td>{{item.apply_man_name}}</td>
                                    <td align="center">{{item.apply_date}}</td>
                                    <td>{{item.audit_type}}</td>
                                
                                    <td>{{item.audit_man_name}}</td>
                                    <td>{{item.audit_remark}}</td>
                                   
                                   
                                    <td align="center">

                                        <a href="#" (click)="goEdit(editTemplateModal,'modal','modal-lg',item)"
                                            title="审核"><em class="fa-lg fas fa-edit mr-1"></em></a>
                                        <a href="#" (click)="deleteApply(item)" title="删除"><em
                                                class="fa-lg fas fa-trash mr-1" style="color:#F56D6D"></em></a>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        <!-- TODO -->
                        <frame-pager [url]="QUERY_URL" hideSearch="true" hasCheck="true" #framePager
                            (preReqEvent)="search($event)"></frame-pager>
                    </div>

                    <!-- 编辑页面 -->
                    <div class="col-lg-12" *ngIf="item && editShowType != null &&editShowType!='modal'">
                        <ng-container *ngTemplateOutlet="editTemplateModal">
                        </ng-container>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- only编辑页面-->
    <div class="col-lg-12" *ngIf="item && editShowType != null &&editShowType =='only'">
        <ng-container *ngTemplateOutlet="editTemplateModal">
        </ng-container>
    </div>
    <!--关联课程界面  -->
    <div class="col-lg-12" *ngIf="courseShowType">
        <ng-container *ngTemplateOutlet="courseTemplateModal">
        </ng-container>
    </div>
</div>

<div class="mt-5">
    <frame-uploader #uploader [silenceUpload]="true" [autoUpload]="true" [uploadUrl]="UPLOAD_URL"></frame-uploader>
</div>

<ng-template #editFormTemplate>
    <form [formGroup]="formModel" *ngIf="item" class="form-validate form-horizontal" novalidate="">
        <input type="hidden" class="form-control" formControlName="id" [(ngModel)]="item.id"
            [formControl]="formModel.controls['id']" />
        <div class="row mb-1">

            <label class="col-lg-2 col-form-label text-lg-right">申请主题</label>
            <div class="col-lg-10" style="padding-top:6px;">
                {{item.apply_topic}}
             </div>

            
        </div>

        <div class="row mb-1">

               
    
                <label class="col-lg-2 col-form-label text-lg-right">申请说明</label>

                <div class="col-lg-10" style="padding-top:6px;white-space:pre-wrap;">
                    {{item.apply_remark}}
                   
                </div>
            </div>

            <div class="row mb-1">
                <label class="col-lg-2 col-form-label text-lg-right">证明材料</label>
                <div class="col-lg-8 form-inline">
                   
                    <span *ngIf="item.file_name && item.id"><a href="#" (click)="downloadApplyFile(item.id);">{{item.file_name}}</a></span>
                </div>
            </div>
        
    </form>
</ng-template>

<ng-template #editTemplateModal>
    <div class="modal-content" style="width: 1000px;">
        <div class="modal-header info-success-qm">
            <div class="pull-left">
                <em class="fa-lg fas fa-edit "></em> 审核页面
            </div>
            <button type="button" class="close" (click)="hideModal()">×</button>
        </div>

        <!-- 1@3 -->
        <div class="modal-body" style="width: 1000px;">
            <div [ngTemplateOutlet]="editFormTemplate"></div>
            <div [ngTemplateOutlet]="oldTemplate"></div>
            <div [ngTemplateOutlet]="newTemplate"></div>
            
            <div class="modal-footer" style="padding-top:2px;">   
                <button class="btn btn-info" (click)="audit()" *ngIf="item && item.apply_status=='待考试院审核'">
                        <i class="fa fa-info-circle"> </i> 审批
                    </button>
                <button class="btn btn-default" (click)="hideModal()">
                    <i class="icon-close"> </i> 取消
                </button>
            </div>
        </div>

        
    </div>
</ng-template>



<ng-template #oldTemplate>
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <h4>原备案考生</h4>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <table class="table table-sm table-striped table-hover table-bordered bg-white">
                    <thead>
                        <tr>
                                <th>序号</th>
                            <th>姓名</th>
                            <th align="center">准考证号</th>
                            <th>专业名称</th>
                            <th>主考学校</th>
                            <th>衔接学校</th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        <tr *ngFor="let std of oldStds; let i = index">
                                <td>{{i+1}}</td>
                            <td>{{std.std_name}}</td>
                            <td align="center">{{std.ticket_no}}</td>
                            <td>{{std.major_name}}</td>
                            <td>{{std.org_name}}</td>
                            <td>{{std.join_school_name === '()'  ? '' : std.join_school_name}}</td>
                            
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

    </div>
</ng-template>

<ng-template #newTemplate>
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <h4>申请转学转专业的网络助学备案考生</h4>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <table class="table table-sm table-striped table-hover table-bordered bg-white">
                    <thead>
                        <tr>
                                <th>序号</th>
                            <th>姓名</th>
                            <th align="center">准考证号</th>
                            <th>专业名称</th>
                            <th>主考学校</th>
                            <th>衔接学校</th>
                            
                        </tr>
                    </thead>
                    <tbody>
                        <tr *ngFor="let std of yesStds; let i = index" >
                                <td>{{i+1}}</td>
                            <td>{{std.std_name}}</td>
                            <td align="center">{{std.ticket_no}}</td>

                            <td style="color:red;">{{std.major_name}}</td>
                            <td style="color:red;">{{std.org_name}}</td>
                            <td style="color:red;">{{std.join_school_name === '()'  ? '' : std.join_school_name}}</td>
                            
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-12">
                <h4>审核意见</h4>
            </div>
        </div>

        <div class="panel-body ml-sm">
            <div class="card card-default">
                <div class="card-body">
                <form [formGroup]="auditFormModel" *ngIf="item" class="form-validate form-horizontal" novalidate="">
                        
                    <!--查询条件-->
                    <div class="row mb-3 ml-1">
                        <div class="col-lg-12">
                            <div class="row mb-1">
           
                                <label class="col-lg-2 col-form-label text-lg-right">审批类型：</label>
                                <div class="col-lg-8" style="padding-top:6px;">
                                    <label class="radio-inline c-radio" style="margin: 0px !important">
                                            <input type="radio" name="audit_type" value="审批通过" [(ngModel)]="item.audit_type" 
                                                formControlName="audit_type" [formControl]="auditFormModel.controls['audit_type']" (click)="this.item.audit_remark='审批通过'"/>&nbsp;&nbsp;审批通过
                                            <span class="fa fa-circle" style="margin: 0px !important"></span>
                                    </label>&nbsp;&nbsp;
                                    <label class="radio-inline c-radio" style="margin: 0px !important">
                                            <input type="radio" name="audit_type" value="审批不通过" [(ngModel)]="item.audit_type" 
                                                formControlName="audit_type" [formControl]="auditFormModel.controls['audit_type']" (click)="this.item.audit_remark='审批不通过'"/>&nbsp;&nbsp;审批不通过
                                            <span class="fa fa-circle" style="margin: 0px !important"></span>
                                    </label>&nbsp;&nbsp;
                                    <label class="radio-inline c-radio" style="margin: 0px !important">
                                            <input type="radio" name="audit_type" value="审批驳回" [(ngModel)]="item.audit_type" 
                                                formControlName="audit_type" [formControl]="auditFormModel.controls['audit_type']" (click)="this.item.audit_remark='审批驳回'"/>&nbsp;&nbsp;审批驳回
                                            <span class="fa fa-circle" style="margin: 0px !important"></span>
                                    </label>
                                    <span class="text-danger" *ngIf="auditFormModel.get('audit_type').hasError('required') && (auditFormModel.get('audit_type').dirty || auditFormModel.get('audit_type').touched)">请选择审批类型</span>
                                </div>
                            </div>
                            <div class="row mb-1">
                                <!-- 审核意见 -->
                                <label class="col-lg-2 col-form-label text-lg-right">审批意见：</label>
                                <div class="col-lg-8">
                                    <textarea class="form-control" [(ngModel)]="item.audit_remark" [formControl]="auditFormModel.controls['audit_remark']" formControlName="audit_remark" rows="3" maxlength="64"></textarea>
                                </div>
                                <span class="text-danger" *ngIf="auditFormModel.get('audit_remark').hasError('required') && (auditFormModel.get('audit_remark').dirty || auditFormModel.get('audit_remark').touched)">请输入审批意见</span>
                            </div>
                        </div>
                    </div>
                </form>
                   
                </div>
            </div>
        </div>

    </div>
</ng-template>

  

