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