Sindbad~EG File Manager

{% extends "conferenceapp/layout.html" %} {% block head %}
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.css" />

{% endblock %} {% block content %}
<div class="row mt-3 mr-3">
    <div class="col-lg-12 col-md-12 col-sm-12 text-right">
        <a class="btn btn-danger float-right mb-1" type="button" id="back" href="{{ url_for('confapp.Back',conf_id=conf_id,conf_key=conf_key) }}">Back</a>
    </div>
</div>
<div class="row">
    <!-- Left div start -->
    <div class="col-lg-6 col-md-12 col-sm-12">
        <input type="hidden" name="society_id" id="society_id" class="form-control col-lg-3" value="{{society_id}}" />
        <input type="hidden" name="conf_id" id="conf_id" class="form-control col-lg-3" value="{{conf_id}}" />
        <input type="hidden" name="conf_key" id="conf_key" class="form-control col-lg-3" value="{{conf_key}}" />
        <h4 class="text-center">Add BO Admin Access for {{conf_name.conf_name}}</h4>
        <div class="card">
            <div class="card-body">
                <div class="row">
                    <div class="col-lg-3 col-md-12 col-sm-12 text-right">
                        <label>Search User : </label>
                    </div>
                    <div class="col-lg-9 col-md-12 col-sm-12">
                        <input type="text" name="search_data" id="search_data" class="form-control" placeholder="Search name,email or mobile.." />
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12 mt-3 text-center">
                        <button type="button" class="btn btn-primary" id="search_user" name="search_user" title="Search in User">Search</button>
                        <button type="button" class="btn btn-danger" id="clear_user_data" name="clear_user_data" title="Clear">Clear</button>
                    </div>
                </div>
                <br />
                <div id="search_data_div"></div>
                <div id="get_admin_data">
                    <div class="row mb-3">
                        <div class="col-lg-1"></div>
                        <div class="col-lg-10">
                            <div style="background-color: #dee2e6; padding: 20px;">
                                <h4 class="text-center">Add BO Admin Access for {{conf_name.conf_name}}</h4>
                                <div class="row">
                                    <div class="col-lg-4">
                                        <label>Full Name :</label>
                                    </div>
                                    <div class="col-lg-8">
                                        <input type="text" class="form-control" id="s_full_name" disabled />
                                    </div>
                                </div>
                                <br />
                                <div class="row">
                                    <div class="col-lg-4">
                                        <label>Email :</label>
                                    </div>
                                    <div class="col-lg-8">
                                        <input type="text" class="form-control" id="s_email" disabled />
                                    </div>
                                </div>
                                <br />
                                <div class="row">
                                    <div class="col-lg-4">
                                        <label>Mobile :</label>
                                    </div>
                                    <div class="col-lg-8">
                                        <input type="text" class="form-control" id="s_mobile" disabled />
                                    </div>
                                </div>
                                <br />
                                <div class="row">
                                    <div class="col-lg-4">
                                        <label>Password :</label>
                                    </div>
                                    <div class="col-lg-8">
                                        <input type="text" class="form-control" id="s_password" name="s_password" />
                                    </div>
                                </div>
                                <br />
                                <div class="row text-center">
                                    <div class="col-lg-12">
                                        <input type="text" class="form-control" id="s_user_id" name="s_user_id" hidden />
                                        <button type="button" class="btn btn-md btn-success save_access_btn" name="save_access_btn" id="save_access_btn" title="Save Access" value="Save Access">Save Access</button>
                                        <button type="button" class="btn btn-md btn-danger clear_access_btn" name="clear_access_btn" id="clear_access_btn" title="Clear" value="Clear">Clear</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-1"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Left div end -->

    <!-- Right div start -->
    <div class="col-lg-6 col-md-12 col-sm-12">
        <div class="card" style="background-color: #dedddd;">
            <div class="card-body">
                



                <div class="table table-lg mobile-responsive" style="background-color: transparent; overflow-x: scroll;font-size: 12px;">
                    <h4 class="text-center">BO Admin Access for {{conf_name.conf_name}}</h4><br>
                    <div class="row">
                        <div class="col-lg-6">
                            <span style="font-weight: bold;font-size: 15px;" >Total Access Count : {{total_count.total_count}} </span>
                        </div>
                        <div class="col-lg-5">
                            <i class="fa fa-square" style="font-size:15 px;color:#a2d9ec; "> </i> 
                            <span class="text-black p-1"  style="font-weight: bold;font-size: 15px;">Non-Numerotec : {{other_email_total_count.total_count}}</span>
                        </div>
                        <div class="col-lg-1">
                            <span name="reload_btn" id="reload_btn" title="Reload" onclick="reload_btn();"><i class="fa-solid fa-rotate fa-2x" style="color:blue;"></i></span>

                        </div>
                    </div>
                    <hr>
                    <input type="hidden" id="s_user_id" name="s_user_id" />
                    <table class="table table-striped table-bordered bg-light" id="myTable" style="width: 100%;">
                        <thead style="background-color: #072645; border-color: #dee2e6; color: #fff;">
                            <tr>
                                <td>S No</td>
                                <td>Name</td>
                                <td>Email</td>
                                <td>Mobile</td>
                                <td>Password</td>
                                <td>Action</td>
                            </tr>
                        </thead>
                        <tbody>
                            {% if get_data : %} 
                            {% for row in get_data %}
                             {% if row.admin_role_id | int == 1 %}
                            <tr style="background-color: #a2d9ec;">
                                {% else %}
                            

                            <tr>
                                {% endif %}
                                <td data-label="S No">{{loop.index}}</td>

                                <td data-label="Name">
                                    {% if row.full_name %} {{row.full_name}} {% else %}
                                    <label> </label>
                                    {% endif %}
                                </td>
                                <td data-label="Email">
                                    {% if row.email %} {{row.email }} {% else %}
                                    <label> </label>
                                    {% endif %}
                                </td>
                                <td data-label="Mobile">
                                    {% if row.mobile %} {{row.mobile }} {% else %}
                                    <label> </label>
                                    {% endif %}
                                </td>
                                <td data-label="Password">
                                    {% if row.password %} {{row.password }} {% else %}
                                    <label> </label>
                                    {% endif %}
                                </td>
                                <td data-label="Action">
                                    <a class="copy_text" data-toggle="tooltip" title="Copy to Clipboard" onclick="copy_text('{{row.conf_name}}','{{row.full_name}}','{{row.email}}','{{row.password}}','{{row.app_url}}');">
                                        <i class="fa-solid fa-clipboard"></i>
                                    </a>
                                </td>
                            </tr>
                            {% endfor %} {% else %}
                            <tr>
                                <td colspan="6" style="color: red; text-align: center;">Record not available</td>
                            </tr>
                            {% endif %}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

{% endblock %} {% block bottomscript %}
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.js"></script>
<script type="text/javascript">
    var BaseUrl = document.location.origin;
    $(document).ready(function () {
        $("#search_data_div").hide();
        $("#get_admin_data").hide();

        $("#myTable").dataTable({
            iDisplayLength: 100,
        });
    });


    function reload_btn(){
        location.reload();
    }

    $(document).on("click", "#search_user", function (e) {
        e.preventDefault();
        $("#get_admin_data").hide();
        var society_id = $("#society_id").val();
        var search_data = $("#search_data").val();
        if (search_data) {
            ShowProgress();
            $.ajax({
                type: "GET", // <-- get method of form
                url: BaseUrl + "/" + society_id + "/get_user_data", // <-- get action of form
                data: { search_data: search_data },
                success: function (data) {
                    StopProgress();
                    var data_1 = JSON.parse(data);
                    var status = data_1.status;
                    var msg = data_1.msg;
                    var html_data = data_1.html_data;
                    if (status == 1) {
                        $("#search_data_div").empty();
                        $("#search_data_div").show();
                        $("#search_data_div").html(html_data);
                    } else {
                        $("#search_data_div").empty();
                        $("#search_data_div").show();
                        $("#search_data_div").html(html_data);
                    }
                },
            });
        } else {
            alert("Search field is Mandatory..!");
            return false;
        }
    });

    $(document).on("click", "#add_access", function (e) {
        e.preventDefault();
        $("#search_data_div").hide();
        $("#get_admin_data").show();
        $("#s_full_name").attr("disabled", true);
        $("#s_email").attr("disabled", true);
        $("#s_mobile").attr("disabled", true);

        var u_user_id = $("#u_user_id").val();

        $("#s_user_id").val(u_user_id);

        var u_full_name = $("#u_full_name").val();
        $("#s_full_name").val(u_full_name);

        var u_email = $("#u_email").val();
        $("#s_email").val(u_email);

        var u_mobile = $("#u_mobile").val();
        $("#s_mobile").val(u_mobile);

        var u_is_admin = $("#u_is_admin").val();
        $("#s_is_admin").val(u_is_admin);

        var u_password = $("#u_password").val();
        $("#s_password").val(u_password);
    });

    $(document).on("click", "#add_new_access", function (e) {
        e.preventDefault();
        $("#search_data_div").hide();
        $("#get_admin_data").show();
        clearall_admin_data_fiels();
        $("#s_full_name").attr("disabled", false);
        $("#s_email").attr("disabled", false);
        $("#s_mobile").attr("disabled", false);
        $("#s_password").attr("disabled", false);
    });

    function clearall_admin_data_fiels() {
        $("#s_full_name").val("");
        $("#s_email").val("");
        $("#s_mobile").val("");
        $("#s_password").val("");
    }

    $(document).on("click", "#save_access_btn", function (e) {
        e.preventDefault();

        var search_data = $("#search_data").val();
        var society_id = $("#society_id").val();
        var conf_id = $("#conf_id").val();
        var conf_key = $("#conf_key").val();
        var user_id = $("#s_user_id").val();
        var email = $("#s_email").val();
        var password = $("#s_password").val();
        var mobile = $("#s_mobile").val();
        var full_name = $("#s_full_name").val();

        var is_admin = 1;
        if (password) {
            ShowProgress();
            $.ajax({
                type: "POST", // <-- get method of form
                url: BaseUrl + "/" + conf_id + "/" + conf_key + "/save_user_access", // <-- get action of form
                data: { search_data: search_data, society_id: society_id, user_id: user_id, email: email, password: password, is_admin: is_admin, mobile: mobile, full_name: full_name },
                success: function (data) {
                    StopProgress();
                    var data_1 = JSON.parse(data);
                    var status = data_1.status;
                    var msg = data_1.msg;
                    var html_data = data_1.html_data;
                    if (status == 1) {
                        $("#search_data_div").empty();
                        $("#search_data_div").show();
                        $("#search_data_div").html(html_data);
                        $("#get_admin_data").hide();
                    } else {
                        $("#search_data_div").empty();
                        $("#search_data_div").show();
                        $("#search_data_div").html(html_data);
                    }
                },
            });
        } else {
            alert("Password is Mandatory..!");
            return false;
        }
    });

    function copy_text(conf_name, full_name, email, password, app_url) {
        var copyText = conf_name + " Delegate Registration Backoffice \nAdmin access credentials\n\nFull name : " + full_name + "\nEmail : " + email + "\nPassword : " + password + "\n\nBackoffice URL : " + app_url + "/bo";
        document.addEventListener(
            "copy",
            function (e) {
                e.clipboardData.setData("text/plain", "");
                e.clipboardData.setData("text/plain", copyText);
                e.preventDefault();
            },
            true
        );

        document.execCommand("copy");
        alert("Text Copied..! ");
    }

    function ShowProgress() {
        var text = "loading data.. please wait..";

        if (jQuery("body").find("#resultLoading").attr("id") != "resultLoading") {
            jQuery("body").append('<div id="resultLoading" style="display:none"><div><img src="' + document.location.origin + '/static/images/ajax-loader.gif"><div>' + text + '</div></div><div class="bg"></div></div>');
            // jQuery('body').append('<div id="resultLoading" style="display:none"><div><div>'+text+'</div></div><div class="bg"></div></div>');
        }

        jQuery("#resultLoading").css({
            width: "100%",
            height: "100%",
            position: "fixed",
            "z-index": "10000000",
            top: "0",
            left: "0",
            right: "0",
            bottom: "0",
            margin: "auto",
        });

        jQuery("#resultLoading .bg").css({
            background: "#000000",
            opacity: "0.7",
            width: "100%",
            height: "100%",
            position: "absolute",
            top: "0",
        });

        jQuery("#resultLoading>div:first").css({
            width: "250px",
            height: "75px",
            "text-align": "center",
            position: "fixed",
            top: "0",
            left: "0",
            right: "0",
            bottom: "0",
            margin: "auto",
            "font-size": "16px",
            "z-index": "10",
            color: "#ffffff",
        });

        jQuery("#resultLoading .bg").height("100%");
        jQuery("#resultLoading").fadeIn(300);
        jQuery("body").css("cursor", "wait");
    }

    function StopProgress() {
        jQuery("#resultLoading .bg").height("100%");
        jQuery("#resultLoading").fadeOut(300);
        jQuery("body").css("cursor", "default");
    }
</script>
{% endblock %}