Commit 082e8129 authored by Jean Rabreau's avatar Jean Rabreau
Browse files

馃攢Merge branch 'feature/accordion' into develop

parents c503587a 6972ad7b
This diff is collapsed.
<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>
......@@ -10,17 +10,20 @@
</template>
<script>
import {mapGetters} from 'vuex'
import { LAYOUT_COMPONENTS } from '@/store/template'
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 {
......@@ -30,10 +33,24 @@ export default {
type: Boolean,
default: false
},
onPublic: {
type: Boolean,
default: false
}
},
computed: {
...mapGetters('item', {item: 'current'}),
...mapGetters('template', { root: 'current' }),
item() {
return this.$store.getters[this.onPublic
? 'community/currentItem'
: 'item/current'
]
},
root() {
return this.$store.getters[this.onPublic
? 'community/currentTemplate'
: 'template/current'
]
},
populatedTemplate() {
return this.cleanFields(this.root.fields)
},
......@@ -112,6 +129,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>
......@@ -16,6 +16,12 @@ export const initialPublicState = {
l: null,
},
},
currentTemplate: {
id: '',
name: '',
fields: [],
messages: {}
},
projectList: {
pageContent: [],
total: 0,
......@@ -67,6 +73,7 @@ const Community = {
state: cloneDeep(initialPublicState),
getters: {
currentProject: state => state.currentProject,
currentTemplate: state => state.currentTemplate,
projectList: state => state.projectList,
currentSet: state => state.currentSet,
setList: state => state.setList,
......@@ -95,6 +102,9 @@ const Community = {
LOAD_ITEM_LIST(state, itemList) {
state.itemList = itemList
},
LOAD_TEMPLATE(state, template) {
state.currentTemplate = template
},
RESET_STATE(state) {
Object.assign(state, initialPublicState);
},
......@@ -134,10 +144,13 @@ const Community = {
commit('LOAD_SET_LIST', {pageContent, pageCount, total})
})
},
loadItem({commit}, itemId) {
loadItem({commit, dispatch}, {itemId, withTemplate = true}) {
return axios.get(`items/${itemId}/`)
.then(response => {
commit('LOAD_ITEM', response.data)
if (withTemplate) {
return dispatch('loadTemplate', response.data.set.templateId)
}
})
},
loadItemList({commit}, {setId, item_ids, page=1, size=DEFAULT_PAGE_SIZE}) {
......@@ -147,6 +160,12 @@ const Community = {
commit('LOAD_ITEM_LIST', {pageContent, pageCount, total})
})
},
loadTemplate({commit}, templateId) {
return axios.get(`template/${templateId}`)
.then(response => {
commit('LOAD_TEMPLATE', response.data)
})
},
resetPublicState({ commit }) {
commit('RESET_STATE');
},
......
......@@ -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) => {
......
......@@ -53,28 +53,33 @@
{{ $t('item.metadata') }}
</v-toolbar-title>
</v-toolbar>
<div class="pa-2">
<dl>
<template
v-for="data in item.metadata"
>
<dt :key="`metadata-title-${data.id}`">{{ data.name | capitalize }}</dt>
<dd :key="`metadata-value-${data.id}`">
<ul v-if="Array.isArray(data.value) && data.value.length > 1">
<li
v-for="(value, index) in data.value"
:key="`${data.name}-${index}`"
>
{{ value }}
</li>
</ul>
<template v-else>
{{ Array.isArray(data.value) ? data.value[0] : data.value }}
</template>
</dd>
</template>
</dl>
</div>
<item-meta-data-renderer
class="pa-2"
:on-public="true"
/>
<!-- <div class="pa-2">-->
<!-- <dl>-->
<!-- <template-->
<!-- v-for="data in item.metadata"-->
<!-- >-->
<!-- <dt :key="`metadata-title-${data.id}`">{{ data.name | capitalize }}</dt>-->
<!-- <dd :key="`metadata-value-${data.id}`">-->
<!-- <ul v-if="Array.isArray(data.value) && data.value.length > 1">-->
<!-- <li-->
<!-- v-for="(value, index) in data.value"-->
<!-- :key="`${data.name}-${index}`"-->
<!-- >-->
<!-- {{ value }}-->
<!-- </li>-->
<!-- </ul>-->
<!-- <template v-else>-->
<!-- {{ Array.isArray(data.value) ? data.value[0] : data.value }}-->
<!-- </template>-->
<!-- </dd>-->
<!-- </template>-->
<!-- </dl>-->
<!-- </div>-->
</v-col>
</v-row>
</v-sheet>
......@@ -87,6 +92,7 @@ import store from '@/store';
import { mapState, mapGetters, mapActions } from 'vuex';
import MobileMixin from '@/mixins/MobileMixin';
import CrudItemHeader from '@/components/crud/CrudItemHeader';
import ItemMetaDataRenderer from '@/components/renderer/metadata/Root'
export default {
name: 'ItemPublic',
......@@ -122,6 +128,7 @@ export default {
components: {
VContainer,
CrudItemHeader,
ItemMetaDataRenderer,
},
computed: {
...mapState('community', ['currentItem']),
......@@ -173,8 +180,11 @@ export default {
...mapActions('community', ['resetPublicState']),
},
beforeRouteEnter(to, from, next) {
store
.dispatch('community/loadItem', to.params.itemId)
store.dispatch(
'community/loadItem',
{
itemId: to.params.itemId,
})
.then(() => next());
},
beforeRouteLeave(to, from, next) {
......
......@@ -49,17 +49,28 @@ describe('store/community', () => {
})
})
describe('loadItem', () => {
beforeEach(async () => {
getStub.resolves({data: { id: objectId }})
await store.dispatch('community/loadItem', objectId)
})
it('should get item detail', () => {
it('should get item detail', async () => {
getStub.resolves({data: { id: objectId}})
await store.dispatch('community/loadItem', { itemId: objectId, withTemplate: false})
expect(getStub.calledOnce, 'api call').to.be.true
expect(getStub.firstCall.args[0]).to.equal(`items/${objectId}/`, 'url check')
})
it('should load item with received data', () => {
it('should load item with received data', async () => {
getStub.resolves({data: { id: objectId}})
await store.dispatch('community/loadItem', { itemId: objectId, withTemplate: false})
expect(store.getters['community/currentItem'].id).to.equal(objectId)
})
it('should load template with received templateId if not specify', async () => {
const templateId = "xx"
const dispatchSpy = sinon.spy(store, 'dispatch')
getStub.resolves({data: { id: objectId, set: { templateId } }})
await store.dispatch('community/loadItem', { itemId: objectId})
expect(dispatchSpy.calledTwice, 'extra dispatch').to.be.true
const [action, param] = dispatchSpy.secondCall.args
dispatchSpy.restore()
expect(action).to.equal('community/loadTemplate', 'action check')
expect(param).to.equal(templateId, 'payload check')
})
})
})
describe('lists', () => {
......
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