Untitled
unknown
plain_text
a year ago
4.4 kB
5
Indexable
const body = ` <!DOCTYPE html> <html lang="zxx"> <head> <title>SnapEzee - Invoice</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta charset="UTF-8"> <style> /* Inline styles for consistent rendering */ body { font-family: Arial, sans-serif; font-size: 14px; margin: 0; padding: 0; } table { border-collapse: collapse; width: 100%; } th, td { border-bottom: 1px solid #dddddd; text-align: left; padding: 10px; } th { background: #29aaff; color: #fff; } </style> </head> <body> <!-- Invoice --> <div style="max-width: 768px; margin: auto; padding: 10px 0;"> <!-- Header --> <div style="text-align: center;"> <!-- <img src="./logo.png" alt="logo" style="width: 80px; height: 80px;"> --> <h1 style="font-size: 22px; font-weight: 700; margin: 5px 0;">Snap<span style="color: #29aaff;">Ezee</span></h1> </div> <!-- Invoice Details --> <div style="text-align: center; padding: 20px 0;"> <h2 style="font-size: 19px; font-weight: 700; margin: 10px 0;">Invoice</h2> <div style="text-align: left; margin: auto; width: fit-content;"> <h4 style="margin: 5px 0;">Invoice Number: <strong>${savedOrder?.orderNumber}</strong></p> <h4 style="margin: 5px 0;">Invoice Date: <strong>${savedOrder?.createdAt}</strong></p> </div> </div> <!-- Invoice To/From --> <div style="display: flex; justify-content: space-between; gap:10px; padding: 0 10px;"> <!-- Invoice To --> <div style="width: 50%;"> <h4 style="font-size: 15px; opacity: 0.9;">Invoice To</h4> <h2 style="font-size: 18px; font-weight: 600; margin: 5px 0;">${mobileUser?.name}</h2> <p style="margin: 5px 0; color: white;"> ${mobileUser?.email} <br> ${address?.addresses[0]?.address}, ${address?.addresses[0]?.state}, ${address?.addresses[0]?.city}, ${address?.addresses[0]?.country}</p> </div> <!-- Invoice From --> <div> <h4 style="font-size: 15px; opacity: 0.9;">Invoice From</h4> <h2 style="font-size: 18px; font-weight: 600; margin: 5px 0;">Animas Roky</h2> <p style="margin: 5px 0; color: white">Apexo Inc <br> info@snapzee.com </div> </div> <!-- Invoice Items --> <div style="padding: 10px;"> <table style="width : 100%"> <!-- Table Header --> <thead> <tr> <th>No.</th> <th>Item Description</th> <th>Quantity</th> <th>Price</th> <th></th> </tr> </thead> <!-- Table Body --> <tbody> ${items?.map((item, index) => (` <tr> <td>${index + 1}</td> <td>${documentNames[index]}</td> <td>${item.quantity}</td> <td>${item.amountPerItem}</td> </tr> `)).join('')} <tr> <td colspan="3" style="text-align: right;">SubTotal</td> <td>${savedOrder?.subtotal}</td> </tr> <tr> <td colspan="3" style="text-align: right;">Tax</td> <td>${savedOrder?.vatAmount}</td> </tr> <tr> <td colspan="3" style="text-align: right;">Grand Total</td> <td>${savedOrder?.total}</td> </tr> </tbody> </table> </div> <!-- Footer --> <div style="background-color: #29aaff; color: white; text-align: center; margin-left: 10px; margin-right: 10px; margin-top: 10px; padding: 10px 0; width: 100%"> <span style="color:#fff">info@snapzee.com</span> </div> </div> </body> </html> `;
Editor is loading...
Leave a Comment