Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-12 21:34:25 +00:00
Code Issues Actions Projects Releases Wiki Activity

DX change function names to camelCase format in vue app signature

Browse Source
This commit is contained in:
nobohan 2024-07-19 10:00:16 +02:00
parent 67395f52b5
commit 111305d09c
1 changed files with 50 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

100
src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DocumentSignature/App.vue
View File

@ -20,7 +20,7 @@
</div> </div>
</template> </template>
<template v-slot:footer> <template v-slot:footer>
<button class="btn btn-action" @click.prevent="confirm_sign"> <button class="btn btn-action" @click.prevent="confirmSign">
{{ $t("yes") }} {{ $t("yes") }}
</button> </button>
</template> </template>
@ -35,13 +35,13 @@
<button <button
:disabled="zone < 1" :disabled="zone < 1"
class="btn btn-light btn-sm" class="btn btn-light btn-sm"
@click="turn_signature(-1)" @click="turnSignature(-1)"
> >
{{ $t("last_sign_zone") }} {{ $t("last_sign_zone") }}
</button> </button>
</div> </div>
<div class="col-4 gap-2 d-grid"> <div class="col-4 gap-2 d-grid">
<button class="btn btn-light btn-sm" @click="turn_signature(1)"> <button class="btn btn-light btn-sm" @click="turnSignature(1)">
{{ $t("next_sign_zone") }} {{ $t("next_sign_zone") }}
</button> </button>
</div> </div>
@ -56,7 +56,7 @@
<button <button
class="btn btn-light btn-sm" class="btn btn-light btn-sm"
:disabled="page <= 1" :disabled="page <= 1"
@click="turn_page(-1)" @click="turnPage(-1)"
> >
❮ ❮
</button> </button>
@ -64,7 +64,7 @@
<button <button
class="btn btn-light btn-sm" class="btn btn-light btn-sm"
:disabled="page >= pageCount" :disabled="page >= pageCount"
@click="turn_page(1)" @click="turnPage(1)"
> >
❯ ❯
</button> </button>
@ -88,7 +88,7 @@
<button <button
class="btn btn-misc" class="btn btn-misc"
:hidden="!userSignatureZones" :hidden="!userSignatureZones"
@click="undo_sign" @click="undoSign"
v-if="signature.zones.length > 1" v-if="signature.zones.length > 1"
> >
{{ $t("choose_another_signature") }} {{ $t("choose_another_signature") }}
@ -96,14 +96,14 @@
<button <button
class="btn btn-misc" class="btn btn-misc"
:hidden="!userSignatureZones" :hidden="!userSignatureZones"
@click="undo_sign" @click="undoSign"
v-else v-else
> >
{{ $t("cancel") }} {{ $t("cancel") }}
</button> </button>
</div> </div>
<div class="col-6"> <div class="col-6">
<button class="btn float-end btn-delete" @click="undo_sign"> <button class="btn float-end btn-delete" @click="undoSign">
{{ $t("cancel_signing") }} {{ $t("cancel_signing") }}
</button> </button>
</div> </div>
@ -155,14 +155,14 @@ declare global {
const signature = window.signature; const signature = window.signature;
const urlInfo = build_download_info_link(signature.storedObject.filename); const urlInfo = build_download_info_link(signature.storedObject.filename);
const mount_pdf = async (url: string) => { const mountPdf = async (url: string) => {
const loadingTask = pdfjsLib.getDocument(url); const loadingTask = pdfjsLib.getDocument(url);
pdf = await loadingTask.promise; pdf = await loadingTask.promise;
pageCount.value = pdf.numPages; pageCount.value = pdf.numPages;
await set_page(1); await setPage(1);
}; };
const get_render_context = (pdfPage: PDFPageProxy) => { const getRenderContext = (pdfPage: PDFPageProxy) => {
const scale = 1; const scale = 1;
const viewport = pdfPage.getViewport({ scale }); const viewport = pdfPage.getViewport({ scale });
const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement; const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
@ -176,13 +176,13 @@ const get_render_context = (pdfPage: PDFPageProxy) => {
}; };
}; };
const set_page = async (page: number) => { const setPage = async (page: number) => {
const pdfPage = await pdf.getPage(page); const pdfPage = await pdf.getPage(page);
const renderContext = get_render_context(pdfPage); const renderContext = getRenderContext(pdfPage);
await pdfPage.render(renderContext); await pdfPage.render(renderContext);
}; };
async function download_and_open(): Promise<Blob> { async function downloadAndOpen(): Promise<Blob> {
let raw; let raw;
try { try {
raw = await download_and_decrypt_doc( raw = await download_and_decrypt_doc(
@ -194,22 +194,22 @@ async function download_and_open(): Promise<Blob> {
console.error("error while downloading and decrypting document", e); console.error("error while downloading and decrypting document", e);
throw e; throw e;
} }
await mount_pdf(URL.createObjectURL(raw)); await mountPdf(URL.createObjectURL(raw));
init_pdf(); initPdf();
return raw; return raw;
} }
const init_pdf = () => { const initPdf = () => {
const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement; const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
canvas.addEventListener( canvas.addEventListener(
"pointerup", "pointerup",
(e: PointerEvent) => canvas_click(e, canvas), (e: PointerEvent) => canvasClick(e, canvas),
false false
); );
setTimeout(() => add_zones(page.value), 800); setTimeout(() => addZones(page.value), 800);
}; };
const hit_signature = ( const hitSignature = (
zone: SignatureZone, zone: SignatureZone,
xy: number[], xy: number[],
canvasWidth: number, canvasWidth: number,
@ -229,30 +229,30 @@ const hit_signature = (
); );
}; };
const canvas_click = (e: PointerEvent, canvas: HTMLCanvasElement) => const canvasClick = (e: PointerEvent, canvas: HTMLCanvasElement) =>
signature.zones signature.zones
.filter((z) => z.PDFPage.index + 1 === page.value) .filter((z) => z.PDFPage.index + 1 === page.value)
.map((z) => { .map((z) => {
if ( if (
hit_signature(z, [e.offsetX, e.offsetY], canvas.width, canvas.height) hitSignature(z, [e.offsetX, e.offsetY], canvas.width, canvas.height)
) { ) {
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext("2d");
if (ctx) { if (ctx) {
set_page(page.value); setPage(page.value);
setTimeout(() => draw_zone(z, ctx, canvas.width, canvas.height), 200); setTimeout(() => drawZone(z, ctx, canvas.width, canvas.height), 200);
} }
userSignatureZones.value = z; userSignatureZones.value = z;
} }
}); });
const turn_page = async (upOrDown: number) => { const turnPage = async (upOrDown: number) => {
userSignatureZones.value = null; userSignatureZones.value = null;
page.value = page.value + upOrDown; page.value = page.value + upOrDown;
await set_page(page.value); await setPage(page.value);
setTimeout(() => add_zones(page.value), 200); setTimeout(() => addZones(page.value), 200);
}; };
const turn_signature = async (upOrDown: number) => { const turnSignature = async (upOrDown: number) => {
userSignatureZones.value = null; userSignatureZones.value = null;
if (zone.value < signature.zones.length - 1) { if (zone.value < signature.zones.length - 1) {
zone.value = zone.value + upOrDown; zone.value = zone.value + upOrDown;
@ -262,12 +262,12 @@ const turn_signature = async (upOrDown: number) => {
let currentZone = signature.zones[zone.value]; let currentZone = signature.zones[zone.value];
if (currentZone) { if (currentZone) {
page.value = currentZone.PDFPage.index + 1; page.value = currentZone.PDFPage.index + 1;
await set_page(page.value); await setPage(page.value);
setTimeout(() => add_zones(page.value), 200); setTimeout(() => addZones(page.value), 200);
} }
}; };
const draw_zone = ( const drawZone = (
zone: SignatureZone, zone: SignatureZone,
ctx: CanvasRenderingContext2D, ctx: CanvasRenderingContext2D,
canvasWidth: number, canvasWidth: number,
@ -309,23 +309,23 @@ const draw_zone = (
} }
}; };
const add_zones = (page: number) => { const addZones = (page: number) => {
const canvas = document.querySelectorAll("canvas")[0]; const canvas = document.querySelectorAll("canvas")[0];
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext("2d");
if (ctx) { if (ctx) {
signature.zones signature.zones
.filter((z) => z.PDFPage.index + 1 === page) .filter((z) => z.PDFPage.index + 1 === page)
.map((z) => draw_zone(z, ctx, canvas.width, canvas.height)); .map((z) => drawZone(z, ctx, canvas.width, canvas.height));
} }
}; };
const check_signature = () => { const checkSignature = () => {
const url = `/api/1.0/document/workflow/${signature.id}/check-signature`; const url = `/api/1.0/document/workflow/${signature.id}/check-signature`;
return makeFetch("GET", url) return makeFetch("GET", url)
.then((r) => { .then((r) => {
signedState.value = r as SignedState; signedState.value = r as SignedState;
if (signedState.value === "pending") { if (signedState.value === "pending") {
check_for_ready(); checkForReady();
} }
}) })
.catch((error) => { .catch((error) => {
@ -338,40 +338,40 @@ const check_signature = () => {
const maxTryForReady = 60; //2 minutes for trying to sign const maxTryForReady = 60; //2 minutes for trying to sign
let tryForReady = 0; let tryForReady = 0;
const stop_try_signing = () => { const stopTrySigning = () => {
loading.value = false; loading.value = false;
modalOpen.value = false; modalOpen.value = false;
}; };
const check_for_ready = () => { const checkForReady = () => {
if (tryForReady > maxTryForReady) { if (tryForReady > maxTryForReady) {
signedState.value = "error"; signedState.value = "error";
stop_try_signing(); stopTrySigning();
console.log("Reached the maximum number of tentative to try signing"); console.log("Reached the maximum number of tentative to try signing");
//TODO toast error //TODO toast error
} }
if (signedState.value === "rejected") { if (signedState.value === "rejected") {
stop_try_signing(); stopTrySigning();
console.log("Signature rejected by the server"); console.log("Signature rejected by the server");
//TODO toast error //TODO toast error
} }
if (signedState.value === "canceled") { if (signedState.value === "canceled") {
stop_try_signing(); stopTrySigning();
console.log("Signature canceledconsole.log('Error while posting the signature', error);"); console.log("Signature canceledconsole.log('Error while posting the signature', error);");
//TODO toast error //TODO toast error
} }
if (signedState.value === "pending") { if (signedState.value === "pending") {
tryForReady = tryForReady + 1; tryForReady = tryForReady + 1;
setTimeout(() => check_signature(), 2000); setTimeout(() => checkSignature(), 2000);
} else { } else {
stop_try_signing(); stopTrySigning();
if (signedState.value === "signed") { if (signedState.value === "signed") {
//TODO recharger le document signé //TODO recharger le document signé
} }
} }
}; };
const confirm_sign = () => { const confirmSign = () => {
loading.value = true; loading.value = true;
const url = `/api/1.0/document/workflow/${signature.id}/signature-request`; const url = `/api/1.0/document/workflow/${signature.id}/signature-request`;
const body = { const body = {
@ -380,27 +380,27 @@ const confirm_sign = () => {
}; };
makeFetch("POST", url, body) makeFetch("POST", url, body)
.then((r) => { .then((r) => {
check_for_ready(); checkForReady();
}) })
.catch((error) => { .catch((error) => {
console.log('Error while posting the signature', error); console.log('Error while posting the signature', error);
stop_try_signing(); stopTrySigning();
//TODO toast //TODO toast
}); });
}; };
const undo_sign = async () => { const undoSign = async () => {
// const canvas = document.querySelectorAll("canvas")[0]; // const canvas = document.querySelectorAll("canvas")[0];
// const ctx = canvas.getContext("2d"); // const ctx = canvas.getContext("2d");
// if (ctx && userSignatureZones.value) { // if (ctx && userSignatureZones.value) {
// //draw_zone(userSignatureZones.value, ctx, canvas.width, canvas.height); // //drawZone(userSignatureZones.value, ctx, canvas.width, canvas.height);
// } // }
await set_page(page.value); await setPage(page.value);
setTimeout(() => add_zones(page.value), 200); setTimeout(() => addZones(page.value), 200);
userSignatureZones.value = null; userSignatureZones.value = null;
}; };
download_and_open(); downloadAndOpen();
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">