Hinzufügen von Beschriftungen mit schreibgeschütztem PSPDF Kit-Textformularfeld. Statische PSPDF-Kit-Instanz erstellt.

This commit is contained in:
Developer 02 2024-07-05 17:15:51 +02:00
parent b3b2baf0e4
commit 8eefd94569
5 changed files with 125 additions and 26 deletions

View File

@ -15,7 +15,7 @@
"Default": "Server=SDD-VMP04-SQL17\\DD_DEVELOP01;Database=DD_ECM;User Id=sa;Password=dd;Encrypt=false;TrustServerCertificate=True;"
},
"AdminPassword": "dd",
"PSPDFKitLicenseKey_SignFlow": "y8VgCpBgUfNlpKJZC-GwjpPs-S-KFBHv4RywfHbqpBAbO0XxRuWDaMGZtIaMrXBDlndlJLk---Ve93xjI_ZR4sbFymf4Ot97yTYUMeDdL2LYXhspkEnSAtkXf9zqepNL1v_0DMibjpqXFQMkVB1y3D5xdnOg-iJuCCZEMhZ780qg04_H_nmx63uSgxjN0GJxC8YvsbnRcUZ2l_idImMvWL0HMqB5B7oEpNenasA0RK0uapFRTa7NIQok0phpTHZYKB4qvj7od2yxlytGB7qBl4-lwT70DSQ9mrLkCWbuzZ9cV9D8fDzdFXr6WoZdOYpkrUadRbsy2bhPq_ukxszDWN4JGhebo0XKUK_YfgvSlS7lFOxHNblHeC9B7gZ8T-VuQ_z1QA2JYRf1dmhSuclnW00diShIg-N0I79PWGsQE4j40XtVpyWcN9uT9hMuiRpL0LzHV4YgsgBrgKgs_moqL7f0L4-MwaS25Dx4Wcz4ttKaerLavwMM4CJHI3DNqTC5UUEG6EViFxBQtrmuAS7kiw2nWjvXO7kUA24NARtsRCphjWE4l6wSMdh7kpqhfbV7_hdb5xXYGALNPkv8En6zPpFIew8DDcOH9dgxfKMI34LLhkEWqovZW_7fXNJTEIHVpR0DSPbZrmyEwkECnbDcNzjyFk2M1fzstJj_dSotyZvS57XJK2DgojbRgXL9pncs",
"PSPDFKitLicenseKey": "SXCtGGY9XA-31OGUXQK-r7c6AkdLGPm2ljuyDr1qu0kkhLvydg-Do-fxpNUF4Rq3fS_xAnZRNFRHbXpE6sQ2BMcCSVTcXVJO6tPviexjpiT-HnrDEySlUERJnnvh-tmeOWprxS6BySPnSILkmaVQtUfOIUS-cUbvvEYHTvQBKbSF8di4XHQFyfv49ihr51axm3NVV3AXwh2EiKL5C5XdqBZ4sQ4O7vXBjM2zvxdPxlxdcNYmiU83uAzw7B83O_jubPzya4CdUHh_YH7Nlp2gP56MeG1Sw2JhMtfG3Rj14Sg4ctaeL9p6AEWca5dDjJ2li5tFIV2fQSsw6A_cowLu0gtMm5i8IfJXeIcQbMC2-0wGv1oe9hZYJvFMdzhTM_FiejM0agemxt3lJyzuyP8zbBSOgp7Si6A85krLWPZptyZBTG7pp7IHboUHfPMxCXqi-zMsqewOJtQBE2mjntU-lPryKnssOpMPfswwQX7QSkJYV5EMqNmEhQX6mEkp2wcqFzMC7bJQew1aO4pOpvChUaMvb1vgRek0HxLag0nwQYX2YrYGh7F_xXJs-8HNwJe8H0-eW4x4faayCgM5rB5772CCCsD9ThZcvXFrjNHHLGJ8WuBUFm6LArvSfFQdii_7j-_sqHMpeKZt26NFgivj1A==",
"UseCSPInDev": false,
"Content-Security-Policy": [ // The first format parameter {0} will be replaced by the nonce value.
"default-src 'self'",
@ -118,6 +118,6 @@
"SendingProfile": 1,
"AddedWho": "DDEnvelopGenerator",
"ReminderTypeId": 202377,
"EmailAttmt1" : ""
"EmailAttmt1": ""
}
}

View File

@ -1,9 +1,9 @@
class Annotation {
static async createAnnotations(document) {
static async createAnnotations(document, instance) {
const signatures = []
for(var element of document.elements){
const [annotation, formField, annotation_date, formFieldDate, annotation_postcode, formFieldPostcode, annotation_city, formFieldCity] = await Annotation.createSignature(element)
for (var element of document.elements) {
const [annotation, formField, annotation_date, formFieldDate, annotation_postcode, formFieldPostcode, annotation_city, formFieldCity, annotation_date_label, formFieldDateLabel, annotation_postcode_label, formFieldPostcodeLabel, annotation_city_label, formFieldCityLabel] = await Annotation.createSignature(element)
signatures.push(annotation)
signatures.push(formField)
signatures.push(annotation_date)
@ -12,9 +12,18 @@
signatures.push(formFieldPostcode)
signatures.push(annotation_city)
signatures.push(formFieldCity)
signatures.push(annotation_date_label)
signatures.push(formFieldDateLabel)
signatures.push(annotation_postcode_label)
signatures.push(formFieldPostcodeLabel)
signatures.push(annotation_city_label)
signatures.push(formFieldCityLabel)
}
return [...signatures ]
await instance.create(signatures)
}
static async createSignature(element) {
@ -45,6 +54,10 @@
annotationIds: PSPDFKit.Immutable.List([annotation.id]),
})
/**
* Date, post code and place text form part
*/
const date_place_top_shift = 16
//date
const id_date = PSPDFKit.generateInstantId()
const annotation_date = new PSPDFKit.Annotations.WidgetAnnotation({
@ -56,17 +69,17 @@
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.75,
height: height / 2,
top: top + height + 25,
top: top + height + 25 + date_place_top_shift,
left: left - width * .25,
}),
fontSize:8,
fontSize: 8,
additionalActions: {
onFormat: new PSPDFKit.Actions.JavaScriptAction({
script: `AFDate_FormatEx("dd/mm/yyyy")`,
}),
onFormat: new PSPDFKit.Actions.JavaScriptAction({
script: `AFDate_FormatEx("dd/mm/yyyy")`,
}),
}
})
const formFieldDate = new PSPDFKit.FormFields.TextFormField({
name: id_date,
annotationIds: PSPDFKit.Immutable.List([annotation_date.id]),
@ -85,12 +98,12 @@
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.45,
height: height / 2,
top: top + height + 25,
top: top + height + 25 + date_place_top_shift,
left: left - width * .25 + width * 0.80,
}),
fontSize:8
fontSize: 8
})
const formFieldPostcode = new PSPDFKit.FormFields.TextFormField({
name: id_postcode,
annotationIds: PSPDFKit.Immutable.List([annotation_postcode.id]),
@ -109,19 +122,104 @@
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.75,
height: height / 2,
top: top + height + 25,
top: top + height + 25 + date_place_top_shift,
left: left - width * .25 + width * 1.30,
}),
fontSize:8
fontSize: 8
})
const formFieldCity = new PSPDFKit.FormFields.TextFormField({
name: id_city,
annotationIds: PSPDFKit.Immutable.List([annotation_city.id]),
value: location.city
value: location.city,
})
return [annotation, formField, annotation_date, formFieldDate, annotation_postcode, formFieldPostcode, annotation_city, formFieldCity]
/**
* Date, post code and place label part
*/
const label_top_shift = -15
//date label
const id_date_label = PSPDFKit.generateInstantId()
const annotation_date_label = new PSPDFKit.Annotations.WidgetAnnotation({
id: id_date_label,
pageIndex: page,
formFieldName: id_date_label,
blendMode: 'multiply',
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.75,
height: height / 2,
top: top + height + 25 + label_top_shift + date_place_top_shift,
left: left - width * .25,
}),
fontSize: 8,
backgroundColor: PSPDFKit.Color.TRANSPARENT,
fontColor: PSPDFKit.Color.Black,
isBold: true,
required: true
})
const formFieldDateLabel = new PSPDFKit.FormFields.TextFormField({
name: id_date_label,
annotationIds: PSPDFKit.Immutable.List([annotation_date_label.id]),
value: "Date",
readOnly: true
})
//postcode label
const id_postcode_label = PSPDFKit.generateInstantId()
const annotation_postcode_label = new PSPDFKit.Annotations.WidgetAnnotation({
id: id_postcode_label,
pageIndex: page,
formFieldName: id_postcode_label,
blendMode: 'multiply',
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.45,
height: height / 2,
top: top + height + 25 + label_top_shift + date_place_top_shift,
left: left - width * .25 + width * 0.80,
}),
fontSize: 8,
backgroundColor: PSPDFKit.Color.TRANSPARENT,
fontColor: PSPDFKit.Color.Black,
isBold: true,
required: true
})
const formFieldPostcodeLabel = new PSPDFKit.FormFields.TextFormField({
name: id_postcode_label,
annotationIds: PSPDFKit.Immutable.List([annotation_postcode_label.id]),
value: "PLZ",
readOnly: true
})
//city label
const id_city_label = PSPDFKit.generateInstantId()
const annotation_city_label = new PSPDFKit.Annotations.WidgetAnnotation({
id: id_city_label,
pageIndex: page,
formFieldName: id_city_label,
blendMode: 'multiply',
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.75,
height: height / 2,
top: top + height + 25 + label_top_shift + date_place_top_shift,
left: left - width * .25 + width * 1.30,
}),
fontSize: 8,
backgroundColor: PSPDFKit.Color.TRANSPARENT,
fontColor: PSPDFKit.Color.Black,
isBold: true,
})
const formFieldCityLabel = new PSPDFKit.FormFields.TextFormField({
name: id_city_label,
annotationIds: PSPDFKit.Immutable.List([annotation_city_label.id]),
value: "Ort",
readOnly: true
})
return [annotation, formField, annotation_date, formFieldDate, annotation_postcode, formFieldPostcode, annotation_city, formFieldCity, annotation_date_label, formFieldDateLabel, annotation_postcode_label, formFieldPostcodeLabel, annotation_city_label, formFieldCityLabel]
}
static createTextBox(element) {
@ -176,7 +274,7 @@
const pageAnnotations = allAnnotations.filter(Annotation.isSignature)
//deleting all Annotations
return await instance.delete(pageAnnotations)
}
}
static async validateAnnotations(instance) {
const allAnnotations = await Annotation.getAnnotations(instance)
@ -211,7 +309,7 @@
const canvas = document.createElement('canvas')
const scale = 4
const fontSize = 10
canvas.width = width * scale
canvas.height = height * scale

View File

@ -70,8 +70,7 @@ class App {
// Load annotations into PSPDFKit
try {
this.signatureCount = this.currentDocument.elements.length
const annotations = await Annotation.createAnnotations(this.currentDocument)
await this.Instance.create(annotations)
await Annotation.createAnnotations(this.currentDocument, this.Instance)
const openResponse = await this.Network.openDocument(this.envelopeKey)

View File

@ -14,8 +14,9 @@
// Load the PSPDFKit UI by setting a target element as the container to render in
// and a arraybuffer which represents the document that should be displayed.
static Instance
static loadPSPDFKit(arrayBuffer, container, licenseKey, locale) {
return PSPDFKit.load({
UI.Instance = PSPDFKit.load({
locale: locale,
licenseKey: licenseKey,
styleSheets: ['/css/site.css'],
@ -43,6 +44,8 @@
Annotation: UI.annotationRenderer,
},
})
return UI.Instance;
}
static configurePSPDFKit(instance, handler) {

View File

@ -52,6 +52,5 @@ function locale_date_dd_mm_yyyy() {
const day = String(today.getDate()).padStart(2, '0');
const month = String(today.getMonth() + 1).padStart(2, '0');
const year = String(today.getFullYear()).slice(-4);
console.log(`${day}/${month}/${year}`)
return `${day}/${month}/${year}`;
}