1
0
Fork 0
mirror of https://gitlab.com/bramw/baserow.git synced 2025-05-01 23:59:50 +00:00
bramw_baserow/web-frontend/modules/database/components/sidebar/Sidebar.vue

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

135 lines
3.5 KiB
Vue
Raw Normal View History

2021-04-08 14:30:26 +00:00
<template>
<SidebarApplication
:workspace="workspace"
:application="application"
@selected="selected"
>
2021-04-08 14:30:26 +00:00
<template #context>
<li class="context__menu-item">
2021-04-08 14:30:26 +00:00
<nuxt-link
:to="{
name: 'database-api-docs-detail',
params: {
databaseId: application.id,
},
}"
class="context__menu-item-link"
2021-04-08 14:30:26 +00:00
>
<i class="context__menu-item-icon iconoir-book"></i>
{{ $t('sidebar.viewAPI') }}
2021-04-08 14:30:26 +00:00
</nuxt-link>
</li>
</template>
<template v-if="isAppSelected(application)" #body>
2021-04-08 14:30:26 +00:00
<ul class="tree__subs">
<SidebarItem
2021-05-18 11:14:18 +00:00
v-for="table in orderedTables"
2021-04-08 14:30:26 +00:00
:key="table.id"
2021-05-18 11:14:18 +00:00
v-sortable="{
id: table.id,
update: orderTables,
2021-07-11 18:02:37 +00:00
marginTop: -1.5,
enabled: $hasPermission(
'database.order_tables',
application,
application.workspace.id
),
2021-05-18 11:14:18 +00:00
}"
2021-04-08 14:30:26 +00:00
:database="application"
:table="table"
></SidebarItem>
</ul>
<ul v-if="pendingJobs.length" class="tree__subs">
<component
:is="getPendingJobComponent(job)"
v-for="job in pendingJobs"
:key="job.id"
:job="job"
>
</component>
</ul>
2022-10-13 21:18:34 +02:00
<a
v-if="
$hasPermission(
'database.create_table',
application,
application.workspace.id
)
"
2022-10-13 21:18:34 +02:00
class="tree__sub-add"
2025-04-01 20:52:11 +00:00
data-highlight="create-table"
2024-09-24 15:06:35 +00:00
@click="$refs.createTableModal.show()"
2022-10-13 21:18:34 +02:00
>
2024-07-31 13:41:49 +00:00
<i class="tree__sub-add-icon iconoir-plus"></i>
{{ $t('sidebar.createTable') }}
2021-04-08 14:30:26 +00:00
</a>
2024-09-24 15:06:35 +00:00
<CreateTableModal ref="createTableModal" :database="application" />
2021-04-08 14:30:26 +00:00
</template>
</SidebarApplication>
</template>
<script>
import { mapGetters } from 'vuex'
2021-04-08 14:30:26 +00:00
import { notifyIf } from '@baserow/modules/core/utils/error'
import SidebarItem from '@baserow/modules/database/components/sidebar/SidebarItem'
import SidebarApplication from '@baserow/modules/core/components/sidebar/SidebarApplication'
2024-09-24 15:06:35 +00:00
import CreateTableModal from '@baserow/modules/database/components/table/CreateTableModal'
2021-04-08 14:30:26 +00:00
export default {
name: 'Sidebar',
components: {
2024-09-24 15:06:35 +00:00
CreateTableModal,
SidebarApplication,
SidebarItem,
},
2021-04-08 14:30:26 +00:00
props: {
application: {
type: Object,
required: true,
},
workspace: {
type: Object,
required: true,
},
2021-04-08 14:30:26 +00:00
},
2021-05-18 11:14:18 +00:00
computed: {
orderedTables() {
return this.application.tables
.map((table) => table)
.sort((a, b) => a.order - b.order)
},
pendingJobs() {
return this.$store.getters['job/getAll'].filter((job) =>
this.$registry
.get('job', job.type)
.isJobPartOfApplication(job, this.application)
)
},
...mapGetters({ isAppSelected: 'application/isSelected' }),
2021-05-18 11:14:18 +00:00
},
2021-04-08 14:30:26 +00:00
methods: {
async selected(application) {
try {
await this.$store.dispatch('application/select', application)
} catch (error) {
notifyIf(error, 'workspace')
2021-04-08 14:30:26 +00:00
}
},
2021-05-18 11:14:18 +00:00
async orderTables(order, oldOrder) {
try {
await this.$store.dispatch('table/order', {
database: this.application,
order,
oldOrder,
})
} catch (error) {
notifyIf(error, 'table')
}
},
getPendingJobComponent(job) {
return this.$registry.get('job', job.type).getSidebarComponent()
},
2021-04-08 14:30:26 +00:00
},
}
</script>