ESH/image_popup_procurement.php
2024-10-23 18:28:06 +05:30

237 lines
8.1 KiB
PHP

<style>
#modal-add-document{
overflow-y:scroll;
}
</style>
<div id="image_div">
</div>
<div class="modal fade" id="modal-add-document" name="modal-add-document" role="dialog" aria-hidden="true">
<form role="form" id="procurement_bill_form" name="procurement_bill_form" enctype="multipart/form-data" method="post">
<div class="modal-dialog">
<div class="modal-content">
<div class="widget-header">
<h5 class="widget-title">Upload Bill</h5>
<div class="widget-toolbar">
<div class="widget-menu">
<button type="button" class="close" style="" data-dismiss="modal"
><i class="ace-icon fa fa-times"></i>
</button>
</div>
</div>
</div>
<div class="modal-body">
<div class="row">
<div class="col-xs-3">
</div>
<input id="procurementID" type="hidden" style="height: 30px" class="form-control" name="procurementID" value="<?php echo $_REQUEST['flex_procurement_id']?>" />
<!-- <input id="emp_id" name="emp_id" type="hidden"
value="<?php echo $row['emp_id']?>" /> -->
<div class="col-xs-6">
<input type="text" style="width:100%" placeholder="Enter Document Name" id="medical_exam_document" name="medical_exam_document" />
</div>
</div>
<div class="row" style="margin-top: 10px">
<div class="form-group">
<div class="col-xs-3">
</div>
<div class="col-xs-6">
<div class="form-group">
<input type="file" id="file_medical_exam" name="file_medical_exam" onchange="return fileValidation()" />
</div>
<!-- <input type="hidden" name="medical_exam_id_doc" id="medical_exam_id_doc" value="<?php echo $_REQUEST['procurement_id']; ?>"> -->
</div>
</div>
</div>
</div>
<div class="widget-toolbox padding-8 clearfix" >
<button type="button" onclick="save_upload_bill()"
class="btn btn-info btn-sm save_button" ><i class="ace-icon fa fa-floppy-o bigger-110"></i>Upload </button>
<button type="button" class="btn btn-danger btn-sm" data-dismiss="modal"><i class="ace-icon fa fa-times bigger-110"></i>Cancel</button>
</div>
</div>
</div>
</form>
</div>
<style>
.clickable{
cursor: pointer;
}
.panel-heading span {
margin-top: -20px;
font-size: 15px;
}
img {
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
}
</style>
<script>
function open_popup_img(){
$("#procurement_form").submit(function(e){
e.preventDefault();
});
$('#modal-add-document').modal("show");
}
function image(value){
var src=value.src;
var content="";
var content='<div class="modal fade" id="modal-img" role="dialog" aria-hidden="true">'
content+='<div class="modal-dialog modal-lg">'
content+='<div class="modal-content">'
content+='<div class="modal-header">'
content+='<h5 class="modal-title" style="text-align: center">Image '
content+='<button type="button" class="close" data-dismiss="modal"'
content+='aria-label="Close">'
content+='<span aria-hidden="true">&times;</span>'
content+='</button></h5>'
content+='</div>'
content+='<div class="modal-body">'
content+='<div class="row"><a href='+src+' download><div class="form-group col-sm-12">'
content+='</div><img height="300" weight="300" src='+src+' alt="new image"/></a></div>'
content+='</div>'
content+='</div><div><div>'
$("#image_div").html(content);
$('#modal-img').modal("show");
}
function pdf_preview(value, title){
var src=value.src;
var content="";
var content='<div class="modal fade" id="modal-img" role="dialog" aria-hidden="true">'
content+='<div class="modal-dialog modal-lg" style="width:80%;height:100%" >'
content+='<div class="modal-content" style="width:100%;height:100%">'
content+='<div class="modal-header">'
content+='<h5 class="modal-title" style="text-align: center">'+title
content+='<button type="button" class="close" data-dismiss="modal"'
content+='aria-label="Close">'
content+='<span aria-hidden="true">&times;</span>'
content+='</button></h5>'
content+='</div>'
content+='<div class="modal-body" style="width:100%;height:100%">'
content+='<div class="form-group col-sm-12">'
content+='</div style="width:100%;height:100%" ><object type="application/pdf" style="width:100%;height:100%" data='+src+' alt="new image"/></object></div>'
// content+='</div>'
content+='</div><div><div>'
$("#image_div").html(content);
$('#modal-img').modal("show");
}
function save_upload_bill(){
// var myForm = $("#medical_exam_document_form")[0]
$.ajax({
url:"save_upload_bill.php",
method:"POST",
data:new FormData(document.getElementById("procurement_bill_form")),
contentType:false,
processData:false,
success:function(data){
BootstrapDialog.alert('Uploaded Document Saved Successfully ');
getMedicalDocData();
},
error:function(data){
BootstrapDialog.alert('Error In Saving Upload Document');
}
});
}
function fileValidation(){
var fileInput = document.getElementById('file_medical_exam');
var filePath = fileInput.value;
var allowedExtensions = /(\.jpg|\.jpeg|\.png|\.pdf)$/i;
if(!allowedExtensions.exec(filePath)){
BootstrapDialog.alert('Please upload only image and pdf file ');
fileInput.value = '';
return false;
}else{
return;
}
}
function getMedicalDocData(){
$.ajax({
url:"get_upload_bill.php",
method:"get",
data:{procurement_id:$('#procurement_id').val()},
dataType:'json',
async:false,
success:function(data){
var content="";
if (data.medical_doc_type=='application/pdf'){
content="<tr id='medical_doc_"+data.id+"'><td>"+data.medical_doc_desc+"</td><td>"
content+="<a href= \"#\" ><img src= \"images/pdf.png\" width=\"35\" height=\"35\" onclick=\"$('#med_doc_"+data.id+"').click()\" /></a> <img id=\"med_doc_"+data.id+"\" style= \"display:none\" src = \"data:"+data.medical_doc_type+";base64,"+data.medical_doc+"\" alt = \"pdf\" onclick=\"pdf_preview(this,'"+data.medical_doc_desc+"')\" /> </td>"
content+='<td align="center"><a href="#" class="btn-lg" data-toggle="tooltip" id="deletebtn" onclick="delete_opd_document('+data.id+')" title="Delete"><span class="glyphicon glyphicon-trash"></span></a></td></tr>'
$("#medical_doc_id tbody").append(content);
}else{
content="<tr id='medical_doc_"+data.id+"'><td>"+data.medical_doc_desc+"</td><td>"
content+="<img width=\"35\" height=\"35\" src = \"data:"+data.medical_doc_type+";base64,"+data.medical_doc+"\" alt = \"new image\" onclick=\"image(this,'"+data.medical_doc_desc+"')\" /></td>"
content+='<td align="center"><a href="#" class="btn-lg" data-toggle="tooltip" id="deletebtn" onclick="delete_opd_document('+data.id+')" title="Delete"><span class="glyphicon glyphicon-trash"></span></a></td></tr>'
$("#medical_doc_id tbody").append(content);
}
counter++;
},
error:function(data){
}
});
}
function delete_upload_bill(delete_id){
$("#medical_doc_id").on("click", ".glyphicon-trash", function (event) {
$('#medical_doc_'+delete_id).remove();
});
$.ajax({
url:"delete_upload_bill.php",
data:{delete_id:delete_id},
method:"POST",
success:function(data){
BootstrapDialog.alert('Document Deleted Successfully ');
//getMedicalDocData();
},
error:function(data){
BootstrapDialog.alert('Error In deleting Upload Document');
}
});
}
</script>