|
|
@@ -115,12 +115,6 @@ const Statistics: React.FC<StatisticsProps> = () => {
|
|
|
gcTime: 10 * 60 * 1000 // 缓存时间10分钟
|
|
|
})
|
|
|
|
|
|
- // 缓存残疾类型图表数据,避免每次渲染创建新对象
|
|
|
- const disabilityChartData = useMemo(() => {
|
|
|
- const stats = getStats(disabilityData)
|
|
|
- return stats.length > 0 ? convertToColumnData(stats) : null
|
|
|
- }, [disabilityData])
|
|
|
-
|
|
|
// 获取性别分布数据
|
|
|
const { data: genderData, isLoading: isLoadingGender } = useQuery({
|
|
|
queryKey: ['statistics', 'gender-distribution'],
|
|
|
@@ -303,20 +297,26 @@ const Statistics: React.FC<StatisticsProps> = () => {
|
|
|
<Text className="font-semibold text-gray-700">残疾类型分布 (Canvas 2D + 原始JS)</Text>
|
|
|
{isLoadingDisability ? (
|
|
|
<Text className="text-gray-500 text-center py-4">加载中...</Text>
|
|
|
- ) : disabilityChartData ? (
|
|
|
- <View className="mt-3">
|
|
|
- <ColumnChartOriginal2D
|
|
|
- canvasId="disability-type-chart-orig2d"
|
|
|
- width={650}
|
|
|
- height={300}
|
|
|
- categories={disabilityChartData.categories}
|
|
|
- series={disabilityChartData.series}
|
|
|
- config={{ color: ['#3b82f6'] }}
|
|
|
- />
|
|
|
- </View>
|
|
|
- ) : (
|
|
|
- <Text className="text-gray-500 text-center py-4 mt-3">暂无数据</Text>
|
|
|
- )}
|
|
|
+ ) : (() => {
|
|
|
+ const stats = getStats(disabilityData)
|
|
|
+ if (stats.length > 0) {
|
|
|
+ const chartData = convertToColumnData(stats)
|
|
|
+ return (
|
|
|
+ <View className="mt-3">
|
|
|
+ <ColumnChartOriginal2D
|
|
|
+ canvasId="disability-type-chart-orig2d"
|
|
|
+ width={650}
|
|
|
+ height={300}
|
|
|
+ categories={chartData.categories}
|
|
|
+ series={chartData.series}
|
|
|
+ config={{ color: ['#3b82f6'] }}
|
|
|
+ />
|
|
|
+ </View>
|
|
|
+ )
|
|
|
+ } else {
|
|
|
+ return <Text className="text-gray-500 text-center py-4 mt-3">暂无数据</Text>
|
|
|
+ }
|
|
|
+ })()}
|
|
|
</View>)}
|
|
|
|
|
|
{/* 残疾类型分布 - Legacy版本(旧Canvas API + 原始JS) */}
|