{% extends 'base_enquiry.html' %}
{% load customtags %}
{% load static %}
{% block contentbody %}
<style>
   .hidden{
   display:none
   }
   .table th, .table td, .table tr { 
   border-top: none !important; 
   }
   div[class*="vr"] {
   background: #FFF;
   border: 1px solid #F0F0F0;
   border-left: 2px solid #3BAFDA;
   border-radius: 4px;
   padding: 1em;
   margin: .5em 0;
   overflow: auto;
   max-height: 250px;
   position: relative;
   }
</style>
<div> 
   <div class="scrollable position-relative ps-container ps-theme-default " style="height:100%;" data-ps-id="825bc4f5-204b-14d1-9102-3e0c389df1dc">
      <div class="card-header bg-info">
         <h4 class="mb-0 text-white">Personal Info</h4>
      </div>
      <div class="card-body bg-white">
         <table class="table table-striped bg-light">
            <tbody>
               <tr>
                  <td>
                     <strong style="color:green">Enquiry No.:</strong>
                  </td>
                  <td>Enq-{{personal_info.id}}</td>
                  <td></td>
                  <td></td>
               </tr>
               <tr>
                  <td>
                     <strong>Student Name:</strong>
                  </td>
                  <td>{{personal_info.student_name}}</td>
                  <td>
                     <strong>Student DOB:</strong>
                  </td>
                  <td>{{personal_info.dob}}</td>
               </tr>
               <tr>
                  <td>
                     <strong>Student Phone:</strong>
                  </td>
                  <td>{{personal_info.mobile_number}}</td>
                  <td>
                     <strong>Student Address:</strong>
                  </td>
                  <td>{{personal_info.address}}</td>
               </tr>
               <tr>
                  <td>
                     <strong>Student Email:</strong>
                  </td>
                  <td> {{personal_info.email}}</td>
                  <td>
                     <strong>Marital Status:</strong>
                  </td>
                  <td>{{personal_info.marital_status}}</td>
               </tr>
               <!-- <tr>
                  <td>
                     <strong>Enquiry Mode</strong>
                  </td>
                  <td>{{personal_info.otherdetail_set.first.enquiry_mode}}</td>
                  <td>
                     <strong>Company Name:</strong>
                  </td>
                  <td>Access Education Network</td>
               </tr> -->
               <tr>
                  <td></td>
                  <td></td>
               </tr>
            </tbody>
         </table>
         
      </div>
      <div id="accordion2" class="accordion" role="tablist" aria-multiselectable="true" style="border: 1px solid #bbbbbb; padding-bottom: 10px">
         <div class="card">
            <div class="card-header" role="tab" id="headingTwo">
               <h5 class="mb-0">
                  <a data-toggle="collapse" data-parent="#accordion2" href="#collapse2" aria-expanded="true" aria-controls="collapseTwo">
                  <small> Hide/Show Applicaiton details </small>
                  </a>
               </h5>
            </div>
            <div id="collapse2" class="collapse" role="tabpanel" aria-labelledby="headingTwo">
               <div class="card-body p-15">
                  <div class="card-header bg-info">
                     <h4 class="mb-0 text-white">Academic Information</h4>
                  </div>
                  <table class="table table-striped">
                     <tbody>
                        <tr>
                           {% if  personal_info.previousacademicdetail_set.first.program_level == "10 Plus 2 | A Level" %}
                                <th>Last Q: </th>
                                <th>Grade: </th>
                                <th>Pass Year</th>
                                <th>Stream:</th><br>
                                <tr>
                                 <td>{{personal_info.previousacademicdetail_set.first.program_level}}</td>
                                 <td>{{personal_info.previousacademicdetail_set.first.grade_percentage}}</td>
                                 <td>{{personal_info.previousacademicdetail_set.first.passed_year}}</td>
                                 <td>{{personal_info.previousacademicdetail_set.first.stream}}</td>
                                 </tr>
                                
                            {% elif personal_info.previousacademicdetail_set.first.program_level == "Diploma | PCL" %}
                                 <th>Last Q:</th>
                                 <th>Grade:</th>
                                 <th>Pass Year:</th>
                                 <th>Stream:</th>
                                 <th>Degree:</th>
                                 <th>Awarding body:</th>
                                 <th>Duration:</th>
                                 <tr>
                                    <td>{{personal_info.previousacademicdetail_set.first.program_level}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.grade_percentage}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.passed_year}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.stream}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.degree_name}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.awarding_body}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.duration}} years</td>
                                 </tr>
                            {% else %}
                                 <th>Last Q:</th>
                                 <th>Grade:</th>
                                 <th>Pass year:</th>
                                 <th>Degree:</th>
                                 <th>Uni:</th>
                                 <th>Duration:</th>
                                 <tr>
                                    <td>{{personal_info.previousacademicdetail_set.first.program_level}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.grade_percentage}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.passed_year}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.degree_name}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.awarding_body}}</td>
                                    <td>{{personal_info.previousacademicdetail_set.first.duration}} years</td>
                                 </tr>
                            {% endif %}
                            <!-- <th scope="col">#</th> -->
                            <!-- <th><strong>Program Level</strong>	</th>
                            <th><strong>Grade / %:</strong></th>
                            <th><strong>Pass Year:</strong></th>
                            <th><strong>Degree:</strong></th>
                            <th><strong>Stream:</strong></th>
                         </tr>
                        <tr>
                           <td> {{personal_info.previousacademicdetail_set.first.program_level}}</td>
                           <td>{{personal_info.previousacademicdetail_set.first.grade_percentage}}%</td>
                           <td>{{personal_info.previousacademicdetail_set.first.passed_year}}</td>
                           <td>{{personal_info.previousacademicdetail_set.first.degree_name}}</td>
                           <td>{{personal_info.previousacademicdetail_set.first.stream}}</td> -->
                        </tr>
                     </tbody>
                  </table>
               </div>
               <br/>
               <div class="card-body" >
                  <div class="card-header bg-info">
                     <h4 class="mb-0 text-white">Test Score</h4>
                  </div>
                  <table class="table table-striped">
                     <tbody>
                        <tr>
                           <td> <strong>English Test</strong> </td>
                           <td>{{personal_info.testscore_set.first.english_test}}</td>
                           <td>{{personal_info.testscore_set.first.secured_points}}</td>
                        </tr>
                        <tr>
                           <td> <strong> Standarized Test</strong></td>
                           <td>{{personal_info.testscore_set.first.standarized_test}}</td>
                           <td>{{personal_info.testscore_set.first.standrized_points}}</td>
                        </tr>
                     </tbody>
                  </table>
               </div>
               <div class="card-body" >
                  <div class="card-header bg-info">
                     <h4 class="mb-0 text-white">Program Interested For</h4>
                  </div>
                  <table class="table table-striped">
                     <tbody>
                        <tr>
                           <!-- <th scope="col">#</th> -->
                           <th><strong>Country Preference </strong>	</th>
                           <th><strong>Program Level </strong>	</th>
                           <th><strong>Program Details </strong></th>
                        </tr>
                        <tr>
                           {% for enq in personal_info.programinterestedfor.all %}
                           <!-- <th scope="row">1</th> -->
                           <td>{{personal_info.preference_country}}</td>
                           <td>{{enq.pg_level}}</td>
                           <td>
                              {% for detail in personal_info.programinterestedfor.first.pgcoursedetail.all %}
                              {{detail}}<br/>
                              {% endfor %}
                           </td>
                           {% endfor %}
                        </tr>
                     </tbody>
                  </table>
               </div>
            </div>
         </div>
      </div>
   </div>
   <br/>
   <div class="row">
      <div class="col-lg-12">
         <div class="card">
            <div id="accordion3" class="accordion" role="tablist" aria-multiselectable="true">
               <div class="card">
                  <div class="card-header bg-info " role="tab" id="headingTwo">
                     <h5 class="mb-0">
                        <a class="text-white"data-toggle="collapse" data-parent="#accordion2" href="#collapse3" aria-expanded="true" aria-controls="collapseTwo">
                        Required Document to Upload & Status
                        </a>
                     </h5>
                  </div>
                  <div id="collapse3" class="collapse show" role="tabpanel" aria-labelledby="headingTwo">
                     <div class="card-body">
                        
                        <div class="table-responsive">
                           <table class="table table-striped">
                              <thead class="bg-secondary text-white">
                                 <tr>
                                    <!-- <th scope="col">SN</th> -->
                                    <th scope="col">Documents</th>
                                    <!-- <th scope="col">Status</th> -->
                                    <th scope="col">status</th>
                                 </tr>
                              </thead>
                              <tbody id="tbody">
                                 {% for each in career%}
                                 <tr id="{{each.id}}" value="{{each.id}}">
                                    <th >{{each.name}}</th>
                                    <td>{{each.status}}</td>
                                    <!-- <td>    
                                       {{each.docs_type__rdod_document_type}}
                                    </td> -->
                                    
                                    
                                    
                                 </tr>
                                 {% endfor %}
                              </tbody>
                           </table>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
      {% if applied_uni_list %}
         <div class="row">
            <div class="col-lg-12">
                  <div id="appliedUni" class="accordion" role="tablist" aria-multiselectable="true">
                        <div class="card-header bg-info" role="tab" id="headingOne">
                           <h5 class="mb-0">
                              <a class="text-white" data-toggle="collapse" data-parent="#appliedUni" href="#collapseapplication" aria-expanded="true" aria-controls="collapseOne">
                              Applied University
                              </a>
                           </h5>
                        </div>
                        <div id="collapseapplication" class="collapse show" role="tabpanel" aria-labelledby="headingOne">
                           <div class="card-body">
                              <div class="row">
                                 <div class="col">
                                    <div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
                                        {% for each in applied_uni_list %}
                                        
                                            <a class="nav-link applieduni" id="custom-pills-{{each.id}}" data-toggle="pill" uni_id="{{each.country}}" href="#v-pills-{{each.id}}" role="tab" aria-controls="custom-pills-home" aria-selected="true">
                                             {{each.university}} <br/>
                                             {{each.course__concentration}} ({{each.course__program_level__name}})
                                            </a>
                                      
                                        {% endfor %}
                  
                                     </div>
                                 </div>
                                  <div class="col-8">
                                    <div class="tab-content" id="v-pills-tabContent">
                                        <div id="sharedDocs" class="accordion" role="tablist" aria-multiselectable="true">
                                            <div class="card-header bg-info" role="tab" id="headingOne">
                                                <h5 class="mb-0 text-white">
                                                    <a class="text-white" data-toggle="collapse" data-parent="#sharedDocs" href="#shareDocstable" aria-expanded="true" aria-controls="collapseOne">

                                                        Sharable Documents
                                                    </a>
                                                </h5>
                                            </div>
                                            <div id="shareDocstable" class="collapse" role="tabpanel" aria-labelledby="headingOne">
                                                <div class="table-reponsive">
                                                   <form action="#" method="POST" id="save-sharable-status"> 
                                                      {% csrf_token %}
                                                   <table class="table table-striped table-hover applied-university-table bg-light">
                                                        <thead class="bg-secondary text-white">
                                                        <tr>
                                                            <th>
                                                                <strong>SN</strong>
                                                            </th>
                                                            <th>
                                                                <strong>Documents</strong>
                                                            </th>
                                                            <th>
                                                                <strong>Status</strong>
                                                            </th>
                                                            <th>
                                                                <strong>Remark</strong>
                                                            </th>
                                                        </tr>
                                                        </thead>
                                                        <tbody id="shareable_doc_table">
                                                         
                                                        </tbody>
                                                        <tfoot>
                                                         <tr class="text-right">
                                                             <td colspan="4">
                                                                 <input type="submit" value="Update" class="btn btn-primary btn-sm">                           
                                                             </td>
                                                         </tr>
                                                     </tfoot>
                                                    </table>
                                                   </form>
                                                </div>
                                            </div>
                                        </div>
                                        {% for each in applied_uni_list %}
                                        <div class="tab-pane fade" id="v-pills-{{each.id}}" role="tabpanel" aria-labelledby="v-pills-home-tab">
                                           
                                                <br/>
                                                <div class="card-header bg-info" role="tab" id="headingOne">
                                                <h5 class="mb-0 text-white">
                                                    Required Docs & Status Update
                                                </h5>
                                                </div>
                                                <div class="table-reponsive">
                                                   <form action="#" method="POST" class="save-required-docs-status">
                                                      {% csrf_token %}
                                                         <table id="table-{{each.country}}" class="table table-striped table-hover bg-light required_doc_table">
                                                            <thead class="bg-secondary text-white">
                                                               <tr>
                                                                     <th>
                                                                     <strong>SN</strong>
                                                                     </th>
                                                                     <th>
                                                                     <strong>Documents</strong>
                                                                     </th>
                                                                     <th>
                                                                     <strong>Status</strong>
                                                                     </th>
                                                                     <th>
                                                                     <strong>Remark</strong>
                                                                     </th>
                                                               </tr>
                                                            </thead>
                                                            <tbody>
                                                               
                                                               
                                                            </tbody>

                                                            <tfoot>
                                                               <tr class="text-right">
                                                                  <td colspan="4">
                                                                     <input type="submit" value="Update" class="btn btn-primary btn-sm">                           
                                                                  </td>
                                                               </tr>
                                                         </tfoot>
                                                         </table>
                                                </form>
                                                </div>
                                            
                                                <div class="card-header bg-info">
                                                <h5 class="mb-0 text-white">
                                                    Office Status
                                                </h5>
                                                </div>
                                                <div class="table-responsive">
                                                <form action="#" method="POST" id="save-office-status">
                                                    {% csrf_token %}
                                                    <table id="office-docs" class="table table-striped bg-light">
                                                        <thead class="bg-secondary text-white">
                                                            <tr>
                                                            <th scope="col">SN</th>
                                                            <th scope="col">Name</th>
                                                            <th scope="col">Status	</th>
                                                            <th scope="col">Update</th>
                                                            <th scope="col">Action</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody id="tbody2">
                                                            {% for each in office_doc_lists %}
                                                            <tr id="{{each.rdod_status.id}}" value="{{each.rdod_status.id}}">
                                                            <th scope="row" >{{each.id}}</th>
                                                            <td>{{each.rdod_name}}</td>
                                                            {% with current_status=each|doc_status:obj.id %}
                                                            <td> 
                                                                {{current_status}}   
                                                            </td>
                                                            <td>
                                                                
                                                            </td>
                                                            {% endwith %}
                                                            <td></td>
                                                            </tr>
                                                            {% endfor %}
                                                        </tbody>
                                                       
                                                    </table>
                                                </form>
                                                </div>
                                        </div>
                                        {% endfor %}
            
                                    </div>
                                 </div> 
                                 <!-- --------------------- -->
                              </div>
                           </div>
                        </div>
                        <!-- APPLIED UNI END -->
                  </div>
            </div>
         </div>
         {% else %}
         {% endif%}
         <!-- follow up -->
         <!-- <div class="row">
            <div class="col-lg-12">
               <div class="card">
                  <div id="accordion5" class="accordion" role="tablist" aria-multiselectable="true">
                     <div class="card">
                        <div class="card-header bg-info" role="tab" id="headingTwo">
                           <h5 class="mb-0">
                              <a class='text-white' data-toggle="collapse" data-parent="#accordion5" href="#collapse5" aria-expanded="true" aria-controls="collapseTwo">
                              Follow Up & Communications
                              </a>   
                           </h5>
                        </div>
                        <div id="collapse5" class="collapse" role="tabpanel" aria-labelledby="headingTwo">
                           
                              
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div> -->
         <div class="row">
            <div class="col-lg-12">
               <div class="card">
                  <div id="accordion6" class="accordion" role="tablist" aria-multiselectable="true">
                     <div class="card">
                        <div class="card-header bg-info" role="tab" id="headingTwo">
                           <h5 class="mb-0">
                              <a class="text-white" data-toggle="collapse" data-parent="#accordion6" href="#collapse6" aria-expanded="true" aria-controls="collapseTwo">
                              Thread Discussion for Application No: ENQ-{{obj.id}}
                              </a>   
                           </h5>
                        </div>
                        <div id="collapse6" class="collapse" role="tabpanel" aria-labelledby="headingTwo">
                           <div class="card-body">
                              <!-- Categories: {{obj.followupcommunication_set.last}} -->
                              
                                 {% for comm in comments %}
                                 <div class="name_are" style="padding-bottom: 0.5rem;">
                                    {{comm.created_by}} 
                                 </div>
                                 <p style="color: #FFF;background-color: gray; max-width: 50% !important; min-height: 2rem !important; overflow-wrap: break-word;
                                 padding-top: 0.5rem; padding-left: 0.5rem;" >

                                    <span style="font-size:15px;  ">

                                       {{comm.post_comment}}
                                    </span>
                                    </p>
                                    <p>
                                       {{ comm.posted_date }}
                                    </p>
                                    <hr>
                                 {% endfor %}
                              </h6>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
         <div class="row">
            <div class="col-lg-12">
               <div class="card">
                  <div id="accordion7" class="accordion" role="tablist" aria-multiselectable="true">
                     <div class="card">
                        <div class="card-header bg-info" role="tab" id="headingTwo">
                           <h5 class="mb-0">
                              <a class="text-white" data-toggle="collapse" data-parent="#accordion7" href="#collapse7" aria-expanded="true" aria-controls="collapseTwo">
                              Recommended University
                              </a>   
                           </h5>
                        </div>
                        <div id="collapse7" class="collapse" role="tabpanel" aria-labelledby="headingTwo">
                           <div class="card-body">
                              <!-- Categories: {{obj.followupcommunication_set.last}} -->
                              <!-- <h6 id="last_comment"> -->
                              
                              <div class="row">
                                 {% for x in recommended_uni %}
                               
                                 

                                  <div class="col-md-12">
                                   
                                     
                                     <div class="row">
                                       <div class="col-md-3">
                                          <p style="background-color: blue; color: #FFF; height: 2rem ; padding-top: 0.7rem;padding-left: 1rem;">

                                             {{x.uni_or_campus.name}}    
                                          </p>
                                       </div>
                               
                                             <div class="col-md-3">
                                                <p>Course</p>
                                                <p>Program Level</p>
                                                <p>Concentration</p>
                                                <p>Application Fee </p>
                                                <p>location</p>
                                                <p>Duration </p>
                                                <p>Tuition Fee </p>
                                                <p>Entry Request </p>
                                                <p>Test Score  </p>
                                                <p>Application Deadline</p>
                                                <p>Test Score  </p>
                                                <p>Scholarship Detail </p>
                                                <p>Remarks </p>


                                             </div>
                                             <div class="col-md-6">
                                                <h5 class="card-title"> {{x.course.name}}</h5>
                                                <p class="card-text"> {{x.program_level.name}}</p>
                                                <p class="card-text"> {{x.concentration}}</p>
                                                 <p class="card-text">{{x.application_fee}}</p>
                                                 <p class="card-text">{{x.location}}</p>
                                                 <p class="card-text">{{x.duration}}</p>
                                                 <p class="card-text">{{x.tuition_fee}}</p>
                                                 <p class="card-text"> {{x.entry_req}}</p>
                                                 <p class="card-text" > {{x.test_score_req}}</p>
                                                 <p class="card-text" >{{x.application_deadline}}</p>
                                                 <p class="card-text"> {{x.scholarship_detail}}</p>
                                                 <p class="card-text" >  {{x.remarks}}</p>
                                             </div>
                                          </div>
                                        
                                         <!-- <a href="#" class="btn btn-primary">Go somewhere</a> -->
                                         <hr />  
                                     
                                  </div>
                                
                               
                                                                
                                 {% endfor %}
                              </div>
                                 
                                 
                              
                              <!-- </h6> -->
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
</div>
<div class="modal" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1" aria-modal="true">
   <div class="modal-dialog" role="document">
      <div class="modal-content">
         <div class="modal-header">
            <h4 class="modal-title" id="exampleModalLabel1">Update Status</h4>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
         </div>
         <div class="modal-body">
            <div class="form-errors">{{ office_form_status.non_form_errors }}</div>
            <form id="save_status_form" method="POST">
               {% csrf_token %}
               <div class="row">
   
                  <div class="col-6">
                     {{office_form_status.rdod_status}}
                  </div>
                  <div class="col-4">
                     {{office_form_status.rdod_status_name}}
                  </div>
               </div>
               <br/>
               <input type="submit" class="btn btn-info btn-sm" value="Submit">
            </form>
         </div>
      </div>
   </div>
   <input type="hidden" id="current_obj_id" value="{{obj.id}}">
</div>
{{ shareable_docs|json_script:"commondocs" }}
{{ current_status|json_script:"current_status" }}
{{ req_docs|json_script:"required_docs" }}
{{ applied_uni_list|json_script:"applied_university" }}
{{ all_status|json_script:"all_status"}}

{% endblock %}
{% block inline_javascript %}
{{office_form_status.media}}
{{ block.super }}
<script src="{% static 'js/required_docs_post.js' %}"></script>
<script src="{% static 'js/query/miniquery.js' %}"
{% endblock %}