diff options
| -rw-r--r-- | day9/task5_vue/src/App.vue | 8 | ||||
| -rw-r--r-- | day9/task5_vue/src/components/AddNewEntryButton.vue | 5 | ||||
| -rw-r--r-- | day9/task5_vue/src/components/EditFormBox.vue | 16 | ||||
| -rw-r--r-- | day9/task5_vue/src/components/Table.vue | 4 |
4 files changed, 12 insertions, 21 deletions
diff --git a/day9/task5_vue/src/App.vue b/day9/task5_vue/src/App.vue index 8def105..42ba3b1 100644 --- a/day9/task5_vue/src/App.vue +++ b/day9/task5_vue/src/App.vue @@ -3,13 +3,13 @@ <EditFormBox v-bind:form-type="formType" v-bind:table-row="formData" - v-bind:cancel-callback="hideForm" - v-bind:show-popup="showPopup" + @close-form="hideForm" + @show-popup="showPopup($event)" v-if="isFormShown" /> - <Table v-bind:table-data="tableData" v-bind:show-form-callback="showForm"/> + <Table v-bind:table-data="tableData" @show-form="showForm('update', $event)"/> <UploadFileButton v-if="!isFormShown"/> - <AddNewEntryButton v-if="!isFormShown" v-bind:show-form-callback="showForm"/> + <AddNewEntryButton v-if="!isFormShown" @show-form="showForm('create', $event)"/> <transition name="fade"> <PopupMessage v-if="isPopupShown" v-bind:message="popupMessage"/> diff --git a/day9/task5_vue/src/components/AddNewEntryButton.vue b/day9/task5_vue/src/components/AddNewEntryButton.vue index 6b7e19b..f22da0f 100644 --- a/day9/task5_vue/src/components/AddNewEntryButton.vue +++ b/day9/task5_vue/src/components/AddNewEntryButton.vue @@ -13,7 +13,6 @@ export default { name: "AddNewEntryButton", - props: ['showFormCallback'], components: {EditFormBox}, data() { @@ -24,13 +23,13 @@ methods: { showForm() { - this.showFormCallback('create', { + this.$emit('show-form', { service_id: '', servtype: '', subtype: '', user_id: '', referrer_user_id: '', state: '', creation_date: '', creation_time: '', creation_request_sent_date: '', notified_about_expiration: '' - }) + }); } } } diff --git a/day9/task5_vue/src/components/EditFormBox.vue b/day9/task5_vue/src/components/EditFormBox.vue index f18bf69..42bb3c6 100644 --- a/day9/task5_vue/src/components/EditFormBox.vue +++ b/day9/task5_vue/src/components/EditFormBox.vue @@ -95,7 +95,7 @@ </div> <div class="formButtons"> - <button type="button" @click="cancelCallback">Cancel</button> + <button type="button" @click="$emit('close-form')">Cancel</button> <button type="button" v-if="formType === 'update'" @click="submitForm">Update</button> <button type="button" v-else-if="formType === 'create'" @click="submitForm">Create</button> @@ -109,7 +109,7 @@ export default { name: "EditFormBox", - props: ['formType', 'cancelCallback', 'tableRow', 'showPopup'], + props: ['formType', 'tableRow'], data() { return { @@ -126,14 +126,6 @@ } }, - mounted() { - let action = ''; - if (this.formType === 'create') action = '/api/add'; - else if (this.formType === 'update') action = '/api/update'; - - this.$refs.tableForm.action = action; - }, - methods: { submitForm() { let creation_date = this.$refs.creation_request_sent_date.value; @@ -177,8 +169,8 @@ data: JSON.stringify(formData) }) .then(response => { - this.cancelCallback(); - this.showPopup('Database updated successfully'); + this.$emit('close-form'); + this.$emit('show-popup', 'Database updated successfully'); }); } } diff --git a/day9/task5_vue/src/components/Table.vue b/day9/task5_vue/src/components/Table.vue index a186277..97bc24d 100644 --- a/day9/task5_vue/src/components/Table.vue +++ b/day9/task5_vue/src/components/Table.vue @@ -32,7 +32,7 @@ export default { name: "Table", - props: ['tableData', 'showFormCallback'], + props: ['tableData'], components: {EditFormBox}, methods: { @@ -45,7 +45,7 @@ data: JSON.stringify({'type': 'single_id', 'service_id': serviceId}) }) .then(response => { - this.showFormCallback('update', response.data); + this.$emit('show-form', response.data); }); }, |