Кнопка удаления ряда теперь действительно работает.

1 files changed, 29 insertions, 5 deletions

diff --git a/day9/task5_vue/src/App.vue b/day9/task5_vue/src/App.vue
index 3ce2035..2af8b20 100644
--- a/day9/task5_vue/src/App.vue
+++ b/day9/task5_vue/src/App.vue
@@ -1,12 +1,19 @@
 <template>
     <div>
-        <Table v-bind:table-data="tableData"/>
-        <UploadFileButton/>
-        <AddNewEntryButton/>
+        <EditFormBox
+                v-bind:form-type="formType"
+                v-bind:cancel-callback="hideForm"
+                v-bind:table-row="formData"
+                v-if="isFormShown"
+        />
+        <Table v-bind:table-data="tableData" v-bind:show-form-callback="showForm"/>
+        <UploadFileButton v-if="!isFormShown"/>
+        <AddNewEntryButton v-if="!isFormShown" v-bind:show-form-callback="showForm"/>
     </div>
 </template>
 
 <script>
+    import EditFormBox from "./components/EditFormBox.vue";
     import Table from "./components/Table.vue";
     import UploadFileButton from "./components/UploadFileButton.vue";
     import AddNewEntryButton from './components/AddNewEntryButton.vue';
@@ -14,11 +21,14 @@
 
     export default {
         name: "App",
-        components: {Table, UploadFileButton, AddNewEntryButton},
+        components: {EditFormBox, Table, UploadFileButton, AddNewEntryButton},
 
         data() {
             return {
-                tableData: []
+                tableData: [],
+                formType: null,
+                formData: null,
+                isFormShown: false
             }
         },
 
@@ -33,6 +43,20 @@
                 .then(response => {
                     this.tableData = response.data;
                 })
+        },
+
+        methods: {
+            showForm(formType, formData) {
+                this.formType = formType;
+                this.formData = formData;
+                this.isFormShown = true;
+            },
+
+            hideForm() {
+                this.formType = null;
+                this.formData = null;
+                this.isFormShown = false;
+            }
         }
     }
 </script>