transmit all options from a twig include template

This commit is contained in:
2021-08-06 21:20:59 +02:00
parent da09e10fb1
commit 24714227b8
6 changed files with 89 additions and 44 deletions

View File

@@ -41,32 +41,36 @@ export default {
edit: window.mode === 'edit',
personId: window.personId,
addressId: window.addressId,
backUrl: `/fr/person/${window.personId}/address/list`, //TODO better way to pass this
backUrl: window.backUrl,
},
addAddress: {
options: {
/// Options override default
/// First button text if create or edit address (trans chain, see i18n)
/// Options override default.
/// null value take default component value
button: {
//text: { create: 'bim', edit: 'bam' },
type: 'btn-update',
size: 'btn-sm',
display: false
text: {
/// if create or edit address
create: window.buttonText || null,
edit: window.buttonText || null
},
type: window.button.type || null,
size: window.button.size || null,
display: window.button.display
},
/// Modal title text if create or edit address (trans chain, see i18n)
//title: { create: 'boum', edit: 'pan' },
title: {
create: window.modalTitle || null,
edit: window.modalTitle || null
},
/// Display each step in page or Modal
bindModal: {
//step1: false,
//step2: false
},
// Options only for root parent component
displayResult: true,
redirectToBackUrl: false
redirectToBackUrl: true
},
type: 'person',
result: null // <== returned from addAddress component

View File

@@ -2,7 +2,7 @@
<button v-if="step1WithModal"
@click="openShowPane"
class="btn mt-4" :class="getClassButton"
class="btn" :class="getClassButton"
type="button" name="button" :title="$t(getTextButton)">
<span v-if="displayTextButton">{{ $t(getTextButton) }}</span>
</button>
@@ -14,7 +14,7 @@
@close="flag.showPane = false">
<template v-slot:header>
<h2 class="modal-title">{{ $t(getTextTitle) }}
<h2 class="modal-title">{{ getTextTitle }}
<span v-if="flag.loading" class="loading">
<i class="fa fa-circle-o-notch fa-spin fa-fw"></i>
<span class="sr-only">Loading...</span>
@@ -67,7 +67,7 @@
@close="flag.editPane = false">
<template v-slot:header>
<h2 class="modal-title">{{ $t(getTextTitle) }}
<h2 class="modal-title">{{ getTextTitle }}
<span v-if="flag.loading" class="loading">
<i class="fa fa-circle-o-notch fa-spin fa-fw"></i>
<span class="sr-only">Loading...</span>
@@ -204,24 +204,24 @@ export default {
return step2;
},
getTextTitle() {
if (this.options.title) {
if (this.options.title && (this.options.title.edit !== null || this.options.title.create !== null)) {
return (this.context.edit) ? this.options.title.edit : this.options.title.create;
}
return (this.context.edit) ? this.default.title.edit : this.default.title.create;
return (this.context.edit) ? this.$t(this.default.title.edit) : this.$t(this.default.title.create);
},
getTextButton() {
if (this.options.button && this.options.button.text) {
if (this.options.button && this.options.button.text && (this.options.button.text.edit !== null || this.options.button.text.create !== null)) {
return (this.context.edit) ? this.options.button.text.edit : this.options.button.text.create;
}
return (this.context.edit) ? this.default.button.text.edit : this.default.button.text.create;
},
getClassButton() {
let size = (this.options.button && this.options.button.size) ? this.options.button.size : '';
let type = (this.options.button && this.options.button.type) ? this.options.button.type : this.default.button.type;
let size = (this.options.button && this.options.button.size !== null) ? this.options.button.size : '';
let type = (this.options.button && this.options.button.type !== null) ? this.options.button.type : this.default.button.type;
return size ? size + ' ' + type : type;
},
displayTextButton() {
return (typeof this.options.button !== 'undefined' && typeof this.options.button.display !== 'undefined') ?
return (this.options.button !== null && typeof this.options.button.display !== 'undefined') ?
this.options.button.display : this.default.button.display;
}
},