68 lines
1.6 KiB
TypeScript
68 lines
1.6 KiB
TypeScript
|
import Vue from "vue";
|
||
|
import VGC from "./components/Video_Grid.vue";
|
||
|
import SCH from "./components/Search.vue";
|
||
|
import VTBL from "./components/Video_Table.vue";
|
||
|
import CTBL from "./components/Channel_Table.vue";
|
||
|
import CADD from "./components/Channel_Add.vue";
|
||
|
import './index.css';
|
||
|
import { Video, search_videos, Channel, search_channels } from "./dumbyt";
|
||
|
|
||
|
let MainApp = new Vue({
|
||
|
el: "#app",
|
||
|
template: `
|
||
|
<div>
|
||
|
<SCH v-on:search_complete="search_completed"/>
|
||
|
<VGC v-bind:Videos="Videos"/>
|
||
|
</div>
|
||
|
`,
|
||
|
components: {
|
||
|
SCH,
|
||
|
VGC
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
Videos: Array<Video>()
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
// Callback for when the search component got results back.
|
||
|
search_completed(videos : Array<Video>) : void {
|
||
|
this.Videos = videos;
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
|
||
|
let AdminApp = new Vue({
|
||
|
el: "#admin_app",
|
||
|
template: `
|
||
|
<div>
|
||
|
<SCH v-on:search_complete="search_completed"/>
|
||
|
<CADD/>
|
||
|
<CTBL v-bind:Channels="Channels"/>
|
||
|
<VTBL v-bind:Videos="Videos"/>
|
||
|
</div>
|
||
|
`,
|
||
|
components: {
|
||
|
SCH,
|
||
|
CADD,
|
||
|
CTBL,
|
||
|
VTBL
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
Videos: Array<Video>(),
|
||
|
Channels: Array<Channel>()
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
// Callback for when the search component got results back.
|
||
|
search_completed(videos : Array<Video>) : void {
|
||
|
this.Videos = videos;
|
||
|
}
|
||
|
},
|
||
|
mounted(){
|
||
|
// Populate the channels field immediatly on start up.
|
||
|
search_channels("").then(channels => this.Channels = channels);
|
||
|
}
|
||
|
});
|