Die Datei „api-service.js“ für HTTP-Anfragen erstellt. HTTP-POST-Anforderung erstellt, um die generierten Umschläge zurückzuweisen.

EnvelopeGenerator.Web/Controllers/EnvelopeController.cs

@@ -153,4 +153,4 @@ namespace EnvelopeGenerator.Web.Controllers
             }
         }
     }
-}
+}

EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml

@@ -17,7 +17,7 @@
     var sender = Model.Envelope?.User;
     var pages = document?.Elements?.Select(e => e.Page) ?? Array.Empty<int>();
     var stPageIndexes = string.Join(pages.Count() > 1 ? ", " : "", pages.Take(pages.Count() - 1))
-                  + (pages.Count() > 1 ? " und " : "") + pages.LastOrDefault();
+                  + (pages.Count() > 1 ? $" {_localizer[WebKey.and].TrySanitize(_sanitizer)} " : "") + pages.LastOrDefault();
 }
 <div class="d-flex flex-column min-vh-100">
     <nav class="navbar navbar-light bg-light">
@@ -25,7 +25,7 @@
             <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarToggleExternalContent" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation">
                 <span class="navbar-toggler-icon"></span>
             </button>
-            <div class="navbar-brand me-auto ms-5 envelope-message">@($"Hallo {Model.Name.TrySanitize(_sanitizer)}, {@envelope?.Message.TrySanitize(_sanitizer)}")</div>
+            <div class="navbar-brand me-auto ms-5 envelope-message">@($"{_localizer[WebKey.Hello]} {Model.Name}, {@envelope?.Message}".TrySanitize(_sanitizer))</div>
             <div class="col-1  p-0 m-0 me-3 d-flex">
                 <img src="~/img/digital_data.svg" alt="...">
             </div>
@@ -46,7 +46,7 @@
                                 envelope?.Title.TryEncode(_encoder), 
                                 sender?.Prename.TryEncode(_encoder), 
                                 sender?.Name.TryEncode(_encoder), 
-                                sender?.Email.TryEncode(_encoder)))</small></p>
+                                sender?.Email.TryEncode(_encoder)).TrySanitize(_sanitizer))</small></p>
                         </div>
                     </div>
                 </div>

EnvelopeGenerator.Web/Views/Shared/_Layout.cshtml

@@ -1,5 +1,6 @@
 @using DigitalData.Core.API
 @using Newtonsoft.Json
+@using Newtonsoft.Json.Serialization
 @{
     var nonce = _accessor.HttpContext?.Items["csp-nonce"] as string;
 }
@@ -27,19 +28,23 @@
     <script src="~/lib/pspdfkit/pspdfkit.js" asp-append-version="true"></script>
     <script src="~/lib/bootstrap-cookie-consent-settings-main/bootstrap-cookie-consent-settings.js" asp-append-version="true"></script>
     <script src="~/js/util.js" asp-append-version="true"></script>
-    <script src="~/js/api.js" asp-append-version="true"></script>
+    <script src="~/js/api-service.js" asp-append-version="true"></script>
     @await RenderSectionAsync("Scripts", required: false)
     @{
-        var lStrsJson = JsonConvert.SerializeObject(_localizer.ToDictionary()).TrySanitize(_sanitizer);
+        var settings = new JsonSerializerSettings
+        {
+            ContractResolver = new CamelCasePropertyNamesContractResolver()
+        };
+        var lStrsJson = JsonConvert.SerializeObject(_localizer.ToDictionary(), settings).TrySanitize(_sanitizer);
     }
     <script nonce="@nonce">
         var localized = @Html.Raw(lStrsJson)
     </script>
-
     <main role="main">
         <partial name="_CookieConsentPartial" />
         @RenderBody()
     </main>
+    <script src="~/js/event-binder.js" asp-append-version="true"></script>
     @Html.AntiForgeryToken()
 </body>
 </html>

EnvelopeGenerator.Web/WebKey.cs

@@ -24,5 +24,7 @@
         public static readonly string EnvelopeInfo2 = nameof(EnvelopeInfo2);
         public static readonly string SigAgree = nameof(SigAgree);
         public static readonly string Reject = nameof(Reject);
+        public static readonly string and = nameof(and);
+        public static readonly string Hello = nameof(Hello);
     }
 }

EnvelopeGenerator.Web/wwwroot/js/api-service.js

@@ -0,0 +1,41 @@
+class Content {
+  static get JSON () {
+    return 'application/json';
+  }
+}
+
+class API {
+  static get REJECT_URL () {
+    return `/api/envelope/reject`;
+  }
+
+  static __XSRF_TOKEN
+  static get XSRF_TOKEN() {
+    API.__XSRF_TOKEN ??= document.getElementsByName('__RequestVerificationToken')[0].value;
+    return API.__XSRF_TOKEN;
+  }
+}
+
+const submitForm = async form => await fetch(form.action, {
+  method: form.method,
+  body: new FormData(form),
+  headers: {
+      "X-Requested-With": "XMLHttpRequest"
+  }
+})
+
+const createRequest = async (method, url, body, contentType) => {
+    return fetch(url, {
+        credentials: 'include',
+        method: method,
+        headers: {
+          'Content-Type': contentType,
+          'X-XSRF-TOKEN': API.XSRF_TOKEN
+        },
+        body: JSON.stringify(body)
+      })
+}
+
+const createPost = (url, body, contentType) => createRequest('POST', url, body, contentType);
+
+const rejectEnvelope = (reason) => createPost(API.REJECT_URL, reason, Content.JSON);

EnvelopeGenerator.Web/wwwroot/js/api.js

@@ -1,7 +0,0 @@
-const submitForm = async form => await fetch(form.action, {
-    method: form.method,
-    body: new FormData(form),
-    headers: {
-        "X-Requested-With": "XMLHttpRequest"
-    }
-})

EnvelopeGenerator.Web/wwwroot/js/app.js

@@ -180,14 +180,14 @@ class App {
         }
 
         return Swal.fire({
-            title: localized.Confirmation,
-            html: `<div class="text-start fs-6 p-0 m-0">${localized.SigAgree}</div>`,
+            title: localized.confirmation,
+            html: `<div class="text-start fs-6 p-0 m-0">${localized.sigAgree}</div>`,
             icon: "question",
             showCancelButton: true,
             confirmButtonColor: "#3085d6",
             cancelButtonColor: "#d33",
-            confirmButtonText: localized.Finalize,
-            cancelButtonText: localized.Back
+            confirmButtonText: localized.finalize,
+            cancelButtonText: localized.back
         }).then(async (result) => {
             if (result.isConfirmed) {
                 //---

EnvelopeGenerator.Web/wwwroot/js/event-binder.js

@@ -0,0 +1,37 @@
+$('.btn_reject').click(_ =>
+    Swal.fire({
+        title: localized.rejection,
+        html: `<div class="text-start fs-6 p-0 m-0">${localized.rejectionReasonQ}</div>`,
+        icon: "question",
+        input: "text",
+        inputAttributes: {
+            autocapitalize: "off"
+        },
+        showCancelButton: true,
+        confirmButtonColor: "#3085d6",
+        cancelButtonColor: "#d33",
+        confirmButtonText: localized.complete,
+        cancelButtonText: localized.back,
+        showLoaderOnConfirm: true,
+        preConfirm: async (reason) => {
+            try {
+                var res = await rejectEnvelope(reason);
+                return res;
+            } catch (error) {
+                Swal.showValidationMessage(`
+          Request failed: ${error}
+        `);
+            }
+        },
+        allowOutsideClick: () => !Swal.isLoading()
+    }).then((result) => {
+        if (!result.isConfirmed)
+            return;
+        const res = result.value;
+        console.log(res)
+        if (res.ok) {
+            alert('rejected')
+        }
+        else
+            alert('fail')
+    }));