ok
Mini Shell
<?php include('header.php');
$statement = $pdo->prepare("SELECT * FROM `customer` WHERE status='1'");
$statement->execute();
$customer_dropdown = $statement->fetchAll(PDO::FETCH_ASSOC);
?>
<style>
@media (min-width: 1200px){
.row-cols-xl-2>* {
flex: 0 0 auto;
width: 33%;
}
}
#alert-info{
background-color: #f8e5e5;
}
#note{
font-size: 14px;
color: red;
}
#kyc{
font-size: 14px;
}
@media (min-width: 1200px){
#buttonstyle {
margin-left: 13%;
color:white;
font-size: 14px;
}
}
@media (min-width: 768px){
#buttonstyle {
margin-left: 13%;
color:white;
font-size: 14px;
}
}
.wrapper .search {
border: 1px solid #c8c8c8;
overflow: hidden;
border-radius: 25px;
padding: 0 10px;
margin: 15px 0 20px;
transition: all 0.3s
}
.wrapper .search:hover,
.wrapper .search:focus-within {
border: 1px solid transparent;
box-shadow: 2px 5px 8px #1f1f1f10, 0px -4px 5px #1f1f1f10
}
.wrapper .search .form-control {
box-shadow: none;
outline: none;
border: none
}
.wrapper .search .form-control:focus::placeholder {
opacity: 0
}
.wrapper .accordion-button {
font-size: 0.9rem;
font-weight: 500
}
.wrapper .accordion-button:hover {
background-color: #f8f8f8
}
.wrapper .accordion-button:focus {
box-shadow: none
}
.wrapper .accordion-button::after {
background-size: 1rem;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #c8c8c8;
background-position: center center;
border-radius: 50%
}
.wrapper .accordion-button:not(.collapsed) {
color: #000;
background-color: #f7f7f7;
font-weight: 600;
border-bottom: 1px solid #ddd !important
}
.accordion-button:not(.collapsed)::after {
border-color: #1E88E5
}
.wrapper .accordion-button.collapsed {
border-bottom: 1px solid #ddd !important
}
.wrapper .accordion-collapse.show {
border-bottom: 1px solid #ddd !important
}
.wrapper .accordion-collapse {
background-color: #eaf3fa
}
.wrapper .accordion-collapse ul li {
line-height: 2rem;
width: 100%;
padding: 0.5rem 1.3rem
}
.wrapper .accordion-collapse ul li:hover {
background-color: #c9e7ff
}
.wrapper .accordion-collapse ul li a {
text-decoration: none;
color: #333;
font-size: 0.85rem;
font-weight: 400;
display: block
}
.wrapper .accordion-collapse ul li:hover a {
color: #222
}
@media (max-width: 777px) {
.wrapper {
margin: 50px 20px
}
}
@media (max-width: 365px) {
.wrapper {
margin: 50px 10px
}
.w-75 {
width: 90% !important
}
}
.widgets-icons-4 {
width: 138px;
height: 138px;
display: flex;
align-items: center;
justify-content: center;
background-color: #ededed;
font-size: 27px;
border-radius: 10px;
}
.text-secondary1{
font-size: 22px;
font-family: emoji;
font-weight: bolder;
color: black !important;
}
.font-12 {
font-size: 12px;
}
</style>
<div class="page-wrapper">
<div class="page-content">
<div class="card card-body">
<div class="row">
<div class="col-12 col-sm-12 col-md-12 col-lg-12" style="background-color: darkkhaki;padding: 17px;border-radius: 10px;box-shadow: 4px 4px 4px 4px;">
<label for="customer_name" class="form-label required" style="color:black;">Customer Name / Mobile No</label>
<select name="customer_name" id="customer_name" class="select2 form-select valid font-size12" required>
<option value="">Select Customer Name / Mobile No</option>
<?php
foreach($customer_dropdown as $customer){
echo "<option value='".$customer['id']."'>".$customer['cust_firstname']."-".$customer['cust_phone']."</option>";
}
?>
</select>
</div><br>
</div>
</div>
<div id="customer_frame_info"></div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.js" ></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>
<script type="text/javascript" src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
<script>
$(document).ready(function() {
$("#customer_name").change(function(){
$('#customer_frame_info').empty();
customer_name=$("#customer_name").val();
console.log('selcetd Purchase Order No:'+customer_name);
$.ajax({
url:'ui-pages/print-customer-histomer.php',
type:'POST',
data:{customer_name:customer_name},
success:function(response)
{
console.log('Respinse'+response);
$("#customer_frame_info").append(response);
}
});
});
});
</script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(document).ready(function() {
console.log("cdn link is working");
$('.select2').select2();
});
</script>
<script>
function getPDF(){
var HTML_Width = $(".canvas_div_pdf").width();
var HTML_Height = $(".canvas_div_pdf").height();
var top_left_margin = 15;
var PDF_Width = HTML_Width+(top_left_margin*2);
var PDF_Height = (PDF_Width*1.5)+(top_left_margin*2);
var canvas_image_width = HTML_Width;
var canvas_image_height = HTML_Height;
var totalPDFPages = Math.ceil(HTML_Height/PDF_Height)-1;
html2canvas($(".canvas_div_pdf")[0],{allowTaint:true}).then(function(canvas) {
canvas.getContext('2d');
console.log(canvas.height+" "+canvas.width);
var imgData = canvas.toDataURL("image/jpeg", 1.0);
var pdf = new jsPDF('p', 'pt', [PDF_Width, PDF_Height]);
pdf.addImage(imgData, 'JPG', top_left_margin, top_left_margin,canvas_image_width,canvas_image_height);
for (var i = 1; i <= totalPDFPages; i++) {
pdf.addPage(PDF_Width, PDF_Height);
pdf.addImage(imgData, 'JPG', top_left_margin, -(PDF_Height*i)+(top_left_margin*4),canvas_image_width,canvas_image_height);
}
pdf.save("HTML-Document.pdf");
});
};
</script>
<?php include('footer.php'); ?>
Zerion Mini Shell 1.0