{% extends "partials/base.html" %}
{% load static %}

{% load custom_filters %}
{% block content %}
<!-- Page Wrapper -->
<style>
    .settings-profile-upload .profile-pic img {
        height: 100px;
    }

    .settings-profile-upload .profile-pic {
        width: 100px;
        height: 100px;
    }

</style>
<div class="page-wrapper">
    {% include 'partials/error-meg.html' %}
    <div class="content">
        <div class="d-md-flex d-block align-items-center justify-content-between border-bottom pb-3">
            {% block title %}
            {% include "partials/title.html" with title="Edit Assign Class" text="Dashboard" textone="Assign Class" texttwo="Edit Assign Class"%}
            {% endblock title %}
            <!-- <div class="d-flex my-xl-auto right-content align-items-center flex-wrap">
                <div class="pe-1 mb-2">
                    <a href="#" class="btn btn-outline-light bg-white btn-icon" data-bs-toggle="tooltip"
                        data-bs-placement="top" aria-label="Refresh" data-bs-original-title="Refresh">
                        <i class="ti ti-refresh"></i>
                    </a>
                </div>
            </div> -->
        </div>
        <div class="d-md-flex d-block mt-3">
            <div class="flex-fill ps-0 border-0">
                <div class="card">
                    <div class="card-header">
                        <div class="card-title">Teacher Assigned Class </div>
                    </div>
                    <div class="card-body align-items-start">
                        <div class="row">
                            <div class="col-md-3 pb-5">
                                <div class="nav nav-pills me-3 tab-style-7" id="v-pills-tab" role="tablist"
                                    aria-orientation="vertical">
                                    <a href="{% url 'manage_user' user='teacher' id=assginclass.teacher_id|base64_encode %}" class="nav-link text-start" aria-selected="false"><i
                                        class="feather-monitor me-1 align-middle d-inline-block"></i>Profile</a>

                                    <a class="nav-link text-start active" aria-selected="false"><i
                                            class="feather-monitor me-1 align-middle d-inline-block"></i>Edit Assign Class</a>
                                    <!-- <button class="nav-link text-start" id="main-team-tab" data-bs-toggle="pill"
                                        data-bs-target="#main-team" type="button" role="tab" aria-controls="main-team"
                                        aria-selected="false"><i
                                            class="feather-users me-1 align-middle d-inline-block"></i>Team</button>
                                    <button class="nav-link text-start" id="main-billing-tab" data-bs-toggle="pill"
                                        data-bs-target="#main-billing" type="button" role="tab"
                                        aria-controls="main-billing" aria-selected="false"><i
                                            class="feather-file me-1 align-middle d-inline-block"></i>Billing</button>
                                    <button class="nav-link text-start mb-1" id="main-email-tab" data-bs-toggle="pill"
                                        data-bs-target="#main-email" type="button" role="tab" aria-controls="main-email"
                                        aria-selected="false"><i
                                            class="feather-mail me-1 align-middle d-inline-block"></i>Email</button> -->
                                </div>
                            </div>
                            <div class="col-md-12">
                                <!-- <a href="#" class="btn btn-primary btn-sm float-end" id="toggle-btn">
                                    <i class="ti ti-edit me-2"></i> Add
                                </a> -->
                                <div class="tab-content" id="v-pills-tabContent">
                                    <div class="tab-pane show active" id="main-profile" role="tabpanel" tabindex="0">
                                       
                                     
                                        <div class="edit" id="edit">
                                            <form id="assigncoursedata" method="post" enctype="multipart/form-data">
                                                {% csrf_token %}
                                                
                                                <input type="hidden" name="assign_id" value={{assignid}}>
                                                <input type="hidden" name="teacher_id" value={{assginclass.teacher_id|base64_encode}}>
                                                    <div class="mb-3">
                                                        <label class="form-label">Select Course </label>
                                                        <select class="selectcourse" name="course" id="course">
                                                            <option disabled>Select Course</option>                                 
                                                            {% for course in courselist %}
                                                                <option value="{{ course.encodedid }}" 
                                                                    {% if course.id|stringformat:"s" == assginclass.course_id %} selected {% endif %}>
                                                                    {{ course.name }}
                                                                </option>
                                                            {% endfor %}
                                                        </select>
                                                
                                                
                                                    </div>   
                                                    <div class="mb-3">
                                                        <label class="form-label">Select Modules </label>
                                                        <input type="hidden" name="selected_modules" id="selected_modules" value="{{assginclass.module_id}}"> 
                                                        <select class="selectmodule" name="module[]" id="module" multiple>
                                                           
                                                            {% for module in coursemodule %}
                                                            {% with selected_modules=assginclass.module_id|default:""|split:"," %}
                                                         
                                                                <option value="{{ module.encodedid }}" 
                                                                {% if module.id|stringformat:"s" in selected_modules %}selected{% endif %}>
                                                                    {{ module.module_name }}
                                                                </option>
                                                                {% endwith %}
                                                            {% endfor %}
                                                        </select>
                                                        
                                                    </div>
                                                    <div class="mb-3">
                                                        <label class="form-label">Select Class & section</label>
                                                        <select class="selectclass" name="class[]" id="class" multiple>
                                                            {% for classes in classlist %}
                                                            {% with selected_class=assginclass.class_id|default:""|split:"," %}
                                                                <option value="{{ classes.encodedid }}" 
                                                                   
                                                                    {% if classes.id|stringformat:"s" in selected_class %}selected{% endif %}>
                                                                    {{ classes.class_name }} ({{ classes.section_name }})
                                                                </option>
                                                                {% endwith %}
                                                            {% endfor %}
                                                        </select>
                                                        
                                                    </div>   
                                                    
                                                   
                                                    <div class="row">
                                                        <div class="col-xxl-4 col-xl-3 col-md-6">
                                                        <div class="mb-3">
                                                            <label class="form-label">Intake Month and Year </label>
                                                            <select class="select" name="intakemonth" id="intakemonth">
                                                                <option disabled selected>Select Intake Month</option>
                                                                {% for intake in intakelist %}
                                                                <option value="{{ intake.encodedid }}" {% if intake.id|stringformat:"s" == assginclass.intakemonth %} selected {% endif %}>{{ intake.month }} {{intake.year}}</option>
                                                                {% endfor %}
                                                            </select>
                                                            
                                                        </div> 
                                                        </div> 
                                                        <div class="col-xxl-4 col-xl-3 col-md-6">
                                                            <div class="mb-3">
                                                                <label class="form-label">Course Start Date</label>
                                                                <div class="input-icon position-relative">
                                                                    <span class="input-icon-addon">
                                                                        <i class="ti ti-calendar"></i>
                                                                    </span>
                                                                    <input type="text" class="form-control datetimepicker" name="start_date" placeholder="Select Date" value="{{ assginclass.start_date|date:'Y-m-d' }}">
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-xxl-4 col-xl-3 col-md-6">
                                                            <div class="mb-3">
                                                                <label class="form-label">Course End Date</label>
                                                                <div class="input-icon position-relative">
                                                                    <span class="input-icon-addon">
                                                                        <i class="ti ti-calendar"></i>
                                                                    </span>
                                                                    <input type="text" class="form-control datetimepicker" name="end_date" placeholder="Select Date" value="{{ assginclass.end_date|date:'Y-m-d' }}">
                                                                </div>
                                                            </div>
                                                        </div> 
                                                    </div> 
                                                    <button type="button" class="btn btn-primary" id="assigncourse">submit</button>
                                                    <!-- {% if assginclass.is_deleted == True %}
                                                    <a class="btn btn-primary activatemodelescourse" 
                                                        href="#" data-coursemodules="assign" data-id="{{ assignid }}">
                                                        <i class="ti ti-check me-2"></i>Activate
                                                    </a>
                                                   {% else %}
                                                       <a class="btn btn-primary deletemodelescourse" 
                                                           href="#" data-coursemodules="assign" data-id="{{ assignid }}">
                                                           <i class="ti ti-trash-x me-2"></i>Delete
                                                       </a>
                                                   {% endif %} -->
                                                   
                                            </form>
                                        </div>
                                    </div>
                                   
                                 
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>



    </div>
</div>


{% endblock content %}


{% block javascript %}
{{ block.super }}
<script>
    
$(document).ready(function(){
    $('.selectcourse').select2({       
        placeholder: 'Select Course',
        width: '100%',        
    });
    $('.selectmodule').select2({
			multiple: true,
            placeholder: 'Select Course Modules',
			width: '100%',
            allowClear: true
		});
        $('.selectmonth').select2({       
        placeholder: 'Select Course',
        width: '100%',        
    });
    $('.selectclass').select2({
			multiple: true,
            placeholder: 'Select Class',
			width: '100%',
            allowClear: true
		});
  

});
</script>
{% endblock %}