EVOLUTION-NINJA

Edit File: followUp_form.php

<?php echo view('includes/home_sidebar'); ?>
<!-- 
<!DOCTYPE html>
<html lang="en">
<head> 
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Follow Up Form</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
  <script type="text/javascript" src="<?php echo base_url('public/assets/js/jquery-3.6.0.min.js'); ?>"></script>
  <link rel="stylesheet" type="text/css" href="<?php echo base_url('public/assets/css/font-awesome.min.css'); ?>">
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
   <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>

<div class="container-fluid mt-5">
        <div class="row fee-structure">
            <div class="col-sm-2">
                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#leadFollowUpModal"
                    style="background-color:rgba(0, 72, 76, 1);">
                    Add Follow Up
                </button>
            </div>
            <div class="col-sm-7"></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>

<div class="modal fade" id="leadFollowUpModal" tabindex="-1" role="dialog" aria-labelledby="leadFollowUpModalLabel"
        aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="leadFollowUpModalLabel">Follow Up Form</h5>
                    
                        
                    </button>
                </div>
                <div class="modal-body">
                    <form id="leadFollowUpForm">
                        <input type="hidden" id="leads_id" name="leads_id"
                            value="<?php echo isset($_GET['id']) ? $_GET['id'] : ''; ?>">

<div class="row">
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label for="">Today's Date <span class="star-mad">*</span></label>
                                    <input type="date" class="form-control" id="date" name="date">
                                </div>
                            </div>
                            <div class="col-sm-6">
                                
                                <div class="form-group mt-2">
                            <label for="">Today's Time</label>
                            <input type="text" class="timepicker form-control" id="time" name="time">
                        </div>
                            </div>

</div><br>

<div class="form-group">
                            <label for="">Next Follow Up Date <span class="star-mad">*</span></label>
                            <input type="date" class="form-control" id="nextdate" name="nextdate">
                        </div><br>

<div class="form-group">
                            <label for="followUpRemarks">Follow Up Remarks</label>
                            <textarea class="form-control" id="followUpRemarks" name="follow_up_remarks"></textarea>
                        </div><br>
                        <div class="form-group">
                            <label for="followedBy">Followed Up By</label>
                            <input type="text" class="form-control" id="followedBy" name="follow_by">
                        </div><br>

<button type="button" class="btn btn-secondary" data-dismiss="modal"
                        id="closeModalBtn1">Close</button>

<button type="submit" class="btn btn-primary">Submit</button>
                    </form>
                </div>
            </div>
        </div>
    </div>

<div class="modal fade" id="FollowUpModal" tabindex="-1" role="dialog" aria-labelledby="FollowUpModalLabel"
        aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="FollowUpModalLabel">Edit Follow-Up Details</h5>
                    
                </div>
                <div class="modal-body">
                    <form id="updateFollowUpForm">

<div class="row">
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label for="ttdate">Today's Date <span class="star-mad">*</span></label>
                                    <input type="date" class="form-control" id="ttdate" name="tdate">
                                </div>
                            </div>
                            <div class="col-sm-6">
                                
                                <div class="form-group mt-2">
                                <label for="timeam">Today's Time</label>
                                <input type="text" class="timepicker form-control" id="timeam" name="timepm">
                            </div>
                            </div>

</div><br>

<div class="form-group">
                            <label for="fnextdate">Next Follow-Up Date <span class="star-mad">*</span></label>
                            <input type="date" class="form-control" id="fnextdate" name="ffnextdate">
                        </div><br>

<input type="hidden" id="updateFollowUpId" name="updateFollowUpId" value="">
                        <input type="hidden" id="leads" name="leads" value="">
                        <div class="form-group">
                            <label for="followRemarks">Follow-Up Remarks</label>
                            <textarea class="form-control" id="followRemarks" name="follow_up_remarks"></textarea>
                        </div><br>
 
                        <div class="form-group">
                            <label for="followBy">Followed By</label>
                            <input type="text" class="form-control" id="followBy" name="follow_by">
                        </div><br>

</form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal"
                        id="closeModalBtn">Close</button>
                    <button type="button" class="btn btn-primary" id="updateBtn">Update</button>
                </div>
            </div>
        </div>
    </div>
    
    
    <div class="container ">
        <div class="row" id="mobile-div">
            <div class="col-sm-3 mt-4 ">
                <h3 style="color: rgba(0, 72, 76, 1);">Follow-Up</h3>
            </div>
        </div>

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

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

</script>
    
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

//         $.ajax({
        //             url: "<?php echo base_url('update_followup');?>",
        //             type: "POST",
        //             data: formData,
        //             processData: false,
        //             contentType: false,
        //             success: function(response) {
        //                 if (response.status === 'success') {
        //                     console.log("Follow-up updated successfully!");
        //                     $('#FollowUpModal').modal('hide');
        //                     toastr.success(response.message);
        //                 } else {
        //                     toastr.error(response.message);
        //                 }
        //             },
        //             error: function(xhr, status, error) {
        //                 console.error("Error updating follow-up:", error);
        //                 toastr.error('Error updating follow-up: ' + error);
        //             },
        //             complete: function() {
        //                 if(action === 'close') {
        //                     $('#FollowUpModal').modal('hide');
        //                 }
        //             }
        //         });
        //     }

//     $('#updateBtn').on('click', function() {
        //         updateFollow('update');
        //     });

// $('#closeModalBtn').click(function() {
        //     updateFollow('close');
        // });
        // });

// ====================update =====================================
        $(document).ready(function () {
    $('#updateBtn').click(function () {
        var formData = $('#updateFollowUpForm').serialize();
        $.ajax({
            type: 'POST',
            url: "<?php echo base_url('updateFollowup'); ?>",
            data: formData,
            success: function (response) {
                console.log('Success:', response);
                
                Swal.fire({
                    icon: 'success',
                    title: 'Success',
                    text: 'Follow-up updated successfully!',
                }).then((result) => {
                    if (result.isConfirmed) {
                        window.location.reload(); 
                    }
                });
            },
            error: function (xhr, status, error) {
                console.error('Error:', error);
                Swal.fire({
                    icon: 'error',
                    title: 'Error',
                    text: 'Failed to update follow-up!',
                });
            }
        });
    });

$('#closeModalBtn').click(function () {
  
    $('#FollowUpModal').modal('hide');
});

});

</script>

<script>
       $(document).ready(function () {
        $('#leadFollowUpForm').on('submit', function (e) {
            e.preventDefault();

var formData = $(this).serialize();
            var leadId = $('#leads_id').val();
            var timeValue = $('#time').val();

formData += '&time=' + timeValue;

formData += '&leads_id=' + leadId;

$.ajax({
                url: "<?php echo base_url('followup_submit'); ?>",
                method: 'POST',
                data: formData,
                dataType: 'json',
                success: function (response) {
                    if (response.status === 'success') {
                        toastr.success(response.message);
                        $('#leadFollowUpModal').find('.close').click();
                        $('#leadFollowUpForm')[0].reset();
                        location.reload();
                    } else {
                        toastr.error(response.message);
                    }
                },
                error: function (xhr, status, error) {
                    toastr.error('Error: ' + error);
                }
            });
        });
    });
    </script>
    
    
    <script>
        function goBack() {
            window.location.href = "<?php echo base_url('leads');?>";
        }
    </script>
    <script>
        $(document).ready(function () {
            $("#addLeadBtn").click(function () {
                window.location.href = "<?php echo base_url('Form');?>"
            });
        });
    </script>

<script>
        $(document).ready(function() {
    var id = '<?php echo $id; ?>';
    $("#list3").jqGrid({
        url: "<?php echo site_url('get_followup'); ?>",
        mtype: "GET",
        postData: { id: id },
        datatype: "json",
        colNames: ['Sl', 'ID', 'Today\'s Date', 'Today\'s Time', 'Follow-Up Date', 'Follow Up Remarks', 'Followed Up By', 'Action'],
        colModel: [
            { name: 'sl', index: 'sl', width: 50, align: 'center', sortable: false },
            { name: 'id', index: 'id', hidden: true, width: 50, align: 'center' },
            { name: 'today_date', index: 'today_date', width: 100, align: 'center' },
            { name: 'today_time', index: 'today_time', width: 100, align: 'center' },
            { name: 'next_date', index: 'next_date', width: 100, align: 'center' },
            { name: 'follow_up_remarks', index: 'follow_up_remarks', width: 150, align: 'left' },
            { name: 'follow_by', index: 'follow_by', width: 100, align: 'left' },
            {
                name: 'actions',
                width: 100,
                align: 'center',
                sortable: false,
                formatter: function (cellvalue, options, rowObject) {
                    var editButton = '<a href="javascript:void(0);" onclick="fun_edit($(this))"><span class="fa fa-pencil" style="color:blue;"></span></a>';
                    var deleteButton = '<a href="javascript:void(0);" onclick="deleteRow($(this))"><span class="fa fa-trash" style="color:red;"></span></a>';
                    return editButton + ' | ' + deleteButton;
                }
            }
        ],
        pager: '#pager3',
        rowNum: 20,
        rowList: [20, 30, 50],
        sortname: 'follow_up_remarks',
        viewrecords: true,
        gridview: true,
        autoencode: true,
        caption: "Follow-Up List",
        height: 'auto',
        autowidth: true,
        loadonce: true,
        shrinkToFit: true,
        loadComplete: function() {
            var grid = $("#list3");
            var ids = grid.getDataIDs();
            for (var i = 0; i < ids.length; i++) {
                var rowId = ids[i];
                grid.setCell(rowId, 'sl', i + 1);
            }
        }
    });

$("#list3").jqGrid('navGrid', '#pager3',
        { edit: false, add: false, del: false, search: false, refresh: true },
        {}, {}, {}, 
        {}
    );
});

// function fun_edit(rowId) {
        //     var id = rowId.closest('tr').attr('id');
        //     var remarks = rowId.closest('tr').attr('follow_up_remarks');
        //     var by = rowId.closest('tr').attr('follow_by');

//     // Set the values of form fields with the retrieved data
        //     $('#idInput').val(id);
        //     $('#remarksInput').val(remarks);
        //     $('#byInput').val(by);
        // }

// ============================delete followup=======================================

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

//     console.log('Deleting row with ID:', id); // Log the 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 base_url('delete_followup'); ?>",
        //                 method: 'POST',
        //                 data: { id: id },
        //                 dataType: 'json',
        //                 success: function(response) {
        //                     if (response.success) {
        //                         row.remove();
        //                         Swal.fire({
        //                             icon: 'success',
        //                             title: 'Success',
        //                             text: 'Data deleted successfully!',
        //                             showConfirmButton: false,
        //                             timer: 1500
        //                         });
        //                     } else {
        //                         Swal.fire({
        //                             icon: 'error',
        //                             title: 'Error',
        //                             text: 'Failed to delete data.',
        //                             showConfirmButton: false,
        //                             timer: 1500
        //                         });
        //                     }
        //                 },
        //                 error: function() {
        //                     Swal.fire({
        //                         icon: 'error',
        //                         title: 'Error',
        //                         text: 'Failed to delete data. Please try again later.',
        //                         showConfirmButton: false,
        //                         timer: 1500
        //                     });
        //                 }
        //             });
        //         }
        //     });
        // }
        function deleteRow(deleteButton) {
            var row = deleteButton.closest('tr');
            var id = row.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 base_url('delete_followup'); ?>",
                        method: 'POST',
                        data: { id: id },
                        dataType: 'json',
                        success: function (response) {
                            if (response.success) {
                                row.remove();
                                Swal.fire({
                                    icon: 'success',
                                    title: 'Success',
                                    text: 'Data deleted successfully!',
                                    showConfirmButton: false,
                                    timer: 1500
                                });
                            } else {
                                Swal.fire({
                                    icon: 'error',
                                    title: 'Error',
                                    text: 'Failed to delete data.',
                                    showConfirmButton: false,
                                    timer: 1500
                                });
                            }
                        },
                        error: function () {
                            Swal.fire({
                                icon: 'error',
                                title: 'Error',
                                text: 'Failed to delete data. Please try again later.',
                                showConfirmButton: false,
                                timer: 1500
                            });
                        }
                    });
                }
            });
        }
    </script>
    <script>
        function fun_edit(element) {
            var rowId = element.closest('tr').attr('id');
            var leadId = $('#list3').jqGrid('getCell', rowId, 'id');
            $.ajax({
                url: "<?php echo site_url('fetch_followup?id='); ?>" + leadId,
                type: 'GET',
                success: function (response) {
                    // Assuming the response is a JSON object
                    console.log(response.follow_up_remarks);
                    console.log(response.follow_by);
                    $('#updateFollowUpId').val(response.id);
                    $('#leads').val(leadId);
                    $('#followRemarks').val(response.follow_up_remarks);
                    $('#followBy').val(response.follow_by);
                    $('#ttdate').val(response.today_date);
                    $('#timeam').val(response.today_time);
                    $('#fnextdate').val(response.next_date);
                    $('#FollowUpModal').modal('show');
                },
                error: function (xhr, status, error) {
                    console.error(xhr.responseText);
                }
            });

$('#closeModalBtn1').click(function () {

$('#FollowUpModal').modal('hide');
});
        }

</script>

window.location.href = "<?php echo base_url('followUp_form') ?>?lead_id=" + id;
        }
        // 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>';
        //                         }
    </script>

.ui-jqgrid-titlebar {
            background-color: rgba(0, 72, 76, 1);
        }

.ui-jqgrid-title {
            color: #fff;
            font-weight: 600;
            font-size: 18px;
        }

.user-tag {
            color: rgba(0, 72, 76, 1);
            font-weight: 600;
            font-size: 24px;
        }

.soptclass {
            display: none;
        }

@media only screen and (max-width:600px) {
            #mobile-div {
                padding: 20px;
            }

.u_e {
                margin-bottom: 5px;
            }

.u_s {
                margin-bottom: 5px;
            }
        }
        .ui-jqgrid {
            z-index: 1;
        }
    </style>

</body>

</html>