优化非遗传承页面
This commit is contained in:
parent
29fd6a779b
commit
08bdd86007
@ -30,7 +30,8 @@
|
||||
<div v-for="item in currentHeritageList" :key="item.id" class="heritage-item card">
|
||||
<div class="heritage-image">
|
||||
<div class="image-placeholder">
|
||||
<svg viewBox="0 0 200 150" width="100%" height="150">
|
||||
<img v-if="item.coverImage" :src="getFileAccessHttpUrl(item.coverImage)" :alt="item.name" class="heritage-cover-image" />
|
||||
<svg v-else viewBox="0 0 200 150" width="100%" height="150">
|
||||
<rect width="200" height="150" :fill="item.color" opacity="0.2"/>
|
||||
<circle cx="100" cy="75" r="30" :fill="item.color" opacity="0.5"/>
|
||||
<text x="100" y="85" text-anchor="middle" :fill="item.color"
|
||||
@ -597,11 +598,6 @@ const protectionStats = ref({
|
||||
const getProtectionStats = async () => {
|
||||
console.log('=== 开始获取保护现状统计数据 ===')
|
||||
try {
|
||||
// 获取级别统计
|
||||
console.log('调用API: getLevelStats')
|
||||
const statsResponse = await heritageApi.getLevelStats()
|
||||
console.log('级别统计数据完整响应:', JSON.stringify(statsResponse, null, 2))
|
||||
|
||||
// 重置统计数据
|
||||
protectionStats.value = {
|
||||
national: 0,
|
||||
@ -610,57 +606,90 @@ const getProtectionStats = async () => {
|
||||
inheritors: 0
|
||||
}
|
||||
|
||||
// 处理响应数据 - 检查是否有result字段
|
||||
let dataArray = null
|
||||
if (statsResponse?.result && Array.isArray(statsResponse.result)) {
|
||||
// 包含result字段的对象（正确的API响应格式）
|
||||
dataArray = statsResponse.result
|
||||
console.log('响应包含result字段，数组长度:', dataArray.length)
|
||||
} else if (Array.isArray(statsResponse)) {
|
||||
// 直接是数组
|
||||
dataArray = statsResponse
|
||||
console.log('响应是直接数组，长度:', dataArray.length)
|
||||
} else {
|
||||
console.log('API响应格式不正确:', statsResponse)
|
||||
console.log('statsResponse?.result:', statsResponse?.result)
|
||||
console.log('Array.isArray(statsResponse):', Array.isArray(statsResponse))
|
||||
// 获取各级别的非遗项目数据来统计数量
|
||||
const [nationalResponse, provincialResponse, municipalResponse] = await Promise.all([
|
||||
heritageApi.getProjectsByLevel('国家级'),
|
||||
heritageApi.getProjectsByLevel('省级'),
|
||||
heritageApi.getProjectsByLevel('市级')
|
||||
])
|
||||
|
||||
console.log('=== API响应详情 ===')
|
||||
console.log('国家级项目完整响应:', JSON.stringify(nationalResponse, null, 2))
|
||||
console.log('省级项目完整响应:', JSON.stringify(provincialResponse, null, 2))
|
||||
console.log('市级项目完整响应:', JSON.stringify(municipalResponse, null, 2))
|
||||
|
||||
// 提取实际数据数组并统计数量
|
||||
const extractData = (response: any) => {
|
||||
console.log('提取数据，响应类型:', typeof response)
|
||||
console.log('响应内容:', response)
|
||||
|
||||
// 检查各种可能的数据结构
|
||||
if (response?.result && Array.isArray(response.result)) {
|
||||
console.log('使用 response.result，长度:', response.result.length)
|
||||
return response.result
|
||||
}
|
||||
if (response?.data?.result && Array.isArray(response.data.result)) {
|
||||
console.log('使用 response.data.result，长度:', response.data.result.length)
|
||||
return response.data.result
|
||||
}
|
||||
if (response?.data?.records && Array.isArray(response.data.records)) {
|
||||
console.log('使用 response.data.records，长度:', response.data.records.length)
|
||||
return response.data.records
|
||||
}
|
||||
if (response?.data && Array.isArray(response.data)) {
|
||||
console.log('使用 response.data，长度:', response.data.length)
|
||||
return response.data
|
||||
}
|
||||
if (Array.isArray(response)) {
|
||||
console.log('直接使用响应数组，长度:', response.length)
|
||||
return response
|
||||
}
|
||||
|
||||
console.log('未找到有效数据数组，返回空数组')
|
||||
return []
|
||||
}
|
||||
|
||||
if (dataArray && Array.isArray(dataArray)) {
|
||||
// 处理统计数据 - 后端返回的是带count字段的统计对象
|
||||
dataArray.forEach((item: any, index: number) => {
|
||||
console.log(`处理统计项 [${index}]:`, JSON.stringify(item, null, 2))
|
||||
const nationalProjects = extractData(nationalResponse)
|
||||
const provincialProjects = extractData(provincialResponse)
|
||||
const municipalProjects = extractData(municipalResponse)
|
||||
|
||||
const level = item.heritage_level || item.heritageLevel
|
||||
const count = item.count || 0
|
||||
console.log('项目级别:', level, '数量:', count)
|
||||
console.log('=== 提取的项目数据 ===')
|
||||
console.log('国家级项目数据:', nationalProjects)
|
||||
console.log('省级项目数据:', provincialProjects)
|
||||
console.log('市级项目数据:', municipalProjects)
|
||||
|
||||
if (level === '国家级') {
|
||||
protectionStats.value.national = count
|
||||
console.log('设置国家级数量:', count)
|
||||
} else if (level === '省级') {
|
||||
protectionStats.value.provincial = count
|
||||
console.log('设置省级数量:', count)
|
||||
} else if (level === '市级') {
|
||||
protectionStats.value.municipal = count
|
||||
console.log('设置市级数量:', count)
|
||||
} else {
|
||||
console.log('未识别的级别:', level)
|
||||
}
|
||||
})
|
||||
}
|
||||
// 统计各级别项目数量
|
||||
protectionStats.value.national = nationalProjects.length
|
||||
protectionStats.value.provincial = provincialProjects.length
|
||||
protectionStats.value.municipal = municipalProjects.length
|
||||
|
||||
console.log('=== 统计结果 ===')
|
||||
console.log('国家级项目数量:', protectionStats.value.national)
|
||||
console.log('省级项目数量:', protectionStats.value.provincial)
|
||||
console.log('市级项目数量:', protectionStats.value.municipal)
|
||||
|
||||
// 获取传承人数量
|
||||
console.log('调用API: getInheritorList')
|
||||
console.log('=== 获取传承人数据 ===')
|
||||
const inheritorResponse = await heritageApi.getInheritorList({
|
||||
pageNo: 1,
|
||||
pageSize: 1000
|
||||
})
|
||||
|
||||
console.log('传承人API完整响应:', JSON.stringify(inheritorResponse, null, 2))
|
||||
|
||||
if (inheritorResponse?.total) {
|
||||
protectionStats.value.inheritors = inheritorResponse.total
|
||||
console.log('使用total字段，传承人数量:', inheritorResponse.total)
|
||||
} else if (inheritorResponse?.records) {
|
||||
protectionStats.value.inheritors = inheritorResponse.records.length
|
||||
// 只统计状态为启用的传承人
|
||||
const activeInheritors = inheritorResponse.records.filter((inheritor: any) => inheritor.status === 1)
|
||||
protectionStats.value.inheritors = activeInheritors.length
|
||||
console.log('使用records字段过滤后，传承人数量:', activeInheritors.length)
|
||||
console.log('所有传承人记录数:', inheritorResponse.records.length)
|
||||
} else if (inheritorResponse?.data?.records) {
|
||||
const activeInheritors = inheritorResponse.data.records.filter((inheritor: any) => inheritor.status === 1)
|
||||
protectionStats.value.inheritors = activeInheritors.length
|
||||
console.log('使用data.records字段过滤后，传承人数量:', activeInheritors.length)
|
||||
}
|
||||
|
||||
console.log('=== 最终保护现状统计 ===:', protectionStats.value)
|
||||
@ -900,6 +929,7 @@ const getHeritageItems = async () => {
|
||||
currentStatus: project.currentStatus || '保护良好',
|
||||
viewCount: project.viewCount || 0,
|
||||
likeCount: project.likeCount || 0,
|
||||
year: project.approvalYear || '未知',
|
||||
craftProcess: project.craftProcess && project.craftProcess.trim() !== '' ?
|
||||
(typeof project.craftProcess === 'string' ? JSON.parse(project.craftProcess) : project.craftProcess) :
|
||||
[],
|
||||
@ -1124,6 +1154,13 @@ const closeImagePreview = () => {
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.heritage-cover-image {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
object-fit: cover;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.heritage-item {
|
||||
overflow: hidden;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user