wsb1224
c8832ae50c
progressStatus was referenced in the template but never defined, causing a Vue runtime warning on every render. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
151 lines
3.7 KiB
Vue
151 lines
3.7 KiB
Vue
<template>
|
|
<div class="ppt-parsing">
|
|
<el-card shadow="never" class="parsing-card">
|
|
<template #header>
|
|
<div class="card-header">
|
|
<el-icon><Loading /></el-icon>
|
|
<span>AI 智能解析</span>
|
|
</div>
|
|
</template>
|
|
|
|
<div v-if="parsing" class="parsing-status">
|
|
<el-progress
|
|
type="circle"
|
|
:percentage="progress"
|
|
:status="progressStatus"
|
|
:width="120"
|
|
/>
|
|
<p class="status-text">{{ statusText }}</p>
|
|
<p class="status-hint">正在分析 PDF 计划书，请稍候...</p>
|
|
</div>
|
|
|
|
<div v-else-if="error" class="parsing-error">
|
|
<el-result icon="error" :title="error" sub-title="解析过程出错">
|
|
<template #extra>
|
|
<el-button @click="$emit('back')">返回上传</el-button>
|
|
</template>
|
|
</el-result>
|
|
</div>
|
|
|
|
<div v-else-if="results.length" class="parsing-results">
|
|
<el-result icon="success" title="解析完成">
|
|
<template #extra>
|
|
<el-button type="primary" @click="$emit('parsed')">下一步：生成 PPT</el-button>
|
|
</template>
|
|
</el-result>
|
|
|
|
<el-table :data="results" stripe style="width: 100%">
|
|
<el-table-column prop="pdfName" label="文件名" />
|
|
<el-table-column prop="planType" label="类型" width="100">
|
|
<template #default="{ row }">
|
|
<el-tag :type="typeTagMap[row.planType] || 'info'" size="small">
|
|
{{ typeNameMap[row.planType] || row.planType }}
|
|
</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="productName" label="产品名称" />
|
|
<el-table-column prop="status" label="状态" width="100">
|
|
<template #default="{ row }">
|
|
<el-tag :type="row.status === 'success' ? 'success' : 'danger'" size="small">
|
|
{{ row.status === 'success' ? '成功' : '失败' }}
|
|
</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="yearCount" label="数据行数" width="100" />
|
|
</el-table>
|
|
</div>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, computed, onMounted } from 'vue'
|
|
import { Loading } from '@element-plus/icons-vue'
|
|
import { pptApi } from '@/utils/ppt-api'
|
|
|
|
const props = defineProps<{
|
|
sessionId: string
|
|
}>()
|
|
|
|
const emit = defineEmits<{
|
|
parsed: []
|
|
back: []
|
|
}>()
|
|
|
|
const parsing = ref(true)
|
|
const progress = ref(0)
|
|
const statusText = ref('准备解析...')
|
|
const error = ref('')
|
|
const results = ref<any[]>([])
|
|
const progressStatus = computed(() => (progress.value >= 100 ? 'success' : ''))
|
|
|
|
const typeTagMap: Record<string, string> = {
|
|
savings: 'success',
|
|
ci: 'warning',
|
|
iul: 'info',
|
|
}
|
|
const typeNameMap: Record<string, string> = {
|
|
savings: '储蓄险',
|
|
ci: '重疾险',
|
|
iul: 'IUL',
|
|
}
|
|
|
|
onMounted(async () => {
|
|
try {
|
|
progress.value = 20
|
|
statusText.value = '正在调用 AI 解析...'
|
|
|
|
const res: any = await pptApi.parse(props.sessionId)
|
|
progress.value = 100
|
|
statusText.value = '解析完成'
|
|
|
|
results.value = res?.data?.extractions || []
|
|
parsing.value = false
|
|
} catch (e: any) {
|
|
parsing.value = false
|
|
error.value = e?.message || '解析失败'
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.ppt-parsing {
|
|
width: 100%;
|
|
max-width: 700px;
|
|
}
|
|
|
|
.parsing-card {
|
|
width: 100%;
|
|
}
|
|
|
|
.card-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.parsing-status {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 16px;
|
|
padding: 40px 0;
|
|
}
|
|
|
|
.status-text {
|
|
font-size: 16px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.status-hint {
|
|
color: #909399;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.parsing-results {
|
|
padding: 20px 0;
|
|
}
|
|
</style>
|