From 4a95a83d6b55006ed3df943d12398e7997fed81d Mon Sep 17 00:00:00 2001 From: iven Date: Wed, 6 May 2026 10:59:13 +0800 Subject: [PATCH] =?UTF-8?q?fix(miniprogram):=20=E7=BB=9F=E4=B8=80=E7=8A=B6?= =?UTF-8?q?=E6=80=81=E8=89=B2=E6=98=A0=E5=B0=84=EF=BC=8C=E5=AF=B9=E9=BD=90?= =?UTF-8?q?=E8=AE=BE=E8=AE=A1=E7=B3=BB=E7=BB=9F=E8=89=B2=E6=9D=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 创建 utils/statusTag.ts 共享状态色工具（对齐 variables.scss） - doctor/consultation: 使用共享状态色替代 Tailwind 硬编码 - doctor/followup: 使用共享状态色替代 Tailwind 硬编码 - doctor/action-inbox: SCSS 状态点替换为设计系统变量 - doctor/index: SCSS 告警/搜索区替换为设计系统变量 - pkg-health/alerts: SCSS 严重度标签替换为设计系统变量 --- .../src/pages/doctor/action-inbox/index.scss | 8 +- .../src/pages/doctor/action-inbox/index.tsx | 1 + .../src/pages/doctor/consultation/index.tsx | 20 +--- .../src/pages/doctor/followup/index.tsx | 14 +-- apps/miniprogram/src/pages/doctor/index.scss | 14 +-- .../src/pages/pkg-health/alerts/index.scss | 14 +-- apps/miniprogram/src/utils/statusTag.ts | 107 ++++++++++++++++++ 7 files changed, 134 insertions(+), 44 deletions(-) create mode 100644 apps/miniprogram/src/utils/statusTag.ts diff --git a/apps/miniprogram/src/pages/doctor/action-inbox/index.scss b/apps/miniprogram/src/pages/doctor/action-inbox/index.scss index 16d1fa5..e42c308 100644 --- a/apps/miniprogram/src/pages/doctor/action-inbox/index.scss +++ b/apps/miniprogram/src/pages/doctor/action-inbox/index.scss @@ -142,10 +142,10 @@ margin-top: 4px; flex-shrink: 0; - &.completed { background: #52c41a; } - &.in_progress { background: #faad14; } - &.pending { background: #d9d9d9; } - &.dismissed { background: #ff4d4f; } + &.completed { background: $acc; } + &.in_progress { background: $wrn; } + &.pending { background: $tx3; } + &.dismissed { background: $dan; } } .thread-content { diff --git a/apps/miniprogram/src/pages/doctor/action-inbox/index.tsx b/apps/miniprogram/src/pages/doctor/action-inbox/index.tsx index 311e444..a7f5330 100644 --- a/apps/miniprogram/src/pages/doctor/action-inbox/index.tsx +++ b/apps/miniprogram/src/pages/doctor/action-inbox/index.tsx @@ -8,6 +8,7 @@ import { type ThreadResponse, } from '@/services/action-inbox'; import Loading from '@/components/Loading'; +import { getStatusInlineStyle, getStatusLabel } from '@/utils/statusTag'; import './index.scss'; const TYPE_LABEL: Record = { diff --git a/apps/miniprogram/src/pages/doctor/consultation/index.tsx b/apps/miniprogram/src/pages/doctor/consultation/index.tsx index 4f70c9b..e43b90d 100644 --- a/apps/miniprogram/src/pages/doctor/consultation/index.tsx +++ b/apps/miniprogram/src/pages/doctor/consultation/index.tsx @@ -4,14 +4,10 @@ import Taro from '@tarojs/taro'; import * as doctorApi from '@/services/doctor'; import Loading from '@/components/Loading'; import EmptyState from '@/components/EmptyState'; +import { getStatusInlineStyle, getStatusLabel } from '@/utils/statusTag'; +import { formatDateTime } from '@/utils/date'; import './index.scss'; -const STATUS_MAP: Record = { - waiting: { label: '等待中', color: '#f59e0b' }, - active: { label: '进行中', color: '#10b981' }, - closed: { label: '已关闭', color: '#94a3b8' }, -}; - const TABS = [ { key: '', label: '全部' }, { key: 'active', label: '进行中' }, @@ -54,12 +50,7 @@ export default function ConsultationList() { const formatTime = (dateStr?: string | null) => { if (!dateStr) return ''; - const d = new Date(dateStr); - const now = new Date(); - if (d.toDateString() === now.toDateString()) { - return d.toLocaleTimeString('zh-CN', { hour: '2-digit', minute: '2-digit' }); - } - return d.toLocaleDateString('zh-CN', { month: 'numeric', day: 'numeric' }); + return formatDateTime(dateStr); }; if (loading && sessions.length === 0) return ; @@ -83,7 +74,6 @@ export default function ConsultationList() { ) : ( {sessions.map((s) => { - const st = STATUS_MAP[s.status] || { label: s.status, color: '#94a3b8' }; return ( {s.subject || '在线咨询'} - - {st.label} + + {getStatusLabel(s.status)} diff --git a/apps/miniprogram/src/pages/doctor/followup/index.tsx b/apps/miniprogram/src/pages/doctor/followup/index.tsx index ef10110..f647e85 100644 --- a/apps/miniprogram/src/pages/doctor/followup/index.tsx +++ b/apps/miniprogram/src/pages/doctor/followup/index.tsx @@ -4,16 +4,9 @@ import Taro, { useRouter } from '@tarojs/taro'; import * as doctorApi from '@/services/doctor'; import Loading from '@/components/Loading'; import EmptyState from '@/components/EmptyState'; +import { getStatusInlineStyle, getStatusLabel } from '@/utils/statusTag'; import './index.scss'; -const STATUS_MAP: Record = { - pending: { label: '待处理', color: '#f59e0b' }, - in_progress: { label: '进行中', color: '#0891b2' }, - completed: { label: '已完成', color: '#10b981' }, - overdue: { label: '已逾期', color: '#ef4444' }, - cancelled: { label: '已取消', color: '#94a3b8' }, -}; - const TABS = [ { key: '', label: '全部' }, { key: 'pending', label: '待处理' }, @@ -91,7 +84,6 @@ export default function FollowUpList() { ) : ( {tasks.map((task) => { - const st = STATUS_MAP[task.status] || { label: task.status, color: '#94a3b8' }; return ( {getTypeLabel(task.follow_up_type)} - - {st.label} + + {getStatusLabel(task.status)} {task.patient_name || '未知患者'} diff --git a/apps/miniprogram/src/pages/doctor/index.scss b/apps/miniprogram/src/pages/doctor/index.scss index 1f98575..6d6268d 100644 --- a/apps/miniprogram/src/pages/doctor/index.scss +++ b/apps/miniprogram/src/pages/doctor/index.scss @@ -34,16 +34,16 @@ align-items: center; margin: 16px 24px; padding: 16px 20px; - background: #FEF2F2; + background: $dan-l; border-radius: $r; - border-left: 4px solid #EF4444; + border-left: 4px solid $dan; } &__alert-icon { width: 36px; height: 36px; border-radius: 50%; - background: #EF4444; + background: $dan; color: #fff; text-align: center; line-height: 36px; @@ -56,12 +56,12 @@ &__alert-text { flex: 1; font-size: 26px; - color: #991B1B; + color: $dan; } &__alert-link { font-size: 24px; - color: #EF4444; + color: $dan; flex-shrink: 0; } @@ -70,11 +70,11 @@ } &__search-input { - background: #F1F5F9; + background: $surface-alt; border-radius: $r; padding: 16px 20px; font-size: 26px; - color: #94A3B8; + color: $tx3; } &__section { diff --git a/apps/miniprogram/src/pages/pkg-health/alerts/index.scss b/apps/miniprogram/src/pages/pkg-health/alerts/index.scss index fcb84ec..5b1bb77 100644 --- a/apps/miniprogram/src/pages/pkg-health/alerts/index.scss +++ b/apps/miniprogram/src/pages/pkg-health/alerts/index.scss @@ -55,19 +55,19 @@ } .alert-badge.sev-info { - background: #e6f7ff; + background: $bd-l; } .alert-badge.sev-warning { - background: #fff7e6; + background: $wrn-l; } .alert-badge.sev-critical { - background: #fff1f0; + background: $dan-l; } .alert-badge.sev-urgent { - background: #ff4d4f; + background: $dan; } .alert-badge-text { @@ -76,15 +76,15 @@ } .alert-badge.sev-info .alert-badge-text { - color: #1890ff; + color: $tx3; } .alert-badge.sev-warning .alert-badge-text { - color: #fa8c16; + color: $wrn; } .alert-badge.sev-critical .alert-badge-text { - color: #f5222d; + color: $dan; } .alert-badge.sev-urgent .alert-badge-text { diff --git a/apps/miniprogram/src/utils/statusTag.ts b/apps/miniprogram/src/utils/statusTag.ts new file mode 100644 index 0000000..709a55b --- /dev/null +++ b/apps/miniprogram/src/utils/statusTag.ts @@ -0,0 +1,107 @@ +/** + * 共享状态色映射 — 对齐设计系统 variables.scss + * + * 使用方式： + * import { getStatusStyle } from '@/utils/statusTag'; + * 待确认 + */ + +// 设计系统色板 (与 variables.scss 对齐) +const COLORS = { + pri: '#C4623A', + priLight: '#F0DDD4', + acc: '#5B7A5E', + accLight: '#E8F0E8', + wrn: '#C4873A', + wrnLight: '#FFF3E0', + dan: '#B54A4A', + danLight: '#FDEAEA', + tx3: '#78716C', + neutralBg: '#F1F5F9', +} as const; + +export interface StatusStyle { + background: string; + color: string; +} + +// 统一状态色映射 +const STATUS_COLORS: Record = { + // 预约 + pending: { background: COLORS.wrnLight, color: COLORS.wrn }, + confirmed: { background: COLORS.priLight, color: COLORS.pri }, + completed: { background: COLORS.accLight, color: COLORS.acc }, + cancelled: { background: COLORS.neutralBg, color: COLORS.tx3 }, + no_show: { background: COLORS.danLight, color: COLORS.dan }, + + // 随访 + overdue: { background: COLORS.danLight, color: COLORS.dan }, + in_progress: { background: COLORS.priLight, color: COLORS.pri }, + + // 咨询 + waiting: { background: COLORS.wrnLight, color: COLORS.wrn }, + active: { background: COLORS.accLight, color: COLORS.acc }, + closed: { background: COLORS.neutralBg, color: COLORS.tx3 }, + + // 告警严重度 + info: { background: COLORS.neutralBg, color: COLORS.tx3 }, + warning: { background: COLORS.wrnLight, color: COLORS.wrn }, + medium: { background: COLORS.wrnLight, color: COLORS.wrn }, + critical: { background: COLORS.danLight, color: COLORS.dan }, + high: { background: COLORS.danLight, color: COLORS.dan }, + urgent: { background: COLORS.danLight, color: COLORS.dan }, + + // 告警状态 + acknowledged: { background: COLORS.priLight, color: COLORS.pri }, + resolved: { background: COLORS.accLight, color: COLORS.acc }, + dismissed: { background: COLORS.neutralBg, color: COLORS.tx3 }, + + // 设备 + online: { background: COLORS.accLight, color: COLORS.acc }, + offline: { background: COLORS.neutralBg, color: COLORS.tx3 }, + paired: { background: COLORS.priLight, color: COLORS.pri }, + error: { background: COLORS.danLight, color: COLORS.dan }, + + // 通用 + verified: { background: COLORS.accLight, color: COLORS.acc }, + inactive: { background: COLORS.neutralBg, color: COLORS.tx3 }, + deceased: { background: COLORS.neutralBg, color: COLORS.tx3 }, + rejected: { background: COLORS.danLight, color: COLORS.dan }, +}; + +const DEFAULT_STYLE: StatusStyle = { background: COLORS.neutralBg, color: COLORS.tx3 }; + +/** 获取状态对应的样式（背景色+文字色） */ +export function getStatusStyle(status: string): StatusStyle { + return STATUS_COLORS[status] || DEFAULT_STYLE; +} + +/** 获取带透明度的状态背景（用于行内 style） */ +export function getStatusInlineStyle(status: string): { background: string; color: string; borderRadius: string; padding: string; fontSize: string } { + const s = getStatusStyle(status); + return { + background: s.background, + color: s.color, + borderRadius: '6px', + padding: '2px 8px', + fontSize: '24px', // 小程序最小字号 + }; +} + +// 统一状态标签文案 +const STATUS_LABELS: Record = { + pending: '待确认', confirmed: '已确认', completed: '已完成', + cancelled: '已取消', no_show: '未到诊', overdue: '逾期', + in_progress: '进行中', waiting: '等待中', active: '进行中', + closed: '已关闭', info: '提示', warning: '警告', + medium: '中等', critical: '严重', high: '严重', urgent: '紧急', + acknowledged: '已确认', resolved: '已恢复', dismissed: '已忽略', + online: '在线', offline: '离线', paired: '已配对', error: '异常', + verified: '已认证', inactive: '停用', deceased: '已故', + rejected: '已拒绝', +}; + +/** 获取状态的中文标签 */ +export function getStatusLabel(status: string): string { + return STATUS_LABELS[status] || status; +}