mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
signature: layout and css bootstrap class of the vue app
This commit is contained in:
nobohan
parent
1bee3114ac
commit
794c479b9e
@ -9,23 +9,41 @@
|
||||
</template>
|
||||
</modal>
|
||||
</teleport>
|
||||
<div>
|
||||
<button :disabled="!userSignatureZones" @click="confirm_sign">
|
||||
Confirmer la signature
|
||||
</button>
|
||||
<button :disabled="!userSignatureZones" @click="undo_sign">
|
||||
Supprimer la signature
|
||||
</button>
|
||||
<div class="col-12">
|
||||
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-3">
|
||||
<button class="btn btn-primary" :disabled="!userSignatureZones" @click="confirm_sign">
|
||||
Confirmer la signature
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<button class="btn btn-primary" :disabled="!userSignatureZones" @click="undo_sign">
|
||||
Supprimer la signature
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-2">
|
||||
<button class="btn btn-light" @click="turn_signature(-1)">Zone de signature précédente</button>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<button class="btn btn-light" @click="turn_signature(1)">Zone de signature suivante</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-center" v-if="pageCount > 1">
|
||||
<div class="col-3">
|
||||
<button class="btn btn-light" :disabled="page <= 1" @click="turn_page(-1)">❮</button>
|
||||
{{ page }} / {{ pageCount }}
|
||||
<button class="btn btn-light" :disabled="page >= pageCount" @click="turn_page(1)">❯</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="pageCount > 1">
|
||||
<button :disabled="page <= 1" @click="turn_page(-1)">❮</button>
|
||||
{{ page }} / {{ pageCount }}
|
||||
<button :disabled="page >= pageCount" @click="turn_page(1)">❯</button>
|
||||
<div class="col-12">
|
||||
<canvas id="canvas" style="width:100%"></canvas>
|
||||
</div>
|
||||
<div>
|
||||
<button @click="go_next_signature()">Voir les zones de signature</button>
|
||||
</div>
|
||||
<canvas id="canvas"></canvas>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@ -180,8 +198,7 @@ const turn_page = async (upOrDown: number) => {
|
||||
setTimeout(() => add_zones(page.value), 200);
|
||||
};
|
||||
|
||||
const go_next_signature = async () => {
|
||||
open()
|
||||
const turn_signature = async (upOrDown: number) => {
|
||||
let currentZone = signature.zones[zone.value];
|
||||
if (currentZone) {
|
||||
page.value = currentZone.page;
|
||||
@ -189,12 +206,13 @@ const go_next_signature = async () => {
|
||||
setTimeout(() => add_zones(page.value), 200);
|
||||
}
|
||||
if (zone.value < signature.zones.length - 1) {
|
||||
zone.value = zone.value + 1;
|
||||
zone.value = zone.value + upOrDown;
|
||||
} else {
|
||||
zone.value = 0;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const draw_zone = (
|
||||
zone: SignatureZone,
|
||||
ctx: CanvasRenderingContext2D,
|
||||
@ -262,6 +280,9 @@ const undo_sign = async () => {
|
||||
download_and_open();
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
<style scoped lang="scss">
|
||||
canvas {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@ -1,107 +1,84 @@
|
||||
{% extends "@ChillPerson/Person/layout.html.twig" %}
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="shortcut icon" href="{{ asset('build/images/favicon.ico') }}" type="image/x-icon">
|
||||
<title>Signature</title>
|
||||
|
||||
{% set activeRouteKey = '' %}
|
||||
{{ encore_entry_link_tags('mod_bootstrap') }}
|
||||
|
||||
{% import "@ChillDocStore/Macro/macro.html.twig" as m %}
|
||||
{% import "@ChillDocStore/Macro/macro_mimeicon.html.twig" as mm %}
|
||||
</head>
|
||||
|
||||
{% block title %}{{ 'Detail of document of %name%'|trans({ '%name%': person|chill_entity_render_string } ) }}{% endblock %}
|
||||
<body>
|
||||
|
||||
{% block js %}
|
||||
{{ encore_entry_script_tags('mod_document_action_buttons_group') }}
|
||||
<script type="text/javascript">
|
||||
const signature = {
|
||||
id: 1,
|
||||
// // storedObject: {
|
||||
// // filename: "gj72nCYsiuysZwZMTMVv5mhqmJdA",
|
||||
// // keyInfos: {
|
||||
// // alg: "A256CBC",
|
||||
// // ext: true,
|
||||
// // k: "WwEuXQqv5sJFzAM6P5q7Ecvbl2MiA9mE_MTQ1fAhVsY",
|
||||
// // key_ops: ["encrypt", "decrypt"],
|
||||
// // kty: "oct",
|
||||
// // },
|
||||
// // iv: [
|
||||
// // 50, 124, 210, 52, 177, 145, 165, 156, 90, 186, 155, 252, 241, 54, 194, 79,
|
||||
// // ],
|
||||
// // },
|
||||
storedObject: {
|
||||
filename: "U2HmWk5MGkUW1vHRA5sMEMkW9fyf",
|
||||
keyInfos: {
|
||||
alg: "A256CBC",
|
||||
ext: true,
|
||||
k: "3GmJ8UBck3WhpmdoQy7cGQho0J9k9Rxhn23UIhqvpVY",
|
||||
key_ops: ["encrypt", "decrypt"],
|
||||
kty: "oct",
|
||||
{% block js %}
|
||||
{{ encore_entry_script_tags('mod_document_action_buttons_group') }}
|
||||
<script type="text/javascript">
|
||||
const signature = {
|
||||
id: 1,
|
||||
// // storedObject: {
|
||||
// // filename: "gj72nCYsiuysZwZMTMVv5mhqmJdA",
|
||||
// // keyInfos: {
|
||||
// // alg: "A256CBC",
|
||||
// // ext: true,
|
||||
// // k: "WwEuXQqv5sJFzAM6P5q7Ecvbl2MiA9mE_MTQ1fAhVsY",
|
||||
// // key_ops: ["encrypt", "decrypt"],
|
||||
// // kty: "oct",
|
||||
// // },
|
||||
// // iv: [
|
||||
// // 50, 124, 210, 52, 177, 145, 165, 156, 90, 186, 155, 252, 241, 54, 194, 79,
|
||||
// // ],
|
||||
// // },
|
||||
storedObject: {
|
||||
filename: "U2HmWk5MGkUW1vHRA5sMEMkW9fyf",
|
||||
keyInfos: {
|
||||
alg: "A256CBC",
|
||||
ext: true,
|
||||
k: "3GmJ8UBck3WhpmdoQy7cGQho0J9k9Rxhn23UIhqvpVY",
|
||||
key_ops: ["encrypt", "decrypt"],
|
||||
kty: "oct",
|
||||
},
|
||||
iv: [
|
||||
254, 171, 69, 203, 89, 3, 202, 29, 187, 200, 19, 146, 201, 253, 79, 169,
|
||||
],
|
||||
},
|
||||
iv: [
|
||||
254, 171, 69, 203, 89, 3, 202, 29, 187, 200, 19, 146, 201, 253, 79, 169,
|
||||
zones: [
|
||||
{
|
||||
page: 1,
|
||||
pageWidth: 210,
|
||||
pageHeight: 297,
|
||||
x: 21, //from top-left corner
|
||||
y: 50,
|
||||
width: 80,
|
||||
height: 50,
|
||||
},
|
||||
{
|
||||
page: 3,
|
||||
pageWidth: 210,
|
||||
pageHeight: 297,
|
||||
x: 60, //from top-left corner
|
||||
y: 20,
|
||||
width: 80,
|
||||
height: 50,
|
||||
},
|
||||
],
|
||||
},
|
||||
zones: [
|
||||
{
|
||||
page: 1,
|
||||
pageWidth: 210,
|
||||
pageHeight: 297,
|
||||
x: 21, //from top-left corner
|
||||
y: 50,
|
||||
width: 80,
|
||||
height: 50,
|
||||
},
|
||||
{
|
||||
page: 3,
|
||||
pageWidth: 210,
|
||||
pageHeight: 297,
|
||||
x: 60, //from top-left corner
|
||||
y: 20,
|
||||
width: 80,
|
||||
height: 50,
|
||||
},
|
||||
],
|
||||
};
|
||||
window.signature = signature;
|
||||
</script>
|
||||
{{ encore_entry_script_tags('vue_document_signature') }}
|
||||
{% endblock %}
|
||||
};
|
||||
window.signature = signature;
|
||||
</script>
|
||||
{{ encore_entry_script_tags('vue_document_signature') }}
|
||||
{% endblock %}
|
||||
|
||||
{% block css %}
|
||||
{{ encore_entry_link_tags('mod_document_action_buttons_group') }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<h1>{{ 'Document %title%' | trans({ '%title%': document.title }) }}</h1>
|
||||
|
||||
{{ mm.mimeIcon(document.object.type) }}
|
||||
|
||||
<dl class="chill_view_data">
|
||||
<dt>{{ 'Title'|trans }}</dt>
|
||||
<dd>{{ document.title }}</dd>
|
||||
</dl>
|
||||
|
||||
<div id="document-signature"></div>
|
||||
|
||||
<ul class="record_actions sticky-form-buttons">
|
||||
<li class="cancel">
|
||||
<a href="{{ chill_return_path_or('chill_docstore_generic-doc_by-person_index', {'id': person.id}) }}" class="btn btn-cancel">
|
||||
{{ 'Back to the list' | trans }}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
{% if is_granted('CHILL_PERSON_DOCUMENT_DELETE', document) %}
|
||||
<li class="delete">
|
||||
<a href="{{ chill_return_path_or('chill_docstore_person_document_delete', {'person': person.id, 'id': document.id}) }}" class="btn btn-delete"></a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
<li>
|
||||
{{ document.object|chill_document_button_group(document.title, is_granted('CHILL_PERSON_DOCUMENT_UPDATE', document)) }}
|
||||
</li>
|
||||
|
||||
{% if is_granted('CHILL_PERSON_DOCUMENT_UPDATE', document) %}
|
||||
<li>
|
||||
<a href="{{ path('person_document_edit', {'id': document.id, 'person': person.id}) }}" class="btn btn-edit">
|
||||
{{ 'Edit' | trans }}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
<div class="content" id="content">
|
||||
<div class="container-xxl">
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-md-12 col-lg-9 my-5 m-auto">
|
||||
<h1>{{ 'Document %title%' | trans({ '%title%': document.title }) }}</h1>
|
||||
<div class="row" id="document-signature"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user