fixing observationPage form fields to pdf. got lost when m$ closed hotmail
This commit is contained in:
parent
9cffd50a5f
commit
2b04df51c0
Binary file not shown.
|
|
@ -21,6 +21,9 @@ const dd = createDebugLogger(true, "dd"); // code function at bottom of the page
|
|||
|
||||
// Wrapper function to fetch, update, and download PDF
|
||||
async function processAndDownloadPdf(filePath, ...dataSources) {
|
||||
|
||||
dd(`Loaded PDF Template: ${filePath.value}`)
|
||||
|
||||
try {
|
||||
const pdfBytes = await fetchPdfBytes(filePath);
|
||||
const updatedPdfBytes = await updatePdfFields(pdfBytes, dataSources);
|
||||
|
|
@ -56,26 +59,30 @@ async function updatePdfFields(
|
|||
dataSources,
|
||||
skipMissingFields = true
|
||||
) {
|
||||
console.log("Datasource size:", dataSources.length)
|
||||
try {
|
||||
const pdfDoc = await PDFLib.PDFDocument.load(pdfBytes);
|
||||
const form = pdfDoc.getForm();
|
||||
|
||||
dataSources.forEach((dataSource) => {
|
||||
console.log("Current Datasource", dataSource)
|
||||
dataSource.forEach((record) => {
|
||||
Object.entries(record).forEach(([fieldName, fieldValue]) => {
|
||||
|
||||
console.log("Working in: ", record)
|
||||
Object.entries(record).forEach(([fieldName, fieldValue]) => {
|
||||
dd(`Field: ${fieldName} Value: ${fieldValue}`) //debugger
|
||||
try {
|
||||
const formField = form.getTextField(fieldName);
|
||||
if (formField) {
|
||||
console.info(`Field "${fieldName}" OK`);
|
||||
dd(fieldName, "-->", fieldValue);
|
||||
// console.info(`Field "${fieldName}" OK`);
|
||||
dd(`${fieldName} --> ${fieldValue} OK`);
|
||||
formField.setText(String(fieldValue));
|
||||
} else if (!skipMissingFields) {
|
||||
//dd(`Skipping Field: ${fieldName} NOT FOUND`)
|
||||
console.warn(`Field "${fieldName}" not found.`);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(`Error updating field "${fieldName}":`, err);
|
||||
console.error(`Error updating field "${fieldName}":`); //console.error(`Error updating field "${fieldName}":`, err);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Untitled Document</title>
|
||||
<!-- New Wappler Page -->
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -52,12 +52,12 @@
|
|||
<link rel="stylesheet" href="/dmxAppConnect/dmxNotifications/dmxNotifications.css" />
|
||||
<script src="/dmxAppConnect/dmxNotifications/dmxNotifications.js" defer></script>
|
||||
|
||||
<script src="/dmxAppConnect/dmxDatePicker/daterangepicker.min.js" defer></script>
|
||||
<link rel="stylesheet" href="/dmxAppConnect/dmxDatePicker/dmxDatePicker.css" />
|
||||
<script src="/dmxAppConnect/dmxDatePicker/dmxDatePicker.js" defer></script>
|
||||
<!--<script src="/dmxAppConnect/dmxDatePicker/daterangepicker.min.js" defer></script>-->
|
||||
<!--<link rel="stylesheet" href="/dmxAppConnect/dmxDatePicker/dmxDatePicker.css" />-->
|
||||
<!--<script src="/dmxAppConnect/dmxDatePicker/dmxDatePicker.js" defer></script>-->
|
||||
|
||||
|
||||
<link rel="stylesheet" href="/dmxAppConnect/dmxDatePicker/bgthemes/bootstrap.css" />
|
||||
<!--<link rel="stylesheet" href="/dmxAppConnect/dmxDatePicker/bgthemes/bootstrap.css" />-->
|
||||
<script src="https://cdn.jsdelivr.net/npm/pouchdb@8.0.1/dist/pouchdb.min.js" defer></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/pouchdb@8.0.1/dist/pouchdb.find.min.js" defer></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/pouchdb@8.0.1/dist/pouchdb.indexeddb.min.js" defer></script>
|
||||
|
|
@ -67,7 +67,7 @@
|
|||
<script src="/dmxAppConnect/dmxLazyLoad/lazysizes.min.js" defer></script>
|
||||
<script src="/dmxAppConnect/dmxBootstrap5Alert/dmxBootstrap5Alert.js" defer></script>
|
||||
<script src="/dmxAppConnect/dmxBootstrap5Collapse/dmxBootstrap5Collapse.js" defer></script>
|
||||
<link rel="stylesheet" href="/dmxAppConnect/dmxDatePicker/daterangepicker.min.css" />
|
||||
<!--<link rel="stylesheet" href="/dmxAppConnect/dmxDatePicker/daterangepicker.min.css" />-->
|
||||
</head>
|
||||
|
||||
<body is="dmx-app" id="main">
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<!-- Wappler include head-page="layouts/main" fontawesome_5="cdn" bootstrap5="local" is="dmx-app" id="observationPage" appConnect="local" components="{dmxBootstrap5TableGenerator:{},dmxMasonry:{},dmxFormatter:{},dmxBootstrap5Popovers:{},dmxBootstrap5Toasts:{},dmxDataTraversal:{},dmxStateManagement:{},dmxDatastore:{},dmxValidator:{},dmxBootstrap5Offcanvas:{},dmxBootstrap5Modal:{},dmxBootstrap5Navigation:{},dmxBootstrap5Tooltips:{},dmxBootbox5:{},dmxNotifications:{},dmxPouchDB:{},dmxBootstrap5Alert:{},dmxBootstrap5Collapse:{},dmxDatePicker:{}}" jquery_slim_35="cdn" moment_2="cdn" -->
|
||||
<!-- Wappler include head-page="layouts/main" fontawesome_5="cdn" bootstrap5="local" is="dmx-app" id="observationPage" appConnect="local" components="{dmxBootstrap5TableGenerator:{},dmxMasonry:{},dmxFormatter:{},dmxBootstrap5Popovers:{},dmxBootstrap5Toasts:{},dmxDataTraversal:{},dmxStateManagement:{},dmxDatastore:{},dmxValidator:{},dmxBootstrap5Offcanvas:{},dmxBootstrap5Modal:{},dmxBootstrap5Navigation:{},dmxBootstrap5Tooltips:{},dmxBootbox5:{},dmxNotifications:{},dmxPouchDB:{},dmxBootstrap5Alert:{},dmxBootstrap5Collapse:{}}" jquery_slim_35="cdn" moment_2="cdn" -->
|
||||
<script is="dmx-flow" id="minCalc" type="text/dmx-flow">{
|
||||
runJS: {
|
||||
name: "CalculateMinutes",
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.9.1/jquery.timepicker.min.js" integrity="sha512-+UV/u4sqwTpgK0d4vvTjan+ofWGwgTX9VkhLPKbRIQSolA4L8JmtJRk2zkh7Pv9ZtBQELMQury9Qf5RSA40N5g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
|
||||
<dmx-json-datasource id="dspListJson" is="dmx-serverconnect" url="/DSPlist.json"></dmx-json-datasource>
|
||||
<dmx-value id="ertTemplatePath" dmx-bind:value="'/PDF/ertff_template_1.pdf'"></dmx-value>
|
||||
<dmx-value id="ertTemplatePath" dmx-bind:value="'/PDF/Template-EDV-ERT_v4.1.pdf'"></dmx-value>
|
||||
<div class="modal" id="saveObservationResults" is="dmx-bs5-modal" tabindex="-1">
|
||||
<div class="modal-dialog modal-lg" role="document">
|
||||
<div class="modal-content">
|
||||
|
|
@ -71,8 +71,8 @@
|
|||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-primary">Save changes</button>
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="button" class="btn btn-primary" dmx-on:click="processPDF.run()">Download PDF</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -140,7 +140,9 @@
|
|||
args: [
|
||||
"{{ertTemplatePath.value}}",
|
||||
"{{datastore1.data}}",
|
||||
"{{data_view1.data}}"
|
||||
"{{data_view1.data}}",
|
||||
"{{saveObservationResults.form2.getStartTime.value}}",
|
||||
"{{saveObservationResults.form2.getEndTime.value}}"
|
||||
]
|
||||
}
|
||||
}</script>
|
||||
|
|
@ -294,7 +296,6 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<input id="text3" name="text3" type="text" class="form-control" is="dmx-date-picker" showdropdowns="true" timepicker="" minutes-increment="5">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -362,9 +363,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<textarea id="text2" class="form-control"></textarea>
|
||||
</div>
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
|
|
@ -392,6 +390,28 @@
|
|||
</table>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-sm">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>$id</th>
|
||||
<th>Db full name</th>
|
||||
<th>Db license number</th>
|
||||
<th>Db state name</th>
|
||||
<th>Db employee</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="datastore1.data" id="tableRepeat5">
|
||||
<tr>
|
||||
<td dmx-text="$id"></td>
|
||||
<td dmx-text="db_fullName"></td>
|
||||
<td dmx-text="db_licenseNumber"></td>
|
||||
<td dmx-text="db_stateName"></td>
|
||||
<td dmx-text="db_employeeID"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="container" id="DS">
|
||||
<div class="row">
|
||||
<header class="text-center">
|
||||
|
|
|
|||
Loading…
Reference in New Issue