342 lines
13 KiB
PHP
342 lines
13 KiB
PHP
|
||
<!-- ============================================================== -->
|
||
<!-- Start Page Content here -->
|
||
<!-- ============================================================== -->
|
||
<style>
|
||
.otp-input {
|
||
text-align: center;
|
||
letter-spacing: 0.5rem;
|
||
}
|
||
.file_approved {
|
||
border-top: 1px dotted #000;
|
||
padding-top: 3px;
|
||
}
|
||
</style>
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
|
||
|
||
<div class="content-page">
|
||
<!-- Start Content-->
|
||
<div class="container-fluid">
|
||
|
||
<!-- start page title -->
|
||
<div class="row">
|
||
<div class="col-2"> </div>
|
||
<div class="col-8">
|
||
<div class="page-title-box page-title-box-alt">
|
||
<h4 class="page-title"><?php echo $docData->service_name; ?>
|
||
<a class="download-btnn" style="color:#000;">
|
||
<i class="fas fa-download"></i>
|
||
</a>
|
||
</h4>
|
||
<div class="page-title-right">
|
||
<a onclick="window.history.back()" class="btn btn-secondary waves-effect waves-light"> Close </a>
|
||
|
||
<?php if($docData->is_approved != 1){ ?>
|
||
<a href="#" class="btn btn-danger waves-effect waves-light" data-toggle="modal" data-target="#reject-modal"> Reject </a>
|
||
<a href="#" data-toggle="modal" data-target="#approve-modal" class="btn btn-primary waves-effect waves-light"> Approve </a>
|
||
<?php } ?>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-2"> </div>
|
||
</div>
|
||
<!-- end page title -->
|
||
|
||
|
||
<div class="row">
|
||
<div class="col-2"> </div>
|
||
<div class="col-8">
|
||
<div class="card">
|
||
<div class="card-body">
|
||
|
||
<div class="template-header">
|
||
|
||
</div>
|
||
|
||
<div class="template-body">
|
||
|
||
<?php echo $body_html; ?>
|
||
|
||
</div>
|
||
|
||
<div >
|
||
<?php if($docData->is_approved == 1){ echo ' <div class="file_approved"> Approved at '.date('d-m-Y H:i:s', strtotime($docData->updated_at)).' through OTP sent to '.$clientData->mobile_no.' from ip address '.$docData->ip_address.'</div>'; } ?>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div><!-- end col-->
|
||
<div class="col-2"> </div>
|
||
</div>
|
||
|
||
|
||
|
||
</div> <!-- container -->
|
||
|
||
</div> <!-- content -->
|
||
|
||
|
||
<!-- SignIn modal content -->
|
||
<div id="reject-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" aria-modal="true" data-backdrop="static">
|
||
<div class="modal-dialog">
|
||
<div class="modal-content">
|
||
|
||
<div class="modal-body">
|
||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
<div class="text-center mt-2 mb-4">
|
||
<h4>Document Rejection</h4>
|
||
</div>
|
||
<input type="hidden" id="doc_id" value="<?php echo $docData->doc_id; ?>">
|
||
<div class="form-group">
|
||
<label for="rejection_reason">Rejection Reason</label>
|
||
<textarea class="form-control" name="rejection_reason" id="rejection_reason" rows="5" required="" placeholder="Rejection Reason"></textarea>
|
||
</div>
|
||
|
||
<div class="form-group text-center">
|
||
<button class="btn btn-rounded btn-primary" type="button" id="submit_button">Submit</button>
|
||
</div>
|
||
</div>
|
||
</div><!-- /.modal-content -->
|
||
</div><!-- /.modal-dialog -->
|
||
</div><!-- /.modal -->
|
||
|
||
|
||
<!-- SignIn modal content -->
|
||
<div id="approve-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" aria-modal="true" data-backdrop="static">
|
||
<div class="modal-dialog">
|
||
<div class="modal-content">
|
||
<div class="modal-body">
|
||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
<div class="text-center mt-2 mb-4">
|
||
<h4>Document Approve</h4>
|
||
</div>
|
||
<div class="form-group" id="approve_error"></div>
|
||
<div class="form-group">
|
||
<label for="rejection_reason">Mobile No</label>
|
||
<input type="text" readonly class="form-control" id="mobile_no" value="<?php echo $clientData->mobile_no; ?>">
|
||
</div>
|
||
<div class="loader-mask modal-loader-mask" style="display:none;">
|
||
<div class="loader modal-loader" style="display:none;">
|
||
Please Wait <img src="<?= base_url() . "public" ?>/assets/images/simple_loader.gif" height="30" width="30" alt="Loading...">
|
||
</div>
|
||
</div>
|
||
<div class="form-group" id="otp_hide" style="display:none;">
|
||
<label for="otp">OTP</label>
|
||
<input type="text" name="otp" id="otp" class="form-control otp-input" maxlength="6" pattern="\d{6}">
|
||
</div>
|
||
<div class="form-group mb-0 text-right" id="approve_resend_otp_hide" style="margin-top: 10px;display:none;">
|
||
<a href="#" id="approve_resend_otp">Resend OTP</a>
|
||
</div>
|
||
<div class="form-group text-center">
|
||
<button class="btn btn-primary btn-block" id="generate_otp" type="button">Generate OTP </button>
|
||
</div>
|
||
<div class="form-group text-center" id="submit_hide" style="display:none;">
|
||
<button class="btn btn-rounded btn-primary" type="button" id="approve_submit_button">Submit</button>
|
||
</div>
|
||
|
||
</div>
|
||
</div><!-- /.modal-content -->
|
||
</div><!-- /.modal-dialog -->
|
||
</div><!-- /.modal -->
|
||
|
||
|
||
|
||
<script>
|
||
|
||
$('#generate_otp').click(function (params) {
|
||
|
||
event.preventDefault(); // Prevent form submission
|
||
$('.loader').fadeIn();
|
||
$('.loader-mask').fadeIn();
|
||
|
||
|
||
$.ajax({
|
||
url: '<?php echo base_url()."doc_generate_otp"?>',
|
||
method: 'POST',
|
||
data: {
|
||
mobile_no : $('#mobile_no').val(),
|
||
doc_id : $('#doc_id').val()
|
||
},
|
||
success: function(response) {
|
||
console.log(response);
|
||
if(response){
|
||
$('#approve_error').html('OTP Sent Successfully').css('color','green');
|
||
$('#generate_otp').hide();
|
||
$('#otp_hide').show();
|
||
$('#submit_hide').show();
|
||
$('#approve_resend_otp_hide').show();
|
||
}else{
|
||
// pan_error.html('PAN number mismatch. Please try again.');
|
||
// pan_error.css('color','red');
|
||
}
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
},
|
||
error: function(xhr, status, error) {
|
||
// Handle any errors
|
||
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
console.error('Error generating OTP: ' + error);
|
||
}
|
||
});
|
||
|
||
})
|
||
|
||
$('#approve_submit_button').click(function (params) {
|
||
|
||
|
||
$('.loader').fadeIn();
|
||
$('.loader-mask').fadeIn();
|
||
$('#approve_error').html('');
|
||
$.getJSON('https://api.ipify.org?format=json', function(data) {
|
||
var clientIp = data.ip;
|
||
var formData ={
|
||
otp : $('#otp').val(),
|
||
doc_id : $('#doc_id').val(),
|
||
is_approved: 1,
|
||
clientIp : clientIp
|
||
}
|
||
$.ajax({
|
||
type: 'POST',
|
||
url: '<?php echo base_url()."doc_verify_otp"?>',
|
||
data: formData,
|
||
dataType: 'json',
|
||
success: function(response) {
|
||
console.log(response);
|
||
if (response) {
|
||
window.location.reload();
|
||
}else{
|
||
$('#approve_error').html('OTP Incorrect. Please try again.');
|
||
$('#approve_error').css('color','red');
|
||
}
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
},
|
||
error: function(xhr, status, error) {
|
||
// Handle error response here
|
||
console.error(xhr.responseText);
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
}
|
||
});
|
||
});
|
||
|
||
})
|
||
|
||
|
||
$('#submit_button').click(function (params) {
|
||
|
||
var formData ={
|
||
rejection_reason : $('#rejection_reason').val(),
|
||
doc_id : $('#doc_id').val(),
|
||
is_approved: 2
|
||
}
|
||
$('.loader').fadeIn();
|
||
$('.loader-mask').fadeIn();
|
||
$.ajax({
|
||
type: 'POST',
|
||
url: '<?php echo base_url()."doc_rejection"?>',
|
||
data: formData,
|
||
dataType: 'json',
|
||
success: function(response) {
|
||
console.log(response);
|
||
if (response) {
|
||
window.location.reload();
|
||
}
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
},
|
||
error: function(xhr, status, error) {
|
||
// Handle error response here
|
||
console.error(xhr.responseText);
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
}
|
||
});
|
||
|
||
|
||
})
|
||
|
||
$('#approve_resend_otp').click(function (params) {
|
||
$('#approve_error').html('');
|
||
event.preventDefault(); // Prevent form submission
|
||
$('.loader').fadeIn();
|
||
$('.loader-mask').fadeIn();
|
||
$.getJSON('https://api.ipify.org?format=json', function(data) {
|
||
var clientIp = data.ip;
|
||
|
||
$.ajax({
|
||
url: '<?php echo base_url()."doc_generate_otp"?>',
|
||
method: 'POST',
|
||
data: {
|
||
mobile_no : $('#mobile_no').val(),
|
||
doc_id : $('#doc_id').val(),
|
||
clientIp: clientIp
|
||
},
|
||
success: function(response) {
|
||
console.log(response);
|
||
if(response){
|
||
$('#approve_error').html('OTP Sent Successfully').css('color','green');
|
||
|
||
}else{
|
||
// $('#approve_error').html('PAN number mismatch. Please try again.');
|
||
// $('#approve_error').css('color','red');
|
||
}
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
},
|
||
error: function(xhr, status, error) {
|
||
// Handle any errors
|
||
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
console.error('Error generating OTP: ' + error);
|
||
}
|
||
});
|
||
})
|
||
|
||
})
|
||
</script>
|
||
|
||
<script>
|
||
document.addEventListener("DOMContentLoaded", function() {
|
||
document.querySelector(".download-btnn").addEventListener("click", async function() {
|
||
const { jsPDF } = window.jspdf;
|
||
|
||
var element = document.querySelector(".card-body");
|
||
const canvas = await html2canvas(element);
|
||
var imgData = canvas.toDataURL('image/png');
|
||
var pdf = new jsPDF('p', 'mm', 'a4');
|
||
var imgWidth = 210;
|
||
var pageHeight = 297;
|
||
var imgHeight = canvas.height * imgWidth / canvas.width;
|
||
var heightLeft = imgHeight;
|
||
var position = 0;
|
||
|
||
pdf.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);
|
||
heightLeft -= pageHeight;
|
||
|
||
while (heightLeft >= 0) {
|
||
position = heightLeft - imgHeight;
|
||
pdf.addPage();
|
||
pdf.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);
|
||
heightLeft -= pageHeight;
|
||
}
|
||
|
||
pdf.save('download.pdf');
|
||
});
|
||
});
|
||
</script>
|
||
|
||
|
||
<!-- ============================================================== -->
|
||
<!-- End Page content -->
|
||
<!-- ============================================================== -->
|
||
|
||
|
||
|
||
|
||
|