Sindbad~EG File Manager
{% extends "conferenceapp/layout.html" %} {% block style %} {% endblock %} {% block content %}
<form id="addon_form" action="{{url_for('addons.PostAddonForm',conf_id=conf_id,conf_key=conf_key)}}" method="POST">
<div class="container">
<div class="alert alert-success text-center successMessage alert-dismissible" id="successMessage" style="display: none;">
<p class="close" data-dismiss="alert" aria-label="close">×</p>
<span id="successMsg"></span>
</div>
<h2 class="fs-title text-center mt-2">Addon Form</h2>
<input type="hidden" name="html_data" id="html_data" value="{{html_data}}" />
<input type="hidden" name="addon_id" id="addon_id" value="{{addon_id}}" />
<input type="hidden" name="conference_id" id="conference_id" value="{{conf_id}}" />
<!-- <input type="hidden" name="conf_id" id="conf_id" value="{{conf_id}}" /> -->
<div class="card">
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Addon Type:<span style="color: red;">*</span></label>
<i class="fas fa-hand-pointer" id="addon_type_hint" data-toggle="modal" data-target="#myModal" title ="Hints of Addon Type" style="line-height: 1; color: rgb(30, 48, 80);"></i>
</div>
<div class="modal fade" id="myModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Hints Of Addon Types</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<div class="copy-message text-center" style="color: green;"></div>
<span style="color:blue;">(If you want to copy the text, then click on the text)</span><br/>
<p>
<span style="color:red;">For Example:</span><br/>
<label class="clickable-label">Choose the Registration Type</label>
<span style="color:red;">(Maximum use this addon type)</span><br/>
<label class="clickable-label">WETLAB</label><br/>
<label class="clickable-label">DRYLAB</label><br/>
<label class="clickable-label">T-shirt Size</label><br/>
<label class="clickable-label">Date planning</label><br/>
<label class="clickable-label">Choose the Pre conference workshop</label><br/>
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="col-md-8">
<select class="form-control" id="addon_type_id" name="addon_type_id">
<option value="" id="select">Select Addon Type</option>
{% if data %} {% for row in data %}
<option value="{{row.addon_type_id}}" {% if row.addon_type_id == 1 %} selected {% endif %} > {{row.addon_type}} </option>
{% endfor %} {% endif %}
</select>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Addon Name:</label>
<i class="fas fa-hand-pointer" id="addonsmodel" data-toggle="modal" data-target="#addons_model" title ="Hints of Addons Name" style="line-height: 1; color: rgb(30, 48, 80);"></i>
</div>
<div class="modal fade" id="addons_model">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Hints Of Addons Names</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<div class="copy-message text-center" style="color: green;"></div>
<span style="color:blue;">(If you want to copy the text, then click on the text)</span>
<p>
<span style="color:red;">For Example:</span><br/>
<label class="clickable-label">Early Bird</label><br/>
<label class="clickable-label">Super Early Bird</label><br/>
<label class="clickable-label">Regular</label><br/>
<label class="clickable-label">Spot</label><br/>
<label class="clickable-label">Standard</label><br/>
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="col-md-8">
<input class="form-control" type="text" name="addon_name" id="addon_name" placeholder="Enter Addon Name" />
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Reg Type:<span style="color:red;">*</span> </label>
</div>
<div class="col-md-8">
<input type="text" name="reg_type" id="reg_type" class="form-control" placeholder="Enter Reg Type" />
<input type="checkbox" class="form-input reg_type_checkbox" name="reg_type_checkbox" id="reg_type_checkbox" value="1">
<label for="reg_type_checkbox">set same as display name</label>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Display Name:</label>
<i class="fas fa-hand-pointer" id="displaynamemodel" data-toggle="modal" data-target="#displayname_model" title ="Hints of Addons Name" style="line-height: 1; color: rgb(30, 48, 80);"></i>
</div>
<div class="modal fade" id="displayname_model">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Hints Of Display Names</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<div class="copy-message text-center" style="color: green;"></div>
<span style="color:blue;">(If you want to copy the text, then click on the text)</span>
<p>
<span style="color:red;">For Example:</span><br/>
<label class="clickable-label">Early Bird</label><br/>
<label class="clickable-label">Super Early Bird</label><br/>
<label class="clickable-label">Regular</label><br/>
<label class="clickable-label">Spot</label><br/>
<label class="clickable-label">Standard</label><br/>
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="col-md-8">
<input class="form-control" type="text" name="display_name" id="display_name" placeholder="Enter Display Name" style="color:black;"/>
<input type="checkbox" class="form-input display_name_checkbox" name="display_name_checkbox" id="display_name_checkbox" value="1">
<label for="display_name_checkbox">set same as reg addon type</label>
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>User Type:<span style="color: red; font-size: 14px;">* (Displaying for mail purpuse.)</span></label>
</div>
<div class="col-md-8">
<select class="form-control" id="user_type_id" name="user_type_id" multiple>
<option value="" id="select">Select User Type</option>
{% if user_type %} {% for row in user_type %}
<option value="{{row.user_type_id}}"> {{row.user_type}} {% if row.is_mandatory_mc_no_state == 0 %} {% else %} <span style="color:red;">- MC No and MC State *</span> {% endif %}</option>
{% endfor %} {% endif %}
</select>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label >Addon Reg Type:</label>
</div>
<div class="col-md-8">
<input class="form-control" type="text" name="addon_reg_type" id="addon_reg_type" name="addon_reg_type" placeholder="Enter Addon Reg Type" style="color:black;"/>
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Amount:</label>
</div>
<div class="col-md-8">
<input class="form-control" type="text" name="amount" id="amount" name="amount" placeholder="Enter Amount" />
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Order By:</label>
</div>
<div class="col-md-8">
<input class="form-control" type="text" id="order_by" name="order_by" placeholder="Enter Order By" />
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Description:</label>
<i class="fas fa-hand-pointer" id="descriptionmodel" data-toggle="modal" data-target="#description_model" title ="Hints of Addons Name" style="line-height: 1; color: rgb(30, 48, 80);"></i>
</div>
<div class="modal fade" id="description_model">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Hints Of Description</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<p>
<span style="color:red;">This field for option only.</span><br/>
Addon Type Name Overview.
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="col-md-8">
<input class="form-control" type="description" name="description" id="description" placeholder="Enter Description" />
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Head Count:</label>
</div>
<div class="col-md-8">
<input class="form-control" type="text" name="head_count" id="head_count" placeholder="Enter head count" />
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Member types:</label>
<i class="fas fa-hand-pointer" id="show_member_type_hint" data-toggle="modal" data-target="#Member_Type_Modal" title ="Hints of Mmeber Type" style="line-height: 1; color: rgb(30, 48, 80);"></i>
<div class="modal fade" id="Member_Type_Modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Hints Of Mmeber Types</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<div class="copy-message text-center" style="color: green;"></div>
<span style="color:blue;">(If you want to copy the text, then click on the text)</span>
<p >
<span style="color:red;">For Example:</span><br/>
<label class="clickable-label">Member</label> <span style="color:red;">(1)</span><br/>
<label class="clickable-label">Non member</label> <span style="color:red;">(2)</span><br/>
<label class="clickable-label">Associate Member</label> <span style="color:red;">(6)</span>
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-8">
<select id="show_member_types" name="show_member_types" multiple>
<option value="" id="select">Select Member Type</option>
{% if m_member_type_data %} {% for row in m_member_type_data %}
<option value="{{row.member_type_id}}"> {{row.member_type}} </option>
{% endfor %} {% endif %}
</select>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Start By:</label>
</div>
<div class="col-md-8">
<input type="datetime-local" name="start_by" id="start_by" class="form-control" placeholder="Enter start by" />
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>End By:</label>
</div>
<div class="col-md-8">
<input type="datetime-local" name="end_by" id="end_by" class="form-control" placeholder="Enter end by" />
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Conference Id:</label>
</div>
<div class="col-md-8">
<input type="text" name="conference_id" id="conference_id" class="form-control" name ="conference_id"disabled value="{{conf_id}}" />
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Is Mandatory:</label>
</div>
<div class="col-md-8">
<input type="radio" class="form-input is_mandatory" name="is_mandatory" id="is_mandatory_yes" value="1" /> <label for="is_mandatory_yes" class="text-dark">Yes</label>
<input type="radio" class="form-input is_mandatory" name="is_mandatory" id="is_mandatory_no" value="0" checked /> <label for="is_mandatory_no" class="text-dark">No</label>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Is Visible:</label>
</div>
<div class="col-md-8">
<input type="radio" class="form-input is_visible" name="is_visible" id="is_visible_yes" value="1" checked /> <label for="is_visible_yes" class="text-dark">Yes</label>
<input type="radio" class="form-input is_visible" name="is_visible" id="is_visible_no" value="0" /> <label for="is_visible_no" class="text-dark">No</label>
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4">
<label>Is Custom Addon:</label>
</div>
<div class="col-md-8">
<input type="radio" class="form-input is_custom_addon" name="is_custom_addon" id="is_custom_addon_yes" value="1" /> <label for="is_custom_addon_yes" class="text-dark">Yes</label>
<input type="radio" class="form-input is_custom_addon" name="is_custom_addon" id="is_custom_addon_no" value="0" checked /> <label for="is_custom_addon_no" class="text-dark">No</label>
</div>
</div>
</div>
</div><br/>
<div class="row">
<div class="col-md-12 text-center" >
<input type="button" class="btn btn sm btn-info" value="Back" onClick="javascript:history.go(-1)" />
<input type="submit" name="save" id="save_btn" class="btn btn-success" value="Save">
<!-- <button type="button" class="btn btn-success save_btn" id="save_btn" value="Save">Save</button> -->
<input type="button" class="btn btn-success update_btn" id="update_btn" value="Update" />
</div>
</div>
</div>
</div>
</div>
</form><br/>
<div id="Addon_Table" class="mobile-responsive">
<table class="table table-bordered">
<thead style="background-color: #072645;border-color: #dee2e6;color: #FFF;">
<tr>
<th scope="col">SNo</th>
<th scope="col">Addon Type Id</th>
<th scope="col">Addon Id</th>
<th scope="col">Category</th>
<th scope="col">Reg Type</th>
<th scope="col">Display Name</th>
<th scope="col">Amount</th>
<th scope="col">Start By / End By</th>
<th scope="col">Order By</th>
<th scope="col">Modify</th>
</tr>
</thead>
<tbody id="Addon_Content"></tbody>
</table>
</div>
{% endblock %}
{% block bottomscript %}
<script type="text/javascript">
var BaseUrl = document.location.origin;
$(document).on("click", "#addon_type_hint", function (e) {
$("#myModal").show();
});
$(document).on("click", "#addonsmodel", function (e){
$("#addons_model").show();
})
$(document).on("click", "#show_member_type_hint", function (e){
$("#Member_Type_Modal").show();
});
$(document).on("click", "#descriptionmodel", function (e) {
$("#description_model").show();
});
$(document).on("click", "#displaynamemodel", function (e) {
$("#displayname_model").show();
});
$(document).ready(function () {
// checkbox display name set as same value in addon_reg_type
$("#display_name_checkbox").on('change', function() {
if ($(this).is(':checked')) {
var display_name = $("#display_name").val();
$("#addon_reg_type").val(display_name);
} else {
}
});
// end
// copy to clipboard function start
$(".clickable-label").click(function() {
var textToCopy = $(this).text();
// Create a temporary input element to copy the text to the clipboard
var input = $("<input>");
$("body").append(input);
input.val(textToCopy).select();
// Copy the text to the clipboard
document.execCommand("copy");
// Remove the temporary input element
input.remove();
// Display a message below the label
$(".copy-message").text("Copied !").show();
// Hide the message after a few seconds (optional)
setTimeout(function() {
$(".copy-message").hide();
}, 4000); // 2000 milliseconds = 2 seconds
});
// end
// checkbox regtype set as same value in display name
$("#reg_type_checkbox").on('change', function() {
if ($(this).is(':checked')) {
var reg_type = $("#reg_type").val();
$("#display_name").val(reg_type);
} else {
}
});
// end
// Load selectize plugin
$('#show_member_types').selectize({
plugins: ['remove_button'],
delimiter: ',',
persist: false,
create: false,
items:show_member_types // for set selected multiple values
});
// end
// selectize for user type id
var select = $('#user_type_id').selectize({
maxItems: 1
});
var selectize = select[0].selectize;
// end
// selectize for member types
var select_m_type = $('#show_member_types').selectize({
maxItems: 10
});
var selectize_m_type = select_m_type[0].selectize;
// end
$(document).on("click", "#save_btn", function (e) {
validate_addon_form();
if (!$("#addon_form").valid()) {
return false;
}
});
var table_data = $("#html_data").val();
$("#Addon_Content").html(table_data);
$("#update_btn").hide();
});
$(document).on("click", ".edit_btn", function (e) {
e.preventDefault();
if(confirm("Are you sure you want to edit this?"))
{
$("#collapseOne").show("slow");
var addon_id = $(this).val();
$.ajax({
type: "GET",
url: BaseUrl + "/addon_edit",
data: { 'addon_id': addon_id },
success: function (reposnse) {
var data_1 = JSON.parse(reposnse);
var status = data_1.status;
var msg = data_1.msg;
var edit_data = data_1.edited_data;
if (data_1.status == 1) {
$("#addon_id").val(edit_data.addon_id);
$("#addon_type_id").val(edit_data.addon_type_id);
$("#addon_name").val(edit_data.addon_name);
$("#display_name").val(edit_data.display_name);
$("#amount").val(edit_data.amount);
$("#order_by").val(edit_data.order_by);
$("#conference_id").val(edit_data.conference_id);
$("#description").val(edit_data.description);
$("#head_count").val(edit_data.head_count);
$("#start_by").val(edit_data.start_by);
$("#end_by").val(edit_data.end_by);
$("#reg_type").val(edit_data.reg_type);
$("#addon_reg_type").val(edit_data.addon_reg_type);
var $select = $("#user_type_id").selectize();
var selectize = $select[0].selectize;
if (status == 1)
{
var user_type_id = edit_data.user_type_id;
selectize.setValue(user_type_id);
}
var $select_m = $("#show_member_types").selectize();
var selectize_m = $select_m[0].selectize;
var ids = edit_data.show_member_types;
if(ids === null)
{
selectize_m.clear();
}
else
{
var result = ids.split(",").map(x=>+x);
selectize_m.setValue(result);
}
var is_mandatory = edit_data.is_mandatory;
if (is_mandatory == "1") {
$("input:radio[id=is_mandatory_yes]").prop("checked", true);
$("#is_mandatory_yes").val('1');
} else {
$("input:radio[id=is_mandatory_no]").prop("checked", true);
$("#is_mandatory_no").val('0');
}
var is_visible = edit_data.is_visible;
if (is_visible == "1") {
$("input:radio[id=is_visible_yes]").prop("checked", true);
$("#is_visible_yes").val('1');
} else {
$("input:radio[id=is_visible_no]").prop("checked", true);
$("#is_visible_no").val('0');
}
var is_custom_addon = edit_data.is_custom_addon;
if (is_custom_addon== "1") {
$("input:radio[id=is_custom_addon_yes]").prop("checked", true);
$("#is_custom_addon_yes").val('1');
} else {
$("input:radio[id=is_custom_addon_no]").prop("checked", true);
$("#is_custom_addon_no").val('0');
}
$("#save_btn").hide();
$(".update_btn").show();
$("html, body").animate({ scrollTop: "0px" }, 300);
} else {
return false;
}
},
});
};
});
$(document).on("click", ".update_btn", function (e) {
e.preventDefault();
var addon_type_id = $("#addon_type_id").val();
var addon_id = $("#addon_id").val();
var addon_name = $("#addon_name").val();
var display_name = $("#display_name").val();
var amount = $("#amount").val();
var order_by = $("#order_by").val();
var user_type_id = $("#user_type_id").val();
var conference_id = $("#conference_id").val();
var description = $("#description").val();
var head_count = $("#head_count").val();
var start_by = $("#start_by").val();
var end_by = $("#end_by").val();
var reg_type = $("#reg_type").val();
var addon_reg_type = $("#addon_reg_type").val();
var show_member_types = $("#show_member_types").val();
var is_mandatory = $('input[name="is_mandatory"]:checked').val();
var is_custom_addon = $('input[name="is_custom_addon"]:checked').val();
var is_visible = $('input[name="is_visible"]:checked').val();
$.ajax({
type: "POST", // <-- get method of form
url: BaseUrl + "/update_addon_1", // <-- get action of form
data: {
'addon_id' : addon_id,
'addon_type_id' : addon_type_id,
'addon_name' : addon_name,
'display_name' : display_name,
'amount' : amount,
'order_by' : order_by,
'user_type_id' : user_type_id,
'conference_id' : conference_id,
'description' : description,
'head_count' : head_count,
'start_by' : start_by,
'end_by' : end_by,
'show_member_types' : show_member_types,
'is_mandatory' : is_mandatory,
'is_custom_addon' : is_custom_addon,
'is_visible' : is_visible,
'reg_type' : reg_type,
'addon_reg_type' : addon_reg_type
},
success: function (reposnse) {
var data_1 = JSON.parse(reposnse);
var status = data_1.status;
var msg = data_1.msg;
if (data_1.status== 1) {
$("#Addon_Content").html(data_1.html_data);
$("#save_btn").show();
$("#update_btn").hide();
alert("Updated Sucessfully..")
// $("#successMessage").show();
// $("#successMsg").html(data_1.msg);
$("#user_type_id")[0].selectize.clear();
$("#show_member_types")[0].selectize.clear();
$('.is_mandatory').removeAttr('checked');
$('.is_custom_addon').removeAttr('checked');
$('.is_visible').removeAttr('checked');
clear();
} else {
return false;
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {},
});
});
$(document).on("click",".delete_btn",function(e)
{
e.preventDefault();
if(confirm("Are you sure you want to delete this?"))
{
var addon_id = $(this).val();
var conference_id = $("#conference_id").val();
$.ajax({
type: 'GET', // <-- get method of form
url: BaseUrl+"/delete_addon",
data: { 'addon_id': addon_id,'conference_id':conference_id},
success: function(response){
var data_1 = JSON.parse(response);
var msg = data_1.msg;
var deleted_data = data_1.deleted_data;
if (data_1.status==1)
{
$("#addon_id").val(0);
$("#Addon_Content").empty();
$("#Addon_Content").html(data_1.deleted_data);
// $("#successMessage").show();
// $("#successMsg").html(data_1.msg);
alert("Deleted Sucessfully..")
clear();
$("#user_type_id")[0].selectize.clear();
$("#show_member_types")[0].selectize.clear();
$('.is_mandatory').removeAttr('checked');
$('.is_custom_addon').removeAttr('checked');
$('.is_visible').removeAttr('checked');
}
else
{
alert(msg);
return false;
}
},
});
}
else{
return false;
}
});
function clear(){
$("#addon_type_id").val('');
$("#addon_name").val('');
$("#display_name").val('');
$("#amount").val('');
$("#order_by").val('');
$("#user_type_id").val('');
$("#description").val('');
$("#head_count").val('');
$("#start_by").val('');
$("#end_by").val('');
$("#reg_type").val('');
$("#addon_reg_type").val('');
$("#show_member_types").val('');
$("#is_mandatory_no").prop("checked", true);
$("#is_custom_addon_no").prop("checked", true);
$("#is_visible_yes").prop("checked", true);
}
function validate_addon_form()
{
errorclass : 'error',
$("#addon_form").validate({
rules: {
addon_type_id: {
required: true,
},
reg_type: {
required: true,
},
},
messages: {
addon_type_id: {
required: "Please Select Addon Type ",
},
reg_type: {
required: "Please Enter Reg Type ",
},
},
highlight: function(element) {
$(element).parent().addClass('error')
},
unhighlight: function(element) {
$(element).parent().removeClass('error')
},
submitHandler: function(form) {
form.submit();
}
})
};
function copy() {
let copyText = document.getElementById("copyClipboard");
let copySuccess = document.getElementById("copied-success");
copyText.select();
copyText.setSelectionRange(0, 99999);
navigator.clipboard.writeText(copyText.value);
copySuccess.style.opacity = "1";
setTimeout(function(){ copySuccess.style.opacity = "0" }, 500);
}
</script>
{% endblock %}
Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists