refactor(mp): 迁移患者端详情页 — 使用统一组件库 (10/12)

报告详情、随访详情、透析记录详情、透析处方详情页:
- View.detail-page → PageShell 替代手写 page 容器
- .detail-card → ContentCard 替代手写卡片样式
- 删除通用 page 容器和 card 样式，保留业务布局样式

apps/miniprogram/src/pages/pkg-profile/reports/detail/index.scss

@@ -1,21 +1,6 @@
 @import '../../../../styles/variables.scss';
 @import '../../../../styles/mixins.scss';
 
-.detail-page {
-  min-height: 100vh;
-  background: $bg;
-  padding: 24px;
-  padding-bottom: 40px;
-}
-
-.detail-card {
-  background: $card;
-  border-radius: $r;
-  padding: 28px;
-  margin-bottom: 20px;
-  box-shadow: $shadow-sm;
-}
-
 .detail-title {
   font-family: 'Georgia', 'Times New Roman', serif;
   font-size: var(--tk-font-num-lg);
@@ -51,13 +36,6 @@
   margin-left: 24px;
 }
 
-.indicators-card {
-  background: $card;
-  border-radius: $r;
-  padding: 28px;
-  box-shadow: $shadow-sm;
-}
-
 .section-title {
   font-family: 'Georgia', 'Times New Roman', serif;
   font-size: var(--tk-font-num);

apps/miniprogram/src/pages/pkg-profile/reports/detail/index.tsx

@@ -4,6 +4,8 @@ import Taro, { useRouter } from '@tarojs/taro';
 import { usePageData } from '@/hooks/usePageData';
 import { getReportDetail, LabReport } from '@/services/report';
 import Loading from '@/components/Loading';
+import PageShell from '@/components/ui/PageShell';
+import ContentCard from '@/components/ui/ContentCard';
 import { useElderClass } from '@/hooks/useElderClass';
 import { useAuthStore } from '@/stores/auth';
 import './index.scss';
@@ -62,26 +64,26 @@ export default function ReportDetail() {
 
   if (loading) {
     return (
-      <View className={`detail-page ${modeClass}`}>
+      <PageShell className={modeClass}>
         <Loading />
-      </View>
+      </PageShell>
     );
   }
 
   if (!report) {
     return (
-      <View className={`detail-page ${modeClass}`}>
+      <PageShell className={modeClass}>
         <View className='empty-state'>
           <Text className='empty-text'>报告不存在</Text>
         </View>
-      </View>
+      </PageShell>
     );
   }
 
   return (
-    <View className={`detail-page ${modeClass}`}>
+    <PageShell className={modeClass}>
       {/* 基本信息 */}
-      <View className='detail-card'>
+      <ContentCard>
         <Text className='detail-title'>{report.report_type}</Text>
         <View className='detail-row'>
           <Text className='detail-label'>报告日期</Text>
@@ -93,10 +95,10 @@ export default function ReportDetail() {
             <Text className='detail-value'>{report.doctor_interpretation}</Text>
           </View>
         )}
-      </View>
+      </ContentCard>
 
       {/* 指标列表 */}
-      <View className='indicators-card'>
+      <ContentCard>
         <Text className='section-title'>检查指标</Text>
         {indicators.map((item) => {
           const statusInfo = getStatusInfo(item.status);
@@ -122,7 +124,7 @@ export default function ReportDetail() {
             </View>
           );
         })}
-      </View>
-    </View>
+      </ContentCard>
+    </PageShell>
   );
 }