{"id":448,"date":"2025-05-13T09:07:21","date_gmt":"2025-05-13T09:07:21","guid":{"rendered":"https:\/\/preambletechnologies.com\/?page_id=448"},"modified":"2025-05-15T07:22:06","modified_gmt":"2025-05-15T07:22:06","slug":"invoice","status":"publish","type":"page","link":"https:\/\/preambletechnologies.com\/index.php\/invoice\/","title":{"rendered":"Invoice"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"UTF-8\">\n   <style>\n    body {\n      font-family: Arial, sans-serif;\n      margin: 40px;\n    }\n\n    h1, h2 {\n      text-align: center;\n    }\n\n    .section {\n      margin-bottom: 25px;\n    }\n\n    label {\n      font-weight: bold;\n      display: block;\n      margin-top: 10px;\n    }\n\n    input, textarea {\n      width: 100%;\n      padding: 6px;\n      font-size: 14px;\n      border: none;\n      border-bottom: 1px solid #000;\n      margin-bottom: 10px;\n    }\n\n    table {\n      width: 100%;\n      border-collapse: collapse;\n      margin-top: 10px;\n    }\n\n    th, td {\n      border: 1px solid #000;\n      padding: 8px;\n      text-align: center;\n      font-size: 14px;\n    }\n\n    .total-section {\n      margin-top: 20px;\n    }\n\n    .total-label {\n      font-weight: bold;\n      font-size: 16px;\n    }\n\n    .button {\n      display: inline-block;\n      margin: 20px 10px;\n      padding: 10px 20px;\n      font-size: 16px;\n      background-color: #007BFF;\n      color: white;\n      border: none;\n      cursor: pointer;\n      border-radius: 5px;\n    }\n\n    .button:hover {\n      background-color: #0056b3;\n    }\n  <\/style>\n<\/head>\n<body>\n\n  <div id=\"invoice\">\n    <h1>INVOICE<\/h1>\n\n    <div class=\"section\">\n      <label>Invoice Created By:<\/label>\n      <input type=\"text\" placeholder=\"Your Name or Company\">\n\n      <label>Invoice For:<\/label>\n      <input type=\"text\" placeholder=\"Customer Name\">\n\n      <label>Date:<\/label>\n      <input type=\"text\" placeholder=\"DD-MM-YYYY\">\n\n      <label>Invoice Number:<\/label>\n      <input type=\"text\" placeholder=\"e.g. 154\">\n    <\/div>\n\n    <h2>Invoice Items<\/h2>\n    <table>\n      <thead>\n        <tr>\n          <th>S.No<\/th>\n          <th>Product \/ Service<\/th>\n          <th>Amount (\u20b9)<\/th>\n          <th>GST (%)<\/th>\n          <th>GST Amount (\u20b9)<\/th>\n          <th>Total (\u20b9)<\/th>\n        <\/tr>\n      <\/thead>\n      <tbody>\n        <tr>\n          <td>1<\/td>\n          <td><input type=\"text\" placeholder=\"e.g., Aprons\"><\/td>\n          <td><input type=\"text\" placeholder=\"1850.00\"><\/td>\n          <td><input type=\"text\" placeholder=\"5\"><\/td>\n          <td><input type=\"text\" placeholder=\"88.10\"><\/td>\n          <td><input type=\"text\" placeholder=\"1938.10\"><\/td>\n        <\/tr>\n        <tr>\n          <td>2<\/td>\n          <td><input type=\"text\" placeholder=\"e.g., Aprons\"><\/td>\n          <td><input type=\"text\" placeholder=\"6500.00\"><\/td>\n          <td><input type=\"text\" placeholder=\"5\"><\/td>\n          <td><input type=\"text\" placeholder=\"309.52\"><\/td>\n          <td><input type=\"text\" placeholder=\"6809.52\"><\/td>\n        <\/tr>\n<tr>\n          <td>3<\/td>\n          <td><input type=\"text\" placeholder=\"e.g., Tshirts\"><\/td>\n          <td><input type=\"text\" placeholder=\"1100.00\"><\/td>\n          <td><input type=\"text\" placeholder=\"5\"><\/td>\n          <td><input type=\"text\" placeholder=\"80\"><\/td>\n          <td><input type=\"text\" placeholder=\"1200.00\"><\/td>\n        <\/tr>\n<tr>\n          <td>4<\/td>\n          <td><input type=\"text\" placeholder=\"e.g., Tshirts\"><\/td>\n          <td><input type=\"text\" placeholder=\"1100.00\"><\/td>\n          <td><input type=\"text\" placeholder=\"5\"><\/td>\n          <td><input type=\"text\" placeholder=\"80\"><\/td>\n          <td><input type=\"text\" placeholder=\"1200.00\"><\/td>\n        <\/tr>\n<tr>\n          <td>5<\/td>\n          <td><input type=\"text\" placeholder=\"e.g., Tshirts\"><\/td>\n          <td><input type=\"text\" placeholder=\"1100.00\"><\/td>\n          <td><input type=\"text\" placeholder=\"5\"><\/td>\n          <td><input type=\"text\" placeholder=\"80\"><\/td>\n          <td><input type=\"text\" placeholder=\"1200.00\"><\/td>\n        <\/tr>\n      <\/tbody>\n    <\/table>\n\n    <div class=\"total-section\">\n      <label class=\"total-label\">Total Invoice Amount (\u20b9):<\/label>\n      <input type=\"text\" placeholder=\"8747.62\">\n\n      <label>Amount in Words:<\/label>\n      <textarea rows=\"2\" placeholder=\"Eight thousand seven hundred forty-seven rupees and sixty-two paise only.\"><\/textarea>\n    <\/div>\n\n    <div class=\"section\">\n      <label>Authorized Signature:<\/label>\n      <input type=\"text\" placeholder=\"Sign here\">\n    <\/div>\n  <\/div>\n\n  <button class=\"button\" onclick=\"generatePDF()\">Download PDF<\/button>\n\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/html2canvas\/1.4.1\/html2canvas.min.js\"><\/script>\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\n\n  <script>\n    async function generatePDF() {\n      const { jsPDF } = window.jspdf;\n\n      \/\/ Scroll to top to make sure all content is visible\n      window.scrollTo(0, 0);\n\n      \/\/ Convert the visible invoice to canvas\n      const canvas = await html2canvas(document.querySelector(\"#invoice\"), {\n        scale: 2,\n        useCORS: true\n      });\n\n      const imgData = canvas.toDataURL(\"image\/jpeg\", 1.0);\n      const pdf = new jsPDF('p', 'mm', 'a4');\n\n      const imgProps = pdf.getImageProperties(imgData);\n      const pdfWidth = pdf.internal.pageSize.getWidth();\n      const pdfHeight = (imgProps.height * pdfWidth) \/ imgProps.width;\n\n      pdf.addImage(imgData, 'JPEG', 0, 0, pdfWidth, pdfHeight);\n      pdf.save(\"invoice.pdf\");\n    }\n  <\/script>\n\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>INVOICE Invoice Created By: Invoice For: Date: Invoice Number: Invoice Items S.No Product \/ Service Amount (\u20b9) GST (%) GST [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-448","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/preambletechnologies.com\/index.php\/wp-json\/wp\/v2\/pages\/448","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/preambletechnologies.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/preambletechnologies.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/preambletechnologies.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/preambletechnologies.com\/index.php\/wp-json\/wp\/v2\/comments?post=448"}],"version-history":[{"count":15,"href":"https:\/\/preambletechnologies.com\/index.php\/wp-json\/wp\/v2\/pages\/448\/revisions"}],"predecessor-version":[{"id":467,"href":"https:\/\/preambletechnologies.com\/index.php\/wp-json\/wp\/v2\/pages\/448\/revisions\/467"}],"wp:attachment":[{"href":"https:\/\/preambletechnologies.com\/index.php\/wp-json\/wp\/v2\/media?parent=448"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}