{% extends 'conferenceapp/layout.html' %} 
{% block head %} {% endblock %}
{% block title %}{{title}}{% endblock %}
{% block style %}
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.css" />

<style type="text/css">
.dataTable no-footer{
    width:100% !important;
}
  @media screen and (max-width: 600px) {

  .mobile-responsive table {
    border: 0;
    border-collapse: collapse;
  }

 .mobile-responsive table thead {
    display:none;
  }
  .mobile-responsive table th {
    display:none;
  }
  
  
 .mobile-responsive table tr {
    margin-bottom: 20px;
    display: block;
    border-bottom: 2px thin #faf5f5;
    box-shadow: 2px 2px 1px #dadada;
    border-collapse: collapse;

  }

 .mobile-responsive table td {
    display: block;
    text-align: right;
    font-size: 15px;
    border-collapse: collapse;
    padding: 25px;

  }

 .mobile-responsive table td:last-child {
    border-bottom: 0;
  }

 .mobile-responsive table td::before {
    content: attr(data-label);
    float: left;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    
  }

  /* .mobile-responsive tbody{
    line-height:0!important;
  } */
  .sidebar {
    width: 100%;
    height: auto;
    position: relative;
  }
  .sidebar a {float: left;}
  /*div.content {margin-left: 0;}*/
  .sidebar a {
    text-align: center;
    float: none;
  }
}
</style>


{% endblock %}

{% block content %}
<div class="">
    <div class="card">
        <div class="card-body">
            <!-- <a id="conf_datails" method="post" action="{{ url_for('confapp.Back',conf_id=conf.conf_id,conf_key=conf.conf_key) }}"></a> -->
            {% for mesg in get_flashed_messages(category_filter=["successMsg"]) %}
            <div class="alert alert-success text-center successMessage alert-dismissible">
                <button class="close" data-dismiss="alert" aria-label="close">&times;</button>
                <h6>{{ mesg|safe }}</h6>
            </div>
            {% endfor %} {% for mesg in get_flashed_messages(category_filter=["errorMsg"]) %}
            <div class="alert alert-danger text-center successMessage" id="successMessage">
                <p class="close" data-dismiss="alert" aria-label="close">&times;</p>
                <h6>{{ mesg|safe }}</h6>
            </div>
            {% endfor %}
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 card-header">
                    <h4 class="text-center">{{get_conf_value.conf_name}}</h4>
                </div>

                <div class="col-lg-12 col-md-12 col-sm-12">
                    <!-- <h1 class="card-header" style="text-align: center;">{{conf.conf_name}}</h1> -->
                    <a class="btn btn-danger float-right mb-1" type="button" id="back" href="{{ url_for('confapp.Back',conf_id=conf.conf_id,conf_key=conf.conf_key) }}">Back</a>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 col-md-4 col-sm-12 confe_1 text-center">
                    <a type="button" id="confe"><h5>Conference Date</h5></a>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-12 reg_1 text-center">
                    <a type="button" id="reg"><h5>Registration Date</h5></a>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-12 addon_label_1 text-center">
                    <a type="button" id="addon_label"><h5>Addons</h5></a>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12  mobile-responsive">
                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <label class="float-right check_conf_mail" style="position: relative; right: 40px;">Send Mail</label>
                        <input class="float-right check_conf_mail send_mail_conf mt-2" style="position: relative; left: -50px;" type="checkbox" name="send_mail_conf" id="send_mail_conf" value="" />
                    </div>
                    <table class="conference table text-center">
                        <thead>
                            <tr>
                                <th scope="col ">category</th>
                                <th scope="col">start By</th>
                                <th scope="col">End By</th>
                                <th scope="col">update</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td data-label="category" class="text-center">Conference Date</td>
                                <td data-label="start By" class="text-center"><input type="datetime-local" name="conf_start_time" id="conf_start_time" value="{{get_conf_value.conf_start_time or ''}}" /></td>
                                <td data-label="end By" class="text-center"><input type="datetime-local" name="conf_end_time" id="conf_end_time" value="{{get_conf_value.conf_end_time or ''}}" /></td>

                                <td>
                                    <button type="button" id="conf_btn" value="{{get_conf_value.conf_id}}" class="btn btn-primary btn-sm conf_btn">update</button>
                                </td>
                            </tr>
                        </tbody>
                        <br />
                    </table>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12  mobile-responsive">
                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <label class="float-right check_reg_mail" style="position: relative; right: 40px;">Send Mail</label>
                        <input class="float-right check_reg_mail send_mail_reg mt-1" style="position: relative; left: -50px;" type="checkbox" name="send_mail_reg" id="send_mail_reg" value="" />
                    </div>

                    <table class="registration table text-center ">
                        <thead>
                            <tr>
                                <th scope="col ">category</th>
                                <th scope="col">start By</th>
                                <th scope="col">End By</th>
                                <th scope="col">update</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td data-label="category" class="text-center">Registration Date</td>
                                <td data-label="start By" class="text-center"><input type="date" name="reg_start_on" id="reg_start_on" value="{{get_conf_value.reg_start_on or ''}}" /></td>
                                <td data-label="End By" class="text-center"><input type="datetime-local" name="reg_end_on" id="reg_end_on" value="{{get_conf_value.reg_end_on or ''}}" /></td>
                                <td>
                                    <button type="button" id="reg_btn" value="{{get_conf_value.conf_id}}" class="btn btn-primary btn-sm reg_btn">update</button>
                                </td>
                            </tr>
                        </tbody>
                        <br />
                    </table>
                </div>
            </div>

            <form id="addon_datail" method="post" action="{{ url_for('confapp.BoBulkUpdatedAddon',conf_id=conf.conf_id,conf_key=conf.conf_key) }}">
                <div class="row" id="show_addon_table ">
                    <div class="col-lg-12 col-md-12 col-sm-12 ">
                        <button style="display: none;" type="submit" id="submit" value="" onclick="return confirm('Are you sure do you want to Update ?')" class="btn btn-primary btn-sm float-right ad_sub">Bulk update</button>
                        <label for="send_mail_addon" class="float-right check_mail" style="position: relative; right: 40px;">Send Mail</label>
                        <input class="float-right check_mail mt-1" style="position: relative; left: -50px;" type="checkbox" name="send_mail_addon" id="send_mail_addon" value="1" />
                    </div>
                    <div class="col-lg-12 col-md-12 col-sm-12  mobile-responsive ">
                        <table class="Addons table text-center">
                            <thead class="thead-dark">
                                <tr>
                                    <th scope="col ">Category</th>
                                    <th scope="col ">Addons</th>
                                    <th scope="col">Start By</th>
                                    <th scope="col">End By</th>
                                    <th scope="col">Action</th>
                                </tr>
                            </thead>
                            <input type="hidden" name="addon_id" id="addon_id" value="{{addon_data.addon_id}}" />
                            <input type="hidden" name="conf_id" id="conf_id" value="{{conf.conf_id}}" />
                            <input type="hidden" name="conf_key" id="conf_key" value="{{conf.conf_key}}" />
                            <tbody>
                                {% for row in addon_data %}
                                <tr>
                                    <td data-label="category">{{row.addon_name or ''}}</td>

                                    <td data-label="Addons">{{row.addon_view or ''}}<br><span id="error_{{row.addon_id}}" class="text-danger"></span></td>
                                    <input type="hidden" name="addon_reg" id="addon_reg" class="addon_reg" value="{{row.addon_id or ''}}" />
                                    <input type="hidden" name="addon_change_{{row.addon_id}}" id="addon_change_{{row.addon_id or ''}}" value="0" />

                                    <td data-label="start By">
                                        <input type="datetime-local" class="form-control start_by" name="start_by_{{row.addon_id}}" id="start_by_{{row.addon_id}}" value="{{row.start_by or ''}}" onChange="start_by('{{row.addon_id}}')" />
                                    </td>
                                    <td data-label="End By">
                                        <input class="form-control end_by" type="datetime-local" name="end_by_{{row.addon_id}}" id="end_by_{{row.addon_id}}" value="{{row.end_by or ''}}" onChange="end_by('{{row.addon_id}}')" />
                                    </td>
                                    <td data-label="Action ">
                                        <button type="button" id="addon_{{row.addon_id}}" value="{{row.addon_id or ''}}" class="btn btn-primary btn-sm addon_id_btn">
                                            update
                                        </button>
                                    </td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>


{% endblock %} {% block bottomscript %}
<script type="text/javascript">
    var BaseUrl = document.location.origin;

    // $('input[name="reg_start_on"]').mask("0000-00-00");
    // $('input[name="reg_end_on"]').mask("0000-00-00 00:00:00");
    //  $('.start_by').mask("0000-00-00 00:00:00");
  

    $(document).ready(function () {
       
        call_conf();

        $(".check_mail").hide();
        $(".check_reg_mail").hide();
        $(".check_conf_mail").hide();
          


        $("#confe").show();
        $(".ad_sub").hide();

        $(".Addons").hide();
        $(".conference").hide();
        $(".registration").hide();

        $("#confe").click(function () {
            $(".conference").toggle();
            $(".check_mail").hide();
            $(".check_conf_mail").show();
            $(".check_reg_mail").hide();
            $(".Addons").hide();
            $(".registration").hide();
             $( ".confe_1" ).css('background', '#296E85');
             $( ".reg_1" ).css('background', '#ADD8E6');
             $( ".addon_label_1" ).css('background', '#ADD8E6');
             $(".ad_sub").hide();
             
        });

        $("#reg").click(function () {
            $(".registration").toggle();
            $(".check_mail").hide();
             $(".check_reg_mail").show();
             $(".check_conf_mail").hide();
            $(".Addons").hide();
            $(".conference").hide();
             $( ".confe_1" ).css('background', '#ADD8E6');
             $( ".reg_1" ).css('background', '#296E85');
             $( ".addon_label_1" ).css('background', '#ADD8E6');
             $(".ad_sub").hide();
        });

        $("#addon_label").click(function () {
            $(".check_mail").show();
            $(".check_conf_mail").hide();
            $(".check_reg_mail").hide();
            $(".Addons").toggle();
            $(".conference").hide();
            $(".registration").hide();
            $(".ad_sub").toggle();
            

            
             $( ".confe_1" ).css('background', '#ADD8E6');
             $( ".reg_1" ).css('background', '#ADD8E6');
             $( ".addon_label_1" ).css('background', '#296E85');
        });

        $(document).on("click", ".reg_btn", function (e) {
        if (confirm("Are you sure to you want update")) {
            var conf_id = $("#conf_id").val();
            var conf_key = $("#conf_key").val();
            var reg_start_on = $("#reg_start_on").val();
            var reg_end_on = $("#reg_end_on").val();

            if ($("#send_mail_reg").is(":checked")) {
                var send_mail = 1;
                alert(send_mail)
            } else {
                var send_mail = 0;
            }
            if (reg_start_on < reg_end_on){
                
                
            $.ajax({
                type: "POST", // <-- get method of form
                url: BaseUrl + "/" + conf_id + "/" + conf_key + "/bo_reg_datails", // <-- get action of form
                data: { "reg_start_on": reg_start_on, "reg_end_on": reg_end_on, "send_mail": send_mail },
                dataType: "html",
                success: function (data) {
                    var data_1 = JSON.parse(data);
                    var status = data_1.status;
                    var msg = data_1.msg;
                    if (status == 1) {
                        alert(msg);
                    } else {
                        alert(msg);
                        return false;
                    }
                },
            });


            } 
            else{
                alert("Please enter valid start_by and end_by date time")
            }

        }
        });




        $(document).on("click", ".addon_id_btn", function (e) {

            if (confirm("Are you sure to you want update")) { 
            var addon_id = $(this).val();
            var start_by = $("#start_by_" + addon_id).val();
            var end_by = $("#end_by_" + addon_id).val();


            var conf_id = $("#conf_id").val();
            var conf_key = $("#conf_key").val();
            if ($("#send_mail_addon").is(":checked")) {
                var send_mail = 1;
            } else {
                var send_mail = 0;
            }

          
                if (start_by < end_by){
            $.ajax({
                type: "POST", // <-- get method of form
                url: BaseUrl + "/" + conf_id + "/" + conf_key + "/update_addon", // <-- get action of form
                data: { "addon_id": addon_id, "start_by": start_by, "end_by": end_by, "send_mail": send_mail },
                dataType: "html",
                success: function (data_1) {
                    var data = JSON.parse(data_1);
                    var status = data.status;
                    var msg = data.msg;
                    if (status == 1) {
                        // $("#flash_success").html(msg);
                        alert(msg);
                        // $("#show_addon_table").show();
                        // $("#addon_label").show();
                        // $(".Addons").show();
                    } else {
                        alert(msg);
                        return false;
                    }
                },
            });



            } 
            else{
                alert("Please enter valid start_by and end_by date time")
            }



        }
        });



     function call_conf() {

        $(document).on("click", ".conf_btn", function (e) {
            if (confirm("Are you sure to you want update")) {
            var conf_id = $("#conf_id").val();
            var conf_key = $("#conf_key").val();
            var conf_start_time = $("#conf_start_time").val();
            var conf_end_time = $("#conf_end_time").val();
            if ($("#send_mail_conf").is(":checked")) {
                var send_mail = 1;
            } else {
                var send_mail = 0;
            }

            if (conf_start_time < conf_end_time){
            $.ajax({
                type: "POST", // <-- get method of form
                url: BaseUrl + "/" + conf_id + "/" + conf_key + "/bo_conf_datails", // <-- get action of form
                data: { "conf_start_time": conf_start_time, "conf_end_time": conf_end_time,"send_mail": send_mail },
                dataType: "html",
                success: function (data) {
                    var data_1 = JSON.parse(data);
                    var status = data_1.status;
                    var msg = data_1.msg;
                    if (status == 1) {
                        alert(msg);
                        // $("#flash_success").html(msg);

                        // $("#confe").show();
                        // $(".conference").show();
                    } else {
                        alert(msg);
                        return false;
                    }
                },
            });

            } 
            else{
                alert("Please enter valid start_by and end_by date time")
            }
}



        });


    }
    });

   

function end_by(addon_reg_type){
$("#addon_change_"+addon_reg_type).val(1)
};

function start_by(addon_reg_type){

$("#addon_change_"+addon_reg_type).val(1) 
   
};





 $(document).on("click", ".ad_sub", function (e) {


    $(".addon_label_1").show();
    var is_valid = true

    $( ".addon_reg" ).each(function( index ) {
        
         addon_reg_type =    $( this ).val();
         var id_1 = "#start_by_" + addon_reg_type;
         var start_by = $("" + id_1 + "").val();
         var id_1 = "#end_by_" + addon_reg_type;
         var end_by = $("" + id_1 + "").val();
      
         if (start_by > end_by){
            $("#error_"+addon_reg_type).html("Please enter valid start_by and end_by date time");
            is_valid = false
         }



    });

       return is_valid

 });


</script>

{% endblock %}