Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-08-21 15:13:50 +00:00
Code Issues Actions Projects Releases Wiki Activity

twig pass arguments to vue_address with dataset attributes

Browse Source
This commit is contained in:
Mathieu Jaumotte
2021-09-16 16:05:36 +02:00
parent 17a3f45247
commit a5ceb551eb
8 changed files with 98 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js
View File

@@ -1,13 +1,61 @@
import { createApp } from 'vue';
import App from './App.vue';
import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n';
import { addressMessages } from './i18n';
import App from './App.vue';
const i18n = _createI18n( addressMessages );
const app = createApp({
template: `<app></app>`,
})
.use(i18n)
.component('app', App)
.mount('#address');
let containers = document.querySelectorAll('.address-container');
containers.forEach((container) => {
const app = createApp({
template: `<app v-bind:addAddress="this.addAddress" ></app>`,
data() {
return {
addAddress: {
context: {
edit: container.dataset.mode === 'edit',
entity: {
type: container.dataset.targetEntityName,
id: container.dataset.targetEntityId
},
addressId: container.dataset.addressId | null,
backUrl: container.dataset.backUrl,
valid: {
from: new Date()
},
},
options: {
/// Options override default.
/// null value take default component value defined in AddAddress data()
button: {
text: {
create: container.dataset.buttonText || null,
edit: container.dataset.buttonText || null
},
size: container.dataset.buttonSize || null,
displayText: container.dataset.buttonDisplayText //boolean, default: true
},
/// Modal title text if create or edit address (trans chain, see i18n)
title: {
create: container.dataset.modalTitle || null,
edit: container.dataset.modalTitle || null
},
/// Display each step in page or Modal
bindModal: {
step1: container.dataset.bindModalStep1, //boolean, default: true
step2: container.dataset.bindModalStep2 //boolean, default: true
}
}
}
}
}
})
.use(i18n)
.component('app', App)
.mount(container);
console.log('container dataset', container.dataset);
});