EVOLUTION-NINJA

Edit File: lead_old.php

<?php echo view('includes/home_sidebar');?>
	
        <script type="text/javascript" src="<?php echo base_url('public/assets/js/jquery-3.6.0.min.js'); ?>"></script>
       
    <main id="rightDiv">
    <div class="container-fluid">
   
    <div >
   
        <div class="row fee-structure" id="mobile-div">
            <div class="col-sm-3">
                <h3  style="color: rgba(0, 72, 76, 1);">Lead Management</h3>
            </div>
           <div class="col-sm-2"></div>
                <div class="col-sm-5"></div>
                <div class="col-sm-2">
                        <button class="btn back-butt" onclick="goBack()"><i class="fa fa-arrow-left"
                                aria-hidden="true"></i>&nbsp;Back</button>
                    </div>
           </div>

<div class="row mt-3">
        <div class="col-sm-2 u_e">
            <button id="addLeadBtn" type="button" class="btn" data-toggle="modal" data-target="#myModal" style="background-color:rgba(0, 72, 76, 1);color:#fff; padding: 8px 15px;border-radius: 8px;">
                Add lead
            </button>
                </div>
                <div class="col-sm-6"></div>       
                <div class="col-sm-2 u_e">
            <button id=" " type="button" onclick="leadrp()" class="btn" style="float:right; background-color:rgba(0, 72, 76, 1);color:#fff; padding: 8px 15px;border-radius: 8px;">
                Lead Report
            </button>
                </div>
        <div class="col-sm-2 u_e">
            <button id=" " type="button" onclick="followrp()" class="btn" style="background-color:rgba(0, 72, 76, 1);color:#fff; padding: 8px 15px;border-radius: 8px;">
                Follow Up Report
            </button>
                </div>
        </div>

</table>
			            <div style="display:none;">

</div>
                    </div>
                <div id="pager3"></div>
            </div>
        </div>
        
    </div>

<div class="modal fade" id="leadDetailsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Lead Details</h5>
                
                    
                </button>
            </div>
            <div class="modal-body">
                <div class='row new-function'>
                    <div class='col-sm-4'>
                <p><strong>ID:</strong> <span class="lead-id"></span></p>
                <p><strong>First Name:</strong> <span class="lead-first-name" name='first_name' required></span></p>
                
                <p><strong>Email:</strong> <span class="lead-email" required></span></p>
                <p><strong>Date of Birth:</strong> <span class="lead-dob"></span></p>
                <p><strong>Date:</strong> <span class="lead-date" required></span></p>
                <p><strong>Mobile Number:</strong> <span class="lead-mobile-no" required></span></p>
                <p><strong>Address:</strong> <span class="lead-address" required></span></p>
                <p><strong>City:</strong> <span class="lead-city" name="city" required></span></p>
                </div>
                <div class='col-sm-4'>
                <p><strong>Course Offered:</strong> <span class="lead-course-offered" required></span></p>
                <p><strong>Qualification:</strong> <span class="lead-qualification" required></span></p>
                <p><strong>Country:</strong> <span class="lead-country" required></span></p>
                <p><strong>Counselor Name:</strong> <span class="lead-counselor-name" required></span></p>
                <p><strong>Gender:</strong> <span class="lead-gender" required></span></p>
                <p><strong>Source:</strong> <span class="lead-source" required></span></p>
                <p><strong>Profession:</strong> <span class="lead-profession"></span></p>
                <p><strong>Status:</strong> <span class="lead-status"></span></p>
                <p><strong>Company Name:</strong> <span class="lead-company-name"></span></p>
                <p><strong>Remarks:</strong> <span class="lead-remarks"></span></p>
                </div>
                <div class='col-sm-4'>
                <p><strong>Profile Image:</strong></p>
                 <img src=" " class="lead-profile-img img-fluid" alt="Profile Image">
                </div>
            </div>
            <div class="row mt-3">
        <div class="col-sm-6">
            <div class="form-group">
                <label for="feeAmount">Fee Amount:</label>
                <input type="number" class="form-control" id="feeAmount" required>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="form-group">
                <label for="discountPercentage">Discount Percentage:</label>
                <input type="number" class="form-control" id="discountPercentage" required>
            </div>
        </div>
            <div class="form-group">
                <label for="discountedAmount">Discounted Amount:</label>
                <input type="number" class="form-control" id="discountedAmount" readonly>
            </div>
            <div class="form-group">
                <label for="convertedby">Converted By:</label>
                <input type="text" class="form-control" id="convertedby" >
            </div>
            <button type="button" class="btn btn-primary" id="submitData" style="width:200px;margin-bottom:50px;margin-left:300px;margin-top:20px">Submit</button>
            <button type="button" class="btn btn-secondary cls-btn" data-dismiss="modal" id="closeModalBtn">Close</button>
          </div>
        </div>
</div>
</div>
</div>
</section>
</main>
    
    <script type="text/ecmascript" src="<?php echo base_url('public/jqgrid/js/jquery.jqGrid.min.js'); ?>"></script>
    
    
    <script type="text/ecmascript" src="<?php echo base_url('public/jqgrid/js/i18n/grid.locale-en.js'); ?>"></script>

$(document).ready(function(){

jQuery("#list3").jqGrid({

url:"<?php echo site_url('fetch_leads');?>",
                datatype: "json",

colNames: ['ID', 'Full Name', 'Email',  'Date', 'Phone',  'Qualification', 'Counselor Name', 'Source',  'Follow up', 'Action','Convert'],
                colModel: [
                    { name: 'id', index: 'id', hidden: true },
                    {
                        name: 'full_name', 
                        index: 'full_name',
                        width: 150,
                        formatter: function (cellvalue, options, rowObject) {
                            var firstName = rowObject.first_name; // Assuming first_name is available in rowObject
                            var lastName = rowObject.last_name; // Assuming last_name is available in rowObject
                            var fullName = firstName + " " + lastName;
                            return fullName;
                        }
                    },
                    { name: 'email', index: 'email', width: 150 },
                    // { name: 'dob', index: 'DOB', width: 100 },
                    { name: 'date', index: 'Date', width: 100 }, 
                    { name: 'phone', index: 'mobile_no', width: 100 },
                    // { name: 'address', index: 'address', width: 100 },
                    // { name: 'city', index: 'city', width: 100 },
                    // { name: 'course_offered', index: 'course_offered', width: 100 },
                    { name: 'qualification', index: 'qualification', width: 100 },
                    // { name: 'country', index: 'country', width: 100 },
                    { name: 'counselor_name', index: 'counselor_name', width: 100 },
                    // { name: 'gender', index: 'gender', width: 100 },
                    { name: 'source', index: 'source', width: 100 },
                    // { name: 'profession', index: 'profession', width: 100 },
                    // { name: 'status', index: 'status', width: 100 },
                    // { name: 'company_name', index: 'company_name', width: 100 },
                    // { name: 'remarks', index: 'remarks', width: 100 },
                    {
                        name: 'follow_up',
                        index: 'follow_up',
                        width: 100,
                        formatter: function (cellvalue, options, rowObject) {
                            var followUpButton = '<button class="btn btn-success" title="Follow Up" onclick="fun_followup($(this))">Follow Up</button>';
                            return followUpButton;
                        }},

{
                        name: 'actions',
                        index: '',
                        search: false,
                        width: 100,
                        formatter: function (cellvalue, options, rowObject) {
                            var editButton = '<a data-toggle="tooltip" title="Edit" href="javascript:void(0);"><span class="fa fa-pencil" onclick="fun_edit($(this))" style="color:blue;"></span></a>';
                            var deleteButton = '<a data-toggle="tooltip" title="Delete" href="javascript:void(0);"><span class="fa fa-trash" onclick="deleteRow($(this))" style="color:red;"></span></a>';
                            return editButton + ' | ' + deleteButton;
                        }
                    },

{
            name: 'convert',
            index: '',
            search: false,
            width: 100,
            formatter: function (cellvalue, options, rowObject) {
                var converted = rowObject['converted'];

if (converted === '1') { 
                    return '<button class="btn btn-success" title="Already Converted" disabled>Converted</button>';
                    // return '<button class="btn btn-success" title="Already Converted"  onclick="alert(\'This lead is already converted.\')">Converted</button>';

} else {
                    return '<button class="btn btn-info" title="Convert" onclick="convertLead($(this))">Convert</button>';
                }
            }
        }

],
                rowNum:5,
                rowList:[5,10,15,20,50,100,300],
                rownumbers: true,
                pager: '#pager3', 
                sortname:'id', 
                autowidth: true,
                height: 'auto',
                width: '100%',
                viewrecords: true, 
                loadonce:true,
                gridview: true,
                sortorder:"desc", 
                shrinkToFit: true,
                caption:"Lead's List",

});

$("#list3").jqGrid("setLabel", "rn", "SL");
            $("#list3").jqGrid('filterToolbar',{stringResult: true,searchOperators : true});

$("#list3").jqGrid('navGrid','#pager3',
                {edit:false,add:false,del:false,search:true,refresh:true},
                { },
                { },
                { }, 
                {
                sopt:['eq', 'ne', 'lt', 'gt', 'cn', 'bw', 'ew'],
                closeOnEscape: true, 
                multipleSearch: true, 
                closeAfterSearch: true }
            );
        });

function fun_edit(rowId){
    var id = rowId.closest('tr').attr('id');
    window.location.href = "<?php echo base_url('Edit_Form') ?>?leadId=" + id;
}

function fun_followup(rowId) {
    var id = rowId.closest('tr').attr('id');
    window.location.href = "<?php echo base_url('followUp_form') ?>?id=" + id;
}

function deleteRow(deleteButton) {
    var rowId = deleteButton.closest('tr').attr('id');

Swal.fire({
        title: 'Are you sure?',
        text: "You won't be able to revert this!",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Yes, delete it!'
    }).then((result) => {
        if (result.isConfirmed) {
            
            $.ajax({
                url: "<?php echo site_url('delete_lead');?>/" + rowId,
                type: "DELETE", 
                dataType: 'json', 
                success: function(response) {
                    
                    if (response.success) {
                        
                        $('#list3').jqGrid('delRowData', rowId);
                      
                        Swal.fire(
                            'Deleted!',
                            response.message,
                            'success'
                        );
                    } else {
                        
                        Swal.fire(
                            'Error!',
                            response.message,
                            'error'
                        );
                    }
                },
                error: function(xhr, status, error) {
                 
                    Swal.fire(
                        'Error!',
                        'Failed to delete. Please try again later.',
                        'error'
                    );
                }
            });
        }
    });
}

</script>

if (!isNaN(feeAmount) && !isNaN(discountPercentage)) {
                var discountAmount = (feeAmount * discountPercentage) / 100;
                var discountedAmount = feeAmount - discountAmount;
                $('#discountedAmount').val(discountedAmount.toFixed(2));
            } else {
                $('#discountedAmount').val('');
            }
        });
    });
// </script>
<script>
function convertLead(button) {
    var row = button.closest('tr');

var leadDetails = {
        leadId: row.find('td:eq(1)').text(),
        firstName: row.find('td:eq(2)').text(),
        // lastName: row.find('td:eq(3)').text(),
        email: row.find('td:eq(3)').text(),
        DOB: row.find('td:eq(4)').text(),
        date: row.find('td:eq(14)').text(),
        mobileNo: row.find('td:eq(5)').text(),
        address: row.find('td:eq(12)').text(),
        city: row.find('td:eq(15)').text(),
        courseOffered: row.find('td:eq(16)').text(),
        qualification: row.find('td:eq(6)').text(),
        country: row.find('td:eq(10)').text(),
        counselorName: row.find('td:eq(7)').text(),
        gender: row.find('td:eq(12)').text(),
        source: row.find('td:eq(8)').text(),
        profession: row.find('td:eq(16)').text(),
        status: row.find('td:eq(17)').text(),
        companyName: row.find('td:eq(18)').text(),
        remarks: row.find('td:eq(19)').text(),
        profileImgPath: row.find('.profile-image').attr('src')
    };

populateModal(leadDetails);
}

function populateModal(leadDetails) {
    var modal = $('#leadDetailsModal');

modal.find('.lead-id').text(leadDetails.leadId);
    modal.find('.lead-first-name').text(leadDetails.firstName);
    modal.find('.lead-last-name').text(leadDetails.lastName);
    modal.find('.lead-email').text(leadDetails.email);
    modal.find('.lead-dob').text(leadDetails.DOB);
    modal.find('.lead-date').text(leadDetails.date);
    modal.find('.lead-mobile-no').text(leadDetails.mobileNo);
    modal.find('.lead-address').text(leadDetails.address);
    modal.find('.lead-city').text(leadDetails.city);
    modal.find('.lead-course-offered').text(leadDetails.courseOffered);
    modal.find('.lead-qualification').text(leadDetails.qualification);
    modal.find('.lead-country').text(leadDetails.country);
    modal.find('.lead-counselor-name').text(leadDetails.counselorName);
    modal.find('.lead-gender').text(leadDetails.gender);
    modal.find('.lead-source').text(leadDetails.source);
    modal.find('.lead-profession').text(leadDetails.profession);
    modal.find('.lead-status').text(leadDetails.status);
    modal.find('.lead-company-name').text(leadDetails.companyName);
    modal.find('.lead-remarks').text(leadDetails.remarks);
    // modal.find('.lead-profile-img').attr('src', leadDetails.profileImage);

// modal.find('.lead-profile-img').attr('src', '<?php //echo base_url('public/assests/profile_img/') ?>' + leadDetails.profileImage);
modal.find('.lead-profile-img').attr('src', '<?php echo base_url('public/assets/lead_profileImg/') ?>' + leadDetails.profileImgPath);

modal.modal('show');

$('#closeModalBtn').on('click', function() {
        $('#leadDetailsModal').modal('hide');
    });
   
}

$(document).ready(function() {
    $('#submitData').on('click', function() {
        if ($('#feeAmount').val() === '' || $('#discountPercentage').val() === '' || $('#convertedby').val() === '') {
                
                alert('Please fill in all required fields.');
                return; 
            }
        var formData = {
            leadId: $('#leadDetailsModal').find('.lead-id').text(),
            first_name: $('#leadDetailsModal').find('.lead-first-name').text(),
            last_name: $('#leadDetailsModal').find('.lead-last-name').text(),
            email: $('#leadDetailsModal').find('.lead-email').text(),
            DOB: $('#leadDetailsModal').find('.lead-dob').text(),
            date: $('#leadDetailsModal').find('.lead-date').text(),
            mobile_no: $('#leadDetailsModal').find('.lead-mobile-no').text(),
            address: $('#leadDetailsModal').find('.lead-address').text(),
            city: $('#leadDetailsModal').find('.lead-city').text(),
            course_offered: $('#leadDetailsModal').find('.lead-course-offered').text(),
            qualification: $('#leadDetailsModal').find('.lead-qualification').text(),
            country: $('#leadDetailsModal').find('.lead-country').text(),
            counselor_name: $('#leadDetailsModal').find('.lead-counselor-name').text(),
            gender: $('#leadDetailsModal').find('.lead-gender').text(),
            source: $('#leadDetailsModal').find('.lead-source').text(),
            profession: $('#leadDetailsModal').find('.lead-profession').text(),
            status: $('#leadDetailsModal').find('.lead-status').text(),
            company_name: $('#leadDetailsModal').find('.lead-company-name').text(),
            remarks: $('#leadDetailsModal').find('.lead-remarks').text(),
            paid_fees: $('#feeAmount').val(),
            discountPercentage: $('#discountPercentage').val(),
            total_fees: $('#discountedAmount').val(),
            converted_by: $('#convertedby').val(),
           
        };

$.ajax({
            type: 'POST',
            url: '<?php echo base_url('convert_students')?>',
            data: formData,
            success: function(response) {
                console.log('Data submitted successfully:', response);
                Swal.fire({
                icon: 'success',
                title: 'Success!',
                text: 'Form submitted successfully.'
            });
            },
            error: function(xhr, status, error) {
                console.error('Error:', error);
            }
        });
        location.reload();
    });
});

</script>
  
<script>
    function goBack() {
        window.location.href = 'dashboard';
    }
</script>
<script>
    function leadrp() {
        window.location.href = 'leads-report-view';
    }
</script>
<script>
    function followrp() {
        window.location.href = 'followup-report';
    }
</script>

#leadDetailsModal .modal-body {
    padding: 10px 25px 10px 16px;
}

#leadDetailsModal .modal-footer {
    border-top: none; 
}

#leadDetailsModal input[type="number"],
#leadDetailsModal input[type="text"] {
    width: 100%; 
}

#leadDetailsModal button[type="button"] {
    width: 20%; 
    margin-top: 10px; 
}
.new-function{
        background-color: #219F94;
    color: white;
    padding: 12px 10px;
    border-radius: 6px;
    font-size: 16px;
    margin-left: 0px;
    }
/* ---------------- */
.cls-btn{
    padding: 0% !important;
    width: 25% !important;
    height: 40px;
    margin-top: 18px !important;
    margin-left: 10px;
}

#leadDetailsModal .modal-header { 
   
   background-color: #219F94;
       color: white;
       border-radius: 6px;
    }

#leadDetailsModal .modal-dialog {
    max-width: 800px;
}

#leadDetailsModal .modal-content {
    /* height: 500px; 
    overflow-y: auto;  */
    height: 805px; 
    width: 100%;
}
.ui-jqgrid {
    z-index: 1;
}
    </style>
     <?php echo view('includes/footer'); ?>