| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657 |
- <template>
- <div id="app">
- <div class="nav">
- <button @click="currentView = 'dashboard'">实时大屏</button>
- <button @click="currentView = 'console'">中控台</button>
- </div>
- <component :is="currentView" :liveId="liveId"></component>
- </div>
- </template>
- <script>
- import LiveDashboard from './LiveDashboard.vue';
- import LiveConsole from './LiveConsole.vue';
- export default {
- name: 'LiveConsole',
- components: {
- dashboard: LiveDashboard,
- console: LiveConsole
- },
- data() {
- return {
- liveId: this.$route.params.liveId,
- currentView: 'dashboard'
- };
- },
- created() {
- }
- };
- </script>
- <style>
- body {
- margin: 0;
- font-family: 'Arial', sans-serif;
- }
- .nav {
- display: flex;
- background: #1e3a8a;
- color: white;
- }
- .nav button {
- padding: 15px 20px;
- border: none;
- background: none;
- color: white;
- cursor: pointer;
- font-size: 16px;
- }
- .nav button:hover {
- background: #3b82f6;
- }
- </style>
|