This commit is contained in:
shengchanzhe 2023-10-13 16:26:35 +08:00
parent a358efeebc
commit faee446b5a
1 changed files with 170 additions and 172 deletions

View File

@ -1,6 +1,6 @@
<script setup lang='ts'> <script setup lang='ts'>
import type { Ref } from 'vue' import type { Ref } from 'vue'
import { computed, onMounted, onUnmounted, reactive, ref } from 'vue' import { computed, onMounted, onUnmounted, ref } from 'vue'
import { useRoute } from 'vue-router' import { useRoute } from 'vue-router'
import { storeToRefs } from 'pinia' import { storeToRefs } from 'pinia'
import { import {
@ -21,15 +21,11 @@ import { useBasicLayout } from '@/hooks/useBasicLayout'
import { useChatStore, usePromptStore } from '@/store' import { useChatStore, usePromptStore } from '@/store'
import { fetchChatAPIProcess } from '@/api' import { fetchChatAPIProcess } from '@/api'
import { t } from '@/locales' import { t } from '@/locales'
import indexBG from "@/components/animation/indexBG.vue" import indexBG from '@/components/animation/indexBG.vue'
import recording from "@/components/animation/recording.vue" import recording from '@/components/animation/recording.vue'
import inputing from "@/components/animation/inputing.vue" import inputing from '@/components/animation/inputing.vue'
import loding from "@/components/animation/loding.vue" import lodingSpin from '@/components/animation/lodingSpin.vue'
import lodingCir from "@/components/animation/lodingCir.vue"
import lodingSpin from "@/components/animation/lodingSpin.vue"
import IatRecorder from '@/utils/test.js'
import { start } from 'repl'
// import IatRecorder from '@/utils/larRcorder.js' // import IatRecorder from '@/utils/larRcorder.js'
// import socket from "@/websocket/socket"; // import socket from "@/websocket/socket";
@ -100,6 +96,7 @@ const { scrollRef, scrollToBottom, scrollToBottomIfAtBottom } = useScroll()
const { usingContext, toggleUsingContext } = useUsingContext() const { usingContext, toggleUsingContext } = useUsingContext()
const { uuid } = route.params as { uuid: string } const { uuid } = route.params as { uuid: string }
chatStore.getChatByUuid(+uuid).length = 0
const dataSources = computed(() => chatStore.getChatByUuid(+uuid)) const dataSources = computed(() => chatStore.getChatByUuid(+uuid))
const conversationList = computed(() => const conversationList = computed(() =>
@ -241,7 +238,8 @@ async function onConversation() {
nowStatus.value = 'input' nowStatus.value = 'input'
socket.close() socket.close()
} }
} catch (error) { }
catch (error) {
nowStatus.value = 'input' nowStatus.value = 'input'
socket.close() socket.close()
} }
@ -601,7 +599,6 @@ onUnmounted(() => {
controller.abort() controller.abort()
}) })
window.winText = '' window.winText = ''
window.addEventListener('test', (e) => { window.addEventListener('test', (e) => {
@ -612,22 +609,21 @@ window.addEventListener('test', (e) => {
// setTimeout(()=>{ // setTimeout(()=>{
// nowStart.value = false; // nowStart.value = false;
// }, 800) // }, 800)
</script> </script>
<template> <template>
<div class="flex w-full h-full my-layout"> <div class="flex w-full h-full my-layout">
<indexBG v-if="!isMobile"> <indexBG v-if="!isMobile">
<transition mode="out-in" name="fade"> <transition mode="out-in" name="fade">
<inputing v-if="nowStatus=='input'" key="input"></inputing> <inputing v-if="nowStatus == 'input'" key="input" />
<recording v-else-if="nowStatus=='record'" key="record"></recording> <recording v-else-if="nowStatus == 'record'" key="record" />
<!-- <loding v-else-if="nowStatus=='loding'" key="loding"></loding> --> <!-- <loding v-else-if="nowStatus=='loding'" key="loding"></loding> -->
<lodingSpin v-else-if="nowStatus=='loding'" key="loding"></lodingSpin> <lodingSpin v-else-if="nowStatus == 'loding'" key="loding" />
<!-- <lodingCir v-else-if="nowStatus=='loding'" key="loding"></lodingCir> --> <!-- <lodingCir v-else-if="nowStatus=='loding'" key="loding"></lodingCir> -->
</transition> </transition>
</indexBG> </indexBG>
<transition name="slide-right-to-left"> <transition name="slide-right-to-left">
<div v-if="!nowStart" class="flex flex-col w-full h-full" :style="{'max-width': maxWeight + 'px'}"> <div v-if="!nowStart" class="flex flex-col w-full h-full" :style="{ 'max-width': `${maxWeight}px` }">
<HeaderComponent <HeaderComponent
v-if="isMobile" v-if="isMobile"
:using-context="usingContext" :using-context="usingContext"
@ -644,7 +640,7 @@ window.addEventListener('test', (e) => {
id="image-wrapper" id="image-wrapper"
class="w-full max-w-screen-xl m-auto dark:bg-[#101014]" class="w-full max-w-screen-xl m-auto dark:bg-[#101014]"
:class="[isMobile ? 'p-2' : 'p-4']" :class="[isMobile ? 'p-2' : 'p-4']"
:style="{'max-width': maxWeight + 'px'}" :style="{ 'max-width': `${maxWeight}px` }"
> >
<!-- <div @click="click">录音开始</div> --> <!-- <div @click="click">录音开始</div> -->
<!-- <div> <!-- <div>
@ -690,8 +686,10 @@ window.addEventListener('test', (e) => {
</div> </div>
</main> </main>
<footer :class="footerClass"> <footer :class="footerClass">
<div class="w-full max-w-screen-xl m-auto" <div
:style="{'max-width': maxWeight + 'px'}"> class="w-full max-w-screen-xl m-auto"
:style="{ 'max-width': `${maxWeight}px` }"
>
<div class="flex items-center justify-between space-x-2"> <div class="flex items-center justify-between space-x-2">
<HoverButton v-if="recordFalg == 0" @click="changeRecord"> <HoverButton v-if="recordFalg == 0" @click="changeRecord">
<span class="text-xl text-[#4f555e] dark:text-white"> <span class="text-xl text-[#4f555e] dark:text-white">