Commit 01e8d8f5 authored by Jean Rabreau's avatar Jean Rabreau
Browse files

馃拕 add renderer components for accordion

parent c503587a
<template>
<v-expansion-panels tile flat>
<component
v-for="field in root.fields"
:key="field.id"
:is="field.component"
:root="field.data"
/>
</v-expansion-panels>
</template>
<script>
export default {
name: "AccordionRenderer",
props: {
root: Object
},
}
</script>
<style lang="scss" scoped>
</style>
......@@ -20,6 +20,8 @@ export default {
}
</script>
<style scoped>
<style lang="scss" scoped>
dl {
padding-left: 24px;
}
</style>
<template>
<v-expansion-panel>
<v-expansion-panel-header>
<h3>{{ root.content }}</h3>
</v-expansion-panel-header>
<v-expansion-panel-content>
<component
v-for="field in root.fields"
:key="field.id"
:is="field.component"
:root="field.data"
/>
</v-expansion-panel-content>
</v-expansion-panel>
</template>
<script>
export default {
name: "PanelRenderer",
props: {
root: Object
},
}
</script>
<style lang="scss" scoped>
.v-expansion-panel-header {
padding: 0;
}
</style>
......@@ -16,11 +16,15 @@ import FieldRenderer from '@/components/renderer/metadata/FieldRenderer'
import ColLayout from '@/components/renderer/metadata/ColLayout'
import ContentLayout from '@/components/renderer/metadata/ContentLayout'
import RowLayout from '@/components/renderer/metadata/RowLayout'
import AccordionLayout from '@/components/renderer/metadata/AccordionLayout'
import PanelLayout from '@/components/renderer/metadata/PanelLayout'
const UsfToRendererMap = {
UsfAccordion: AccordionLayout,
UsfCol: ColLayout,
UsfRow: RowLayout,
UsfContent: ContentLayout,
UsfPanel: PanelLayout,
UsfRow: RowLayout,
}
export default {
......@@ -112,6 +116,8 @@ export default {
}
</script>
<style scoped>
<style lang="scss" scoped>
dl {
padding-left: 24px;
}
</style>
......@@ -53,3 +53,12 @@ export default {
},
};
</script>
<style lang="scss" scoped>
#usf--builder::v-deep {
.v-expansion-panel-header {
padding: 0 0 0 8px;
}
}
</style>
......@@ -53,9 +53,11 @@ const TEMPLATE_SCOPE = Object.freeze({
})
const LAYOUT_COMPONENTS = [
'Accordion',
'Col',
'Content',
'Panel',
'Row',
'Content'
].map(s => `Usf${s}`)
const getPrivateFields = (fields, privateParent=false) => {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment