summaryrefslogtreecommitdiff
path: root/day9/task5_vue/src/App.vue
diff options
context:
space:
mode:
Diffstat (limited to 'day9/task5_vue/src/App.vue')
-rw-r--r--day9/task5_vue/src/App.vue34
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>