diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index eb9fb29..d8165da 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -14,6 +14,7 @@ import {
 import type { NameType, ValueType } from 'recharts/types/component/DefaultTooltipContent'
 import { orpc } from '@/client/orpc'
 import type { DashboardSnapshot, DeviceStatus } from '@/domain/battery'
+import { BATTERY_LIST_SORT, DEVICE_STATUS } from '@/domain/battery'
 
 export const Route = createFileRoute('/')({
   component: Dashboard,
@@ -57,9 +58,9 @@ function buildChartData(soh: DashboardSnapshot['soh']) {
 }
 
 const statusColorMap: Record<DeviceStatus, string> = {
-  健康: 'text-emerald-400',
-  关注: 'text-amber-400',
-  预警: 'text-red-400',
+  [DEVICE_STATUS.HEALTHY]: 'text-emerald-400',
+  [DEVICE_STATUS.WATCH]: 'text-amber-400',
+  [DEVICE_STATUS.WARNING]: 'text-red-400',
 }
 
 const severityColorMap: Record<DashboardSnapshot['events'][number]['severity'], string> = {
@@ -77,6 +78,23 @@ function formatChartTooltip(value: ValueType | undefined, name: NameType | undef
   ]
 }
 
+function formatPercent(value: number | null) {
+  return value === null ? '—' : value.toFixed(1)
+}
+
+function formatPercentWithUnit(value: number | null) {
+  return value === null ? '预测不可用' : `${value.toFixed(1)}%`
+}
+
+function formatDelta(from: number | null, to: number | null) {
+  if (from === null || to === null) return '预测不可用'
+  return `${(from - to).toFixed(1)}% 衰减`
+}
+
+function widthPercent(value: number | null) {
+  return `${Math.max(0, Math.min(100, value ?? 0))}%`
+}
+
 function Dashboard() {
   const { data, error, isPending } = useQuery(orpc.battery.dashboard.queryOptions())
 
@@ -147,7 +165,7 @@ function Dashboard() {
             <p className="text-xs tabular-nums text-[#71717A]">数据更新时间: {updatedAt}</p>
             <Link
               to="/batteries"
-              search={{ pageSize: 50, sort: 'createdAtDesc', cursors: [] }}
+              search={{ pageSize: 50, sort: BATTERY_LIST_SORT.CREATED_AT_DESC, cursors: [] }}
               className="text-xs text-teal-400 hover:text-teal-300"
             >
               设备电池实时状态 →
@@ -168,13 +186,13 @@ function Dashboard() {
             <div className="absolute inset-x-0 top-0 h-1 bg-gradient-to-r from-teal-500/50 to-transparent" />
             <p className="text-sm font-medium text-[#A1A1AA]">当前平均 SoH</p>
             <div className="mt-4 flex items-baseline gap-2">
-              <h2 className="text-6xl font-light tabular-nums text-white">{avgSoh.toFixed(1)}</h2>
-              <span className="text-2xl text-[#71717A]">%</span>
+              <h2 className="text-6xl font-light tabular-nums text-white">{formatPercent(avgSoh)}</h2>
+              {avgSoh !== null && <span className="text-2xl text-[#71717A]">%</span>}
             </div>
             <div className="mt-6 flex items-center gap-3 text-sm">
               <span className="inline-flex items-center gap-1.5 text-emerald-400">
                 <span className="h-1.5 w-1.5 rounded-full bg-emerald-400" />
-                基线健康
+                {avgSoh === null ? 'AI预测不可用' : '基线健康'}
               </span>
               <span className="text-[#71717A]">|</span>
               <span className="text-[#A1A1AA]">共 {totalDevices} 台设备</span>
@@ -185,24 +203,24 @@ function Dashboard() {
           <article className="rounded-2xl border border-white/[0.06] bg-white/[0.02] p-6 transition-colors hover:border-white/10">
             <p className="text-sm text-[#A1A1AA]">30 天预测均值</p>
             <div className="mt-3 flex items-baseline gap-1">
-              <h2 className="text-4xl font-light tabular-nums text-white">{avgSoh30d.toFixed(1)}</h2>
-              <span className="text-lg text-[#71717A]">%</span>
+              <h2 className="text-4xl font-light tabular-nums text-white">{formatPercent(avgSoh30d)}</h2>
+              {avgSoh30d !== null && <span className="text-lg text-[#71717A]">%</span>}
             </div>
             <div className="mt-4 flex items-center gap-1.5 text-sm">
               <span className="text-red-400">↘</span>
-              <span className="tabular-nums text-[#A1A1AA]">{(avgSoh - avgSoh30d).toFixed(1)}% 衰减</span>
+              <span className="tabular-nums text-[#A1A1AA]">{formatDelta(avgSoh, avgSoh30d)}</span>
             </div>
           </article>
 
           <article className="rounded-2xl border border-white/[0.06] bg-white/[0.02] p-6 transition-colors hover:border-white/10">
             <p className="text-sm text-[#A1A1AA]">90 天预测均值</p>
             <div className="mt-3 flex items-baseline gap-1">
-              <h2 className="text-4xl font-light tabular-nums text-white">{avgSoh90d.toFixed(1)}</h2>
-              <span className="text-lg text-[#71717A]">%</span>
+              <h2 className="text-4xl font-light tabular-nums text-white">{formatPercent(avgSoh90d)}</h2>
+              {avgSoh90d !== null && <span className="text-lg text-[#71717A]">%</span>}
             </div>
             <div className="mt-4 flex items-center gap-1.5 text-sm">
               <span className="text-red-400">↘</span>
-              <span className="tabular-nums text-[#A1A1AA]">{(avgSoh - avgSoh90d).toFixed(1)}% 衰减</span>
+              <span className="tabular-nums text-[#A1A1AA]">{formatDelta(avgSoh, avgSoh90d)}</span>
             </div>
           </article>
 
@@ -245,97 +263,103 @@ function Dashboard() {
             </header>
 
             <div className="w-full h-[320px]">
-              <ResponsiveContainer width="100%" height="100%">
-                <ComposedChart data={chartData} margin={{ top: 24, right: 24, bottom: 8, left: 0 }}>
-                  <defs>
-                    <linearGradient id="historyFill" x1="0" y1="0" x2="0" y2="1">
-                      <stop offset="0%" stopColor="#2DD4BF" stopOpacity={0.15} />
-                      <stop offset="100%" stopColor="#2DD4BF" stopOpacity={0} />
-                    </linearGradient>
-                    <linearGradient id="forecastFill" x1="0" y1="0" x2="0" y2="1">
-                      <stop offset="0%" stopColor="#818CF8" stopOpacity={0.15} />
-                      <stop offset="100%" stopColor="#818CF8" stopOpacity={0} />
-                    </linearGradient>
-                  </defs>
-                  <CartesianGrid stroke="#ffffff" strokeOpacity={0.05} vertical={false} />
-                  <XAxis dataKey="month" tick={{ fill: '#71717A', fontSize: 11 }} axisLine={false} tickLine={false} />
-                  <YAxis
-                    domain={[(min: number) => Math.floor(min) - 2, (max: number) => Math.ceil(max) + 2]}
-                    tick={{ fill: '#71717A', fontSize: 11 }}
-                    axisLine={false}
-                    tickLine={false}
-                    tickFormatter={(v: number) => `${v}%`}
-                    width={48}
-                  />
-                  <Tooltip
-                    contentStyle={{
-                      backgroundColor: '#18181B',
-                      border: '1px solid rgba(255,255,255,0.1)',
-                      borderRadius: 8,
-                      fontSize: 13,
-                      color: '#F4F4F5',
-                    }}
-                    itemStyle={{ color: '#A1A1AA' }}
-                    formatter={formatChartTooltip}
-                    labelStyle={{ color: '#71717A', marginBottom: 4 }}
-                  />
-                  <ReferenceLine
-                    y={85}
-                    stroke="#F87171"
-                    strokeOpacity={0.4}
-                    strokeDasharray="4 4"
-                    label={{
-                      value: '85% 预警线',
-                      fill: '#F87171',
-                      fontSize: 11,
-                      position: 'right',
-                    }}
-                  />
-                  <Area
-                    type="monotone"
-                    dataKey="history"
-                    fill="url(#historyFill)"
-                    stroke="none"
-                    connectNulls={false}
-                    tooltipType="none"
-                  />
-                  <Area
-                    type="monotone"
-                    dataKey="forecast"
-                    fill="url(#forecastFill)"
-                    stroke="none"
-                    connectNulls={false}
-                    tooltipType="none"
-                  />
-                  <Line
-                    type="monotone"
-                    dataKey="history"
-                    stroke="#2DD4BF"
-                    strokeWidth={2.5}
-                    dot={{
-                      fill: '#09090B',
-                      stroke: '#2DD4BF',
-                      strokeWidth: 2,
-                      r: 3,
-                    }}
-                    connectNulls={false}
-                  />
-                  <Line
-                    type="monotone"
-                    dataKey="forecast"
-                    stroke="#818CF8"
-                    strokeWidth={2.5}
-                    strokeDasharray="4 4"
-                    dot={{
-                      fill: '#09090B',
-                      stroke: '#818CF8',
-                      strokeWidth: 2,
-                      r: 3,
-                    }}
-                    connectNulls={false}
-                  />
-                </ComposedChart>
-              </ResponsiveContainer>
+              {chartData.length > 0 ? (
+                <ResponsiveContainer width="100%" height="100%">
+                  <ComposedChart data={chartData} margin={{ top: 24, right: 24, bottom: 8, left: 0 }}>
+                    <defs>
+                      <linearGradient id="historyFill" x1="0" y1="0" x2="0" y2="1">
+                        <stop offset="0%" stopColor="#2DD4BF" stopOpacity={0.15} />
+                        <stop offset="100%" stopColor="#2DD4BF" stopOpacity={0} />
+                      </linearGradient>
+                      <linearGradient id="forecastFill" x1="0" y1="0" x2="0" y2="1">
+                        <stop offset="0%" stopColor="#818CF8" stopOpacity={0.15} />
+                        <stop offset="100%" stopColor="#818CF8" stopOpacity={0} />
+                      </linearGradient>
+                    </defs>
+                    <CartesianGrid stroke="#ffffff" strokeOpacity={0.05} vertical={false} />
+                    <XAxis dataKey="month" tick={{ fill: '#71717A', fontSize: 11 }} axisLine={false} tickLine={false} />
+                    <YAxis
+                      domain={[(min: number) => Math.floor(min) - 2, (max: number) => Math.ceil(max) + 2]}
+                      tick={{ fill: '#71717A', fontSize: 11 }}
+                      axisLine={false}
+                      tickLine={false}
+                      tickFormatter={(v: number) => `${v}%`}
+                      width={48}
+                    />
+                    <Tooltip
+                      contentStyle={{
+                        backgroundColor: '#18181B',
+                        border: '1px solid rgba(255,255,255,0.1)',
+                        borderRadius: 8,
+                        fontSize: 13,
+                        color: '#F4F4F5',
+                      }}
+                      itemStyle={{ color: '#A1A1AA' }}
+                      formatter={formatChartTooltip}
+                      labelStyle={{ color: '#71717A', marginBottom: 4 }}
+                    />
+                    <ReferenceLine
+                      y={85}
+                      stroke="#F87171"
+                      strokeOpacity={0.4}
+                      strokeDasharray="4 4"
+                      label={{
+                        value: '85% 预警线',
+                        fill: '#F87171',
+                        fontSize: 11,
+                        position: 'right',
+                      }}
+                    />
+                    <Area
+                      type="monotone"
+                      dataKey="history"
+                      fill="url(#historyFill)"
+                      stroke="none"
+                      connectNulls={false}
+                      tooltipType="none"
+                    />
+                    <Area
+                      type="monotone"
+                      dataKey="forecast"
+                      fill="url(#forecastFill)"
+                      stroke="none"
+                      connectNulls={false}
+                      tooltipType="none"
+                    />
+                    <Line
+                      type="monotone"
+                      dataKey="history"
+                      stroke="#2DD4BF"
+                      strokeWidth={2.5}
+                      dot={{
+                        fill: '#09090B',
+                        stroke: '#2DD4BF',
+                        strokeWidth: 2,
+                        r: 3,
+                      }}
+                      connectNulls={false}
+                    />
+                    <Line
+                      type="monotone"
+                      dataKey="forecast"
+                      stroke="#818CF8"
+                      strokeWidth={2.5}
+                      strokeDasharray="4 4"
+                      dot={{
+                        fill: '#09090B',
+                        stroke: '#818CF8',
+                        strokeWidth: 2,
+                        r: 3,
+                      }}
+                      connectNulls={false}
+                    />
+                  </ComposedChart>
+                </ResponsiveContainer>
+              ) : (
+                <div className="flex h-full items-center justify-center rounded-xl border border-dashed border-white/10 bg-white/[0.02] text-sm text-[#71717A]">
+                  AI SoH 预测不可用，暂无可绘制的健康度趋势。
+                </div>
+              )}
             </div>
           </article>
         </section>
@@ -412,10 +436,15 @@ function Dashboard() {
                       <span className="w-20 text-sm text-[#A1A1AA]">{item.batch}</span>
                       <div className="flex-1">
                         <div className="h-1.5 overflow-hidden rounded-full bg-white/5">
-                          <div className="h-full rounded-full bg-white/20" style={{ width: `${item.avgSoh}%` }} />
+                          <div
+                            className="h-full rounded-full bg-white/20"
+                            style={{ width: widthPercent(item.avgSoh) }}
+                          />
                         </div>
                       </div>
-                      <span className="w-12 text-right text-sm tabular-nums text-white">{item.avgSoh.toFixed(1)}%</span>
+                      <span className="w-20 text-right text-sm tabular-nums text-white">
+                        {formatPercentWithUnit(item.avgSoh)}
+                      </span>
                     </div>
                   ))
                 ) : (
@@ -511,9 +540,9 @@ function Dashboard() {
                       <tr key={unit.id} className="transition-colors hover:bg-white/[0.04]">
                         <td className="px-6 py-4 font-medium text-white">{unit.id}</td>
                         <td className="px-6 py-4 text-[#A1A1AA]">{unit.batch}</td>
-                        <td className="px-6 py-4 tabular-nums text-white">{unit.soh.toFixed(1)}%</td>
-                        <td className="px-6 py-4 tabular-nums text-[#A1A1AA]">{unit.soh30d.toFixed(1)}%</td>
-                        <td className="px-6 py-4 tabular-nums text-[#A1A1AA]">{unit.soh90d.toFixed(1)}%</td>
+                        <td className="px-6 py-4 tabular-nums text-white">{formatPercentWithUnit(unit.soh)}</td>
+                        <td className="px-6 py-4 tabular-nums text-[#A1A1AA]">{formatPercentWithUnit(unit.soh30d)}</td>
+                        <td className="px-6 py-4 tabular-nums text-[#A1A1AA]">{formatPercentWithUnit(unit.soh90d)}</td>
                         <td className="px-6 py-4">
                           <div className="flex items-center gap-2">
                             <div className="h-1.5 w-12 overflow-hidden rounded-full bg-white/5">
@@ -604,7 +633,7 @@ function Dashboard() {
                         <div className="text-xs text-[#71717A]">{item.count} 台设备</div>
                       </div>
                       <div className="text-right">
-                        <div className="text-sm tabular-nums text-white">{item.avgSoh.toFixed(1)}%</div>
+                        <div className="text-sm tabular-nums text-white">{formatPercentWithUnit(item.avgSoh)}</div>
                         <div className="text-xs text-[#71717A]">平均 SoH</div>
                       </div>
                     </div>