weipengfei
/
dataV-xunfei
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

gengx

This commit is contained in:
shengchanzhe 2023-10-15 13:42:20 +08:00
parent 95a6257c53
commit 92d1685688
4 changed files with 151 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
index.js
View File

@ -210,5 +210,4 @@ function RecordXunfei() {
// 结束录音
recorder.stop()
}
return window.winText
}

22
src/components/animation/lodingCir.vue
View File

@ -1,14 +1,28 @@
<template>
<div />
<div style="position: relative;">
<div class="div" />
<p class="text">
正在唤起录音
</p>
</div>
</template>
<style scoped>
div {
.text{
display: block;
width: 100%;
font-size: 1.5em;
text-align: center;
position: absolute;
left: 0;
bottom: -2em;
}
.div {
width: 20em;
height: 20em;
border: 3em solid transparent;
border-top-color: #3cefff;
border-bottom-color: #3cefff;
border-top-color: #7fe7c4;
border-bottom-color: #7fe7c4;
border-radius: 50%;
animation: spin-stretch 1.5s ease infinite;
}

5
src/views/chat/components/Message/index.vue
View File

@ -297,12 +297,15 @@ const pauseAudio = () => {
const noPauseAudio = () => {
playStatus.value = 'playing'
emit('changeNowStatus', 'playing')
audioElements[pauseIndex].play()
audioElements[pauseIndex]?.play()
pauseIndex = -1
}
defineExpose({
stopPlay,
pauseAudio,
noPauseAudio,
radioPlay,
})
</script>

159
src/views/chat/index.vue
View File

@ -4,11 +4,10 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import { storeToRefs } from 'pinia'
import {
NAutoComplete,
NButton,
NInput,
useDialog,
useMessage,
} from 'naive-ui'
import html2canvas from 'html2canvas'
import { Message } from './components'
@ -16,7 +15,7 @@ import { useScroll } from './hooks/useScroll'
import { useChat } from './hooks/useChat'
import { useUsingContext } from './hooks/useUsingContext'
import HeaderComponent from './components/Header/index.vue'
import { HoverButton, SvgIcon } from '@/components/common'
import { SvgIcon } from '@/components/common'
import { useBasicLayout } from '@/hooks/useBasicLayout'
import { useChatStore, usePromptStore } from '@/store'
import { fetchChatAPIProcess } from '@/api'
@ -25,6 +24,7 @@ import indexBG from '@/components/animation/indexBG.vue'
import recording from '@/components/animation/recording.vue'
import inputing from '@/components/animation/inputing.vue'
import lodingSpin from '@/components/animation/lodingSpin.vue'
import lodingCir from '@/components/animation/lodingCir.vue'
import playing from '@/components/animation/playing.vue'
// import IatRecorder from '@/utils/larRcorder.js'
@ -33,7 +33,7 @@ import playing from '@/components/animation/playing.vue'
// let socket = new WebSocket("wss://chat.lihaink.cn/chat");
const maxWeight = ref(1200)
const maxWeight = ref(2500)
const messageRef = ref(null)
@ -58,32 +58,112 @@ const recordFalg = ref(0)
* stop 停止播放
* re-play 重新播放
*/
const runOrder = (e)=>{
switch(e){
case 'start': startOrder();break;
case 'end':endOrder();break;
const runOrder = (e) => {
switch (e) {
case 'start': startOrder(); break
case 'end':endOrder(); break
case 're':reOrder(); break
case 'clear':cleatOrder(); break
case 'pause':pauseOrder(); break
case 'play':playOrder(); break
case 'stop':stopOrder(); break
case 're-play':rePlayOrder(); break
default: console.log('无效指令')
}
}
const startOrder = ()=>{
const startOrder = () => {
if (recordFalg.value == 0) {
RecordXunfei()
nowStatus.value = 'run'
if (messageRef.value?.length > 0)
messageRef.value[messageRef.value.length - 1].stopPlay()
setTimeout(() => {
recordFalg.value = 1
nowStatus.value = 'record'
}else {
console.log('无效指令');
}, 1000)
}
else {
console.log('无效指令')
}
}
const endOrder = ()=>{
if(recordFalg.value==1){
const endOrder = () => {
if (recordFalg.value == 1) {
RecordXunfei()
recordFalg.value = 0
nowStatus.value = 'loding'
handleSubmit()
}else {
console.log('无效指令');
}
else {
console.log('无效指令')
}
}
const reOrder = () => {
if (recordFalg.value == 1) {
RecordXunfei() // 结束
recordFalg.value = 0
nowStatus.value = 'run'
prompt.value = ''
if (messageRef.value?.length > 0)
messageRef.value[messageRef.value.length - 1].stopPlay()
setTimeout(() => {
prompt.value = ''
RecordXunfei() // 重新开始
setTimeout(() => {
prompt.value = ''
recordFalg.value = 1
nowStatus.value = 'record'
}, 500)
}, 2500)
}
else {
console.log('无效指令')
}
}
const cleatOrder = () => {
if (recordFalg.value == 1) {
RecordXunfei()
recordFalg.value = 0
}
if (messageRef.value?.length > 0)
messageRef.value[messageRef.value.length - 1].stopPlay()
if (socket?.readyState < 2)
socket.close()
chatStore.getChatByUuid(+uuid).length = 0
nowStatus.value = 'input'
}
const pauseOrder = () => {
if (messageRef.value?.length > 0)
messageRef.value[messageRef.value.length - 1].pauseAudio()
else
console.log('无效指令')
}
const playOrder = () => {
if (messageRef.value?.length > 0)
messageRef.value[messageRef.value.length - 1].noPauseAudio()
else
console.log('无效指令')
}
const stopOrder = () => {
if (messageRef.value?.length > 0) {
nowStatus.value = 'input'
messageRef.value[messageRef.value.length - 1].stopPlay()
}
else { console.log('无效指令') }
}
const rePlayOrder = () => {
if (messageRef.value?.length > 0) {
messageRef.value[messageRef.value.length - 1].stopPlay()
messageRef.value[messageRef.value.length - 1].radioPlay()
}
else { console.log('无效指令') }
}
// 假设用户uid为1
@ -140,7 +220,7 @@ const conversationList = computed(() =>
const prompt = ref<string>('')
const loading = ref<boolean>(false)
const inputRef = ref<Ref | null>(null)
const nowStatus = ref('input') // 当前系统状态, input等待, loding加载, record录音,playing播放
const nowStatus = ref('input') // 当前系统状态, input等待, loding加载, record录音,playing播放, run启动中
const nowStart = ref(true) // 当前是否有消息, 有才显示聊天记录
// 添加PromptStore
@ -155,7 +235,13 @@ dataSources.value.forEach((item, index) => {
updateChatSome(+uuid, index, { loading: false })
})
function handleSubmit() {
const messageUI = useMessage()
async function handleSubmit() {
if (prompt.value.trim() == '') {
nowStatus.value = 'input'
return messageUI.error('不可发送空内容')
}
if (recordFalg.value == 1) {
RecordXunfei()
recordFalg.value = 0
@ -228,6 +314,15 @@ async function onConversation() {
if (lastContext && usingContext.value)
options = { ...lastContext }
let infoList = JSON.parse(JSON.stringify(dataSources.value))
infoList = infoList.slice(-20)
infoList = infoList.map((item: any, index: any) => {
return {
role: index % 2 == 0 ? 'user' : 'assistant',
content: item.text,
}
})
addChat(+uuid, {
dateTime: new Date().toLocaleString(),
text: '思考中',
@ -240,16 +335,7 @@ async function onConversation() {
})
scrollToBottom()
let infoList = JSON.parse(JSON.stringify(dataSources.value))
infoList = infoList.slice(-20)
infoList = infoList.map((item: any, index: any) => {
return {
role: index % 2 == 0 ? 'user' : 'assistant',
content: item.text,
}
})
console.log(dataSources.value)
// console.log(dataSources.value)
try {
let lastText = ''
@ -261,10 +347,6 @@ async function onConversation() {
tts: 1,
data: [
...infoList,
{
role: 'user',
content: message,
},
],
}))
@ -303,6 +385,7 @@ async function onConversation() {
}
}
catch (error) {
console.log(error)
nowStatus.value = 'input'
socket.close()
}
@ -695,7 +778,7 @@ setTimeout(() => {
<!-- <loding v-else-if="nowStatus=='loding'" key="loding"></loding> -->
<lodingSpin v-else-if="nowStatus == 'loding'" key="loding" />
<playing v-else-if="nowStatus == 'playing'" key="playing" />
<!-- <lodingCir v-else-if="nowStatus=='loding'" key="loding"></lodingCir> -->
<lodingCir v-else-if="nowStatus == 'run'" key="run" />
</transition>
</indexBG>
<transition name="slide-right-to-left">
@ -765,7 +848,7 @@ setTimeout(() => {
</div>
</div>
</main>
<footer :class="footerClass">
<!-- <footer :class="footerClass">
<div
class="w-full max-w-screen-xl m-auto"
:style="{ 'max-width': `${maxWeight}px` }"
@ -786,12 +869,12 @@ setTimeout(() => {
<SvgIcon icon="ri:delete-bin-line" />
</span>
</HoverButton>
<!-- <HoverButton v-if="!isMobile" @click="handleExport">
<HoverButton v-if="!isMobile" @click="handleExport">
<span class="text-xl text-[#4f555e] dark:text-white">
<SvgIcon icon="ri:download-2-line" />
</span>
</HoverButton> -->
<!-- <HoverButton @click="toggleUsingContext">
</HoverButton>
<HoverButton @click="toggleUsingContext">
<span
class="text-xl"
:class="{
@ -801,7 +884,7 @@ setTimeout(() => {
>
<SvgIcon icon="ri:chat-history-line" />
</span>
</HoverButton> -->
</HoverButton>
<NAutoComplete
v-model:value="prompt"
:options="searchOptions"
@ -833,7 +916,7 @@ setTimeout(() => {
</NButton>
</div>
</div>
</footer>
</footer> -->
</div>
</transition>
</div>