インボイス PHP・MySQL to PDF
2025年1月2日
WEB入力画面
PDF出力
index.php
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.slim.min.js"></script>
<!-- Popper JS -->
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
<!-- -->
<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script src="https://code.jquery.com/ui/1.14.1/jquery-ui.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/i18n/jquery.ui.datepicker-ja.min.js"></script>
<title>Document</title>
</head>
<body>
<div class="container pt-5">
query($sql)){
$sid=$con->insert_id;
$sql2="insert into invoice_products (sid,pname,price,qty,total) values ";
$rows=[];
for ($i=0; $iquery($sql2)) {
echo "請求書追加しました。click";
}else{
echo "請求書追加失敗した。";
}
}else{
echo "請求書追加失敗した。";
}
}
?>
<form action="index.php" method="POST" autocomplete="off">
<div class="row">
<div class="col-md-4">
<h5 class="text-success">請求書の詳細</h5>
<div class="form-group">
<label>請求書No</label>
<input type="text" name="invoice_no" class="form-control">
</div>
<div class="form-group">
<label>請求書日時</label>
<input type="text" name="invoice_date"id="date" class="form-control">
</div>
</div>
<div class="col-md-8">
<h5 class="text-success">お客様情報</h5>
<div class="form-group">
<label>お名前</label>
<input type="text" name="cname" class="form-control">
</div>
<div class="form-group">
<label>住所</label>
<input type="text" name="caddress" class="form-control">
</div>
<div class="form-group">
<label>建物名</label>
<input type="text" name="ccity" class="form-control">
</div>
</div>
<div class="row">
<div class="col-md-12">
<h5 class="text-success">商品の詳細</h5>
<table class="table table-bordered">
<thead>
<tr>
<th>商品</th>
<th>価格 [税抜き]</th>
<th>数量</th>
<th>小合計 [消費税10％含む]</th>
<th>実行</th>
</tr>
</thead>
<tbody id="product_tbody">
<tr>
<td><input type="text" name="pname[]" required class="form-control"></td>
<td><input type="text" name="price[]" required class="form-control price"></td>
<td><input type="text" name="qty[]" required class="form-control qty"></td>
<td><input type="text" name="total[]" required class="form-control total"></td>
<td><input type="button" value="x" class="btn btn-danger btn-sm btn-row-remove"></td>
</tr>
</tbody>
<tfoot>
<tr>
<td><input type="button" value="+ 行追加" class="btn btn-primary btn-sm" id="btn-add-row"></td>
<td colspan="2" class="text-right">税込み金額</td>
<td><input type="text" name="grand_total" id="grand_total" required class="form-control"></td>
</tr>
</tfoot>
</table>
<input type="submit" value="請求書保存" name="submit" class="btn btn-success float-right">
</div>
</div>
</div>
</form>
</div>
<script>
$(document).ready(function(){
$("#date").datepicker({
dateFormat:"yy-mm-dd"
});
$("#btn-add-row").click(function(){
var row='<tr><td><input type="text" name="pname[]" required class="form-control"></td><td><input type="text" name="price[]" required class="form-control price"></td><td><input type="text" name="qty[]" required class="form-control qty"></td><td><input type="text" name="total[]" required class="form-control total"></td><td><input type="button" value="x" class="btn btn-danger btn-sm btn-row-remove"></td></tr>'
$("#product_tbody").append(row);
});
$("body").on("click",".btn-row-remove",function(){
if(confirm("削除しますか?")) {
$(this).closest("tr").remove();
grand_total();
}
});
$("body").on("keyup",".price",function(){
var price=Number($(this).val());
var qty=Number($(this).closest("tr").find(".qty").val());
$(this).closest("tr").find(".total").val(price*qty);
grand_total();
});
$("body").on("keyup",".qty",function(){
var qty=Number($(this).val());
var price=Number($(this).closest("tr").find(".price").val());
$(this).closest("tr").find(".total").val(Math.round(price*(qty*1.1)));
grand_total();
});
function grand_total(){
var tot=0;
$(".total").each(function(){
tot+=Number($(this).val());
});
$("#grand_total").val(tot);
}
});
</script>
</body>
</html>
PDFコンバート
