ss

src/components/animation/inputing.vue

@@ -26,7 +26,7 @@
 .dots > div {
   width: 4em;
   height: 4em;
-  background-color: #3cefff;
+  background-color: #7fe7c4;
   border-radius: 50%;
   animation: fade 1.5s alternate ease-in-out infinite;
 }

src/components/animation/loding.vue

@@ -19,7 +19,7 @@ div::before {
   left: -3px;
   width: 20em;
   height: 20em;
-  background-color: hsla(185, 100%, 62%, 0.75);
+  background-color: hsla(185, 65%, 58%, 0.75);
   transform-origin: center bottom;
   transform: scaleY(1);
   animation: fill 3s linear infinite;

src/components/animation/lodingSpin.vue

@@ -25,8 +25,8 @@
 .middle,
 .inner {
   border: 3px solid transparent;
-  border-top-color: #3cefff;
-  border-right-color: #3cefff;
+  border-top-color: #7fe7c4;
+  border-right-color: #7fe7c4;
   border-radius: 50%;
   position: absolute;
   top: 50%;

src/components/animation/recording.vue

@@ -19,7 +19,7 @@
 span {
   width: 3em;
   height: 6em;
-  background-color: #3cefff;
+  background-color: #7fe7c4;
 }
 
 span:nth-of-type(1) {

src/views/chat/components/Message/index.vue

@@ -21,6 +21,7 @@ interface Props {
 interface Emit {
   (ev: 'regenerate'): void
   (ev: 'delete'): void
+  (ev: 'changeNowStatus'): string
 }
 
 const props = defineProps<Props>()
@@ -97,6 +98,7 @@ let sok = false
 async function radioPlay() {
   console.log('播放', props.mp3)
   audioElements.length = 0
+	emit('changeNowStatus', 'loding')
   const socket = new WebSocket('wss://chat.lihaink.cn/zhanti/tts')
   sok = true
 
@@ -166,8 +168,12 @@ const onAudioEnd = (index: any) => {
   if (playing < audioElements.length) {
     playFlag = true
     audioElements[playing].play()
+		emit('changeNowStatus', 'playing')
   }
-  else { playStatus.value = 'end' }
+  else {
+		playStatus.value = 'end';
+		emit('changeNowStatus', 'input')
+	}
 }
 // 创建音频对象的数组
 const audioElements = reactive([])
@@ -175,6 +181,7 @@ const audioElements = reactive([])
 const playAudio = (playIndex: any) => {
   // for (let i = 0; i < audioElements.length; i++)
   audioElements[0].play()
+	emit('changeNowStatus', 'playing')
 }
 
 watch(() => audioElements.length, (newVal, oldVal) => {
@@ -191,11 +198,13 @@ let pauseIndex = -1
 const pauseAudio = () => {
   pauseIndex = playing + 0
   playStatus.value = 'pause'
+	emit('changeNowStatus', 'input')
   for (let i = 0; i < audioElements.length; i++)
     audioElements[i].pause()
 }
 const noPauseAudio = () => {
   playStatus.value = 'playing'
+	emit('changeNowStatus', 'playing')
   audioElements[pauseIndex].play()
   pauseIndex = -1
 }

src/views/chat/index.vue

@@ -218,7 +218,7 @@ async function onConversation() {
           // console.log(`收到消息: `, msg.payload.choices.text[0].content);
           // console.log(`当前消息: `, dataSources.value[dataSources.value.length - 1].text);
           lastText += msg.payload.choices.text[0].content
-          const loading = true
+          const loading = false
           nowStart.value = false
           updateChat(
             +uuid,
@@ -588,6 +588,18 @@ const footerClass = computed(() => {
   return classes
 })
 
+// 改变状态
+const changeNowStatus = (e:any)=>{
+	console.log('收到数据',e);
+	if(e!=nowStatus.value){
+		switch(e){
+			case 'playing': nowStatus.value = 'record';break;
+			case 'loding': nowStatus.value = 'loding';break;
+			default: nowStatus.value = 'input';break;
+		}
+	}
+}
+
 onMounted(() => {
   scrollToBottom()
   if (inputRef.value && !isMobile.value)
@@ -606,9 +618,9 @@ window.addEventListener('test', (e) => {
     prompt.value = window.winText
 })
 
-// setTimeout(() => {
-//   nowStart.value = false
-// }, 800)
+setTimeout(() => {
+  nowStart.value = false
+}, 800)
 </script>
 
 <template>
@@ -669,6 +681,7 @@ window.addEventListener('test', (e) => {
                     :inversion="item.inversion"
                     :error="item.error"
                     :loading="item.loading"
+										@changeNowStatus="changeNowStatus"
                     @regenerate="onRegenerate(index)"
                     @delete="handleDelete(index)"
                   />