You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
40 lines
1.0 KiB
40 lines
1.0 KiB
import { gMainApp, gEventBus, gUrlParams } from "./MainApp.js" ;
|
|
|
|
// --------------------------------------------------------------------
|
|
|
|
gMainApp.component( "content-pane", {
|
|
|
|
props: [ "contentDocs" ],
|
|
|
|
template: `
|
|
<tabbed-pages ref="tabbedPages">
|
|
<tabbed-page v-for="doc in contentDocs" :tabId=doc.docId :caption=doc.title >
|
|
<content-doc :doc=doc />
|
|
</tabbed-page>
|
|
</tabbed-pages>`,
|
|
|
|
mounted() {
|
|
gEventBus.on( "show-content-doc", (docId) => {
|
|
this.$refs.tabbedPages.activateTab( docId ) ; // nb: tabId == docId
|
|
} ) ;
|
|
},
|
|
|
|
} ) ;
|
|
|
|
// --------------------------------------------------------------------
|
|
|
|
gMainApp.component( "content-doc", {
|
|
|
|
props: [ "doc" ],
|
|
data() { return {
|
|
noContent: gUrlParams.get( "no-content" ),
|
|
} ; },
|
|
|
|
template: `
|
|
<div class="content-doc">
|
|
<div v-if=noContent class="disabled"> Content disabled. </div>
|
|
<iframe v-else-if=doc.url :src=doc.url />
|
|
<div v-else class="disabled"> No content. </div>
|
|
</div>`,
|
|
|
|
} ) ;
|
|
|