57 lines
1.0 KiB
Vue
57 lines
1.0 KiB
Vue
<script setup>
|
|
import ChatInterface from './components/ChatInterface.vue'
|
|
import ChatModeSelector from './components/ChatModeSelector.vue'
|
|
import { ref } from 'vue'
|
|
|
|
const currentMode = ref({
|
|
id: 'training',
|
|
token: 'app-88ae2GN49aUyNO6qGg7tbTfX'
|
|
})
|
|
|
|
const handleModeChange = (mode) => {
|
|
currentMode.value = mode
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="app">
|
|
<div class="app-container">
|
|
<ChatModeSelector @mode-changed="handleModeChange" />
|
|
<div class="chat-wrapper">
|
|
<ChatInterface :chatMode="currentMode" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
|
|
}
|
|
|
|
.app {
|
|
height: 100vh;
|
|
width: 100vw;
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
.app-container {
|
|
height: 100%;
|
|
display: flex;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.chat-wrapper {
|
|
flex: 1;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
background-color: #f5f5f5;
|
|
position: relative;
|
|
}
|
|
</style>
|