parent
ced3a15d00
commit
f45e92af1e
@ -0,0 +1,45 @@
|
|||||||
|
import { Component } from '../../lib/vues6/vues6.js'
|
||||||
|
import { event_bus } from '../service/EventBus.service.js'
|
||||||
|
|
||||||
|
const template = `
|
||||||
|
<coreid-root :page="page" :form_id="form_id" :resource="resource" :mode="mode" v-if="show"></coreid-root>
|
||||||
|
`
|
||||||
|
export default class OutletPageComponent extends Component {
|
||||||
|
static get selector() { return 'coreid-outlet' }
|
||||||
|
static get template() { return template }
|
||||||
|
static get props() { return ['initial_page', 'initial_form_id', 'initial_resource', 'initial_mode'] }
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super()
|
||||||
|
this.navigate_event = event_bus.event('root.navigate')
|
||||||
|
this.show = true
|
||||||
|
console.log('navigate event', this.navigate_event)
|
||||||
|
}
|
||||||
|
|
||||||
|
async vue_on_create() {
|
||||||
|
this.page = this.initial_page
|
||||||
|
this.form_id = this.initial_form_id
|
||||||
|
this.resource = this.initial_resource
|
||||||
|
this.mode = this.initial_mode
|
||||||
|
|
||||||
|
this.navigate_event.subscribe((props = {}) => {
|
||||||
|
console.log('navigation event', props)
|
||||||
|
this.page = props.page
|
||||||
|
this.form_id = props.form_id
|
||||||
|
this.resource = props.resource
|
||||||
|
this.mode = props.mode
|
||||||
|
this.rerender()
|
||||||
|
})
|
||||||
|
|
||||||
|
this.$forceUpdate()
|
||||||
|
}
|
||||||
|
|
||||||
|
rerender() {
|
||||||
|
this.show = false
|
||||||
|
this.$forceUpdate()
|
||||||
|
requestAnimationFrame(() => {
|
||||||
|
this.show = true
|
||||||
|
this.$forceUpdate()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,32 @@
|
|||||||
|
import { Component } from '../../lib/vues6/vues6.js'
|
||||||
|
|
||||||
|
const template = `
|
||||||
|
<span>
|
||||||
|
<coreid-profile-edit v-if="page === 'dash.profile'"></coreid-profile-edit>
|
||||||
|
<coreid-app-setup v-if="page === 'app.setup'"></coreid-app-setup>
|
||||||
|
<cobalt-form
|
||||||
|
v-if="page === 'cobalt.form' && form_id"
|
||||||
|
:resource="resource"
|
||||||
|
:form_id="form_id"
|
||||||
|
:initial_mode="mode"
|
||||||
|
></cobalt-form>
|
||||||
|
<cobalt-form
|
||||||
|
v-if="page === 'cobalt.form' && !form_id"
|
||||||
|
:resource="resource"
|
||||||
|
:initial_mode="mode"
|
||||||
|
></cobalt-form>
|
||||||
|
<cobalt-listing
|
||||||
|
v-if="page === 'cobalt.listing'"
|
||||||
|
:resource="resource"
|
||||||
|
></cobalt-listing>
|
||||||
|
</span>
|
||||||
|
`
|
||||||
|
export default class RootPageComponent extends Component {
|
||||||
|
static get selector() { return 'coreid-root' }
|
||||||
|
static get template() { return template }
|
||||||
|
static get props() { return ['page', 'form_id', 'resource', 'mode'] }
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super()
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in new issue