EVOLUTION-NINJA

Edit File: my_cpd_portfolio.php

<?php
    echo view('includes/flow-header'); 
    //  print_r($all_val);
    // die();   
?>
<section class="spec-main last_body">
    <div class="row">
        <div class="col-sm-3 anaslefbox">
            <div class="spec-left specunderline mob_height">
                <ul>
                    <li><a href="">CPD Activity</a></li>
                </ul>
            </div>
        </div>
        <div class="col-sm-9">

<div class="row">
                            <div class="col-sm-3 mb-5 cpd_back" id="go-back-new">
                                <a href="<?php echo base_url('cpd-dashboard');?>">
                                    <i class="fa fa-arrow-left" aria-hidden="true"></i>Back</a>
                            </div>
                        </div>
                        <div class="row cpd_start_four">
                            <div class="col-sm-3">

<a href="<?php echo base_url('cpd-dashboard');?>"><span><button type="button" class="form-control" id="dash-button-1"><img class="avc-img" src="public/assets/cpdimage/Dashboard 1.png">Dashboard</button></a></span>
                                
                            </div>
                            <div class="col-sm-3 mob_cpdacti">
                                 <a href="<?php echo base_url('cpd-activity');?>"><button type="button" class="form-control dash-button"><img class="avc-img" src="public/assets/cpdimage/Activities 1.png">Activities</button></a>
                            </div>
                            <div class="col-sm-4 mob_cpdproto">
                                 <a href="<?php echo base_url('my-cpd-portfolio');?>"><button type="button" class="form-control cps-summary-button "><img class="avc-img" src="public/assets/cpdimage/My CPD Portfolio 1.png">CPD Summary/Download</button></a>
                            </div>

</div>
                        <div class="row">
                        <div class="col-sm-3 mob_cpdactivity">
                                
                                <a href="<?php echo base_url('add-cpd');?>"> <img src="public/assets/cpdimage/Subtract.png" class="cpd_subtract">
                                <button type="button" class="form-control add_act_new">Add Activity</button></a>

</div>
</div>
                        <!-- <div class="row cpd_start_four">
                            <div class="col-sm-3">
                                <a href="<?php echo base_url('cpd-dashboard');?>"> <img src="public/assets/cpdimage/Rectangle 4108 (2).png">
                                    <h5 class="cpd_dash">Dashboard</h5>
                                </a>
                            </div>
                            <div class="col-sm-3 mob_cpdacti">
                                <a href="<?php echo base_url('cpd-activity');?>"><img src="public/assets/cpdimage/Rectangle 4108 (2).png">
                                    <h5 class="cpd_acti">Activities</h5>
                                </a>
                            </div>
                            <div class="col-sm-5 mob_cpdproto">
                                <a href="<?php echo base_url('my-cpd-portfolio');?>"><img src="public/assets/cpdimage/Rectangle 4108 (1).png">
                                    <h5 class="cpd_proto">My CPD Portfolio</h5>
                                </a>
                            </div>

<div class="col-sm-5 mt-2 mob_cpdactivity">
                                <a href="<?php echo base_url('add-cpd');?>"><img src="public/assets/cpdimage/Rectangle 4108 (2).png">
                                    <img src="public/assets/cpdimage/Subtract.png" class="cpd_subtract">
                                    <h5 class="cpd_addaccti">Add Activity</h5>
                                </a>
                            </div>
                        </div> -->

</div>
                    
                </div>
</div>

<div class="row">
                <div class="col-sm-12 mt-4 ml-1" style="margin-bottom: -30px;">
                    <h3 style="font-weight:600">Current Program</h3>
                </div>
            </div>
        
            <table class="table table-bordered mt-5" id="ps">
                <thead>
                    <tr>
                        <th>Start Year</th>
                        <th>End Year</th>
                        <th>CPD Summary to date</th>
                        <th>Evidence to Date</th>
                    </tr>
                    <tr>
                        <?php
                            $i = 0;
                            foreach($all_val  as $val){
                                if($val['count'] != 0){
                                    $i = 1;
                                }
                            }
                        ?>
                        <td><?php
                            echo substr($start_val,0,4); ?></td>
                        <td><?php echo substr($end_val,0,4); ?></td>
                        <td><button class="btn-cpd" onclick="fun_pdf('All')"><i class="fa fa-download"></i> Download</button>
                        
                        </td>
                        <?php
                            if($i == 1){
                                ?>
                                 <td><button class="btn-cpd" onclick="cpd_evidence('<?php echo 'All';?>')"><i class="fa fa-download"></i> Download</button></td>
                                <?php
                            }
                            else{
                                ?>
                                 <td>No Evidences</td>
                                <?php
                            }
                        ?>
                       
                    </tr>
                </thead>
                
            </table>
            
            
            <div class="row">
                <div class="col-sm-12 mt-4 ml-1" style="margin-bottom: 10px;">
                    <h3 style="font-weight:600">CPD Program History</h3>
                </div>
            </div>

<table class="table table-bordered" id="ps">
                <thead>
                    <tr>
                        <th>Year</th>
                        <th>CPD Summary to date</th>
                        <th>Evidence to Date</th>
                    </tr>
                    <?php foreach($all_val  as $val){
                        ?>
                          <tr>
                            <td>
                            <?php
                                 echo $val['year']; ?></td>
                             <td><button class="btn-cpd" onclick="fun_pdf_year('<?php echo $val['year'];?>')"><i class="fa fa-download"></i> Download</button></td>
                             <?php
                             if($val['count'] != 0){
                                ?>
                                     <td><button class="btn-cpd" onclick="cpd_evidence('<?php echo $val['year'];?>')"><i class="fa fa-download"></i> Download</button></td>
                                <?php
                             }
                             else{
                                ?>
                                 <td>No Evidences</td>

<?php
                             }
                             ?>
                           
                        </tr>
                        <?php
                    }
                    ?>
                  
                </thead>
                
            </table>

</div>
    </div>

<div id="deleteConfirmationModal" class="modal">
    <div class="modal-content">
        <h3 class="p-2" style="background-color: #0065A3;color: white; ">Logbook</h3>
        <div class="model_con">
        <p><b>Do you want to delete this record?</b></p>
        <div class="row">
            <div class="col-sm-6">
                <button class="btn btn-light bt" onclick="closeDeleteConfirmation()"><b>No</b></button>
            </div>
            <div class="col-sm-6">
      
        <button class="btn btn-danger bt"onclick="deleteRecord()"><b>Yes</b></button>
    </div>
        </div>
    </div>
    </div>
</div>
</section>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.5.12/jspdf.plugin.autotable.min.js"></script>

$.ajax({
        url: "<?php echo base_url('cpd-data');?>"+'?year='+year,
        type: "GET",

success: function(response) {
            // response = jQuery.parseJSON(response);

// Create a Bootstrap-styled table
            var columns = [
                { title: "Start Date", key: "start_date" },
                { title: "End Date", key: "end_date" },
                { title: "Category", key: "category" },
                { title: "Section", key: "section" },
                { title: "Title", key: "title" },
                { title: "Details", key: "notes" },
                { title: "Hours", key: "hours" },
                { title: "CPD Point ", key: "cpd_points" },
                { title: "Evidences", key: "evidences" }
            ];

var data = response.map(function(item) {
                return columns.map(function(column) {
                    return item[column.key];
                });
            });

var doc = new jsPDF();

// Add a title to the PDF
            doc.text("CPD Summary to date", 10, 10);

// Generate auto-width and auto-height table using jsPDF-AutoTable
            doc.autoTable({
                head: [columns.map(function(column) { return column.title; })],
                body: data,
                startY: 20 // Adjust the starting Y position as needed
            });

// Save the PDF as a file
            doc.save('CPD Summary.pdf');
        }
    });
}

</script>
<script>
function fun_pdf_year(year) {

$.ajax({
        url: "<?php echo base_url('cpd-data');?>"+'?year='+year,
        type: "GET",

success: function(response) {
            // response = jQuery.parseJSON(response);

var data = response.map(function(item) {
                return columns.map(function(column) {
                    return item[column.key];
                });
            });

var doc = new jsPDF();

// Add a title to the PDF
            doc.text("CPD Summary to date", 10, 10);

// Save the PDF as a file
            doc.save('CPD Summary.pdf');
        }
    });
}

</script>

.modal-content {
    background-color: #fff;
    margin: 20% auto;
    /* padding: 20px; */
    width: 30%;
    /* text-align: center; */
}
.model_con{
    padding: 20px;
}

.bt{
    width: 100%;
}

</style>

.dash-button{
        background: linear-gradient(to left, #0160A2,#0198CD, #0160A2);
    color: white;
    border: none;
    border-radius: 6px;
    width: 100%;
    height: 45px;
    font-size: 17px;
    }
    #dash-button-1{
        background: linear-gradient(to left, #0160A2,#0198CD, #0160A2);
        /* background-color: #0160A2; */

color: white;
    border: none;
    border-radius: 6px;
    width: 100%;
    height: 45px;
    font-size: 17px;
    }
    .cps-summary-button{
        /* background: linear-gradient(to left, #0160A2,#0198CD, #0160A2); */
        background-color: #0065a3;
        box-shadow: #6c757d 0px 0px 0px 3px;
    color: white;
    border: none;
    border-radius: 6px;
    width: 105%;
    height: 45px;
    font-size: unset;
    }
    .add_act_new{
        background: linear-gradient(to left, #0160A2,#0198CD, #0160A2);
        color: white;
    border: none;
    border-radius: 6px;
    width: 85%;
    height: 30px;
   
    font-size: 14px;
    text-align: center;
  
    }
    .cpd_subtract{
        margin-left: 3px;
    position: relative;
    top: 24px;
    width: 14px;
    left: 3px;
    
    }
    .cpd_back{
        position: relative;
        top: 0px;
    }
    .mob_cpdacti{
        /* margin-left: -50px; */
    }
    .mob_cpdproto{
        /* margin-left: -50px; */
    }
    .cpd_start_four{
        margin-top: -80px;
    }
    .avc-img{
        width: 28px;
    height: 28px;
    position: relative;
    left: -7px;
    }

@media only screen and (max-width: 600px){
            .mob_cpdactivity{
                width: 50%;
    margin-left: -148px;
    margin-top: 160px !important;
    margin-bottom: -140px;
            }
           
            #dash-button-1{
                margin-top: 50px;
                margin-left: 0px;
            }
            .cps-summary-button{
                margin-left: 50px;
                margin-top: 10px;
                width: 80%;
            }
            .mob_cpdacti{
                margin-top: 50px;
    margin-left: -189px !important;
            }
            .cpd_start_four{
                margin-top: -45px;
                margin-left: 10px !important;
            }
            .can-mo{
                    position: relative;
                    top: -30px;
                    left: 4px;
                        }
            .can-mo1{
                    position: relative;
                    top: -12px;
                    left: 4px;
            }  
            .mob_cpdacti {
                position: relative;
                top: -35px;
                left: 187px;
        }
       
            .cps-summary-button {
                margin-left: 0px;
                margin-top: 10px;
                width: 100%;
        }
        .btn-cpd{
            font-size: 12px;
        }
           
        }

</style>