Dynamic component id issue solved

This commit is contained in:
Cüneyt Şentürk 2020-08-22 16:07:36 +03:00
parent 95f5c8cd73
commit 7ef096dab9
7 changed files with 14 additions and 9 deletions

View File

@ -67,7 +67,7 @@ const app = new Vue({
this.component = Vue.component('add-new-component', (resolve, reject) => {
resolve({
template : '<div id="dynamic-component"><akaunting-modal v-if="confirm.show" :show="confirm.show" :title="confirm.title" :message="confirm.message" :button_cancel="confirm.button_cancel" :button_delete="confirm.button_delete" @confirm="onDelete" @cancel="cancelDelete"></akaunting-modal></div>',
template : '<div id="dynamic-delete-component"><akaunting-modal v-if="confirm.show" :show="confirm.show" :title="confirm.title" :message="confirm.message" :button_cancel="confirm.button_cancel" :button_delete="confirm.button_delete" @confirm="onDelete" @cancel="cancelDelete"></akaunting-modal></div>',
mixins: [
Global

View File

@ -22,6 +22,7 @@
</div>
<div class="modal-body pb-0" v-else>
<form id="form-create" method="POST" action="#"/>
<component v-bind:is="component"></component>
</div>
</slot>
@ -143,10 +144,12 @@ export default {
},
mounted() {
let form_prefix = this._uid;
if (this.is_component) {
this.component = Vue.component('add-new-component', (resolve, reject) => {
resolve({
template : '<div id="modal-add-new-form">' + this.message + '</div>',
template : '<div id="modal-add-new-form-' + form_prefix + '">' + this.message + '</div>',
components: {
AkauntingRadioGroup,
@ -163,7 +166,7 @@ export default {
},
mounted() {
let form_id = document.getElementById('modal-add-new-form').children[0].id;
let form_id = document.getElementById('modal-add-new-form-' + form_prefix).children[0].id;
this.form = new Form(form_id);
},

View File

@ -141,7 +141,7 @@ export default {
this.component = Vue.component('add-new-component', (resolve, reject) => {
resolve({
template : '<div id="dynamic-component"><akaunting-modal v-if="confirm.show" :show="confirm.show" :title="confirm.title" :message="confirm.message" :button_cancel="confirm.button_cancel" :button_delete="confirm.button_delete" @confirm="onDelete" @cancel="cancelDelete"></akaunting-modal></div>',
template : '<div id="dynamic-delete-component"><akaunting-modal v-if="confirm.show" :show="confirm.show" :title="confirm.title" :message="confirm.message" :button_cancel="confirm.button_cancel" :button_delete="confirm.button_delete" @confirm="onDelete" @cancel="cancelDelete"></akaunting-modal></div>',
components: {
AkauntingModal,
@ -347,7 +347,7 @@ export default {
this.component = Vue.component('add-new-component', (resolve, reject) => {
resolve({
template : '<div id="dynamic-component"><akaunting-modal v-if="confirm.show" :show="confirm.show" :title="confirm.title" :message="confirm.message" :button_cancel="confirm.button_cancel" :button_delete="confirm.button_delete" @confirm="onDelete" @cancel="cancelDelete"></akaunting-modal></div>',
template : '<div id="dynamic-delete-file-component"><akaunting-modal v-if="confirm.show" :show="confirm.show" :title="confirm.title" :message="confirm.message" :button_cancel="confirm.button_cancel" :button_delete="confirm.button_delete" @confirm="onDelete" @cancel="cancelDelete"></akaunting-modal></div>',
components: {
AkauntingModal,

View File

@ -338,7 +338,7 @@ const app = new Vue({
this.component = Vue.component('add-new-component', (resolve, reject) => {
resolve({
template: '<div id="dynamic-component"><akaunting-modal-add-new modal-dialog-class="modal-md" :show="payment.modal" @submit="onSubmit" @cancel="onCancel" :buttons="payment.buttons" :title="payment.title" :is_component=true :message="payment.html"></akaunting-modal-add-new></div>',
template: '<div id="dynamic-payment-component"><akaunting-modal-add-new modal-dialog-class="modal-md" :show="payment.modal" @submit="onSubmit" @cancel="onCancel" :buttons="payment.buttons" :title="payment.title" :is_component=true :message="payment.html"></akaunting-modal-add-new></div>',
mixins: [
Global

View File

@ -339,7 +339,7 @@ const app = new Vue({
this.component = Vue.component('add-new-component', (resolve, reject) => {
resolve({
template: '<div id="dynamic-component"><akaunting-modal-add-new modal-dialog-class="modal-md" :show="payment.modal" @submit="onSubmit" @cancel="onCancel" :buttons="payment.buttons" :title="payment.title" :is_component=true :message="payment.html"></akaunting-modal-add-new></div>',
template: '<div id="dynamic-payment-component"><akaunting-modal-add-new modal-dialog-class="modal-md" :show="payment.modal" @submit="onSubmit" @cancel="onCancel" :buttons="payment.buttons" :title="payment.title" :is_component=true :message="payment.html"></akaunting-modal-add-new></div>',
mixins: [
Global

View File

@ -7,7 +7,8 @@
@stack('content_content_end')
<notifications></notifications>
<form id="form-create" method="POST" action="#"/>
<form id="form-dynamic-component" method="POST" action="#"></form>
<component v-bind:is="component"></component>
</div>
@stack('content_end')

View File

@ -7,7 +7,8 @@
@stack('content_content_end')
<notifications></notifications>
<form id="form-create" method="POST" action="#"/>
<form id="form-dynamic-component" method="POST" action="#"></form>
<component v-bind:is="component"></component>
</div>
@stack('content_end')