import { ref } from "vue"
import { message } from "ant-design-vue"

export function useRecording() {
  const isRecording = ref(false)
  const mediaRecorder = ref(null)
  const audioChunks = ref([])

  const startRecording = () => {
    if (isRecording.value) return

    navigator.mediaDevices
      .getUserMedia({ audio: true })
      .then((stream) => {
        isRecording.value = true
        audioChunks.value = []

        mediaRecorder.value = new MediaRecorder(stream)

        mediaRecorder.value.ondataavailable = (event) => {
          audioChunks.value.push(event.data)
        }

        mediaRecorder.value.onstop = () => {
          const audioBlob = new Blob(audioChunks.value, { type: "audio/wav" })
          const audioUrl = URL.createObjectURL(audioBlob)

          // 这里可以触发发送音频消息的事件
          // 或者调用父组件的方法

          // 停止所有音频轨道
          stream.getTracks().forEach((track) => track.stop())
        }

        mediaRecorder.value.start()
      })
      .catch((error) => {
        console.error("录音失败:", error)
        message.error("无法访问麦克风，请检查权限设置")
        isRecording.value = false
      })
  }

  const stopRecording = () => {
    if (!isRecording.value || !mediaRecorder.value) return

    isRecording.value = false
    mediaRecorder.value.stop()
  }

  return {
    isRecording,
    startRecording,
    stopRecording,
  }
}