Koha-community/Koha
13
7
Fork 0
Code Issues Releases Wiki Activity

Bug 37812: Adjust Dialog.vue component

Browse source 
Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
This commit is contained in:
Jonathan Druart 2024-09-10 16:34:54 +02:00 committed by Martin Renvoize
parent a2782f9146
commit f2f2ecaeef
Signed by: martin.renvoize
GPG key ID: 422B469130441A0F
1 changed files with 80 additions and 73 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
koha-tmpl/intranet-tmpl/prog/js/vue/components/Dialog.vue
View file

@ -1,20 +1,32 @@
<template>
<div class="alert alert-info" v-if="message" v-html="message"></div>
<div class="alert alert-warning" v-if="error" v-html="error"></div>
<div class="alert alert-warning modal" v-if="warning">
<div class="modal" role="dialog" v-if="warning">
<div class="modal-dialog">
<div class="modal-content modal-lg">
<div class="modal-body alert-warning">
<h1 v-html="warning"></h1>
<button
id="close_modal"
class="btn btn-default approve"
class="btn btn-default deny cancel"
type="button"
data-bs-dismiss="modal"
@click="removeMessages"
>
<i class="fa fa-fw fa-check"></i>
{{ $__("Close") }}
</button>
</div>
<div class="modal_centered" v-if="confirmation">
<div class="alert alert-warning confirmation">
</div>
</div>
</div>
<div class="confirmation modal" role="dialog" v-if="confirmation">
<div class="modal-dialog">
<div class="modal-content modal-lg">
<div class="modal-header alert-warning">
<h1 v-html="confirmation.title"></h1>
</div>
<div class="modal-body">
<p v-html="confirmation.message"></p>
<div class="inputs" v-if="confirmation.inputs">
<form ref="confirmationform">
@ -26,7 +38,9 @@
<div class="col-md-6">
<label
:for="`confirmation_input_${input.id}`"
v-bind:class="{ required: input.required }"
v-bind:class="{
required: input.required,
}"
>{{ input.label }}:</label
>
</div>
@ -59,7 +73,9 @@
</button>
<button
id="close_modal"
class="btn btn-default deny"
class="btn btn-default deny cancel"
type="button"
data-bs-dismiss="modal"
@click="removeConfirmationMessages"
>
<i class="fa fa-fw fa-remove"></i>
@ -67,6 +83,8 @@
</button>
</div>
</div>
</div>
</div>
<!-- Must be styled differently -->
<div class="modal_centered" v-if="is_submitting">
@ -168,17 +186,6 @@ export default {
width: 10%;
}
.confirmation {
position: absolute;
top: 25%;
left: 40%;
width: 50%;
min-height: 10%;
margin: auto;
align-items: center;
justify-content: center;
}
.confirmation .inputs {
margin-top: 0.4em;
}