  <span *ngIf="show" class="backToList">

    <a (click)="show = !show;" tooltip="Go to listing">Back to List</a>
    
    </span>
<div class="col-lg-12" *ngIf="!show">
    
<!--/.row-->
<div class="row">
 <!--/.col-->
 <div class="col-md-12 mb-4">
  <!-- Nav tabs -->
  <tabset>
    <tab>
      <ng-template tabHeading> View Document &nbsp;<span class="badge badge-pill badge-success"></span></ng-template>
      <!--/.row-->
      <div class="card"> 
         <div class="card-header">
                    <i class="fa fa-align-justify"></i>Document List
                </div>
               
                 <div class="card-body">
	  <div class="row">
                        <div class="col-md-4">
                            <div class="input-prepend input-group">
                                <span class="input-group-addon">
                                    <i class="fa fa-search"></i>
                                    </span>
                                <input id="search" class="form-control" type="text" placeholder="search">
                            </div>
                        </div>
                    </div>
			<br>
	  
  <div class="row">
    <div class="col-lg-12 col-xs-12">
      <table class="table table-bordered">
        <thead>
            <tr>
                <th>DocumentName</th>
                <th>Description</th>
                <th>Status</th>
				        <th>Action</th>
              </tr>
        </thead>
        <tbody>
              <tr>
                <td>Transfer certificate</td>
                <td>Transfer certificate Doc</td>
                <td>
                  <span class="badge badge-success">Active</span>
                </td>
				 <td>
                                    <i class="fa fa-edit" tooltip="Edit" (click)="editEmployee()"></i> 
                                </td>
              </tr>   
              <tr>
                <td>Provisional Certificate</td>
                <td>Provisional Certificate Doc</td>
               
               <td>
                  <span class="badge badge-success">Active</span>
                </td>
				  <td>
                                    <i class="fa fa-edit" tooltip="Edit" (click)="editEmployee()"></i> 
                                </td>
              </tr>
              <tr>
                <td>Degree Certificate</td>
                <td>Degree Certificate Doc</td>
               
                <td>
              <span class="badge badge-danger">Inactive</span>
            </td>
			<td>
                                    <i class="fa fa-edit" tooltip="Edit" (click)="editEmployee()"></i> 
                                </td>
              </tr>
              
             
            </tbody>
      </table>
      <ul class="pagination">
        <li class="page-item"><a class="page-link" href="#">Prev</a></li>
        <li class="page-item active">
          <a class="page-link" href="#">1</a>
        </li>
        <li class="page-item"><a class="page-link" href="#">2</a></li>
        <li class="page-item"><a class="page-link" href="#">3</a></li>
        <li class="page-item"><a class="page-link" href="#">4</a></li>
        <li class="page-item"><a class="page-link" href="#">Next</a></li>
      </ul>
    </div>
    </div>
    </div>
    <!--/.col-->
  </div>
  <!--/.row-->
    </tab>
    <tab>
      <ng-template tabHeading> Add Document</ng-template>
	   <div class="card">
        <div class="card-header">
           <i class="fa fa-align-justify"></i>Document
        </div>
     
        <form action="" method="post" class="form-horizontal">
		 <div class="card-body">
          <div class="form-group row">
		 
            <div class=" col-md-4 ">
              <label for="company">Document Name<span class="required">&nbsp;*</span></label>
              <input type="text" class="form-control" id="company" placeholder="Enter Document Name">         
			  </div>
             <div class=" col-md-4 ">
              <label for="company">Document Description<span class="required">&nbsp;*</span></label>
              <input type="text" class="form-control" id="company" placeholder="Document description">         
			  </div>
         <div class="col-md-4">
			            <label for="company">Active/De-Active<span class="required">&nbsp;*</span></label>
			            <br>
						  <label class="switch switch-3d switch-primary">
						  <input type="checkbox" class="switch-input" checked>
						  <span class="switch-label"></span>
						  <span class="switch-handle"></span>
					     </label>
		            </div>
			  </div>
		  </div>
		  <br>
          <div class="card-footer">
          <div class="form-group row">
            <div class=" col-md-12" align="right">
			
                <button type="button" style="margin-bottom: -14px" class="btn btn-sm btn-success"><i class="fa fa-dot-circle-o"></i> Submit</button>
				&nbsp;
                <button type="reset" style="margin-bottom: -14px" class="btn btn-sm btn-danger"><i class="fa fa-ban"></i> Reset</button>
            </div>
          </div> 
          </div>		  
        </form>
     
	  </div>
	 
	  </tab>
  </tabset>
</div><!--/.col-->
</div>
</div>

<!--/.row-->



  
  
   
  
 