<script setup>
import { getAISummary } from '../api'
import { aiStreamParse } from '@/utils/parse'
import VueMarkdown from 'vue-markdown-render'

const content = ref('')
const isLoading = ref(false)
async function fetchAI() {
  isLoading.value = true
  const stream = await getAISummary()
  aiStreamParse(stream, (json, messageContent) => {
    content.value += messageContent
  })
  isLoading.value = false
}
onMounted(() => {
  fetchAI()
})
</script>

<template>
  <el-dialog title="AI标签建议">
    <div v-loading="isLoading">
      <VueMarkdown :source="content" class="markdown-body" />
    </div>
    <template #footer>
      <el-row justify="center">
        <el-button round @click="$emit('update:modelValue', false)">关闭</el-button>
      </el-row>
    </template>
  </el-dialog>
</template>
