FrontEnd/src/index.ts

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);
}
});