From df03ed5ed33701aa3c893e602cc1d963d2e0cc84 Mon Sep 17 00:00:00 2001
From: Kirill Stytsenko <kirill@styts.com>
Date: Wed, 2 Mar 2022 16:04:37 +0100
Subject: [PATCH] Improve "back" functionality #92
Former-commit-id: 862f677cda2305c1b8f82380e4260186d2f530cc
---
fda-ui/components/TableList.vue | 13 ++++++++-----
.../database/_database_id/table/_table_id/index.vue | 3 +++
.../database/_database_id/table/import.vue | 3 ++-
fda-ui/store/index.js | 13 +++++++++++--
4 files changed, 24 insertions(+), 8 deletions(-)
diff --git a/fda-ui/components/TableList.vue b/fda-ui/components/TableList.vue
index d5b93adc53..67972b85ae 100644
--- a/fda-ui/components/TableList.vue
+++ b/fda-ui/components/TableList.vue
@@ -85,8 +85,9 @@
</v-row>
<v-row dense>
<v-col>
- <v-btn color="blue-grey" class="white--text" :to="`/container/${$route.params.container_id}/database/${$route.params.database_id}/table/${item.id}`">
- More
+ <v-btn outlined :to="`/container/${$route.params.container_id}/database/${$route.params.database_id}/table/${item.id}`">
+ <v-icon>mdi-table</v-icon>
+ View
</v-btn>
</v-col>
<v-col class="align-right">
@@ -176,7 +177,8 @@ export default {
},
mounted () {
this.$root.$on('table-create', this.refresh)
- this.refresh()
+ const table = this.$store.state.table
+ this.refresh(table ? table.id : null)
},
methods: {
async details (tableId, clicked = false) {
@@ -186,8 +188,8 @@ export default {
}
try {
const res = await this.$axios.get(`/api/container/${this.$route.params.container_id}/database/${this.$route.params.database_id}/table/${tableId}`)
- console.debug('table', res.data)
this.tableDetails = res.data
+ this.$store.commit('SET_TABLE', this.tableDetails)
} catch (err) {
this.tableDetails = undefined
this.$toast.error('Could not get table details.')
@@ -205,8 +207,9 @@ export default {
this.loading = false
if (tableId) { this.openPanelByTableId(tableId) }
} catch (err) {
- this.$toast.error('Could not list table.')
+ this.$toast.error('Could not load tables.')
}
+ this.$store.commit('SET_TABLE', null)
},
async deleteTable () {
try {
diff --git a/fda-ui/pages/container/_container_id/database/_database_id/table/_table_id/index.vue b/fda-ui/pages/container/_container_id/database/_database_id/table/_table_id/index.vue
index 8bb1fa0d4d..589edcff41 100644
--- a/fda-ui/pages/container/_container_id/database/_database_id/table/_table_id/index.vue
+++ b/fda-ui/pages/container/_container_id/database/_database_id/table/_table_id/index.vue
@@ -7,6 +7,9 @@
</v-toolbar-title>
<v-spacer />
<v-toolbar-title>
+ <v-btn class="mr-2" :to="`/container/${$route.params.container_id}/database/${$route.params.database_id}/table`">
+ <v-icon left>mdi-arrow-left</v-icon> Back
+ </v-btn>
<v-btn class="mr-2" :disabled="!token" :to="`/container/${$route.params.container_id}/database/${$route.params.database_id}/table/${$route.params.table_id}/import`">
<v-icon left>mdi-cloud-upload</v-icon> Import csv
</v-btn>
diff --git a/fda-ui/pages/container/_container_id/database/_database_id/table/import.vue b/fda-ui/pages/container/_container_id/database/_database_id/table/import.vue
index 881a42b638..4abb79ed1a 100644
--- a/fda-ui/pages/container/_container_id/database/_database_id/table/import.vue
+++ b/fda-ui/pages/container/_container_id/database/_database_id/table/import.vue
@@ -246,7 +246,8 @@ export default {
text: `${this.$route.params.database_id}`,
to: `/container/${this.$route.params.container_id}/database/${this.$route.params.database_id}/info`,
activeClass: ''
- }
+ },
+ { text: 'Tables', to: `/container/${this.$route.params.container_id}/database/${this.$route.params.database_id}/table`, activeClass: '' }
],
rules: {
required: value => !!value || 'Required'
diff --git a/fda-ui/store/index.js b/fda-ui/store/index.js
index b5fd011b17..f823bb0e85 100644
--- a/fda-ui/store/index.js
+++ b/fda-ui/store/index.js
@@ -1,7 +1,8 @@
export const state = () => ({
- db: null,
token: null,
- user: null
+ user: null,
+ db: null,
+ table: null
})
export const mutations = {
@@ -13,5 +14,13 @@ export const mutations = {
},
SET_USER (state, user) {
state.user = user
+ },
+
+ /**
+ Workaround. Helps to go 'back' from table data view and
+ have the accordion open on the same table
+ */
+ SET_TABLE (state, table) {
+ state.table = table
}
}
--
GitLab