mirror of
https://gitlab.com/bramw/baserow.git
synced 2025-03-16 21:43:34 +00:00
159 lines
3.9 KiB
Vue
159 lines
3.9 KiB
Vue
<template>
|
|
<PageContent
|
|
:page="page"
|
|
:path="path"
|
|
:params="params"
|
|
:elements="elements"
|
|
/>
|
|
</template>
|
|
|
|
<script>
|
|
import PageContent from '@baserow/modules/builder/components/page/PageContent'
|
|
import { resolveApplicationRoute } from '@baserow/modules/builder/utils/routing'
|
|
import RuntimeFormulaContext from '@baserow/modules/core/runtimeFormulaContext'
|
|
|
|
export default {
|
|
components: { PageContent },
|
|
provide() {
|
|
return { builder: this.builder, page: this.page, mode: this.mode }
|
|
},
|
|
async asyncData({ store, params, error, $registry, app, req }) {
|
|
let mode = 'public'
|
|
const builderId = parseInt(params.builderId, 10)
|
|
|
|
// We have a builderId parameter in the path so it's a preview
|
|
if (builderId) {
|
|
mode = 'preview'
|
|
}
|
|
|
|
let builder = store.getters['application/getSelected']
|
|
|
|
if (!builder || builderId !== builder.id) {
|
|
try {
|
|
if (builderId) {
|
|
// We have the builderId in the params so this is a preview
|
|
// Must fetch the builder instance by this Id.
|
|
await store.dispatch('publicBuilder/fetchById', {
|
|
builderId,
|
|
})
|
|
builder = await store.dispatch('application/selectById', builderId)
|
|
} else {
|
|
// We don't have the builderId so it's a public page.
|
|
// Must fetch the builder instance by domain name.
|
|
const host = process.server ? req.headers.host : window.location.host
|
|
const domain = new URL(`http://${host}`).hostname
|
|
|
|
const { id: receivedBuilderId } = await store.dispatch(
|
|
'publicBuilder/fetchByDomain',
|
|
{
|
|
domain,
|
|
}
|
|
)
|
|
builder = await store.dispatch(
|
|
'application/selectById',
|
|
receivedBuilderId
|
|
)
|
|
}
|
|
} catch (e) {
|
|
return error({
|
|
statusCode: 404,
|
|
message: app.i18n.t('publicPage.siteNotFound'),
|
|
})
|
|
}
|
|
}
|
|
|
|
const found = resolveApplicationRoute(builder.pages, params.pathMatch)
|
|
|
|
// Handle 404
|
|
if (!found) {
|
|
return error({
|
|
statusCode: 404,
|
|
message: app.i18n.t('publicPage.pageNotFound'),
|
|
})
|
|
}
|
|
|
|
const [pageFound, path, pageParamsValue] = found
|
|
|
|
const page = await store.getters['page/getById'](builder, pageFound.id)
|
|
|
|
await Promise.all([
|
|
store.dispatch('dataSource/fetchPublished', {
|
|
page,
|
|
}),
|
|
store.dispatch('element/fetchPublished', { page }),
|
|
])
|
|
|
|
const runtimeFormulaContext = new RuntimeFormulaContext(
|
|
$registry.getAll('builderDataProvider'),
|
|
{
|
|
builder,
|
|
page,
|
|
pageParamsValue,
|
|
mode,
|
|
}
|
|
)
|
|
|
|
// Initialize all data provider contents
|
|
await runtimeFormulaContext.initAll()
|
|
|
|
// And finally select the page to display it
|
|
await store.dispatch('page/selectById', {
|
|
builder,
|
|
pageId: pageFound.id,
|
|
})
|
|
|
|
return {
|
|
builder,
|
|
page,
|
|
path,
|
|
params,
|
|
mode,
|
|
}
|
|
},
|
|
head() {
|
|
return {
|
|
titleTemplate: '',
|
|
title: this.page.name,
|
|
bodyAttrs: {
|
|
class: 'public-page',
|
|
},
|
|
}
|
|
},
|
|
computed: {
|
|
elements() {
|
|
return this.$store.getters['element/getRootElements'](this.page)
|
|
},
|
|
runtimeFormulaContext() {
|
|
return new RuntimeFormulaContext(
|
|
this.$registry.getAll('builderDataProvider'),
|
|
{
|
|
builder: this.builder,
|
|
page: this.page,
|
|
pageParamsValue: this.params,
|
|
mode: this.mode,
|
|
}
|
|
)
|
|
},
|
|
backendContext() {
|
|
return this.runtimeFormulaContext.getAllBackendContext()
|
|
},
|
|
},
|
|
watch: {
|
|
backendContext: {
|
|
deep: true,
|
|
/**
|
|
* Update data source content on backend context changes
|
|
*/
|
|
handler(newValue) {
|
|
this.$store.dispatch(
|
|
'dataSourceContent/debouncedFetchPageDataSourceContent',
|
|
{
|
|
page: this.page,
|
|
data: newValue,
|
|
}
|
|
)
|
|
},
|
|
},
|
|
},
|
|
}
|
|
</script>
|