feat: 完善中文心理测评平台

2026-06-22 22:59:01 +02:00
commit 9227c687fc
160 changed files with 16974 additions and 0 deletions
@@ -0,0 +1,104 @@
+'use client';
+
+import React from 'react';
+import { calculateWHO5Results } from '../../test/private/WHO5Calculator';
+
+interface WHO5ResultProps {
+  answers: string[];
+}
+
+const levelText = {
+  high: '幸福感较好',
+  moderate: '幸福感中等',
+  low: '幸福感偏低',
+  very_low: '幸福感明显偏低',
+};
+
+const levelDescription = {
+  high: '最近两周的积极情绪、活力和生活兴趣整体较好，可以继续保持目前有帮助的生活节奏。',
+  moderate: '整体幸福感处在中等区间，可以留意睡眠、压力、社交和日常恢复感的变化。',
+  low: '幸福感偏低，建议结合PHQ-9、GAD-7或DASS-21进一步了解情绪状态。',
+  very_low: '幸福感明显偏低，近期可能承受了较多压力或情绪困扰，建议尽快寻求可靠支持或专业评估。',
+};
+
+const questions = [
+  '快乐、心情愉快',
+  '平静和放松',
+  '精力充沛、充满活力',
+  '醒来时清新、休息充分',
+  '日常生活中有感兴趣的事情',
+];
+
+export function WHO5Result({ answers }: WHO5ResultProps) {
+  const answersMap: { [key: number]: string } = {};
+  answers.forEach((answer, index) => {
+    answersMap[index + 1] = answer;
+  });
+
+  const results = calculateWHO5Results({ answers: answersMap });
+
+  const levelClass = results.level === 'high'
+    ? 'border-green-200 bg-green-50 text-green-800'
+    : results.level === 'moderate'
+      ? 'border-blue-200 bg-blue-50 text-blue-800'
+      : results.level === 'low'
+        ? 'border-yellow-200 bg-yellow-50 text-yellow-800'
+        : 'border-red-200 bg-red-50 text-red-800';
+
+  return (
+    <div className="mt-6 space-y-6">
+      <div className="bg-white border rounded-lg p-6 shadow-sm">
+        <h3 className="text-lg font-semibold mb-4">WHO-5 幸福感结果</h3>
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+          <MetricCard title="原始总分" value={`${results.rawScore}/25`} />
+          <MetricCard title="百分制得分" value={`${results.percentageScore}/100`} />
+          <MetricCard title="结果水平" value={levelText[results.level]} />
+        </div>
+      </div>
+
+      <div className={`border rounded-lg p-6 shadow-sm ${levelClass}`}>
+        <h3 className="text-lg font-semibold mb-3">结果解释</h3>
+        <p className="text-sm">{levelDescription[results.level]}</p>
+        {results.needsAttention && (
+          <p className="text-sm mt-3 font-medium">
+            WHO-5通常建议：原始总分低于13分，或任一题为0-1分时，可以进一步做情绪筛查或寻求专业意见。
+          </p>
+        )}
+      </div>
+
+      <div className="bg-white border rounded-lg p-6 shadow-sm">
+        <h3 className="text-lg font-semibold mb-4">分项情况</h3>
+        <div className="space-y-3">
+          {results.itemScores.map((score, index) => (
+            <div key={questions[index]} className="flex items-center justify-between gap-4 p-3 bg-gray-50 rounded-lg">
+              <span className="text-sm font-medium">{index + 1}. {questions[index]}</span>
+              <span className={`text-lg font-semibold ${score <= 1 ? 'text-red-600' : score <= 3 ? 'text-yellow-600' : 'text-green-600'}`}>
+                {score}/5
+              </span>
+            </div>
+          ))}
+        </div>
+      </div>
+
+      <div className="bg-gray-50 border border-gray-200 rounded-lg p-4">
+        <p className="text-sm text-gray-700">
+          注：WHO-5用于幸福感筛查和追踪，不等同于临床诊断。若结果偏低，请结合近期生活事件、睡眠、压力和其他量表综合判断。
+        </p>
+      </div>
+    </div>
+  );
+}
+
+interface MetricCardProps {
+  title: string;
+  value: React.ReactNode;
+}
+
+function MetricCard({ title, value }: MetricCardProps) {
+  return (
+    <div className="bg-gray-50 rounded-lg p-4 flex flex-col items-center">
+      <span className="text-sm text-gray-500 mb-1">{title}</span>
+      <span className="text-2xl font-semibold text-indigo-600 text-center">{value}</span>
+    </div>
+  );
+}