EVOLUTION-NINJA

Edit File: feed_back_details_v.php

<?php
    echo view('includes/admin-header');    
?>

<div class="row" id="mobile-div">
        <div class="col-sm-12">
            <h4 class="user-tag"><?php echo $title1['title']; ?></h4>
        </div>
        
        
    </div>
    <div class="row mt-4" id="mobile-div">
        <div class="col-sm-9">
            
        </div>
        
        <div class="col-sm-3">   
            <button type="button" id="btnExport" class="btn-excel" onclick="usermanagement_excel()">Export to Excel</button>
            <button type="button" class="btn btn-primary back" style="background-color:#0065A3;border-radius: 8px;">Back</button>         
        </div>
    </div>
    <div id="jaytab3" style="margin-top:6%;" >

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

</div>
        </div>
        <div id="pager3"></div>
    </div>
    <div class="row">
        <div class="col-sm-5">
        
        </div>
        <div class="col-sm-5">
        <button id="feed_rbutton" type="submit">export to pdf</button>
        </div>
    </div>

<div id="feed_rdiv" class="row">
        <div class="col-sm-2"></div>
        <div  class="col-sm-6" >
        <h4 class="confer">Conference Feedback Report</h4> 
            <div id="chartContainer" style="margin:20px;">
               
        </div>
       
        </div>
    </div>
</div>

$(document).ready(function () {
        var conf_id = $('#conf_id').val();
        $.ajax({
            url: '<?php echo site_url('feedBack-data-chart');?>?id=' + conf_id,
            type: 'GET',
            dataType: 'json',
            success: function (data) {
                for (var ps_id in data) {
                    var chartCanvas = document.createElement('canvas');
                    chartCanvas.id = 'chart_' + ps_id;
                    $('#chartContainer').append(chartCanvas);
                    var ratingLabels = [];
                    var ratingCounts = [];
                    var ratingNames = {
                    '1': 'Poor',
                    '2': 'Not Good',
                    '3': 'Good',
                    '4': 'Very Good',
                    '5': 'Excellent'
                };
                    for (var rating in data[ps_id].ratings) {
                        ratingLabels.push( ratingNames[rating]);
                        ratingCounts.push(data[ps_id].ratings[rating]);
                    }
                    var ctx = document.getElementById('chart_' + ps_id).getContext('2d');
                    var chart = new Chart(ctx, {
                        type: 'bar',
                        data: {
                            labels: ratingLabels,
                            datasets: [{
                                label: 'Rating Counts',
                                data: ratingCounts,
                                backgroundColor: '#0065A3',
                                borderColor: 'black',
                                borderWidth: 1
                            }]
                        },
                        options: {
                            scales: {
                                y: {
                                    beginAtZero: true
                                }
                            }
                        }
                    });
                $('#chartContainer').append('<b class="speaker_name"  id="speaker_' + ps_id + '" >Speaker : ' + data[ps_id].speaker + '</b><br/>');
                $('#chartContainer').append('<b class="topic_name"  id="speaker_' + ps_id + '" >Topic : ' + data[ps_id].topic + '</b>');
                var totalRatingCount = ratingCounts.reduce((total, count) => total + count, 0);
                var totalRatingSum = ratingCounts.reduce((sum, count, index) => sum + count * (index + 1), 0);
                var averageRating = totalRatingSum / totalRatingCount;

$('#chartContainer').append('<div class="total_member" id="totalRatingCount_' + ps_id + '">Total Members Rated : ' + totalRatingCount + '</div>');
                $('#chartContainer').append('<div class="avg" id="averageRating_' + ps_id + '">Average Rating : ' + generateStarRating(averageRating) +'</div>');
                $('#chartContainer').append('<div class="average_num" id="averageRating_' + ps_id + '">Average : ' + averageRating.toFixed(2) + '</div>');
                    // $('#chartContainer').append('<div id="averageRating_' + ps_id + '">Average Rating: ' + generateStarRating(data[ps_id].averageRating) + '</div>');
                    // $('#chartContainer').append('<div id="totalRatingCount_' + ps_id + '">Total Members Rated: ' + data[ps_id].totalRatingCount + '</div>');
                }
            },
            error: function () {
                $('#ratingCounts').html('Failed to fetch rating counts.');
            }
        });
    });
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.min.js"></script>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
<script>
    var btnSave = document.getElementById('feed_rbutton');

btnSave.disabled = false;

btnSave.addEventListener('click', function () {
        var doc = new jsPDF();

html2canvas($('#feed_rdiv').get(0)).then(function (canvas) {
            var margin = canvas.height * 0.005;
            var pageHeight = canvas.height + 2 * margin;

// Export pdf
            var pdfDoc = new jsPDF({
                orientation: 'portrait',
                unit: 'px',
                format: [canvas.width, pageHeight] 
            });

pdfDoc.addImage(canvas.toDataURL('image/png'), 0, margin, canvas.width, canvas.height);

// Save the PDF
            pdfDoc.save('Conf Feedback Report.pdf');
        });
    }, false);
</script>

$('.back').click(function(){
        window.location.href = '<?php echo base_url("Conferencelist")?>';
    });

$(document).ready(function(){

var conf_id = $('#conf_id').val();

jQuery("#list3").jqGrid({

url:'<?php echo site_url('feedBack-data');?>?id='+conf_id,
            datatype: "json",

colNames:['Sl','Name','date','Start Time','End Time','Topic','Speaker','Rating / 5','Feedback Comments'],

colModel:[

{name:'id',index:'id',hidden:true, width:50, editable:false},
                {name:'user_name',index:'user_name', width:60, editable:false },
                {name:'date',index:'date', width:70, editable:false , formatter: 'date', formatoptions: { newformat: 'd-m-Y' }},
                {name:'start_time',index:'start_time', width:60, editable:false},  
                {name:'end_time',index:'end_time',width:60, editable:false},                  
                {name:'topic',index:'topic', width:120, editable:false },
                {name:'speaker',index:'speaker', width:60, editable:false},
                {name:'rating',index:'rating', width:60, editable:false},
                {name:'review',index:'review', width:140, editable:false}
            ],

rowNum:20,
            rowList:[20,30,50,100,200,300],
            rownumbers: true,
            pager: '#pager3', 
            sortname:'id', 
            autowidth: true,
            height: '100%',
            // width: '100%',
            viewrecords: true, 
            loadonce:true,
            gridview: true,
            sortorder:"desc", 
            shrinkToFit: true,
            caption:"FeedBack Details",
            
            subGrid: false,

subGridRowExpanded: function(subgrid_id, row_id) {
                var subgrid_table_id;
                swan_id=row_id;

subgrid_table_id = subgrid_id+"_t";
                jQuery("#"+subgrid_id).html("<table id='"+subgrid_table_id+"' class='scroll'></table>");

jQuery("#"+subgrid_table_id).jqGrid({

url:"<?php echo site_url('show-row-details');?>?id="+swan_id,
                    type : "GET", 
                    datatype: "json", 
                    colNames:['Sl','e-mail','Mobile','City','Country'],
                    colModel:[

{name:'id',index:'id',hidden:true, width:50, editable:false},
                    {name:'email',index:'email', width:150, editable:false},
                    {name:'mobile',index:'mobile', width:120, editable:false},                              
                    
                    {name:'city',index:'city', width:150, editable:false},                              
                    {name:'contry',index:'contry', width:150, editable:false}
                    // {name:'purpose',index:'purpose', width:150, editable:false}

height: 'auto',
                    autowidth: true,
                    shrinkToFit: true,
                    rowNum:20,
                    sortname: 'num',
                    sortorder: "asc",
                    pager:subgrid_table_id,
                    loadonce: true,
                    footerrow: true,
                    userDataOnFooter: true,

});

}

});

$("#list3").jqGrid("setLabel", "rn", "SL");
        $("#list3").jqGrid('filterToolbar',{stringResult: true,searchOperators : true}); //for multisearch code,remove if not required

$("#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_excel(){       
        
        var conf_id = $('#conf_id').val();

$.ajax({
            url:'<?php echo site_url('feedBack-data');?>?id='+conf_id,
            type:"GET",
        
            success:function(response) {
                // response = jQuery.parseJSON(response);
                // console.log(response[0]);
                $('.user_excel').empty();

var con = '';

con +='<thead><tr><th>Name</th><th>Date</th><th>Start-Time</th><th>End-Time</th><th>Topic</th><th>Speaker</th><th>rating / 5</th><th>Feedback Comments</th></tr></thead>';
                $.each(response, function( key, value ) {   
                    con += '<tr>';                
                    con += '<td>'+value.user_name+'</td>';
                    con += '<td>'+value.date+'</td>';
                    con += '<td>'+value.start_time+'</td>';
                    con += '<td>'+value.end_time+'</td>';
                    con += '<td>'+value.topic+'</td>';
                    con += '<td>'+value.speaker+'</td>';
                    con += '<td>'+value.rating+'</td>';
                    con += '<td>'+value.review+'</td>';

con += '</tr>';
                });

$('.user_excel').append(con);

}
        }); 
    }

fun_excel();

</script>

function usermanagement_excel(){

$(".user_excel").table2excel({

exclude: ".noExl",
            name: "Excel Document Name",
            filename: "Feedback Summery Report",
            fileext: ".xlsx",
            exclude_img: true,
            exclude_links: true,
            exclude_inputs: true
        });

}
</script>

}
/* .speaker_name{
    text-decoration: underline;
} */
.average_num{
    border-bottom: 2px solid;
    margin-bottom: 20px;
    padding-bottom: 5px;
}
#feed_rbutton{
    background-color: #0065A3;
    cursor: pointer;
    color: #fff;
    border: 0;
    padding: 8px 15px;
    border-radius: 8px;
    float: right;
    margin-top: 20px;
}
.confer{
    margin-top: 20px;
    font-size: xx-large;
    text-decoration: underline;
}
    @media only screen and (max-width:600px){
        #mobile-div{
            padding: 20px;
        }
        .dashboard-left {
         height: 800px;
        }
        .chartjs-render-monitor {
            height: 224px !important;
        }
        .confer{
            margin-left: 20px;
        }
        #feed_rbutton{
            margin-right: 25px
        }
    }
</style>

<?php
    echo view('includes/admin-footer');    
?>