48 lines
952 B
Vue
48 lines
952 B
Vue
<template>
|
|
<div id="app">
|
|
<section class="hero">
|
|
<div class="hero-body">
|
|
<div class="container">
|
|
<h1 class="title">{{ title }}</h1>
|
|
<h2 class="subtitle">{{ subtitle }}</h2>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<div class="container">
|
|
<ConnectForm v-if="!isConnected" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { Component, Vue } from "vue-property-decorator";
|
|
import { State } from "vuex-class";
|
|
import ConnectForm from "@/components/ConnectForm.vue";
|
|
import RoomList from "@/components/RoomList.vue";
|
|
import { ServerState } from "./store/server";
|
|
|
|
@Component({
|
|
components: {
|
|
ConnectForm,
|
|
RoomList
|
|
}
|
|
})
|
|
export default class App extends Vue {
|
|
@State("server") private server!: ServerState;
|
|
|
|
private title!: string;
|
|
private subtitle!: string;
|
|
|
|
private data() {
|
|
return {
|
|
title: "Cardgage web client",
|
|
subtitle: ""
|
|
};
|
|
}
|
|
|
|
private get isConnected() {
|
|
return this.server.connected;
|
|
}
|
|
}
|
|
</script>
|