Compare commits
18 Commits
3e1413aebc
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
|
d6abf45e7e | ||
|
|
5c5c099fb2 | ||
|
|
a12fe0e8a9 | ||
|
|
3c828bfc4a | ||
|
|
11101ac204 | ||
|
|
28bcdc4208 | ||
|
|
890c132890 | ||
|
|
257ca94a25 | ||
|
|
7b5138a630 | ||
|
|
e8ccee02d5 | ||
|
|
4335f7e144 | ||
|
|
66329852b8 | ||
|
|
085163ec7a | ||
|
|
0c28969c3b | ||
|
|
8490344d69 | ||
|
|
e4b19090b8 | ||
|
|
07217336e7 | ||
|
|
19705e31bd |
@@ -3,10 +3,8 @@ module.exports = {
|
||||
'cargo fmt --check --',
|
||||
() => 'cargo clippy -p erp-health -p erp-server -- -D warnings',
|
||||
],
|
||||
'apps/web/src/**/*.{ts,tsx}': () =>
|
||||
process.platform === 'win32'
|
||||
? 'pushd apps/web && npx eslint --fix src/ & popd'
|
||||
: 'cd apps/web && npx eslint --fix src/',
|
||||
'apps/web/src/**/*.{ts,tsx}': (filenames) =>
|
||||
`npx eslint --fix ${filenames.join(' ')}`,
|
||||
'apps/web/src/**/*.test.{ts,tsx}': [
|
||||
'cd apps/web && npx vitest run --reporter=verbose',
|
||||
],
|
||||
|
||||
@@ -5,7 +5,7 @@ export default defineConfig(async (merge) => {
|
||||
const baseConfig = {
|
||||
projectName: 'hms-miniprogram',
|
||||
date: '2026-4-23',
|
||||
designWidth: 750,
|
||||
designWidth: 375,
|
||||
deviceRatio: { 640: 2.34 / 2, 750: 1, 375: 2, 828: 1.81 / 2 },
|
||||
sourceRoot: 'src',
|
||||
outputRoot: 'dist',
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
"miniprogramRoot": "dist/",
|
||||
"compileType": "miniprogram",
|
||||
"setting": {
|
||||
"urlCheck": true,
|
||||
"urlCheck": false,
|
||||
"automationAudits": true,
|
||||
"es6": false,
|
||||
"enhance": false,
|
||||
@@ -11,6 +11,10 @@
|
||||
"postcss": false,
|
||||
"minified": true,
|
||||
"bundle": false,
|
||||
"minifyWXML": true
|
||||
}
|
||||
"minifyWXML": true,
|
||||
"packNpmManually": false,
|
||||
"packNpmRelationList": [],
|
||||
"ignoreUploadUnusedFiles": true
|
||||
},
|
||||
"condition": {}
|
||||
}
|
||||
@@ -44,6 +44,7 @@ export default defineAppConfig({
|
||||
'dialysis-records/index', 'dialysis-records/detail/index',
|
||||
'dialysis-prescriptions/index', 'dialysis-prescriptions/detail/index',
|
||||
'consents/index', 'health-records/index', 'diagnoses/index',
|
||||
'elder-mode/index',
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
@import './styles/variables.scss';
|
||||
@import './styles/tokens.scss';
|
||||
@import './styles/elder-mode.scss';
|
||||
|
||||
page {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, 'PingFang SC',
|
||||
|
||||
@@ -1,15 +1,21 @@
|
||||
import { useEffect, PropsWithChildren } from 'react';
|
||||
import Taro from '@tarojs/taro';
|
||||
import Taro, { useDidShow } from '@tarojs/taro';
|
||||
import ErrorBoundary from './components/ErrorBoundary';
|
||||
import { flushEvents } from './services/analytics';
|
||||
import { useAuthStore } from './stores/auth';
|
||||
import { useUIStore } from './stores/ui';
|
||||
import './app.scss';
|
||||
|
||||
function App({ children }: PropsWithChildren<Record<string, unknown>>) {
|
||||
const restoreAuth = useAuthStore((s) => s.restore);
|
||||
const restoreUI = useUIStore((s) => s.restore);
|
||||
|
||||
useDidShow(() => {
|
||||
restoreAuth();
|
||||
restoreUI();
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
restoreAuth();
|
||||
const timer = setInterval(() => {
|
||||
flushEvents();
|
||||
}, 30000);
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
box-shadow: $shadow-sm;
|
||||
|
||||
.device-icon {
|
||||
font-size: 48rpx;
|
||||
font-size: var(--tk-font-h2);
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
@@ -18,14 +18,14 @@
|
||||
flex: 1;
|
||||
|
||||
.device-name {
|
||||
font-size: 28rpx;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.device-status {
|
||||
font-size: 24rpx;
|
||||
font-size: var(--tk-font-micro);
|
||||
margin-top: 4rpx;
|
||||
display: block;
|
||||
|
||||
@@ -34,7 +34,7 @@
|
||||
}
|
||||
|
||||
.last-sync {
|
||||
font-size: 22rpx;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: $tx3;
|
||||
margin-top: 4rpx;
|
||||
display: block;
|
||||
@@ -46,6 +46,6 @@
|
||||
background: $pri;
|
||||
color: #fff;
|
||||
border-radius: $r-pill;
|
||||
font-size: 24rpx;
|
||||
font-size: var(--tk-font-micro);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -21,20 +21,20 @@
|
||||
|
||||
.empty-state-icon-char {
|
||||
font-family: Georgia, 'Times New Roman', serif;
|
||||
font-size: 48px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: 600;
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.empty-state-text {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
color: $tx2;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.empty-state-hint {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
@@ -45,6 +45,6 @@
|
||||
}
|
||||
|
||||
.empty-state-action-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@@ -9,12 +9,12 @@
|
||||
}
|
||||
|
||||
.error-state-icon {
|
||||
font-size: 80px;
|
||||
font-size: 80px; /* hero icon — kept as-is */
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.error-state-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx2;
|
||||
margin-bottom: 32px;
|
||||
text-align: center;
|
||||
@@ -27,6 +27,6 @@
|
||||
}
|
||||
|
||||
.error-state-retry-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
64
apps/miniprogram/src/components/GuestGuard/index.scss
Normal file
64
apps/miniprogram/src/components/GuestGuard/index.scss
Normal file
@@ -0,0 +1,64 @@
|
||||
@import '../../styles/variables.scss';
|
||||
@import '../../styles/mixins.scss';
|
||||
|
||||
.guard-page {
|
||||
min-height: 100vh;
|
||||
background: $bg;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 40px 24px;
|
||||
}
|
||||
|
||||
.guard-card {
|
||||
text-align: center;
|
||||
padding: 40px 20px;
|
||||
}
|
||||
|
||||
.guard-icon-wrap {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 40px;
|
||||
background: $surface-alt;
|
||||
@include flex-center;
|
||||
margin: 0 auto 20px;
|
||||
}
|
||||
|
||||
.guard-icon {
|
||||
font-size: var(--tk-font-num);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.guard-title {
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.guard-desc {
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.guard-btn {
|
||||
display: inline-block;
|
||||
height: 48px;
|
||||
padding: 0 32px;
|
||||
background: $pri;
|
||||
border-radius: $r-pill;
|
||||
@include flex-center;
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
|
||||
.guard-btn-text {
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
}
|
||||
28
apps/miniprogram/src/components/GuestGuard/index.tsx
Normal file
28
apps/miniprogram/src/components/GuestGuard/index.tsx
Normal file
@@ -0,0 +1,28 @@
|
||||
import { View, Text } from '@tarojs/components';
|
||||
import { navigateToLogin } from '../../utils/navigate';
|
||||
import './index.scss';
|
||||
|
||||
interface GuestGuardProps {
|
||||
title: string;
|
||||
desc?: string;
|
||||
}
|
||||
|
||||
export default function GuestGuard({ title, desc }: GuestGuardProps) {
|
||||
return (
|
||||
<View className='guard-page'>
|
||||
<View className='guard-card'>
|
||||
<View className='guard-icon-wrap'>
|
||||
<Text className='guard-icon'>锁</Text>
|
||||
</View>
|
||||
<Text className='guard-title'>{title}</Text>
|
||||
{desc && <Text className='guard-desc'>{desc}</Text>}
|
||||
<View
|
||||
className='guard-btn'
|
||||
onClick={navigateToLogin}
|
||||
>
|
||||
<Text className='guard-btn-text'>立即登录</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
@@ -25,6 +25,6 @@
|
||||
}
|
||||
|
||||
.loading-state-text {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
@@ -17,13 +17,13 @@
|
||||
|
||||
.progress-ring-percent {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.progress-ring-unit {
|
||||
font-size: 12px;
|
||||
font-size: var(--tk-font-micro);
|
||||
font-weight: 600;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
@@ -39,7 +39,7 @@
|
||||
justify-content: center;
|
||||
background: $bd-l;
|
||||
color: $tx3;
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
transition: all 0.3s ease;
|
||||
z-index: 1;
|
||||
|
||||
@@ -55,8 +55,8 @@
|
||||
}
|
||||
|
||||
.step-label {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
margin-top: 8px;
|
||||
text-align: center;
|
||||
|
||||
|
||||
@@ -13,8 +13,8 @@
|
||||
}
|
||||
|
||||
.trend-chart-empty-text {
|
||||
font-size: 28px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
.trend-chart-skeleton {
|
||||
|
||||
@@ -14,13 +14,13 @@
|
||||
}
|
||||
|
||||
.week-arrow {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $pri;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
.week-label {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx;
|
||||
font-weight: bold;
|
||||
}
|
||||
@@ -39,13 +39,13 @@
|
||||
}
|
||||
|
||||
.cell-weekday {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cell-date {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
display: block;
|
||||
margin-top: 4px;
|
||||
|
||||
6
apps/miniprogram/src/hooks/useElderClass.ts
Normal file
6
apps/miniprogram/src/hooks/useElderClass.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
import { useUIStore } from '../stores/ui';
|
||||
|
||||
export function useElderClass(): string {
|
||||
const mode = useUIStore((s) => s.mode);
|
||||
return mode === 'elder' ? 'elder-mode' : '';
|
||||
}
|
||||
@@ -27,7 +27,7 @@
|
||||
}
|
||||
|
||||
.meta-item {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -45,7 +45,7 @@
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
line-height: 1.8;
|
||||
margin-bottom: 16px;
|
||||
@@ -57,7 +57,7 @@
|
||||
}
|
||||
|
||||
li {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
line-height: 1.8;
|
||||
margin-bottom: 8px;
|
||||
@@ -69,7 +69,7 @@
|
||||
}
|
||||
|
||||
.report-content {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
line-height: 1.8;
|
||||
color: $tx;
|
||||
}
|
||||
@@ -78,8 +78,8 @@
|
||||
display: block;
|
||||
text-align: center;
|
||||
padding: 120px 0;
|
||||
color: $tx3;
|
||||
font-size: 28px;
|
||||
color: var(--tk-text-secondary);
|
||||
font-size: var(--tk-font-body-lg);
|
||||
}
|
||||
|
||||
.auto-badge {
|
||||
@@ -91,7 +91,7 @@
|
||||
display: inline-block;
|
||||
padding: 4px 16px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 500;
|
||||
background: #f0e6ff;
|
||||
color: #7c3aed;
|
||||
@@ -106,7 +106,7 @@
|
||||
}
|
||||
|
||||
.trend-tip-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: #92400e;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@ import { View, Text, RichText } from '@tarojs/components';
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import { getAiAnalysisDetail, type AiAnalysisItem } from '@/services/ai-analysis';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const TYPE_LABELS: Record<string, string> = {
|
||||
@@ -44,6 +45,7 @@ function markdownToHtml(md: string): string {
|
||||
}
|
||||
|
||||
export default function AiReportDetail() {
|
||||
const modeClass = useElderClass();
|
||||
const router = useRouter();
|
||||
const id = router.params.id || '';
|
||||
|
||||
@@ -63,7 +65,7 @@ export default function AiReportDetail() {
|
||||
|
||||
if (!analysis) {
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
<Text className='empty-text'>报告不存在</Text>
|
||||
</View>
|
||||
);
|
||||
@@ -77,7 +79,7 @@ export default function AiReportDetail() {
|
||||
const isAutoAnalysis = (analysis.result_metadata as Record<string, unknown>)?.auto_analysis === true;
|
||||
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
<View className='detail-card'>
|
||||
<Text className='detail-type'>{TYPE_LABELS[analysis.analysis_type] || analysis.analysis_type}</Text>
|
||||
<View className='detail-meta'>
|
||||
|
||||
@@ -1,28 +1,5 @@
|
||||
@import '../../../styles/variables.scss';
|
||||
|
||||
@mixin serif-number {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
@mixin section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@mixin tag($bg, $color) {
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
background: $bg;
|
||||
color: $color;
|
||||
}
|
||||
@import '../../../styles/mixins.scss';
|
||||
|
||||
.ai-report-page {
|
||||
min-height: 100vh;
|
||||
@@ -55,7 +32,7 @@
|
||||
}
|
||||
|
||||
.card-type {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 500;
|
||||
color: $tx;
|
||||
}
|
||||
@@ -87,19 +64,19 @@
|
||||
}
|
||||
|
||||
.card-time {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.card-model {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.no-more {
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
padding: 24px 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Taro from '@tarojs/taro';
|
||||
import { listAiAnalysis, type AiAnalysisItem } from '@/services/ai-analysis';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const TYPE_LABELS: Record<string, string> = {
|
||||
@@ -21,6 +22,7 @@ const STATUS_MAP: Record<string, { text: string; className: string }> = {
|
||||
};
|
||||
|
||||
export default function AiReportList() {
|
||||
const modeClass = useElderClass();
|
||||
const [list, setList] = useState<AiAnalysisItem[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [page, setPage] = useState(1);
|
||||
@@ -60,14 +62,14 @@ export default function AiReportList() {
|
||||
|
||||
if (list.length === 0) {
|
||||
return (
|
||||
<View className='ai-report-page'>
|
||||
<View className={`ai-report-page ${modeClass}`}>
|
||||
<EmptyState text='暂无 AI 分析报告' />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<View className='ai-report-page'>
|
||||
<View className={`ai-report-page ${modeClass}`}>
|
||||
<View className='page-title'>AI 分析报告</View>
|
||||
<ScrollView scrollY className='report-scroll' onScrollToLower={loadMore}>
|
||||
{list.map((item) => {
|
||||
|
||||
@@ -55,7 +55,7 @@
|
||||
|
||||
.dept-initial-text {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
|
||||
@@ -65,7 +65,7 @@
|
||||
}
|
||||
|
||||
.dept-label {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -77,7 +77,7 @@
|
||||
|
||||
.slot-section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 16px;
|
||||
@@ -114,14 +114,14 @@
|
||||
|
||||
.slot-time {
|
||||
@include serif-number;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.slot-count {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
display: block;
|
||||
margin-top: 6px;
|
||||
@@ -156,7 +156,7 @@
|
||||
|
||||
.confirm-icon-serif {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
}
|
||||
@@ -169,12 +169,12 @@
|
||||
}
|
||||
|
||||
.confirm-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.confirm-value {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
}
|
||||
@@ -185,7 +185,7 @@
|
||||
}
|
||||
|
||||
.confirm-dept-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 500;
|
||||
color: $pri;
|
||||
}
|
||||
@@ -225,7 +225,7 @@
|
||||
|
||||
.doctor-avatar-text {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-num);
|
||||
color: $pri;
|
||||
font-weight: bold;
|
||||
}
|
||||
@@ -238,18 +238,18 @@
|
||||
}
|
||||
|
||||
.doctor-name {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.doctor-title {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.doctor-specialty {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
@@ -263,7 +263,7 @@
|
||||
}
|
||||
|
||||
.doctor-check-text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
}
|
||||
@@ -274,7 +274,7 @@
|
||||
}
|
||||
|
||||
.form-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
margin-bottom: 12px;
|
||||
display: block;
|
||||
@@ -284,7 +284,7 @@
|
||||
background: $card;
|
||||
border-radius: $r-sm;
|
||||
padding: 24px 28px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
@@ -298,8 +298,8 @@
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 28px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
/* 底部操作栏 */
|
||||
@@ -339,7 +339,7 @@
|
||||
}
|
||||
|
||||
.btn-text {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -7,6 +7,7 @@ import { TEMPLATE_IDS } from '@/services/wechat-templates';
|
||||
import { trackEvent } from '@/services/analytics';
|
||||
import StepIndicator from '../../../components/StepIndicator';
|
||||
import WeekCalendar from '../../../components/WeekCalendar';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const DEPARTMENTS = [
|
||||
@@ -44,6 +45,7 @@ export default function AppointmentCreate() {
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [schedules, setSchedules] = useState<any[]>([]);
|
||||
const [timeSlots, setTimeSlots] = useState<TimeSlot[]>([]);
|
||||
const modeClass = useElderClass();
|
||||
|
||||
const currentPatient = useAuthStore((s) => s.currentPatient);
|
||||
|
||||
@@ -148,7 +150,7 @@ export default function AppointmentCreate() {
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='create-page'>
|
||||
<View className={`create-page ${modeClass}`}>
|
||||
<StepIndicator
|
||||
steps={[{ label: '选科室' }, { label: '选医生' }, { label: '选时段' }]}
|
||||
current={currentStep}
|
||||
|
||||
@@ -23,14 +23,14 @@
|
||||
}
|
||||
|
||||
.back-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $pri;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 34px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
}
|
||||
@@ -80,19 +80,19 @@
|
||||
}
|
||||
|
||||
.status-tag-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.status-doctor {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.status-dept {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -130,7 +130,7 @@
|
||||
|
||||
.info-icon-serif {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $pri;
|
||||
background: $pri-l;
|
||||
width: 36px;
|
||||
@@ -143,12 +143,12 @@
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -163,8 +163,8 @@
|
||||
|
||||
.info-id {
|
||||
@include serif-number;
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
word-break: break-all;
|
||||
max-width: 400px;
|
||||
text-align: right;
|
||||
@@ -180,7 +180,7 @@
|
||||
|
||||
.tips-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $wrn;
|
||||
margin-bottom: 12px;
|
||||
@@ -188,7 +188,7 @@
|
||||
}
|
||||
|
||||
.tips-text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@@ -219,7 +219,7 @@
|
||||
}
|
||||
|
||||
.cancel-text {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $dan;
|
||||
}
|
||||
|
||||
@@ -5,6 +5,7 @@ import { getAppointment, cancelAppointment } from '../../../services/appointment
|
||||
import type { Appointment } from '../../../services/appointment';
|
||||
import Loading from '../../../components/Loading';
|
||||
import ErrorState from '../../../components/ErrorState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const STATUS_MAP: Record<string, { label: string; className: string }> = {
|
||||
@@ -22,6 +23,7 @@ export default function AppointmentDetail() {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState(false);
|
||||
const [cancelling, setCancelling] = useState(false);
|
||||
const modeClass = useElderClass();
|
||||
|
||||
useEffect(() => {
|
||||
if (!id) return;
|
||||
@@ -65,7 +67,7 @@ export default function AppointmentDetail() {
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
<View className='detail-header'>
|
||||
<View className='back-btn' onClick={goBack}><Text className='back-text'>返回</Text></View>
|
||||
<Text className='header-title'>预约详情</Text>
|
||||
@@ -78,7 +80,7 @@ export default function AppointmentDetail() {
|
||||
|
||||
if (error || !appointment) {
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
<View className='detail-header'>
|
||||
<View className='back-btn' onClick={goBack}><Text className='back-text'>返回</Text></View>
|
||||
<Text className='header-title'>预约详情</Text>
|
||||
@@ -90,7 +92,7 @@ export default function AppointmentDetail() {
|
||||
}
|
||||
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
<View className='detail-header'>
|
||||
<View className='back-btn' onClick={goBack}><Text className='back-text'>返回</Text></View>
|
||||
<Text className='header-title'>预约详情</Text>
|
||||
|
||||
@@ -17,13 +17,13 @@
|
||||
.page-title {
|
||||
@include section-title;
|
||||
margin-bottom: 4px;
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
}
|
||||
|
||||
.page-subtitle {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
@@ -67,7 +67,7 @@
|
||||
|
||||
.dept-initial-text {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
}
|
||||
@@ -80,7 +80,7 @@
|
||||
}
|
||||
|
||||
.doctor-name {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
overflow: hidden;
|
||||
@@ -93,7 +93,7 @@
|
||||
}
|
||||
|
||||
.dept-tag-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 500;
|
||||
color: $pri;
|
||||
}
|
||||
@@ -124,7 +124,7 @@
|
||||
}
|
||||
|
||||
.status-tag-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@@ -157,12 +157,12 @@
|
||||
|
||||
.info-icon-serif {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.info-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -186,7 +186,7 @@
|
||||
}
|
||||
|
||||
.fab-text {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
letter-spacing: 2px;
|
||||
|
||||
@@ -5,6 +5,7 @@ import { listAppointments } from '../../services/appointment';
|
||||
import type { Appointment } from '../../services/appointment';
|
||||
import EmptyState from '../../components/EmptyState';
|
||||
import Loading from '../../components/Loading';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const STATUS_MAP: Record<string, { label: string; className: string }> = {
|
||||
@@ -30,6 +31,7 @@ export default function AppointmentList() {
|
||||
const [total, setTotal] = useState(0);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const loadingRef = useRef(false);
|
||||
const modeClass = useElderClass();
|
||||
|
||||
const fetchData = useCallback(async (pageNum: number, isRefresh = false) => {
|
||||
if (loadingRef.current) return;
|
||||
@@ -86,7 +88,7 @@ export default function AppointmentList() {
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='appointment-page'>
|
||||
<View className={`appointment-page ${modeClass}`}>
|
||||
{/* 页面标题 */}
|
||||
<View className='page-header'>
|
||||
<Text className='page-title'>预约挂号</Text>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
}
|
||||
|
||||
.article-title {
|
||||
font-size: 38px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -29,7 +29,7 @@
|
||||
}
|
||||
|
||||
.article-category {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $pri;
|
||||
background: $pri-l;
|
||||
padding: 4px 12px;
|
||||
@@ -37,13 +37,13 @@
|
||||
}
|
||||
|
||||
.article-author {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.article-date {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
.article-summary {
|
||||
@@ -53,7 +53,7 @@
|
||||
}
|
||||
|
||||
.summary-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@@ -70,7 +70,7 @@
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
line-height: 1.8;
|
||||
margin-bottom: 16px;
|
||||
@@ -93,6 +93,6 @@
|
||||
|
||||
.loading-text,
|
||||
.empty-text {
|
||||
font-size: 28px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
@@ -3,9 +3,11 @@ import { View, Text, RichText } from '@tarojs/components';
|
||||
import Taro, { useRouter, useShareAppMessage } from '@tarojs/taro';
|
||||
import { getArticleDetail, Article } from '../../../services/article';
|
||||
import { trackEvent } from '@/services/analytics';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function ArticleDetail() {
|
||||
const modeClass = useElderClass();
|
||||
const router = useRouter();
|
||||
const id = router.params.id || '';
|
||||
|
||||
@@ -31,7 +33,7 @@ export default function ArticleDetail() {
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<View className='article-detail-page'>
|
||||
<View className={`article-detail-page ${modeClass}`}>
|
||||
<View className='loading-state'>
|
||||
<Text className='loading-text'>加载中...</Text>
|
||||
</View>
|
||||
@@ -41,7 +43,7 @@ export default function ArticleDetail() {
|
||||
|
||||
if (!article) {
|
||||
return (
|
||||
<View className='article-detail-page'>
|
||||
<View className={`article-detail-page ${modeClass}`}>
|
||||
<View className='empty-state'>
|
||||
<Text className='empty-text'>文章不存在</Text>
|
||||
</View>
|
||||
@@ -50,7 +52,7 @@ export default function ArticleDetail() {
|
||||
}
|
||||
|
||||
return (
|
||||
<View className='article-detail-page'>
|
||||
<View className={`article-detail-page ${modeClass}`}>
|
||||
{/* 文章头部 */}
|
||||
<View className='article-header'>
|
||||
<Text className='article-title'>{article.title}</Text>
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
display: inline-block;
|
||||
padding: 12px 28px;
|
||||
margin-right: 12px;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
background: $card;
|
||||
border-radius: 32px;
|
||||
@@ -52,7 +52,7 @@
|
||||
}
|
||||
|
||||
.article-card-title {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
line-height: 1.4;
|
||||
@@ -66,7 +66,7 @@
|
||||
}
|
||||
|
||||
.article-card-summary {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
line-height: 1.4;
|
||||
display: block;
|
||||
@@ -83,7 +83,7 @@
|
||||
}
|
||||
|
||||
.article-card-tag {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $pri;
|
||||
background: $pri-l;
|
||||
padding: 2px 12px;
|
||||
@@ -91,7 +91,7 @@
|
||||
}
|
||||
|
||||
.article-card-date {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -116,8 +116,8 @@
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 28px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
.loading-hint {
|
||||
@@ -126,6 +126,6 @@
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
@@ -4,9 +4,11 @@ import Taro, { useDidShow, usePullDownRefresh, useReachBottom } from '@tarojs/ta
|
||||
import { listArticles, listCategories, Article, ArticleCategory } from '../../services/article';
|
||||
import EmptyState from '../../components/EmptyState';
|
||||
import Loading from '../../components/Loading';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function ArticleList() {
|
||||
const modeClass = useElderClass();
|
||||
const [articles, setArticles] = useState<Article[]>([]);
|
||||
const [page, setPage] = useState(1);
|
||||
const [total, setTotal] = useState(0);
|
||||
@@ -72,7 +74,7 @@ export default function ArticleList() {
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='article-page'>
|
||||
<View className={`article-page ${modeClass}`}>
|
||||
{/* 分类筛选 */}
|
||||
{categories.length > 0 && (
|
||||
<ScrollView scrollX className='article-categories'>
|
||||
|
||||
@@ -8,61 +8,108 @@
|
||||
background: $bg;
|
||||
}
|
||||
|
||||
/* ─── 导航栏 ─── */
|
||||
.chat-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 24px 32px;
|
||||
padding: 12px 16px;
|
||||
background: $card;
|
||||
border-bottom: 1px solid $bd;
|
||||
border-bottom: 1px solid $bd-l;
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
.chat-header__back {
|
||||
position: absolute;
|
||||
left: 16px;
|
||||
z-index: 1;
|
||||
|
||||
&:active {
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
|
||||
&__status {
|
||||
font-size: 24px;
|
||||
.chat-header__back-text {
|
||||
font-size: var(--tk-font-body-sm);
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.chat-header__center {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chat-header__title {
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.chat-header__status {
|
||||
font-size: var(--tk-font-micro);
|
||||
color: $acc;
|
||||
margin-top: 2px;
|
||||
|
||||
&--closed {
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
|
||||
/* ─── 消息区 ─── */
|
||||
.chat-messages {
|
||||
flex: 1;
|
||||
padding: 24px;
|
||||
padding: 16px 16px 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.msg-row {
|
||||
display: flex;
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 16px;
|
||||
gap: 8px;
|
||||
|
||||
&--self {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
/* ─── 医生头像 ─── */
|
||||
.msg-avatar {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 16px;
|
||||
background: $pri-l;
|
||||
@include flex-center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.msg-avatar-char {
|
||||
@include serif-number;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 700;
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
/* ─── 消息气泡 ─── */
|
||||
.msg-bubble {
|
||||
max-width: 70%;
|
||||
padding: 20px 24px;
|
||||
border-radius: $r-lg;
|
||||
position: relative;
|
||||
padding: 12px 16px;
|
||||
box-shadow: $shadow-sm;
|
||||
|
||||
&--other {
|
||||
background: $card;
|
||||
border-top-left-radius: $r-sm;
|
||||
border-radius: $r $r $r $r-xs;
|
||||
}
|
||||
|
||||
&--self {
|
||||
background: $pri;
|
||||
border-top-right-radius: $r-sm;
|
||||
border-radius: $r $r $r-xs $r;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx;
|
||||
display: block;
|
||||
line-height: 1.6;
|
||||
@@ -76,88 +123,95 @@
|
||||
.msg-date-divider {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 16px 0 12px;
|
||||
padding: 12px 0;
|
||||
|
||||
&__text {
|
||||
font-size: 22px;
|
||||
color: #94A3B8;
|
||||
background: #F1F5F9;
|
||||
padding: 4px 16px;
|
||||
border-radius: 8px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: var(--tk-text-secondary);
|
||||
background: $surface-alt;
|
||||
padding: 2px 12px;
|
||||
border-radius: $r-pill;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-image {
|
||||
width: 320px;
|
||||
border-radius: 12px;
|
||||
width: 200px;
|
||||
border-radius: $r-sm;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.msg-time {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
text-align: right;
|
||||
margin-top: 4px;
|
||||
|
||||
.msg-bubble--self & {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.chat-empty {
|
||||
text-align: center;
|
||||
padding: 120px 32px;
|
||||
padding: 80px 24px;
|
||||
|
||||
&__text {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
}
|
||||
|
||||
/* ─── 输入栏 ─── */
|
||||
.chat-input-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 16px 24px;
|
||||
gap: 10px;
|
||||
padding: 10px 16px 38px;
|
||||
background: $card;
|
||||
border-top: 1px solid $bd;
|
||||
padding-bottom: calc(16px + env(safe-area-inset-bottom));
|
||||
border-top: 1px solid $bd-l;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.chat-input {
|
||||
flex: 1;
|
||||
height: 40px;
|
||||
background: $bg;
|
||||
border-radius: $r;
|
||||
padding: 16px 20px;
|
||||
font-size: 28px;
|
||||
margin-right: 16px;
|
||||
border: 1.5px solid $bd;
|
||||
border-radius: 20px;
|
||||
padding: 0 14px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.chat-send-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 20px;
|
||||
background: $pri;
|
||||
border-radius: $r;
|
||||
padding: 16px 28px;
|
||||
@include flex-center;
|
||||
flex-shrink: 0;
|
||||
box-shadow: 0 2px 6px rgba(196, 98, 58, 0.3);
|
||||
|
||||
&--disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
&__text {
|
||||
font-size: 28px;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
.chat-send-btn__icon {
|
||||
font-size: var(--tk-font-cap);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.chat-closed-bar {
|
||||
padding: 24px;
|
||||
padding: 16px;
|
||||
text-align: center;
|
||||
background: $card;
|
||||
border-top: 1px solid $bd;
|
||||
border-top: 1px solid $bd-l;
|
||||
|
||||
&__text {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -6,14 +6,14 @@ import {
|
||||
listMessages,
|
||||
sendMessage,
|
||||
markSessionRead,
|
||||
pollMessages,
|
||||
type ConsultationSession,
|
||||
type ConsultationMessage,
|
||||
} from '@/services/consultation';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '@/hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const POLL_INTERVAL = 8000;
|
||||
|
||||
export default function ConsultationDetail() {
|
||||
const router = useRouter();
|
||||
const sessionId = router.params.id || '';
|
||||
@@ -23,43 +23,35 @@ export default function ConsultationDetail() {
|
||||
const [sending, setSending] = useState(false);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const scrollViewRef = useRef('');
|
||||
const pollTimerRef = useRef<ReturnType<typeof setInterval> | null>(null);
|
||||
const pollingRef = useRef(false);
|
||||
const modeClass = useElderClass();
|
||||
|
||||
useEffect(() => {
|
||||
if (sessionId) {
|
||||
loadData();
|
||||
markRead();
|
||||
startPolling();
|
||||
startLongPolling();
|
||||
}
|
||||
return () => stopPolling();
|
||||
return () => { pollingRef.current = false; };
|
||||
}, [sessionId]);
|
||||
|
||||
const startPolling = () => {
|
||||
stopPolling();
|
||||
pollTimerRef.current = setInterval(pollNewMessages, POLL_INTERVAL);
|
||||
useEffect(() => {
|
||||
if (session?.status === 'closed') {
|
||||
pollingRef.current = false;
|
||||
}
|
||||
}, [session?.status]);
|
||||
|
||||
const startLongPolling = () => {
|
||||
pollingRef.current = true;
|
||||
longPoll();
|
||||
};
|
||||
|
||||
const stopPolling = () => {
|
||||
if (pollTimerRef.current) {
|
||||
clearInterval(pollTimerRef.current);
|
||||
pollTimerRef.current = null;
|
||||
}
|
||||
};
|
||||
|
||||
const pollNewMessages = async () => {
|
||||
if (!session || session.status === 'closed') {
|
||||
stopPolling();
|
||||
return;
|
||||
}
|
||||
const longPoll = async () => {
|
||||
if (!pollingRef.current) return;
|
||||
try {
|
||||
const lastId = messages.length > 0 ? messages[messages.length - 1].id : undefined;
|
||||
const m = await listMessages(sessionId, {
|
||||
page: 1,
|
||||
page_size: 50,
|
||||
after_id: lastId,
|
||||
});
|
||||
const newMsgs = m.data || [];
|
||||
if (newMsgs.length > 0) {
|
||||
const newMsgs = await pollMessages(sessionId, lastId);
|
||||
if (newMsgs && newMsgs.length > 0) {
|
||||
setMessages((prev) => {
|
||||
const existing = new Set(prev.map((msg) => msg.id));
|
||||
const fresh = newMsgs.filter((msg) => !existing.has(msg.id));
|
||||
@@ -67,7 +59,12 @@ export default function ConsultationDetail() {
|
||||
});
|
||||
scrollViewRef.current = `msg-${messages.length + newMsgs.length}`;
|
||||
}
|
||||
} catch { /* 轮询失败静默忽略 */ }
|
||||
} catch {
|
||||
// 超时或网络错误，静默重试
|
||||
}
|
||||
if (pollingRef.current) {
|
||||
longPoll();
|
||||
}
|
||||
};
|
||||
|
||||
const loadData = async () => {
|
||||
@@ -80,7 +77,7 @@ export default function ConsultationDetail() {
|
||||
setSession(s);
|
||||
setMessages(m.data || []);
|
||||
scrollViewRef.current = `msg-${(m.data || []).length}`;
|
||||
if (s.status === 'closed') stopPolling();
|
||||
if (s.status === 'closed') pollingRef.current = false;
|
||||
} catch {
|
||||
Taro.showToast({ title: '加载失败', icon: 'none' });
|
||||
} finally {
|
||||
@@ -137,14 +134,24 @@ export default function ConsultationDetail() {
|
||||
if (loading) return <Loading />;
|
||||
|
||||
const isOpen = session?.status !== 'closed';
|
||||
const doctorInitial = (session?.subject || '医').charAt(0);
|
||||
const statusLabel = session?.status === 'active' ? '进行中'
|
||||
: session?.status === 'pending' ? '等待接诊'
|
||||
: '已结束';
|
||||
|
||||
return (
|
||||
<View className='chat-page'>
|
||||
<View className={`chat-page ${modeClass}`}>
|
||||
{/* 导航栏 — 对齐设计稿：返回 + 标题 + 副标题 */}
|
||||
<View className='chat-header'>
|
||||
<Text className='chat-header__title'>{session?.subject || '在线咨询'}</Text>
|
||||
{!isOpen && (
|
||||
<Text className='chat-header__status'>已结束</Text>
|
||||
)}
|
||||
<View className='chat-header__back' onClick={() => Taro.navigateBack()}>
|
||||
<Text className='chat-header__back-text'>‹ 返回</Text>
|
||||
</View>
|
||||
<View className='chat-header__center'>
|
||||
<Text className='chat-header__title'>{session?.subject || '在线咨询'}</Text>
|
||||
<Text className={`chat-header__status ${isOpen ? '' : 'chat-header__status--closed'}`}>
|
||||
{statusLabel}
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<ScrollView
|
||||
@@ -164,6 +171,11 @@ export default function ConsultationDetail() {
|
||||
</View>
|
||||
)}
|
||||
<View id={`msg-${idx + 1}`} className={`msg-row ${isSelf ? 'msg-row--self' : ''}`}>
|
||||
{!isSelf && (
|
||||
<View className='msg-avatar'>
|
||||
<Text className='msg-avatar-char'>{doctorInitial}</Text>
|
||||
</View>
|
||||
)}
|
||||
<View className={`msg-bubble ${isSelf ? 'msg-bubble--self' : 'msg-bubble--other'}`}>
|
||||
{isImageUrl(msg.content) ? (
|
||||
<Image
|
||||
@@ -203,7 +215,7 @@ export default function ConsultationDetail() {
|
||||
className={`chat-send-btn ${(!inputText.trim() || sending) ? 'chat-send-btn--disabled' : ''}`}
|
||||
onClick={handleSend}
|
||||
>
|
||||
<Text className='chat-send-btn__text'>{sending ? '...' : '发送'}</Text>
|
||||
<Text className='chat-send-btn__icon'>发</Text>
|
||||
</View>
|
||||
</View>
|
||||
) : (
|
||||
|
||||
@@ -6,26 +6,36 @@
|
||||
background: $bg;
|
||||
}
|
||||
|
||||
/* ─── 页头 ─── */
|
||||
.consultation-header {
|
||||
background: linear-gradient(135deg, $pri 0%, $pri-d 100%);
|
||||
padding: 48px 32px 36px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.consultation-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 40px;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
.consultation-body {
|
||||
padding: 12px 24px 24px;
|
||||
}
|
||||
|
||||
/* ─── 副标题 ─── */
|
||||
.consultation-subtitle {
|
||||
font-size: 24px;
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* ─── 发起咨询按钮 — 实心主色 ─── */
|
||||
.consultation-create-btn {
|
||||
height: 48px;
|
||||
border-radius: $r;
|
||||
background: $pri;
|
||||
@include flex-center;
|
||||
box-shadow: 0 2px 8px rgba(196, 98, 58, 0.25);
|
||||
margin-bottom: 20px;
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
|
||||
.consultation-create-btn-text {
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* ─── 居中容器 ─── */
|
||||
@@ -37,7 +47,7 @@
|
||||
}
|
||||
|
||||
.consultation-error {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $dan;
|
||||
}
|
||||
|
||||
@@ -47,51 +57,52 @@
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 160px 40px;
|
||||
padding: 120px 40px;
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 50%;
|
||||
background: $pri-l;
|
||||
@include flex-center;
|
||||
margin-bottom: 32px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.empty-char {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 52px;
|
||||
font-weight: bold;
|
||||
@include serif-number;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: 700;
|
||||
color: $pri;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.empty-title {
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.empty-hint {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* ─── 会话列表 ─── */
|
||||
.session-list {
|
||||
padding: 20px 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.session-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 24px;
|
||||
margin-bottom: 12px;
|
||||
padding: 16px;
|
||||
box-shadow: $shadow-sm;
|
||||
|
||||
&:active {
|
||||
@@ -99,7 +110,27 @@
|
||||
}
|
||||
}
|
||||
|
||||
.session-main {
|
||||
.session-card-closed {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.session-avatar {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 18px;
|
||||
background: $pri-l;
|
||||
@include flex-center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.session-avatar-char {
|
||||
@include serif-number;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 700;
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.session-body {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
@@ -108,56 +139,73 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 8px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.session-subject {
|
||||
font-size: 28px;
|
||||
color: $tx;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.session-tag {
|
||||
&.tag-ok { @include tag($acc-l, $acc); }
|
||||
&.tag-warn { @include tag($wrn-l, $wrn); }
|
||||
&.tag-default { @include tag($bd-l, $tx2); }
|
||||
}
|
||||
|
||||
.session-message {
|
||||
font-size: 26px;
|
||||
color: $tx2;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-bottom: 8px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.session-time {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
display: block;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: var(--tk-text-secondary);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.session-tag {
|
||||
font-size: var(--tk-font-micro);
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-weight: 500;
|
||||
display: inline-block;
|
||||
|
||||
&.tag-ok { background: $acc-l; color: $acc; }
|
||||
&.tag-warn { background: $wrn-l; color: $wrn; }
|
||||
&.tag-default { background: $surface-alt; color: $tx3; }
|
||||
}
|
||||
|
||||
.session-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.session-message-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.session-message {
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
/* ─── 未读角标 ─── */
|
||||
.session-badge {
|
||||
background: $dan;
|
||||
border-radius: $r-pill;
|
||||
min-width: 36px;
|
||||
height: 36px;
|
||||
min-width: 18px;
|
||||
height: 18px;
|
||||
@include flex-center;
|
||||
padding: 0 10px;
|
||||
margin-left: 12px;
|
||||
padding: 0 5px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.session-badge-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@ import { View, Text } from '@tarojs/components';
|
||||
import Taro, { useDidShow, usePullDownRefresh, useReachBottom } from '@tarojs/taro';
|
||||
import { listConsultations, ConsultationSession } from '@/services/consultation';
|
||||
import Loading from '../../components/Loading';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
function getStatusTag(status: string) {
|
||||
@@ -33,6 +34,7 @@ export default function Consultation() {
|
||||
const [sessions, setSessions] = useState<ConsultationSession[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState('');
|
||||
const modeClass = useElderClass();
|
||||
const [page, setPage] = useState(1);
|
||||
const [total, setTotal] = useState(0);
|
||||
const loadingRef = useRef(false);
|
||||
@@ -85,68 +87,84 @@ export default function Consultation() {
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='consultation-page'>
|
||||
{/* 页头 */}
|
||||
<View className='consultation-header'>
|
||||
<Text className='consultation-title'>在线咨询</Text>
|
||||
<View className={`consultation-page ${modeClass}`}>
|
||||
<View className='consultation-body'>
|
||||
{/* 副标题 */}
|
||||
<Text className='consultation-subtitle'>随时随地，连接专业医生</Text>
|
||||
</View>
|
||||
|
||||
{/* 内容区 */}
|
||||
{loading ? (
|
||||
<View className='consultation-center'>
|
||||
<Loading text='加载中...' />
|
||||
{/* 发起咨询按钮 — 实心主色 */}
|
||||
<View
|
||||
className='consultation-create-btn'
|
||||
onClick={() => Taro.navigateTo({ url: '/pages/consultation/create/index' })}
|
||||
>
|
||||
<Text className='consultation-create-btn-text'>发起咨询</Text>
|
||||
</View>
|
||||
) : error ? (
|
||||
<View className='consultation-center'>
|
||||
<Text className='consultation-error'>{error}</Text>
|
||||
</View>
|
||||
) : sessions.length === 0 ? (
|
||||
<View className='consultation-empty'>
|
||||
<View className='empty-icon'>
|
||||
<Text className='empty-char'>问</Text>
|
||||
|
||||
{/* 内容区 */}
|
||||
{loading ? (
|
||||
<View className='consultation-center'>
|
||||
<Loading text='加载中...' />
|
||||
</View>
|
||||
<Text className='empty-title'>暂无咨询记录</Text>
|
||||
<Text className='empty-hint'>发起咨询后即可在这里与医生交流</Text>
|
||||
</View>
|
||||
) : (
|
||||
<View className='session-list'>
|
||||
{sessions.map((session) => {
|
||||
const tag = getStatusTag(session.status);
|
||||
return (
|
||||
<View
|
||||
key={session.id}
|
||||
className='session-card'
|
||||
onClick={() => handleTapSession(session)}
|
||||
>
|
||||
<View className='session-main'>
|
||||
<View className='session-top'>
|
||||
<Text className='session-subject'>
|
||||
{session.subject || '在线咨询'}
|
||||
</Text>
|
||||
<Text className={`session-tag ${tag.cls}`}>{tag.label}</Text>
|
||||
) : error ? (
|
||||
<View className='consultation-center'>
|
||||
<Text className='consultation-error'>{error}</Text>
|
||||
</View>
|
||||
) : sessions.length === 0 ? (
|
||||
<View className='consultation-empty'>
|
||||
<View className='empty-icon'>
|
||||
<Text className='empty-char'>问</Text>
|
||||
</View>
|
||||
<Text className='empty-title'>暂无咨询记录</Text>
|
||||
<Text className='empty-hint'>发起咨询后即可在这里与医生交流</Text>
|
||||
</View>
|
||||
) : (
|
||||
<View className='session-list'>
|
||||
{sessions.map((session) => {
|
||||
const tag = getStatusTag(session.status);
|
||||
const initial = (session.subject || '咨').charAt(0);
|
||||
const isClosed = session.status === 'closed' || session.status === 'cancelled';
|
||||
return (
|
||||
<View
|
||||
key={session.id}
|
||||
className={`session-card ${isClosed ? 'session-card-closed' : ''}`}
|
||||
onClick={() => handleTapSession(session)}
|
||||
>
|
||||
<View className='session-avatar'>
|
||||
<Text className='session-avatar-char'>{initial}</Text>
|
||||
</View>
|
||||
<View className='session-body'>
|
||||
<View className='session-top'>
|
||||
<Text className='session-subject'>
|
||||
{session.subject || '在线咨询'}
|
||||
</Text>
|
||||
<Text className='session-time'>
|
||||
{session.last_message_at
|
||||
? formatTime(session.last_message_at)
|
||||
: formatTime(session.created_at)}
|
||||
</Text>
|
||||
</View>
|
||||
<View className='session-meta'>
|
||||
<Text className={`session-tag ${tag.cls}`}>{tag.label}</Text>
|
||||
</View>
|
||||
<View className='session-message-row'>
|
||||
<Text className='session-message'>
|
||||
{session.last_message || '暂无消息'}
|
||||
</Text>
|
||||
{session.unread_count_patient > 0 && (
|
||||
<View className='session-badge'>
|
||||
<Text className='session-badge-text'>
|
||||
{session.unread_count_patient > 99 ? '99+' : session.unread_count_patient}
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
<Text className='session-message'>
|
||||
{session.last_message || '暂无消息'}
|
||||
</Text>
|
||||
<Text className='session-time'>
|
||||
{session.last_message_at
|
||||
? formatTime(session.last_message_at)
|
||||
: formatTime(session.created_at)}
|
||||
</Text>
|
||||
</View>
|
||||
{session.unread_count_patient > 0 && (
|
||||
<View className='session-badge'>
|
||||
<Text className='session-badge-text'>
|
||||
{session.unread_count_patient > 99 ? '99+' : session.unread_count_patient}
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
)}
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,34 +1,5 @@
|
||||
@import '../../styles/variables.scss';
|
||||
|
||||
@mixin serif-number {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
@mixin section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@mixin tag($bg, $color) {
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
background: $bg;
|
||||
color: $color;
|
||||
}
|
||||
|
||||
@mixin flex-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@import '../../styles/mixins.scss';
|
||||
|
||||
.device-sync-page {
|
||||
min-height: 100vh;
|
||||
@@ -43,9 +14,8 @@
|
||||
}
|
||||
|
||||
.sync-header-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 40px;
|
||||
font-weight: bold;
|
||||
@include section-title;
|
||||
color: $card;
|
||||
}
|
||||
|
||||
.sync-section {
|
||||
@@ -72,20 +42,17 @@
|
||||
margin-bottom: 20px;
|
||||
color: $pri;
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.sync-hero-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 34px;
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
@include section-title;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.sync-hero-desc {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -110,7 +77,7 @@
|
||||
|
||||
.sync-action-text {
|
||||
color: $card;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@@ -120,7 +87,7 @@
|
||||
|
||||
.sync-section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 12px;
|
||||
@@ -144,19 +111,19 @@
|
||||
}
|
||||
|
||||
.sync-device-name {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 500;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.sync-device-adapter {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.sync-device-rssi {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -183,7 +150,7 @@
|
||||
}
|
||||
|
||||
.sync-status-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
@@ -208,12 +175,12 @@
|
||||
}
|
||||
|
||||
.sync-reading-type {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.sync-reading-value {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
@include serif-number;
|
||||
@@ -222,8 +189,8 @@
|
||||
.sync-readings-count {
|
||||
display: block;
|
||||
margin-top: 12px;
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@@ -240,7 +207,7 @@
|
||||
}
|
||||
|
||||
.sync-error-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $dan;
|
||||
}
|
||||
|
||||
@@ -250,7 +217,7 @@
|
||||
}
|
||||
|
||||
.sync-loading-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -273,20 +240,17 @@
|
||||
@include flex-center;
|
||||
color: $acc;
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: bold;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.sync-result-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 34px;
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
@include section-title;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.sync-result-count {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -10,6 +10,7 @@ import { DataSyncScheduler } from '@/services/ble/DataSyncScheduler';
|
||||
import { uploadReadings } from '@/services/device-sync';
|
||||
import { useAuthStore } from '@/stores/auth';
|
||||
import type { BLEDevice, NormalizedReading } from '@/services/ble/types';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const bleManager = new BLEManager({ scanTimeout: 10000, retryCount: 3 });
|
||||
@@ -21,6 +22,7 @@ bleManager.registerAdapter(CustomBandAdapter);
|
||||
type PageState = 'idle' | 'scanning' | 'connecting' | 'connected' | 'syncing' | 'done' | 'error';
|
||||
|
||||
export default function DeviceSync() {
|
||||
const modeClass = useElderClass();
|
||||
const { currentPatient } = useAuthStore();
|
||||
const router = useRouter();
|
||||
const returnTo = router.params.returnTo || '';
|
||||
@@ -271,7 +273,7 @@ export default function DeviceSync() {
|
||||
);
|
||||
|
||||
return (
|
||||
<View className="device-sync-page">
|
||||
<View className={`device-sync-page ${modeClass}`}>
|
||||
<View className="sync-header">
|
||||
<Text className="sync-header-title">设备同步</Text>
|
||||
</View>
|
||||
|
||||
@@ -38,7 +38,7 @@
|
||||
}
|
||||
|
||||
.inbox-tab-text {
|
||||
font-size: 14px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
}
|
||||
}
|
||||
@@ -64,20 +64,20 @@
|
||||
|
||||
.inbox-type-tag {
|
||||
color: $card;
|
||||
font-size: 10px;
|
||||
font-size: var(--tk-font-micro);
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.inbox-card-title {
|
||||
font-size: 14px;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 500;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.inbox-card-desc {
|
||||
font-size: 12px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
@@ -87,7 +87,7 @@
|
||||
padding: 80px 0;
|
||||
|
||||
.inbox-empty-text {
|
||||
font-size: 14px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
@@ -112,13 +112,13 @@
|
||||
border-bottom: 1px solid $bd-l;
|
||||
|
||||
.dialog-title {
|
||||
font-size: 16px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.dialog-close {
|
||||
font-size: 13px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
@@ -128,7 +128,7 @@
|
||||
}
|
||||
|
||||
.dialog-patient {
|
||||
font-size: 13px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 12px;
|
||||
@@ -156,13 +156,13 @@
|
||||
|
||||
.thread-content {
|
||||
.thread-label {
|
||||
font-size: 13px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.thread-time {
|
||||
font-size: 11px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
@@ -178,7 +178,7 @@
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
border-radius: $r-sm;
|
||||
font-size: 14px;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 500;
|
||||
|
||||
&.primary { background: $pri; color: $card; }
|
||||
|
||||
@@ -8,6 +8,7 @@ import {
|
||||
type ThreadResponse,
|
||||
} from '@/services/action-inbox';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import { getStatusInlineStyle, getStatusLabel } from '@/utils/statusTag';
|
||||
import './index.scss';
|
||||
|
||||
@@ -33,6 +34,7 @@ const STATUS_TABS = [
|
||||
];
|
||||
|
||||
export default function ActionInboxPage() {
|
||||
const modeClass = useElderClass();
|
||||
const [items, setItems] = useState<ActionItem[]>([]);
|
||||
const [total, setTotal] = useState(0);
|
||||
const [_page, setPage] = useState(1);
|
||||
@@ -118,7 +120,7 @@ export default function ActionInboxPage() {
|
||||
};
|
||||
|
||||
return (
|
||||
<View className="action-inbox-page">
|
||||
<View className={`action-inbox-page ${modeClass}`}>
|
||||
<View className="inbox-tabs">
|
||||
{STATUS_TABS.map((tab) => (
|
||||
<View
|
||||
|
||||
@@ -18,13 +18,13 @@
|
||||
}
|
||||
|
||||
&__time {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
|
||||
.detail-severity {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
font-weight: 600;
|
||||
padding: 6px 16px;
|
||||
border-radius: $r-sm;
|
||||
@@ -51,7 +51,7 @@
|
||||
}
|
||||
|
||||
.detail-status {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
padding: 6px 16px;
|
||||
border-radius: $r-sm;
|
||||
|
||||
@@ -84,24 +84,24 @@
|
||||
box-shadow: $shadow-sm;
|
||||
|
||||
&__label {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
&__value {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
word-break: break-all;
|
||||
|
||||
&--id {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
&--detail {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx2;
|
||||
font-family: monospace;
|
||||
line-height: 1.6;
|
||||
@@ -125,7 +125,7 @@
|
||||
flex: 1;
|
||||
height: 88px;
|
||||
line-height: 88px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
border-radius: $r-lg;
|
||||
text-align: center;
|
||||
|
||||
@@ -3,6 +3,7 @@ import { View, Text, ScrollView, Button } from '@tarojs/components';
|
||||
import Taro from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const SEVERITY_MAP: Record<string, { label: string; className: string }> = {
|
||||
@@ -20,6 +21,7 @@ const STATUS_MAP: Record<string, { label: string; className: string }> = {
|
||||
};
|
||||
|
||||
export default function AlertDetail() {
|
||||
const modeClass = useElderClass();
|
||||
const [alert, setAlert] = useState<doctorApi.Alert | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [actionLoading, setActionLoading] = useState(false);
|
||||
@@ -93,7 +95,7 @@ export default function AlertDetail() {
|
||||
if (loading) return <Loading />;
|
||||
if (!alert) {
|
||||
return (
|
||||
<View className='alert-detail-page'>
|
||||
<View className={`alert-detail-page ${modeClass}`}>
|
||||
<Text>告警不存在</Text>
|
||||
</View>
|
||||
);
|
||||
@@ -105,7 +107,7 @@ export default function AlertDetail() {
|
||||
const isAcknowledged = alert.status === 'acknowledged';
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='alert-detail-page'>
|
||||
<ScrollView scrollY className={`alert-detail-page ${modeClass}`}>
|
||||
{/* 顶部状态 */}
|
||||
<View className='alert-detail-header'>
|
||||
<View className='alert-detail-header__tags'>
|
||||
|
||||
@@ -16,13 +16,13 @@
|
||||
}
|
||||
|
||||
.alert-list-title {
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.alert-list-count {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -36,7 +36,7 @@
|
||||
padding: 10px 24px;
|
||||
border-radius: $r-pill;
|
||||
background: $bd-l;
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
transition: all 0.2s;
|
||||
|
||||
@@ -79,7 +79,7 @@
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 500;
|
||||
color: $tx;
|
||||
margin-bottom: 8px;
|
||||
@@ -92,13 +92,13 @@
|
||||
}
|
||||
|
||||
&__time {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-severity {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 600;
|
||||
padding: 4px 12px;
|
||||
border-radius: $r-sm;
|
||||
@@ -125,7 +125,7 @@
|
||||
}
|
||||
|
||||
.alert-status {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
padding: 4px 12px;
|
||||
border-radius: $r-sm;
|
||||
|
||||
@@ -158,7 +158,7 @@
|
||||
margin-top: 32px;
|
||||
|
||||
&__btn {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $pri;
|
||||
padding: 12px 24px;
|
||||
|
||||
@@ -168,7 +168,7 @@
|
||||
}
|
||||
|
||||
&__info {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Taro from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const SEVERITY_MAP: Record<string, { label: string; className: string }> = {
|
||||
@@ -28,6 +29,7 @@ const STATUS_TABS = [
|
||||
];
|
||||
|
||||
export default function AlertList() {
|
||||
const modeClass = useElderClass();
|
||||
const [alerts, setAlerts] = useState<doctorApi.Alert[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [activeTab, setActiveTab] = useState('');
|
||||
@@ -81,7 +83,7 @@ export default function AlertList() {
|
||||
if (loading && alerts.length === 0) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='alert-list-page'>
|
||||
<ScrollView scrollY className={`alert-list-page ${modeClass}`}>
|
||||
<View className='alert-list-header'>
|
||||
<Text className='alert-list-title'>告警列表</Text>
|
||||
<Text className='alert-list-count'>共 {total} 条</Text>
|
||||
|
||||
@@ -18,13 +18,13 @@
|
||||
|
||||
&__title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
&__close {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $dan;
|
||||
padding: 8px 16px;
|
||||
}
|
||||
@@ -63,7 +63,7 @@
|
||||
}
|
||||
|
||||
.msg-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
display: block;
|
||||
line-height: 1.6;
|
||||
@@ -76,7 +76,7 @@
|
||||
|
||||
.msg-time {
|
||||
@include serif-number;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
@@ -92,7 +92,7 @@
|
||||
padding: 120px 32px;
|
||||
|
||||
&__text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
@@ -111,7 +111,7 @@
|
||||
background: $bd-l;
|
||||
border-radius: $r;
|
||||
padding: 16px 20px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
@@ -126,7 +126,7 @@
|
||||
}
|
||||
|
||||
&__text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $card;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -139,7 +139,7 @@
|
||||
border-top: 1px solid $bd;
|
||||
|
||||
&__text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,56 +3,47 @@ import { View, Text, Input, ScrollView } from '@tarojs/components';
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const POLL_INTERVAL = 8000;
|
||||
|
||||
export default function ConsultationDetail() {
|
||||
const router = useRouter();
|
||||
const sessionId = router.params.id || '';
|
||||
const modeClass = useElderClass();
|
||||
const [session, setSession] = useState<doctorApi.ConsultationSession | null>(null);
|
||||
const [messages, setMessages] = useState<doctorApi.ConsultationMessage[]>([]);
|
||||
const [inputText, setInputText] = useState('');
|
||||
const [sending, setSending] = useState(false);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const scrollViewRef = useRef('');
|
||||
const pollTimerRef = useRef<ReturnType<typeof setInterval> | null>(null);
|
||||
const pollingRef = useRef(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (sessionId) {
|
||||
loadData();
|
||||
markRead();
|
||||
startPolling();
|
||||
startLongPolling();
|
||||
}
|
||||
return () => stopPolling();
|
||||
return () => { pollingRef.current = false; };
|
||||
}, [sessionId]);
|
||||
|
||||
const startPolling = () => {
|
||||
stopPolling();
|
||||
pollTimerRef.current = setInterval(pollNewMessages, POLL_INTERVAL);
|
||||
useEffect(() => {
|
||||
if (session?.status === 'closed') {
|
||||
pollingRef.current = false;
|
||||
}
|
||||
}, [session?.status]);
|
||||
|
||||
const startLongPolling = () => {
|
||||
pollingRef.current = true;
|
||||
longPoll();
|
||||
};
|
||||
|
||||
const stopPolling = () => {
|
||||
if (pollTimerRef.current) {
|
||||
clearInterval(pollTimerRef.current);
|
||||
pollTimerRef.current = null;
|
||||
}
|
||||
};
|
||||
|
||||
const pollNewMessages = async () => {
|
||||
if (!session || session.status === 'closed') {
|
||||
stopPolling();
|
||||
return;
|
||||
}
|
||||
const longPoll = async () => {
|
||||
if (!pollingRef.current) return;
|
||||
try {
|
||||
const lastId = messages.length > 0 ? messages[messages.length - 1].id : undefined;
|
||||
const m = await doctorApi.listMessages(sessionId, {
|
||||
page: 1,
|
||||
page_size: 50,
|
||||
after_id: lastId,
|
||||
});
|
||||
const newMsgs = m.data || [];
|
||||
if (newMsgs.length > 0) {
|
||||
const newMsgs = await doctorApi.pollMessages(sessionId, lastId);
|
||||
if (newMsgs && newMsgs.length > 0) {
|
||||
setMessages((prev) => {
|
||||
const existing = new Set(prev.map((msg) => msg.id));
|
||||
const fresh = newMsgs.filter((msg) => !existing.has(msg.id));
|
||||
@@ -60,7 +51,12 @@ export default function ConsultationDetail() {
|
||||
});
|
||||
scrollViewRef.current = `msg-${messages.length + newMsgs.length}`;
|
||||
}
|
||||
} catch { /* 轮询失败静默忽略 */ }
|
||||
} catch {
|
||||
// 超时或网络错误，静默重试
|
||||
}
|
||||
if (pollingRef.current) {
|
||||
longPoll();
|
||||
}
|
||||
};
|
||||
|
||||
const loadData = async () => {
|
||||
@@ -73,7 +69,7 @@ export default function ConsultationDetail() {
|
||||
setSession(s);
|
||||
setMessages(m.data || []);
|
||||
scrollViewRef.current = `msg-${(m.data || []).length}`;
|
||||
if (s.status === 'closed') stopPolling();
|
||||
if (s.status === 'closed') pollingRef.current = false;
|
||||
} catch {
|
||||
Taro.showToast({ title: '加载失败', icon: 'none' });
|
||||
} finally {
|
||||
@@ -132,7 +128,7 @@ export default function ConsultationDetail() {
|
||||
const isOpen = session?.status !== 'closed';
|
||||
|
||||
return (
|
||||
<View className='chat-page'>
|
||||
<View className={`chat-page ${modeClass}`}>
|
||||
{/* Header */}
|
||||
<View className='chat-header'>
|
||||
<Text className='chat-header__title'>{session?.subject || '在线咨询'}</Text>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 24px 0;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx2;
|
||||
position: relative;
|
||||
|
||||
@@ -64,7 +64,7 @@
|
||||
}
|
||||
|
||||
&__subject {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
flex: 1;
|
||||
@@ -80,7 +80,7 @@
|
||||
}
|
||||
|
||||
&__status-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@@ -96,12 +96,12 @@
|
||||
}
|
||||
|
||||
&__time {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
&__preview {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@@ -123,7 +123,7 @@
|
||||
|
||||
&__badge-text {
|
||||
@include serif-number;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $card;
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -137,7 +137,7 @@
|
||||
padding: 24px;
|
||||
|
||||
&__btn {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $pri;
|
||||
padding: 12px 24px;
|
||||
|
||||
@@ -147,7 +147,7 @@
|
||||
}
|
||||
|
||||
&__info {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Taro from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import { getStatusInlineStyle, getStatusLabel } from '@/utils/statusTag';
|
||||
import { formatDateTime } from '@/utils/date';
|
||||
import './index.scss';
|
||||
@@ -16,6 +17,7 @@ const TABS = [
|
||||
];
|
||||
|
||||
export default function ConsultationList() {
|
||||
const modeClass = useElderClass();
|
||||
const [sessions, setSessions] = useState<doctorApi.ConsultationSession[]>([]);
|
||||
const [activeTab, setActiveTab] = useState('');
|
||||
const [loading, setLoading] = useState(true);
|
||||
@@ -58,7 +60,7 @@ export default function ConsultationList() {
|
||||
if (loading && sessions.length === 0) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='consultation-page'>
|
||||
<ScrollView scrollY className={`consultation-page ${modeClass}`}>
|
||||
<View className='tabs'>
|
||||
{TABS.map((t) => (
|
||||
<View
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
@import '../../../../styles/variables.scss';
|
||||
@import '../../../../styles/mixins.scss';
|
||||
|
||||
.create-page {
|
||||
min-height: 100vh;
|
||||
@@ -16,7 +17,7 @@
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -41,7 +42,7 @@
|
||||
}
|
||||
|
||||
.form-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
flex-shrink: 0;
|
||||
min-width: 140px;
|
||||
@@ -50,12 +51,12 @@
|
||||
.form-input {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.form-value {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
|
||||
&.placeholder {
|
||||
@@ -66,7 +67,7 @@
|
||||
.form-textarea {
|
||||
width: 100%;
|
||||
margin-top: 12px;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
min-height: 120px;
|
||||
background: $bg;
|
||||
@@ -91,7 +92,7 @@
|
||||
}
|
||||
|
||||
.submit-btn__text {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@ import { View, Text, Input, Textarea, Picker, ScrollView } from '@tarojs/compone
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const DIALYSIS_TYPES = ['HD', 'HDF', 'HF'];
|
||||
@@ -55,6 +56,7 @@ export default function DialysisCreate() {
|
||||
const version = router.params.version ? Number(router.params.version) : 0;
|
||||
const patientIdFromRoute = router.params.patientId || '';
|
||||
const isEdit = !!id;
|
||||
const modeClass = useElderClass();
|
||||
|
||||
const [form, setForm] = useState<FormState>({ ...initialForm, patient_id: patientIdFromRoute });
|
||||
const [loading, setLoading] = useState(isEdit);
|
||||
@@ -167,7 +169,7 @@ export default function DialysisCreate() {
|
||||
);
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='create-page'>
|
||||
<ScrollView scrollY className={`create-page ${modeClass}`}>
|
||||
<View className='section'>
|
||||
<Text className='section-title'>基本信息</Text>
|
||||
<View className='form-row'>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
@import '../../../../styles/variables.scss';
|
||||
@import '../../../../styles/mixins.scss';
|
||||
|
||||
.dialysis-detail {
|
||||
min-height: 100vh;
|
||||
@@ -16,7 +17,7 @@
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -31,7 +32,7 @@
|
||||
}
|
||||
|
||||
.record-header__title {
|
||||
font-size: 34px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
font-variant-numeric: tabular-nums;
|
||||
@@ -41,7 +42,7 @@
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
background: $bd-l;
|
||||
color: $tx3;
|
||||
|
||||
@@ -57,13 +58,13 @@
|
||||
}
|
||||
|
||||
.record-sub {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.review-info {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
@@ -82,12 +83,12 @@
|
||||
}
|
||||
|
||||
.detail-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.detail-value {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
text-align: right;
|
||||
flex: 1;
|
||||
@@ -98,7 +99,7 @@
|
||||
.error-text {
|
||||
text-align: center;
|
||||
padding: 120px 0;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -150,6 +151,6 @@
|
||||
}
|
||||
|
||||
.action-btn__text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@@ -3,11 +3,13 @@ import { View, Text, ScrollView } from '@tarojs/components';
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function DialysisDetail() {
|
||||
const router = useRouter();
|
||||
const id = router.params.id || '';
|
||||
const modeClass = useElderClass();
|
||||
const [record, setRecord] = useState<doctorApi.DialysisRecord | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [submitting, setSubmitting] = useState(false);
|
||||
@@ -85,13 +87,13 @@ export default function DialysisDetail() {
|
||||
};
|
||||
|
||||
if (loading) return <Loading />;
|
||||
if (!record) return <View className='error-text'><Text>记录加载失败</Text></View>;
|
||||
if (!record) return <View className={`error-text ${modeClass}`}><Text>记录加载失败</Text></View>;
|
||||
|
||||
const canComplete = record.status === 'draft';
|
||||
const canReview = record.status === 'completed';
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='dialysis-detail'>
|
||||
<ScrollView scrollY className={`dialysis-detail ${modeClass}`}>
|
||||
{/* 状态头部 */}
|
||||
<View className='section'>
|
||||
<View className='record-header'>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
@import '../../../styles/variables.scss';
|
||||
@import '../../../styles/mixins.scss';
|
||||
|
||||
.dialysis-page {
|
||||
min-height: 100vh;
|
||||
@@ -15,7 +16,7 @@
|
||||
background: $bg;
|
||||
border-radius: $r-sm;
|
||||
padding: 16px 20px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
@@ -52,7 +53,7 @@
|
||||
}
|
||||
|
||||
.tab-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -61,7 +62,7 @@
|
||||
}
|
||||
|
||||
.record-count {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
padding: 8px 0 16px;
|
||||
}
|
||||
@@ -89,7 +90,7 @@
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 600;
|
||||
background: $pri-l;
|
||||
color: $pri-d;
|
||||
@@ -109,7 +110,7 @@
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
background: $bd-l;
|
||||
color: $tx3;
|
||||
|
||||
@@ -131,13 +132,13 @@
|
||||
}
|
||||
|
||||
.record-card__date {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.record-card__meta {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
@@ -154,7 +155,7 @@
|
||||
padding: 12px 24px;
|
||||
background: $card;
|
||||
border-radius: $r-sm;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $pri;
|
||||
|
||||
&--disabled {
|
||||
@@ -163,7 +164,7 @@
|
||||
}
|
||||
|
||||
.page-info {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -187,7 +188,7 @@
|
||||
}
|
||||
|
||||
.fab-text {
|
||||
font-size: 40px;
|
||||
font-size: var(--tk-font-hero);
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const TABS = [
|
||||
@@ -18,6 +19,7 @@ const TYPE_MAP: Record<string, string> = { HD: 'HD', HDF: 'HDF', HF: 'HF' };
|
||||
export default function DialysisList() {
|
||||
const router = useRouter();
|
||||
const patientId = router.params.patientId || '';
|
||||
const modeClass = useElderClass();
|
||||
const [searchPatient, setSearchPatient] = useState('');
|
||||
const [currentPatientId, setCurrentPatientId] = useState(patientId);
|
||||
const [activeTab, setActiveTab] = useState('');
|
||||
@@ -72,7 +74,7 @@ export default function DialysisList() {
|
||||
if (loading && records.length === 0) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='dialysis-page'>
|
||||
<ScrollView scrollY className={`dialysis-page ${modeClass}`}>
|
||||
{!patientId && (
|
||||
<View className='search-bar'>
|
||||
<Input
|
||||
|
||||
@@ -28,13 +28,13 @@
|
||||
|
||||
&__title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: 700;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
&__status {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
padding: 6px 16px;
|
||||
border-radius: $r;
|
||||
font-weight: 500;
|
||||
@@ -60,12 +60,12 @@
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -77,14 +77,14 @@
|
||||
border-radius: $r;
|
||||
|
||||
&__label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
&__text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@@ -99,14 +99,14 @@
|
||||
}
|
||||
|
||||
&__date {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
&__text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
@@ -121,7 +121,7 @@
|
||||
border-radius: $r;
|
||||
margin-bottom: 24px;
|
||||
color: $card;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@@ -130,7 +130,7 @@
|
||||
}
|
||||
|
||||
.form-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
font-weight: 500;
|
||||
display: block;
|
||||
@@ -143,7 +143,7 @@
|
||||
background: $bd-l;
|
||||
border-radius: $r;
|
||||
padding: 16px 20px;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
box-sizing: border-box;
|
||||
line-height: 1.6;
|
||||
@@ -154,7 +154,7 @@
|
||||
padding: 16px 20px;
|
||||
background: $bd-l;
|
||||
border-radius: $r;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
@@ -171,7 +171,7 @@
|
||||
}
|
||||
|
||||
&__text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $card;
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -181,5 +181,5 @@
|
||||
text-align: center;
|
||||
padding: 80px 32px;
|
||||
color: $tx3;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@ import { View, Text, Textarea, ScrollView } from '@tarojs/components';
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const STATUS_LABELS: Record<string, string> = {
|
||||
@@ -16,6 +17,7 @@ const STATUS_LABELS: Record<string, string> = {
|
||||
export default function FollowUpDetail() {
|
||||
const router = useRouter();
|
||||
const taskId = router.params.id || '';
|
||||
const modeClass = useElderClass();
|
||||
const [task, setTask] = useState<doctorApi.FollowUpTask | null>(null);
|
||||
const [records, setRecords] = useState<doctorApi.FollowUpRecord[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
@@ -87,12 +89,12 @@ export default function FollowUpDetail() {
|
||||
const formatDate = (d: string) => new Date(d).toLocaleDateString('zh-CN');
|
||||
|
||||
if (loading) return <Loading />;
|
||||
if (!task) return <View className='error-text'><Text>任务加载失败</Text></View>;
|
||||
if (!task) return <View className={`error-text ${modeClass}`}><Text>任务加载失败</Text></View>;
|
||||
|
||||
const canSubmit = task.status === 'in_progress' || task.status === 'pending' || task.status === 'overdue';
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='followup-detail'>
|
||||
<ScrollView scrollY className={`followup-detail ${modeClass}`}>
|
||||
<View className='section'>
|
||||
<View className='task-header'>
|
||||
<Text className='task-header__title'>随访详情</Text>
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
.tab {
|
||||
display: inline-block;
|
||||
padding: 24px 16px;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
@@ -44,7 +44,7 @@
|
||||
padding: 20px 28px;
|
||||
|
||||
text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
@@ -75,19 +75,19 @@
|
||||
|
||||
&__type {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
&__status {
|
||||
@include tag(transparent, $tx2);
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&__patient {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
@@ -99,7 +99,7 @@
|
||||
}
|
||||
|
||||
&__date {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import { getStatusInlineStyle, getStatusLabel } from '@/utils/statusTag';
|
||||
import './index.scss';
|
||||
|
||||
@@ -18,6 +19,7 @@ const TABS = [
|
||||
export default function FollowUpList() {
|
||||
const router = useRouter();
|
||||
const patientId = router.params.patientId || '';
|
||||
const modeClass = useElderClass();
|
||||
const [tasks, setTasks] = useState<doctorApi.FollowUpTask[]>([]);
|
||||
const [activeTab, setActiveTab] = useState('');
|
||||
const [loading, setLoading] = useState(true);
|
||||
@@ -62,7 +64,7 @@ export default function FollowUpList() {
|
||||
if (loading && tasks.length === 0) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='followup-page'>
|
||||
<ScrollView scrollY className={`followup-page ${modeClass}`}>
|
||||
<View className='tabs'>
|
||||
{TABS.map((t) => (
|
||||
<View
|
||||
|
||||
@@ -13,19 +13,18 @@
|
||||
|
||||
&__title {
|
||||
@include section-title;
|
||||
font-size: 40px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
&__greeting {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
&__date {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -48,19 +47,19 @@
|
||||
text-align: center;
|
||||
line-height: 36px;
|
||||
font-weight: bold;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
margin-right: 12px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__alert-text {
|
||||
flex: 1;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $dan;
|
||||
}
|
||||
|
||||
&__alert-link {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $dan;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
@@ -73,7 +72,7 @@
|
||||
background: $surface-alt;
|
||||
border-radius: $r;
|
||||
padding: 16px 20px;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -113,14 +112,14 @@
|
||||
background: $pri-l;
|
||||
color: $pri;
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 700;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
&__card-num {
|
||||
@include serif-number;
|
||||
font-size: 48px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: 700;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -128,7 +127,7 @@
|
||||
}
|
||||
|
||||
&__card-label {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -145,7 +144,7 @@
|
||||
|
||||
&__logout {
|
||||
color: $dan;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-h2);
|
||||
padding: 16px 48px;
|
||||
display: inline-block;
|
||||
}
|
||||
@@ -172,7 +171,7 @@
|
||||
background: $acc-l;
|
||||
color: $acc;
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@@ -192,14 +191,14 @@
|
||||
text-align: center;
|
||||
background: $dan;
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 700;
|
||||
border-radius: $r-pill;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
&__label {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@@ -2,6 +2,7 @@ import { useState, useEffect, useMemo } from 'react';
|
||||
import { View, Text, Input, ScrollView } from '@tarojs/components';
|
||||
import Taro from '@tarojs/taro';
|
||||
import { useAuthStore } from '@/stores/auth';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import './index.scss';
|
||||
@@ -53,6 +54,7 @@ const ROLE_LABELS: Record<string, string> = {
|
||||
|
||||
export default function DoctorHome() {
|
||||
const { user, logout, roles } = useAuthStore();
|
||||
const modeClass = useElderClass();
|
||||
const [dashboard, setDashboard] = useState<doctorApi.DoctorDashboard | null>(null);
|
||||
const [alertCount, setAlertCount] = useState(0);
|
||||
const [loading, setLoading] = useState(true);
|
||||
@@ -105,7 +107,7 @@ export default function DoctorHome() {
|
||||
if (loading) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='doctor-home'>
|
||||
<ScrollView scrollY className={`doctor-home ${modeClass}`}>
|
||||
<View className='doctor-home__header'>
|
||||
<Text className='doctor-home__title'>医护工作台</Text>
|
||||
<Text className='doctor-home__greeting'>
|
||||
|
||||
@@ -33,12 +33,12 @@
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -51,7 +51,7 @@
|
||||
}
|
||||
|
||||
.warning-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $wrn;
|
||||
font-weight: 600;
|
||||
display: block;
|
||||
@@ -59,7 +59,7 @@
|
||||
}
|
||||
|
||||
.warning-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $pri-d;
|
||||
}
|
||||
|
||||
@@ -68,14 +68,14 @@
|
||||
}
|
||||
|
||||
.info-block-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.info-block-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@@ -96,7 +96,7 @@
|
||||
|
||||
.vital-value {
|
||||
@include serif-number;
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: 700;
|
||||
color: $pri;
|
||||
display: block;
|
||||
@@ -104,7 +104,7 @@
|
||||
}
|
||||
|
||||
.vital-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -116,13 +116,13 @@
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
@include serif-number;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
|
||||
@@ -151,18 +151,18 @@
|
||||
}
|
||||
|
||||
&__type {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: 500;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
&__date {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
&__abnormal {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $dan;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -180,7 +180,7 @@
|
||||
border-radius: $r;
|
||||
background: $pri;
|
||||
color: $card;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: 500;
|
||||
|
||||
&:active {
|
||||
@@ -196,5 +196,5 @@
|
||||
text-align: center;
|
||||
padding: 80px 32px;
|
||||
color: $tx3;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
}
|
||||
|
||||
@@ -3,11 +3,13 @@ import { View, Text, ScrollView } from '@tarojs/components';
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function PatientDetail() {
|
||||
const router = useRouter();
|
||||
const patientId = router.params.id || '';
|
||||
const modeClass = useElderClass();
|
||||
const [patient, setPatient] = useState<doctorApi.PatientDetail | null>(null);
|
||||
const [summary, setSummary] = useState<doctorApi.HealthSummary | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
@@ -40,10 +42,10 @@ export default function PatientDetail() {
|
||||
};
|
||||
|
||||
if (loading) return <Loading />;
|
||||
if (!patient) return <View className='error-text'><Text>患者信息加载失败</Text></View>;
|
||||
if (!patient) return <View className={`error-text ${modeClass}`}><Text>患者信息加载失败</Text></View>;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='patient-detail'>
|
||||
<ScrollView scrollY className={`patient-detail ${modeClass}`}>
|
||||
{/* 基本信息 */}
|
||||
<View className='section'>
|
||||
<View className='section-header'>
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 20px 24px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
box-shadow: $shadow-sm;
|
||||
@@ -33,7 +33,7 @@
|
||||
padding: 10px 24px;
|
||||
border-radius: $r-pill;
|
||||
background: $bd-l;
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
margin-right: 16px;
|
||||
|
||||
@@ -47,7 +47,7 @@
|
||||
margin-bottom: 16px;
|
||||
|
||||
text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
@@ -75,14 +75,14 @@
|
||||
}
|
||||
|
||||
&__name {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
&__meta {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -112,7 +112,7 @@
|
||||
background: $pri-l;
|
||||
|
||||
&__text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -124,7 +124,7 @@
|
||||
margin-top: 32px;
|
||||
|
||||
&__btn {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $pri;
|
||||
padding: 12px 24px;
|
||||
|
||||
@@ -134,7 +134,7 @@
|
||||
}
|
||||
|
||||
&__info {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,9 +4,11 @@ import Taro, { usePullDownRefresh, useReachBottom } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function PatientList() {
|
||||
const modeClass = useElderClass();
|
||||
const [patients, setPatients] = useState<doctorApi.PatientItem[]>([]);
|
||||
const [tags, setTags] = useState<doctorApi.PatientTag[]>([]);
|
||||
const [activeTag, setActiveTag] = useState<string>('');
|
||||
@@ -98,7 +100,7 @@ export default function PatientList() {
|
||||
if (loading && patients.length === 0) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='patient-list-page'>
|
||||
<ScrollView scrollY className={`patient-list-page ${modeClass}`}>
|
||||
<View className='search-bar'>
|
||||
<Input
|
||||
className='search-input'
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
@import '../../../../styles/variables.scss';
|
||||
@import '../../../../styles/mixins.scss';
|
||||
|
||||
.create-page {
|
||||
min-height: 100vh;
|
||||
@@ -16,7 +17,7 @@
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -36,7 +37,7 @@
|
||||
}
|
||||
|
||||
.form-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
flex-shrink: 0;
|
||||
min-width: 140px;
|
||||
@@ -45,12 +46,12 @@
|
||||
.form-input {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.form-value {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
|
||||
&.placeholder {
|
||||
@@ -61,7 +62,7 @@
|
||||
.form-textarea {
|
||||
width: 100%;
|
||||
margin-top: 12px;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
min-height: 120px;
|
||||
background: $bg;
|
||||
@@ -86,7 +87,7 @@
|
||||
}
|
||||
|
||||
.submit-btn__text {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@ import { View, Text, Input, Textarea, Picker, ScrollView } from '@tarojs/compone
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
interface FormState {
|
||||
@@ -50,6 +51,7 @@ const initialForm: FormState = {
|
||||
export default function PrescriptionCreate() {
|
||||
const router = useRouter();
|
||||
const patientId = router.params.patientId || '';
|
||||
const modeClass = useElderClass();
|
||||
const [form, setForm] = useState<FormState>(initialForm);
|
||||
const [submitting, setSubmitting] = useState(false);
|
||||
|
||||
@@ -114,7 +116,7 @@ export default function PrescriptionCreate() {
|
||||
);
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='create-page'>
|
||||
<ScrollView scrollY className={`create-page ${modeClass}`}>
|
||||
{/* 透析器 */}
|
||||
<View className='section'>
|
||||
<Text className='section-title'>透析器</Text>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
@import '../../../../styles/variables.scss';
|
||||
@import '../../../../styles/mixins.scss';
|
||||
|
||||
.prescription-detail {
|
||||
min-height: 100vh;
|
||||
@@ -16,7 +17,7 @@
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -31,7 +32,7 @@
|
||||
}
|
||||
|
||||
.rx-header__title {
|
||||
font-size: 34px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
}
|
||||
@@ -40,7 +41,7 @@
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
background: $bd-l;
|
||||
color: $tx3;
|
||||
|
||||
@@ -51,7 +52,7 @@
|
||||
}
|
||||
|
||||
.rx-sub {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
font-variant-numeric: tabular-nums;
|
||||
@@ -69,12 +70,12 @@
|
||||
}
|
||||
|
||||
.detail-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.detail-value {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
text-align: right;
|
||||
flex: 1;
|
||||
@@ -83,7 +84,7 @@
|
||||
}
|
||||
|
||||
.notes-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@@ -91,7 +92,7 @@
|
||||
.error-text {
|
||||
text-align: center;
|
||||
padding: 120px 0;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -131,6 +132,6 @@
|
||||
}
|
||||
|
||||
.action-btn__text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@@ -3,11 +3,13 @@ import { View, Text, ScrollView } from '@tarojs/components';
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function PrescriptionDetail() {
|
||||
const router = useRouter();
|
||||
const id = router.params.id || '';
|
||||
const modeClass = useElderClass();
|
||||
const [rx, setRx] = useState<doctorApi.DialysisPrescription | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [submitting, setSubmitting] = useState(false);
|
||||
@@ -76,10 +78,10 @@ export default function PrescriptionDetail() {
|
||||
};
|
||||
|
||||
if (loading) return <Loading />;
|
||||
if (!rx) return <View className='error-text'><Text>处方加载失败</Text></View>;
|
||||
if (!rx) return <View className={`error-text ${modeClass}`}><Text>处方加载失败</Text></View>;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='prescription-detail'>
|
||||
<ScrollView scrollY className={`prescription-detail ${modeClass}`}>
|
||||
{/* 状态头部 */}
|
||||
<View className='section'>
|
||||
<View className='rx-header'>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
@import '../../../styles/variables.scss';
|
||||
@import '../../../styles/mixins.scss';
|
||||
|
||||
.prescription-page {
|
||||
min-height: 100vh;
|
||||
@@ -15,7 +16,7 @@
|
||||
background: $bg;
|
||||
border-radius: $r-sm;
|
||||
padding: 16px 20px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
@@ -52,7 +53,7 @@
|
||||
}
|
||||
|
||||
.tab-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -61,7 +62,7 @@
|
||||
}
|
||||
|
||||
.prescription-count {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
padding: 8px 0 16px;
|
||||
}
|
||||
@@ -86,7 +87,7 @@
|
||||
}
|
||||
|
||||
.prescription-card__model {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
}
|
||||
@@ -95,7 +96,7 @@
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
background: $bd-l;
|
||||
color: $tx3;
|
||||
|
||||
@@ -112,13 +113,13 @@
|
||||
}
|
||||
|
||||
.prescription-card__meta {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.prescription-card__date {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
display: block;
|
||||
font-variant-numeric: tabular-nums;
|
||||
@@ -136,7 +137,7 @@
|
||||
padding: 12px 24px;
|
||||
background: $card;
|
||||
border-radius: $r-sm;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $pri;
|
||||
|
||||
&--disabled {
|
||||
@@ -145,7 +146,7 @@
|
||||
}
|
||||
|
||||
.page-info {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -169,7 +170,7 @@
|
||||
}
|
||||
|
||||
.fab-text {
|
||||
font-size: 40px;
|
||||
font-size: var(--tk-font-hero);
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const TABS = [
|
||||
@@ -15,6 +16,7 @@ const TABS = [
|
||||
export default function PrescriptionList() {
|
||||
const router = useRouter();
|
||||
const patientId = router.params.patientId || '';
|
||||
const modeClass = useElderClass();
|
||||
const [searchPatient, setSearchPatient] = useState('');
|
||||
const [currentPatientId, setCurrentPatientId] = useState(patientId);
|
||||
const [activeTab, setActiveTab] = useState('');
|
||||
@@ -66,7 +68,7 @@ export default function PrescriptionList() {
|
||||
if (loading && prescriptions.length === 0) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='prescription-page'>
|
||||
<ScrollView scrollY className={`prescription-page ${modeClass}`}>
|
||||
{!patientId && (
|
||||
<View className='search-bar'>
|
||||
<Input
|
||||
|
||||
@@ -28,13 +28,13 @@
|
||||
|
||||
&__type {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: 700;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
&__status {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
padding: 6px 16px;
|
||||
border-radius: $r;
|
||||
font-weight: 500;
|
||||
@@ -45,13 +45,13 @@
|
||||
}
|
||||
|
||||
.report-date {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.review-info {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $acc;
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
@@ -81,7 +81,7 @@
|
||||
}
|
||||
|
||||
.indicator-cell {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
|
||||
&--name {
|
||||
flex: 2;
|
||||
@@ -116,7 +116,7 @@
|
||||
}
|
||||
|
||||
.indicator-row--header & {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -129,7 +129,7 @@
|
||||
}
|
||||
|
||||
.notes-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@@ -140,7 +140,7 @@
|
||||
background: $bd-l;
|
||||
border-radius: $r;
|
||||
padding: 20px;
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
box-sizing: border-box;
|
||||
line-height: 1.6;
|
||||
@@ -158,7 +158,7 @@
|
||||
}
|
||||
|
||||
&__text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $card;
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -168,5 +168,5 @@
|
||||
text-align: center;
|
||||
padding: 80px 32px;
|
||||
color: $tx3;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
}
|
||||
|
||||
@@ -3,12 +3,14 @@ import { View, Text, Textarea, ScrollView } from '@tarojs/components';
|
||||
import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function ReportDetail() {
|
||||
const router = useRouter();
|
||||
const patientId = router.params.patientId || '';
|
||||
const reportId = router.params.id || '';
|
||||
const modeClass = useElderClass();
|
||||
const [report, setReport] = useState<doctorApi.LabReportDetail | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [doctorNotes, setDoctorNotes] = useState('');
|
||||
@@ -51,10 +53,10 @@ export default function ReportDetail() {
|
||||
const formatDate = (d: string) => new Date(d).toLocaleDateString('zh-CN');
|
||||
|
||||
if (loading) return <Loading />;
|
||||
if (!report) return <View className='error-text'><Text>报告加载失败</Text></View>;
|
||||
if (!report) return <View className={`error-text ${modeClass}`}><Text>报告加载失败</Text></View>;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='report-detail'>
|
||||
<ScrollView scrollY className={`report-detail ${modeClass}`}>
|
||||
{/* 基本信息 */}
|
||||
<View className='section'>
|
||||
<View className='report-header'>
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 20px 24px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
box-shadow: $shadow-sm;
|
||||
@@ -26,7 +26,7 @@
|
||||
margin-bottom: 16px;
|
||||
|
||||
text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
}
|
||||
@@ -56,13 +56,13 @@
|
||||
|
||||
&__type {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
&__date {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -73,13 +73,13 @@
|
||||
}
|
||||
|
||||
&__abnormal {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $dan;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
&__normal {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $acc;
|
||||
}
|
||||
|
||||
|
||||
@@ -4,11 +4,13 @@ import Taro, { useRouter } from '@tarojs/taro';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function ReportList() {
|
||||
const router = useRouter();
|
||||
const patientId = router.params.patientId || '';
|
||||
const modeClass = useElderClass();
|
||||
const [searchPatient, setSearchPatient] = useState('');
|
||||
const [currentPatientId, setCurrentPatientId] = useState(patientId);
|
||||
const [reports, setReports] = useState<doctorApi.LabReportItem[]>([]);
|
||||
@@ -55,7 +57,7 @@ export default function ReportList() {
|
||||
if (loading && reports.length === 0) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='report-page'>
|
||||
<ScrollView scrollY className={`report-page ${modeClass}`}>
|
||||
{!patientId && (
|
||||
<View className='search-bar'>
|
||||
<Input
|
||||
|
||||
@@ -1,34 +1,5 @@
|
||||
@import '../../styles/variables.scss';
|
||||
|
||||
@mixin serif-number {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
@mixin section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@mixin tag($bg, $color) {
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
background: $bg;
|
||||
color: $color;
|
||||
}
|
||||
|
||||
@mixin flex-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@import '../../styles/mixins.scss';
|
||||
|
||||
.events-page {
|
||||
min-height: 100vh;
|
||||
@@ -43,14 +14,14 @@
|
||||
|
||||
&__title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 40px;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: bold;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
&__subtitle {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
@@ -77,7 +48,7 @@
|
||||
|
||||
&__status {
|
||||
@include tag($bd-l, $tx2);
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
}
|
||||
|
||||
&__status--published {
|
||||
@@ -97,7 +68,7 @@
|
||||
}
|
||||
|
||||
&__points {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $wrn;
|
||||
@include serif-number;
|
||||
@@ -105,7 +76,7 @@
|
||||
|
||||
&__title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -113,7 +84,7 @@
|
||||
}
|
||||
|
||||
&__desc {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 16px;
|
||||
@@ -128,13 +99,13 @@
|
||||
}
|
||||
|
||||
&__date {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
&__location {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
&__footer {
|
||||
@@ -146,8 +117,8 @@
|
||||
}
|
||||
|
||||
&__participants {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
@include serif-number;
|
||||
}
|
||||
|
||||
@@ -161,7 +132,7 @@
|
||||
}
|
||||
|
||||
&-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $card;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Taro from '@tarojs/taro';
|
||||
import * as pointsApi from '@/services/points';
|
||||
import Loading from '@/components/Loading';
|
||||
import EmptyState from '@/components/EmptyState';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const STATUS_MAP: Record<string, { label: string; className: string }> = {
|
||||
@@ -14,6 +15,7 @@ const STATUS_MAP: Record<string, { label: string; className: string }> = {
|
||||
};
|
||||
|
||||
export default function EventsPage() {
|
||||
const modeClass = useElderClass();
|
||||
const [events, setEvents] = useState<pointsApi.OfflineEvent[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [registering, setRegistering] = useState<string | null>(null);
|
||||
@@ -59,7 +61,7 @@ export default function EventsPage() {
|
||||
if (loading) return <Loading />;
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='events-page'>
|
||||
<ScrollView scrollY className={`events-page ${modeClass}`}>
|
||||
<View className='events-header'>
|
||||
<Text className='events-header__title'>线下活动</Text>
|
||||
<Text className='events-header__subtitle'>参加活动赢取积分</Text>
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
|
||||
.detail-title {
|
||||
@include section-title;
|
||||
font-size: 34px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@@ -34,12 +34,12 @@
|
||||
}
|
||||
|
||||
.detail-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.detail-value {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
|
||||
&.status-completed { color: $acc; }
|
||||
@@ -59,7 +59,7 @@
|
||||
}
|
||||
|
||||
.countdown-text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $wrn;
|
||||
font-weight: bold;
|
||||
|
||||
@@ -74,7 +74,7 @@
|
||||
}
|
||||
|
||||
.detail-desc-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@@ -94,7 +94,7 @@
|
||||
.submit-textarea {
|
||||
width: 100%;
|
||||
min-height: 200px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
background: $bg;
|
||||
border-radius: $r-sm;
|
||||
@@ -121,7 +121,7 @@
|
||||
}
|
||||
|
||||
.submit-btn-text {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -134,6 +134,6 @@
|
||||
|
||||
.loading-text,
|
||||
.empty-text {
|
||||
font-size: 28px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
@@ -7,9 +7,11 @@ import { TEMPLATE_IDS } from '@/services/wechat-templates';
|
||||
import { trackEvent } from '@/services/analytics';
|
||||
import Loading from '../../../components/Loading';
|
||||
import ErrorState from '../../../components/ErrorState';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function FollowUpDetail() {
|
||||
const modeClass = useElderClass();
|
||||
const router = useRouter();
|
||||
const id = router.params.id || '';
|
||||
|
||||
@@ -82,7 +84,7 @@ export default function FollowUpDetail() {
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
<Loading />
|
||||
</View>
|
||||
);
|
||||
@@ -90,7 +92,7 @@ export default function FollowUpDetail() {
|
||||
|
||||
if (error || !task) {
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
<ErrorState text='任务不存在' />
|
||||
</View>
|
||||
);
|
||||
@@ -99,7 +101,7 @@ export default function FollowUpDetail() {
|
||||
const isCompleted = task.status === 'completed';
|
||||
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
<View className='detail-card'>
|
||||
<Text className='detail-title'>{task.follow_up_type}</Text>
|
||||
<View className='detail-row'>
|
||||
|
||||
@@ -10,11 +10,12 @@
|
||||
|
||||
/* ─── 页头 ─── */
|
||||
.health-header {
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.health-title {
|
||||
font-size: 22px;
|
||||
@include serif-number;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: 700;
|
||||
color: $tx;
|
||||
}
|
||||
@@ -40,6 +41,7 @@
|
||||
|
||||
&.vital-tab-active {
|
||||
background: $pri;
|
||||
box-shadow: 0 2px 8px rgba(196, 98, 58, 0.25);
|
||||
|
||||
.vital-tab-text {
|
||||
color: #fff;
|
||||
@@ -48,7 +50,7 @@
|
||||
}
|
||||
|
||||
.vital-tab-text {
|
||||
font-size: 15px;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 600;
|
||||
color: $tx2;
|
||||
}
|
||||
@@ -65,11 +67,11 @@
|
||||
|
||||
/* ─── 录入区 ─── */
|
||||
.input-section {
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 20px;
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 16px;
|
||||
box-shadow: $shadow-sm;
|
||||
padding: 20px;
|
||||
box-shadow: $shadow-md;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
@@ -77,8 +79,8 @@
|
||||
}
|
||||
|
||||
.input-label {
|
||||
font-size: 13px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
@@ -90,7 +92,7 @@
|
||||
border-radius: 12px;
|
||||
padding: 0 16px;
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
width: 100%;
|
||||
@@ -98,13 +100,17 @@
|
||||
}
|
||||
|
||||
.input-ref {
|
||||
font-size: 13px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.input-label--secondary {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* ─── 血糖时段选择 ─── */
|
||||
.period-group {
|
||||
display: flex;
|
||||
@@ -133,7 +139,7 @@
|
||||
}
|
||||
|
||||
.period-btn-text {
|
||||
font-size: 15px;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 600;
|
||||
color: $tx2;
|
||||
}
|
||||
@@ -145,7 +151,8 @@
|
||||
border-radius: 14px;
|
||||
background: $pri;
|
||||
@include flex-center;
|
||||
margin-top: 12px;
|
||||
margin-top: 20px;
|
||||
box-shadow: 0 2px 8px rgba(196, 98, 58, 0.25);
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
@@ -153,7 +160,7 @@
|
||||
}
|
||||
|
||||
.save-btn-text {
|
||||
font-size: 17px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
}
|
||||
@@ -176,7 +183,7 @@
|
||||
}
|
||||
|
||||
.trend-empty-text {
|
||||
font-size: 14px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -195,6 +202,25 @@
|
||||
border-radius: 12px;
|
||||
padding: 12px 8px;
|
||||
gap: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.trend-threshold-line {
|
||||
position: absolute;
|
||||
left: 8px;
|
||||
right: 8px;
|
||||
border-top: 1.5px dashed $wrn;
|
||||
opacity: 0.6;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.trend-threshold-label {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: -16px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: $wrn;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.trend-bar-col {
|
||||
@@ -222,8 +248,8 @@
|
||||
}
|
||||
|
||||
.trend-bar-label {
|
||||
font-size: 11px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: var(--tk-text-secondary);
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
@@ -256,7 +282,7 @@
|
||||
}
|
||||
|
||||
.device-icon-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
}
|
||||
|
||||
.device-info {
|
||||
@@ -265,21 +291,21 @@
|
||||
}
|
||||
|
||||
.device-name {
|
||||
font-size: 15px;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 500;
|
||||
color: $tx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.device-desc {
|
||||
font-size: 13px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $acc;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.device-arrow {
|
||||
font-size: 14px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@@ -296,37 +322,38 @@
|
||||
}
|
||||
|
||||
.article-entry-text {
|
||||
font-size: 15px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* ─── AI 建议卡片 ─── */
|
||||
.ai-suggestion-card {
|
||||
background: $card;
|
||||
background: $acc-l;
|
||||
border-radius: $r;
|
||||
padding: 16px;
|
||||
margin-bottom: 16px;
|
||||
box-shadow: $shadow-sm;
|
||||
border-left: 4px solid $pri;
|
||||
margin-bottom: 20px;
|
||||
box-shadow: none;
|
||||
border-left: 4px solid $acc;
|
||||
}
|
||||
|
||||
.ai-card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.ai-card-title {
|
||||
font-size: 15px;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
color: $acc;
|
||||
}
|
||||
|
||||
.ai-card-count {
|
||||
font-size: 12px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: $acc;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.ai-suggestion-item {
|
||||
@@ -344,6 +371,7 @@
|
||||
}
|
||||
|
||||
.ai-suggestion-text {
|
||||
font-size: 13px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
@@ -3,9 +3,11 @@ import { View, Text, Input } from '@tarojs/components';
|
||||
import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro';
|
||||
import { useHealthStore } from '../../stores/health';
|
||||
import { useAuthStore } from '../../stores/auth';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import { inputVitalSign, getTrend, getHealthThresholds, findThreshold, DEFAULT_THRESHOLDS, type HealthThreshold } from '../../services/health';
|
||||
import { listPendingSuggestions, type AiSuggestionItem } from '../../services/ai-analysis';
|
||||
import Loading from '../../components/Loading';
|
||||
import GuestGuard from '../../components/GuestGuard';
|
||||
import './index.scss';
|
||||
|
||||
type VitalType = 'blood_pressure' | 'heart_rate' | 'blood_sugar' | 'weight';
|
||||
@@ -40,7 +42,8 @@ interface TrendPoint {
|
||||
|
||||
export default function Health() {
|
||||
const { todaySummary, loading, refreshToday, getTrend: fetchTrend } = useHealthStore();
|
||||
const { currentPatient } = useAuthStore();
|
||||
const { user, currentPatient } = useAuthStore();
|
||||
const modeClass = useElderClass();
|
||||
const [activeTab, setActiveTab] = useState<VitalType>('blood_pressure');
|
||||
const [systolic, setSystolic] = useState('');
|
||||
const [diastolic, setDiastolic] = useState('');
|
||||
@@ -55,6 +58,7 @@ export default function Health() {
|
||||
const [thresholds, setThresholds] = useState<HealthThreshold[]>(DEFAULT_THRESHOLDS);
|
||||
|
||||
useDidShow(() => {
|
||||
if (!user) return;
|
||||
refreshToday();
|
||||
loadTrend(activeTab);
|
||||
loadAiSuggestions();
|
||||
@@ -62,11 +66,16 @@ export default function Health() {
|
||||
});
|
||||
|
||||
usePullDownRefresh(() => {
|
||||
if (!user) return;
|
||||
Promise.all([refreshToday(true), loadTrend(activeTab), loadAiSuggestions()]).finally(() => {
|
||||
Taro.stopPullDownRefresh();
|
||||
});
|
||||
});
|
||||
|
||||
if (!user) {
|
||||
return <GuestGuard title='请先登录' desc='登录后即可记录和查看健康数据' />;
|
||||
}
|
||||
|
||||
const loadAiSuggestions = async () => {
|
||||
try {
|
||||
const items = await listPendingSuggestions();
|
||||
@@ -204,7 +213,7 @@ export default function Health() {
|
||||
const dayLabels = ['日', '一', '二', '三', '四', '五', '六'];
|
||||
|
||||
return (
|
||||
<View className='health-page'>
|
||||
<View className={`health-page ${modeClass}`}>
|
||||
{/* 页头 */}
|
||||
<View className='health-header'>
|
||||
<Text className='health-title'>健康数据</Text>
|
||||
@@ -273,7 +282,7 @@ export default function Health() {
|
||||
value={systolic}
|
||||
onInput={(e) => setSystolic(e.detail.value)}
|
||||
/>
|
||||
<Text className='input-label' style='margin-top:20px;'>舒张压（低压）</Text>
|
||||
<Text className='input-label input-label--secondary'>舒张压（低压）</Text>
|
||||
<Input
|
||||
className='input-field'
|
||||
type='number'
|
||||
@@ -363,7 +372,7 @@ export default function Health() {
|
||||
const tv = getThresholdValue(activeTab, thresholds)!;
|
||||
const pct = Math.min(95, (tv / maxTrendValue) * 100);
|
||||
return (
|
||||
<View className='trend-threshold-line' style={`bottom:${12 + pct * 1.08}px;`}>
|
||||
<View className='trend-threshold-line' style={`bottom:${((12 + pct * 1.08) / 120 * 100).toFixed(1)}%;`}>
|
||||
<Text className='trend-threshold-label'>{tv}</Text>
|
||||
</View>
|
||||
);
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
@import '../../styles/variables.scss';
|
||||
@import '../../styles/mixins.scss';
|
||||
|
||||
/* ═══════════════════════════════════════
|
||||
登录后首页
|
||||
═══════════════════════════════════════ */
|
||||
|
||||
.home-page {
|
||||
min-height: 100vh;
|
||||
background: $bg;
|
||||
@@ -8,12 +12,12 @@
|
||||
padding-bottom: calc(100px + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
/* ─── 区域 1：问候 + 日期 + 铃铛 ─── */
|
||||
/* ─── 问候区 ─── */
|
||||
.greeting-section {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 16px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.greeting-left {
|
||||
@@ -21,7 +25,8 @@
|
||||
}
|
||||
|
||||
.greeting-text {
|
||||
font-size: 24px;
|
||||
@include serif-number;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: 700;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -29,14 +34,16 @@
|
||||
}
|
||||
|
||||
.greeting-date {
|
||||
font-size: 14px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
.greeting-bell {
|
||||
position: relative;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 22px;
|
||||
background: $pri-l;
|
||||
@include flex-center;
|
||||
flex-shrink: 0;
|
||||
|
||||
@@ -46,16 +53,27 @@
|
||||
}
|
||||
|
||||
.greeting-bell-icon {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
color: $pri-d;
|
||||
}
|
||||
|
||||
/* ─── 区域 2：今日体征完成度 ─── */
|
||||
.greeting-bell-dot {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 6px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 4px;
|
||||
background: $dan;
|
||||
}
|
||||
|
||||
/* ─── 今日体征进度 ─── */
|
||||
.checkin-card {
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
box-shadow: $shadow-sm;
|
||||
padding: 16px;
|
||||
margin-bottom: 12px;
|
||||
box-shadow: $shadow-md;
|
||||
padding: 20px;
|
||||
margin-bottom: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
@@ -76,7 +94,7 @@
|
||||
}
|
||||
|
||||
.checkin-title {
|
||||
font-size: 16px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -90,7 +108,7 @@
|
||||
}
|
||||
|
||||
.capsule {
|
||||
font-size: 11px;
|
||||
font-size: var(--tk-font-micro);
|
||||
padding: 3px 8px;
|
||||
border-radius: $r-pill;
|
||||
font-weight: 500;
|
||||
@@ -106,9 +124,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* ─── 区域 3：今日体征 2x2 ─── */
|
||||
/* ─── 今日体征 2x2 ─── */
|
||||
.vitals-section {
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
@@ -133,40 +151,39 @@
|
||||
}
|
||||
|
||||
.vital-label {
|
||||
font-size: 13px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.vital-value-row {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
margin-bottom: 4px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.vital-value {
|
||||
@include serif-number;
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: 700;
|
||||
color: $tx;
|
||||
line-height: 1.1;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.vital-unit {
|
||||
font-size: 12px;
|
||||
color: $tx3;
|
||||
margin-left: 2px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: var(--tk-text-secondary);
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.vital-bottom {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.vital-tag {
|
||||
font-size: 12px;
|
||||
font-size: var(--tk-font-micro);
|
||||
font-weight: 500;
|
||||
padding: 2px 8px;
|
||||
border-radius: $r-pill;
|
||||
@@ -189,103 +206,85 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* ─── 区域 4：今日待办 ─── */
|
||||
.todo-section {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.todo-empty {
|
||||
background: $card;
|
||||
/* ─── 智能提醒卡片 ─── */
|
||||
.reminder-card {
|
||||
background: linear-gradient(135deg, $pri 0%, $pri-d 100%);
|
||||
border-radius: $r;
|
||||
padding: 24px;
|
||||
text-align: center;
|
||||
box-shadow: $shadow-sm;
|
||||
padding: 18px;
|
||||
margin-bottom: 16px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.todo-empty-text {
|
||||
font-size: 14px;
|
||||
color: $tx2;
|
||||
.reminder-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.todo-list {
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
overflow: hidden;
|
||||
box-shadow: $shadow-sm;
|
||||
.reminder-title {
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.todo-item {
|
||||
.reminder-count {
|
||||
font-size: var(--tk-font-micro);
|
||||
opacity: 0.7;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.reminder-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid $bd;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
gap: 8px;
|
||||
padding: 8px 0;
|
||||
|
||||
&:active {
|
||||
background: $bd-l;
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
|
||||
.todo-icon-wrap {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 10px;
|
||||
background: $pri-l;
|
||||
@include flex-center;
|
||||
.reminder-item-border {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.reminder-tag {
|
||||
font-size: var(--tk-font-micro);
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.todo-icon-char {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.todo-info {
|
||||
.reminder-text {
|
||||
font-size: var(--tk-font-cap);
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.todo-title {
|
||||
font-size: 15px;
|
||||
color: $tx;
|
||||
font-weight: 500;
|
||||
display: block;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.todo-sub {
|
||||
font-size: 13px;
|
||||
color: $tx3;
|
||||
display: block;
|
||||
color: #fff;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.todo-arrow {
|
||||
font-size: 14px;
|
||||
color: $tx3;
|
||||
.reminder-arrow {
|
||||
opacity: 0.5;
|
||||
color: #fff;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* ─── 区域 5：快捷操作 ─── */
|
||||
/* ─── 快捷操作 ─── */
|
||||
.action-section {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
margin-top: 16px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.action-btn {
|
||||
flex: 1;
|
||||
height: 52px;
|
||||
border-radius: 14px;
|
||||
font-size: 17px;
|
||||
font-weight: 600;
|
||||
@include flex-center;
|
||||
|
||||
&:active {
|
||||
@@ -296,6 +295,7 @@
|
||||
.action-primary {
|
||||
background: $pri;
|
||||
color: #fff;
|
||||
box-shadow: 0 2px 8px rgba(196, 98, 58, 0.25);
|
||||
}
|
||||
|
||||
.action-outline {
|
||||
@@ -305,6 +305,169 @@
|
||||
}
|
||||
|
||||
.action-btn-text {
|
||||
font-size: 17px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* ═══════════════════════════════════════
|
||||
访客首页
|
||||
═══════════════════════════════════════ */
|
||||
|
||||
.guest-page {
|
||||
min-height: 100vh;
|
||||
background: $bg;
|
||||
padding-bottom: calc(120px + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
/* ─── 轮播图 ─── */
|
||||
.guest-swiper {
|
||||
width: 100%;
|
||||
height: 360px;
|
||||
}
|
||||
|
||||
.guest-slide {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.guest-slide-bg {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
|
||||
&--1 {
|
||||
background: linear-gradient(135deg, $pri-d 0%, $pri 60%, $pri-l 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.guest-slide:nth-child(2) .guest-slide-bg {
|
||||
background: linear-gradient(135deg, $acc 0%, #3D5A40 60%, $acc-l 100%);
|
||||
}
|
||||
|
||||
.guest-slide:nth-child(3) .guest-slide-bg {
|
||||
background: linear-gradient(135deg, #8B6F4E 0%, $wrn 60%, $wrn-l 100%);
|
||||
}
|
||||
|
||||
.guest-slide-content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 40px 32px;
|
||||
}
|
||||
|
||||
.guest-slide-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: 700;
|
||||
color: #FFFFFF;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.guest-slide-desc {
|
||||
font-size: var(--tk-font-body-sm);
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* ─── 健康资讯 ─── */
|
||||
.guest-section {
|
||||
padding: 24px 24px 0;
|
||||
}
|
||||
|
||||
.guest-section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.guest-articles {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.guest-article-card {
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 16px 18px;
|
||||
box-shadow: $shadow-sm;
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
|
||||
.guest-article-title {
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.guest-article-summary {
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.guest-empty {
|
||||
padding: 40px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.guest-empty-text {
|
||||
font-size: var(--tk-font-cap);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
/* ─── 底部登录引导 ─── */
|
||||
.guest-login-prompt {
|
||||
margin: 24px 24px 0;
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 20px;
|
||||
box-shadow: $shadow-md;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.guest-login-text {
|
||||
flex: 1;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.guest-login-btn {
|
||||
height: 56px;
|
||||
padding: 0 28px;
|
||||
background: $pri;
|
||||
border-radius: $r-pill;
|
||||
@include flex-center;
|
||||
flex-shrink: 0;
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
|
||||
.guest-login-btn-text {
|
||||
font-size: var(--tk-font-h2);
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@@ -1,7 +1,9 @@
|
||||
import { View, Text } from '@tarojs/components';
|
||||
import { useState } from 'react';
|
||||
import { View, Text, Swiper, SwiperItem } from '@tarojs/components';
|
||||
import { useState, useCallback } from 'react';
|
||||
import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro';
|
||||
import { useAuthStore } from '../../stores/auth';
|
||||
import { useUIStore } from '../../stores/ui';
|
||||
import { navigateToLogin } from '../../utils/navigate';
|
||||
import { useHealthStore } from '../../stores/health';
|
||||
import ProgressRing from '../../components/ProgressRing';
|
||||
import Loading from '../../components/Loading';
|
||||
@@ -19,7 +21,77 @@ interface ReminderItem {
|
||||
tag: string;
|
||||
}
|
||||
|
||||
export default function Index() {
|
||||
// ─── 访客首页 ───
|
||||
|
||||
const CAROUSEL_SLIDES = [
|
||||
{ id: 'slide-1', title: '专业血透中心', desc: '三甲级医护团队全程守护' },
|
||||
{ id: 'slide-2', title: '智慧健康管理', desc: 'AI 驱动个性化健康方案' },
|
||||
{ id: 'slide-3', title: '温馨就医环境', desc: '舒适安全的治疗体验' },
|
||||
];
|
||||
|
||||
function GuestHome({ modeClass }: { modeClass: string }) {
|
||||
return (
|
||||
<View className={`guest-page ${modeClass}`}>
|
||||
{/* 轮播图 */}
|
||||
<Swiper
|
||||
className='guest-swiper'
|
||||
indicatorDots
|
||||
indicatorColor='rgba(255,255,255,0.4)'
|
||||
indicatorActiveColor='#FFFFFF'
|
||||
autoplay
|
||||
circular
|
||||
interval={4000}
|
||||
duration={500}
|
||||
>
|
||||
{CAROUSEL_SLIDES.map((slide) => (
|
||||
<SwiperItem key={slide.id}>
|
||||
<View className='guest-slide'>
|
||||
<View className='guest-slide-bg guest-slide-bg--1' />
|
||||
<View className='guest-slide-content'>
|
||||
<Text className='guest-slide-title'>{slide.title}</Text>
|
||||
<Text className='guest-slide-desc'>{slide.desc}</Text>
|
||||
</View>
|
||||
</View>
|
||||
</SwiperItem>
|
||||
))}
|
||||
</Swiper>
|
||||
|
||||
{/* 功能亮点 */}
|
||||
<View className='guest-section'>
|
||||
<Text className='guest-section-title'>核心功能</Text>
|
||||
<View className='guest-articles'>
|
||||
<View className='guest-article-card'>
|
||||
<Text className='guest-article-title'>健康数据管理</Text>
|
||||
<Text className='guest-article-summary'>记录并追踪您的体征数据</Text>
|
||||
</View>
|
||||
<View className='guest-article-card'>
|
||||
<Text className='guest-article-title'>智能预约排班</Text>
|
||||
<Text className='guest-article-summary'>在线预约透析和治疗</Text>
|
||||
</View>
|
||||
<View className='guest-article-card'>
|
||||
<Text className='guest-article-title'>AI 健康分析</Text>
|
||||
<Text className='guest-article-summary'>个性化健康趋势解读</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* 底部登录引导 */}
|
||||
<View className='guest-login-prompt'>
|
||||
<Text className='guest-login-text'>登录后即可使用完整健康管理服务</Text>
|
||||
<View
|
||||
className='guest-login-btn'
|
||||
onClick={navigateToLogin}
|
||||
>
|
||||
<Text className='guest-login-btn-text'>立即登录</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
// ─── 登录后首页 ───
|
||||
|
||||
function HomeDashboard({ modeClass }: { modeClass: string }) {
|
||||
const { user, currentPatient } = useAuthStore();
|
||||
const { todaySummary, loading, refreshToday } = useHealthStore();
|
||||
const [reminders, setReminders] = useState<ReminderItem[]>([]);
|
||||
@@ -55,7 +127,6 @@ export default function Index() {
|
||||
setRemindersLoading(true);
|
||||
try {
|
||||
const items: ReminderItem[] = [];
|
||||
|
||||
const [apptRes, taskRes, suggestRes] = await Promise.allSettled([
|
||||
appointmentApi.listAppointments(patientId, 1),
|
||||
followupApi.listTasks(patientId, 'pending'),
|
||||
@@ -64,15 +135,9 @@ export default function Index() {
|
||||
|
||||
if (suggestRes.status === 'fulfilled') {
|
||||
for (const s of suggestRes.value.data.slice(0, 1)) {
|
||||
items.push({
|
||||
id: s.id,
|
||||
text: buildSuggestionText(s),
|
||||
type: 'ai',
|
||||
tag: 'AI 建议',
|
||||
});
|
||||
items.push({ id: s.id, text: buildSuggestionText(s), type: 'ai', tag: 'AI 建议' });
|
||||
}
|
||||
}
|
||||
|
||||
if (apptRes.status === 'fulfilled') {
|
||||
for (const a of apptRes.value.data.slice(0, 1)) {
|
||||
if (a.status === 'pending' || a.status === 'confirmed') {
|
||||
@@ -85,7 +150,6 @@ export default function Index() {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (taskRes.status === 'fulfilled') {
|
||||
for (const t of taskRes.value.data.slice(0, 1)) {
|
||||
items.push({
|
||||
@@ -96,7 +160,6 @@ export default function Index() {
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
setReminders(items.slice(0, 3));
|
||||
} catch {
|
||||
setReminders([]);
|
||||
@@ -110,12 +173,7 @@ export default function Index() {
|
||||
const displayName = user?.display_name || currentPatient?.name || '访客';
|
||||
|
||||
const summary = todaySummary || {};
|
||||
const indicators = [
|
||||
!!summary.blood_pressure,
|
||||
!!summary.heart_rate,
|
||||
!!summary.blood_sugar,
|
||||
!!summary.weight,
|
||||
];
|
||||
const indicators = [!!summary.blood_pressure, !!summary.heart_rate, !!summary.blood_sugar, !!summary.weight];
|
||||
const completedCount = indicators.filter(Boolean).length;
|
||||
const progressPercent = Math.round((completedCount / 4) * 100);
|
||||
|
||||
@@ -140,7 +198,7 @@ export default function Index() {
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='home-page'>
|
||||
<View className={`home-page ${modeClass}`}>
|
||||
{/* 问候区 */}
|
||||
<View className='greeting-section'>
|
||||
<View className='greeting-left'>
|
||||
@@ -149,20 +207,14 @@ export default function Index() {
|
||||
{new Date().toLocaleDateString('zh-CN', { month: 'long', day: 'numeric', weekday: 'short' })}
|
||||
</Text>
|
||||
</View>
|
||||
<View
|
||||
className='greeting-bell'
|
||||
onClick={() => Taro.switchTab({ url: '/pages/messages/index' })}
|
||||
>
|
||||
<View className='greeting-bell' onClick={() => Taro.switchTab({ url: '/pages/messages/index' })}>
|
||||
<Text className='greeting-bell-icon'>消</Text>
|
||||
{unreadCount > 0 && <View className='greeting-bell-dot' />}
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* 今日体征进度 */}
|
||||
<View
|
||||
className='checkin-card'
|
||||
onClick={() => Taro.switchTab({ url: '/pages/health/index' })}
|
||||
>
|
||||
<View className='checkin-card' onClick={() => Taro.switchTab({ url: '/pages/health/index' })}>
|
||||
<View className='checkin-left'>
|
||||
<ProgressRing percent={progressPercent} />
|
||||
</View>
|
||||
@@ -172,10 +224,7 @@ export default function Index() {
|
||||
</Text>
|
||||
<View className='checkin-capsules'>
|
||||
{indicatorCapsules.map((cap) => (
|
||||
<Text
|
||||
key={cap.label}
|
||||
className={`capsule ${cap.done ? 'capsule-done' : 'capsule-pending'}`}
|
||||
>
|
||||
<Text key={cap.label} className={`capsule ${cap.done ? 'capsule-done' : 'capsule-pending'}`}>
|
||||
{cap.done ? '✓ ' : ''}{cap.label}
|
||||
</Text>
|
||||
))}
|
||||
@@ -226,11 +275,8 @@ export default function Index() {
|
||||
key={r.id}
|
||||
className={`reminder-item ${i > 0 ? 'reminder-item-border' : ''}`}
|
||||
onClick={() => {
|
||||
if (r.type === 'appointment') {
|
||||
Taro.navigateTo({ url: '/pages/appointment/index' });
|
||||
} else if (r.type === 'followup') {
|
||||
Taro.navigateTo({ url: `/pages/followup/detail/index?id=${r.id}` });
|
||||
}
|
||||
if (r.type === 'appointment') Taro.navigateTo({ url: '/pages/appointment/index' });
|
||||
else if (r.type === 'followup') Taro.navigateTo({ url: `/pages/followup/detail/index?id=${r.id}` });
|
||||
}}
|
||||
>
|
||||
<Text className='reminder-tag'>{r.tag}</Text>
|
||||
@@ -243,16 +289,10 @@ export default function Index() {
|
||||
|
||||
{/* 快捷操作 */}
|
||||
<View className='action-section'>
|
||||
<View
|
||||
className='action-btn action-primary'
|
||||
onClick={() => Taro.switchTab({ url: '/pages/health/index' })}
|
||||
>
|
||||
<View className='action-btn action-primary' onClick={() => Taro.switchTab({ url: '/pages/health/index' })}>
|
||||
<Text className='action-btn-text'>记录体征</Text>
|
||||
</View>
|
||||
<View
|
||||
className='action-btn action-outline'
|
||||
onClick={() => Taro.navigateTo({ url: '/pages/appointment/create/index' })}
|
||||
>
|
||||
<View className='action-btn action-outline' onClick={() => Taro.navigateTo({ url: '/pages/appointment/create/index' })}>
|
||||
<Text className='action-btn-text'>预约挂号</Text>
|
||||
</View>
|
||||
</View>
|
||||
@@ -260,12 +300,21 @@ export default function Index() {
|
||||
);
|
||||
}
|
||||
|
||||
// ─── 首页入口：根据登录状态切换 ───
|
||||
|
||||
export default function Index() {
|
||||
const user = useAuthStore((s) => s.user);
|
||||
const mode = useUIStore((s) => s.mode);
|
||||
const modeClass = mode === 'elder' ? 'elder-mode' : '';
|
||||
|
||||
if (!user) {
|
||||
return <GuestHome modeClass={modeClass} />;
|
||||
}
|
||||
return <HomeDashboard modeClass={modeClass} />;
|
||||
}
|
||||
|
||||
function buildSuggestionText(s: AiSuggestionItem): string {
|
||||
const riskMap: Record<string, string> = {
|
||||
high: '高风险',
|
||||
medium: '中风险',
|
||||
low: '低风险',
|
||||
};
|
||||
const riskMap: Record<string, string> = { high: '高风险', medium: '中风险', low: '低风险' };
|
||||
const typeMap: Record<string, string> = {
|
||||
vital_sign_anomaly: '体征异常',
|
||||
lab_result_anomaly: '化验异常',
|
||||
|
||||
@@ -8,19 +8,19 @@
|
||||
}
|
||||
|
||||
.legal-content {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
line-height: 1.8;
|
||||
|
||||
h3 {
|
||||
font-size: 34px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-top: 24px;
|
||||
@@ -28,7 +28,7 @@
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
margin-bottom: 8px;
|
||||
line-height: 1.8;
|
||||
@@ -41,6 +41,6 @@
|
||||
}
|
||||
|
||||
.legal-footer-text {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 160px 56px 80px;
|
||||
padding: 100px 40px 60px;
|
||||
}
|
||||
|
||||
/* ─── 品牌区 ─── */
|
||||
@@ -19,22 +19,22 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-bottom: 80px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
||||
.login-logo {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
border-radius: $r-lg;
|
||||
background: $pri;
|
||||
@include flex-center;
|
||||
margin-bottom: 36px;
|
||||
margin-bottom: 24px;
|
||||
box-shadow: 0 8px 24px rgba($pri, 0.3);
|
||||
}
|
||||
|
||||
.login-logo-mark {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 64px;
|
||||
font-size: var(--tk-font-hero);
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
@@ -42,14 +42,14 @@
|
||||
|
||||
.login-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 48px;
|
||||
font-size: var(--tk-font-num);
|
||||
color: $tx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.login-subtitle {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
color: $tx2;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
@@ -57,7 +57,7 @@
|
||||
/* ─── 装饰线 ─── */
|
||||
.login-divider {
|
||||
width: 48px;
|
||||
margin-bottom: 64px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.login-divider-line {
|
||||
@@ -74,16 +74,18 @@
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 96px;
|
||||
height: $btn-primary-h;
|
||||
background: $pri;
|
||||
color: #fff;
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
border-radius: $r;
|
||||
border: none;
|
||||
@include flex-center;
|
||||
letter-spacing: 0.04em;
|
||||
box-shadow: 0 4px 16px rgba($pri, 0.25);
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
|
||||
&::after {
|
||||
border: none;
|
||||
@@ -98,14 +100,14 @@
|
||||
.agreement-row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-top: 40px;
|
||||
gap: 12px;
|
||||
margin-top: 28px;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.agreement-check {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 2px solid $bd;
|
||||
border-radius: $r-sm;
|
||||
@include flex-center;
|
||||
@@ -120,14 +122,14 @@
|
||||
}
|
||||
|
||||
.agreement-check-mark {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.agreement-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
line-height: 1.7;
|
||||
}
|
||||
@@ -136,3 +138,16 @@
|
||||
color: $pri;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* ─── 暂不登录 ─── */
|
||||
.skip-row {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.skip-btn {
|
||||
font-size: var(--tk-font-body-sm);
|
||||
color: var(--tk-text-secondary);
|
||||
padding: 8px 16px;
|
||||
}
|
||||
|
||||
@@ -2,13 +2,18 @@ import { useState } from 'react';
|
||||
import { View, Text, Button, ScrollView } from '@tarojs/components';
|
||||
import Taro from '@tarojs/taro';
|
||||
import { useAuthStore } from '../../stores/auth';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
export default function Login() {
|
||||
const modeClass = useElderClass();
|
||||
const [needBind, setNeedBind] = useState(false);
|
||||
const [agreed, setAgreed] = useState(false);
|
||||
const { login, bindPhone, loading, isMedicalStaff } = useAuthStore();
|
||||
|
||||
// 登录页不应用关怀模式（正常模式尺寸已足够大）
|
||||
const loginClass = '';
|
||||
|
||||
const navigateAfterLogin = () => {
|
||||
if (isMedicalStaff()) {
|
||||
Taro.redirectTo({ url: '/pages/doctor/index' });
|
||||
@@ -47,16 +52,29 @@ export default function Login() {
|
||||
return;
|
||||
}
|
||||
const { encryptedData, iv } = e.detail;
|
||||
const success = await bindPhone(encryptedData, iv);
|
||||
if (success) {
|
||||
navigateAfterLogin();
|
||||
} else {
|
||||
Taro.showToast({ title: '绑定失败，请重试', icon: 'none' });
|
||||
try {
|
||||
const success = await bindPhone(encryptedData, iv);
|
||||
if (success) {
|
||||
navigateAfterLogin();
|
||||
}
|
||||
} catch (err: any) {
|
||||
const msg = err?.message || '绑定失败';
|
||||
Taro.showModal({
|
||||
title: '绑定手机号失败',
|
||||
content: msg,
|
||||
confirmText: '重新登录',
|
||||
cancelText: '取消',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
setNeedBind(false);
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className='login-scroll'>
|
||||
<ScrollView scrollY className={`login-scroll ${loginClass}`}>
|
||||
<View className='login-page'>
|
||||
{/* 品牌区 */}
|
||||
<View className='login-brand'>
|
||||
@@ -102,6 +120,13 @@ export default function Login() {
|
||||
<Text className='agreement-link' onClick={() => Taro.navigateTo({ url: '/pages/legal/privacy-policy' })}>《隐私政策》</Text>
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
{/* 暂不登录 */}
|
||||
<View className='skip-row'>
|
||||
<Text className='skip-btn' onClick={() => Taro.reLaunch({ url: '/pages/index/index' })}>
|
||||
暂不登录，先看看
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
);
|
||||
|
||||
@@ -28,7 +28,7 @@
|
||||
}
|
||||
|
||||
.points-label {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
@@ -50,7 +50,7 @@
|
||||
}
|
||||
|
||||
.checkin-btn-text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -61,7 +61,7 @@
|
||||
|
||||
.points-balance {
|
||||
@include serif-number;
|
||||
font-size: 72px;
|
||||
font-size: 72px; /* kept as-is: special display value */
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
display: block;
|
||||
@@ -71,7 +71,7 @@
|
||||
}
|
||||
|
||||
.points-streak {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
display: block;
|
||||
}
|
||||
@@ -102,7 +102,7 @@
|
||||
}
|
||||
|
||||
.type-tab-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx2;
|
||||
|
||||
&.active {
|
||||
@@ -142,7 +142,7 @@
|
||||
|
||||
.product-image-char {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 56px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
line-height: 1;
|
||||
@@ -156,7 +156,7 @@
|
||||
}
|
||||
|
||||
.product-name {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -180,20 +180,20 @@
|
||||
|
||||
.product-points-char {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: bold;
|
||||
color: $wrn;
|
||||
}
|
||||
|
||||
.product-points-value {
|
||||
@include serif-number;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $wrn;
|
||||
}
|
||||
|
||||
.product-stock {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
padding: 2px 10px;
|
||||
border-radius: $r-sm;
|
||||
|
||||
@@ -212,7 +212,7 @@
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 160px 40px;
|
||||
padding: 100px 40px;
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
@@ -226,22 +226,22 @@
|
||||
|
||||
.empty-char {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 52px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.empty-title {
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.empty-hint {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: var(--tk-text-secondary);
|
||||
text-align: center;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
@@ -257,7 +257,7 @@
|
||||
}
|
||||
|
||||
.empty-action-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@@ -6,6 +6,7 @@ import type { PointsProduct } from '../../services/points';
|
||||
import { useAuthStore } from '../../stores/auth';
|
||||
import { usePointsStore } from '../../stores/points';
|
||||
import Loading from '../../components/Loading';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const PRODUCT_TYPE_TABS = [
|
||||
@@ -32,6 +33,7 @@ export default function Mall() {
|
||||
const [checkinLoading, setCheckinLoading] = useState(false);
|
||||
const [noProfile, setNoProfile] = useState(false);
|
||||
const loadingRef = useRef(false);
|
||||
const modeClass = useElderClass();
|
||||
|
||||
const fetchProducts = useCallback(
|
||||
async (pageNum: number, type: string, isRefresh = false) => {
|
||||
@@ -132,7 +134,7 @@ export default function Mall() {
|
||||
|
||||
if (noProfile) {
|
||||
return (
|
||||
<View className='mall-page'>
|
||||
<View className={`mall-page ${modeClass}`}>
|
||||
<View className='mall-empty-state'>
|
||||
<View className='empty-icon'>
|
||||
<Text className='empty-char'>档</Text>
|
||||
@@ -148,7 +150,7 @@ export default function Mall() {
|
||||
}
|
||||
|
||||
return (
|
||||
<View className='mall-page'>
|
||||
<View className={`mall-page ${modeClass}`}>
|
||||
{/* 积分余额卡片 */}
|
||||
<View className='mall-header'>
|
||||
<View className='points-card'>
|
||||
|
||||
@@ -4,70 +4,86 @@
|
||||
.messages-page {
|
||||
min-height: 100vh;
|
||||
background: $bg;
|
||||
padding-bottom: calc(120px + env(safe-area-inset-bottom));
|
||||
padding: 20px 24px 100px;
|
||||
padding-bottom: calc(100px + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
/* ─── 页头 ─── */
|
||||
.messages-header {
|
||||
padding: 24px 32px 8px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.messages-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 36px;
|
||||
font-weight: bold;
|
||||
@include serif-number;
|
||||
font-size: var(--tk-font-h1);
|
||||
font-weight: 700;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
/* ─── Tab 切换 ─── */
|
||||
.msg-tabs {
|
||||
/* ─── 分段控件 Tab ─── */
|
||||
.msg-segment {
|
||||
display: flex;
|
||||
padding: 16px 24px 0;
|
||||
gap: 0;
|
||||
background: $surface-alt;
|
||||
border-radius: $r-sm;
|
||||
padding: 3px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.msg-tab {
|
||||
.msg-segment-tab {
|
||||
flex: 1;
|
||||
height: $tab-h;
|
||||
height: 40px;
|
||||
border-radius: $r-xs;
|
||||
@include flex-center;
|
||||
position: relative;
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-tab-text {
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
color: $tx2;
|
||||
}
|
||||
.msg-segment-active {
|
||||
background: $card;
|
||||
box-shadow: $shadow-sm;
|
||||
|
||||
.msg-tab-active .msg-tab-text {
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.msg-tab-indicator {
|
||||
padding: 0 24px;
|
||||
height: 3px;
|
||||
background: $bd-l;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.msg-tab-bar {
|
||||
width: 50%;
|
||||
height: 3px;
|
||||
background: $pri;
|
||||
border-radius: 2px;
|
||||
transition: transform 0.2s;
|
||||
|
||||
&.msg-tab-bar-right {
|
||||
transform: translateX(100%);
|
||||
.msg-segment-text {
|
||||
color: $tx;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-segment-text {
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 600;
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.msg-segment-badge {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 12px;
|
||||
min-width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 8px;
|
||||
background: $dan;
|
||||
@include flex-center;
|
||||
padding: 0 4px;
|
||||
}
|
||||
|
||||
.msg-segment-badge-text {
|
||||
font-size: var(--tk-font-micro);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* ─── 内容区 ─── */
|
||||
.msg-content {
|
||||
padding: 0 24px;
|
||||
// wrapper
|
||||
}
|
||||
|
||||
.msg-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.msg-empty {
|
||||
@@ -79,18 +95,18 @@
|
||||
}
|
||||
|
||||
.msg-empty-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
/* ─── 咨询卡片 ─── */
|
||||
.consult-card {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 24px;
|
||||
margin-bottom: 12px;
|
||||
padding: 16px;
|
||||
box-shadow: $shadow-sm;
|
||||
|
||||
&:active {
|
||||
@@ -98,53 +114,84 @@
|
||||
}
|
||||
}
|
||||
|
||||
.consult-info {
|
||||
.consult-card-muted {
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
.consult-avatar {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 22px;
|
||||
background: $surface-alt;
|
||||
@include flex-center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.consult-avatar-active {
|
||||
background: $pri-l;
|
||||
}
|
||||
|
||||
.consult-avatar-char {
|
||||
@include serif-number;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 700;
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.consult-avatar-active .consult-avatar-char {
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.consult-body {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.consult-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 4px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.consult-doctor {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
display: block;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.consult-preview {
|
||||
font-size: 24px;
|
||||
color: $tx2;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.consult-meta {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
gap: 8px;
|
||||
flex-shrink: 0;
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.consult-time {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: var(--tk-text-secondary);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.consult-preview {
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.consult-badge {
|
||||
min-width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 12px;
|
||||
min-width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 9px;
|
||||
background: $dan;
|
||||
@include flex-center;
|
||||
padding: 0 6px;
|
||||
padding: 0 4px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.consult-badge-text {
|
||||
font-size: 18px;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -152,43 +199,72 @@
|
||||
/* ─── 通知卡片 ─── */
|
||||
.notify-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
align-items: flex-start;
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 24px;
|
||||
margin-bottom: 12px;
|
||||
padding: 16px;
|
||||
box-shadow: $shadow-sm;
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
|
||||
.notify-info {
|
||||
.notify-card-muted {
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
.notify-icon {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: $r-sm;
|
||||
@include flex-center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.notify-icon-char {
|
||||
@include serif-number;
|
||||
font-size: var(--tk-font-body-sm);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.notify-body {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.notify-title {
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
display: block;
|
||||
margin-bottom: 6px;
|
||||
.notify-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.notify-desc {
|
||||
font-size: 24px;
|
||||
color: $tx2;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
.notify-title {
|
||||
font-size: var(--tk-font-cap);
|
||||
font-weight: 400;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.notify-title-bold {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.notify-time {
|
||||
font-size: 22px;
|
||||
color: $tx2;
|
||||
font-size: var(--tk-font-micro);
|
||||
color: var(--tk-text-secondary);
|
||||
flex-shrink: 0;
|
||||
margin-left: 16px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.notify-desc {
|
||||
font-size: var(--tk-font-cap);
|
||||
color: $tx2;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.notify-dot {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 4px;
|
||||
background: $pri;
|
||||
flex-shrink: 0;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
@@ -4,6 +4,9 @@ import Taro, { useDidShow, useReachBottom } from '@tarojs/taro';
|
||||
import { listConsultations, ConsultationSession } from '../../services/consultation';
|
||||
import { notificationService } from '../../services/notification';
|
||||
import Loading from '../../components/Loading';
|
||||
import GuestGuard from '../../components/GuestGuard';
|
||||
import { useAuthStore } from '../../stores/auth';
|
||||
import { useElderClass } from '../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
type MsgTab = 'consultation' | 'notification';
|
||||
@@ -14,9 +17,20 @@ interface NotificationItem {
|
||||
desc: string;
|
||||
time: string;
|
||||
type: string;
|
||||
read?: boolean;
|
||||
}
|
||||
|
||||
const NOTIFY_ICONS: Record<string, { icon: string; bg: string; color: string }> = {
|
||||
appointment: { icon: '约', bg: '#F0DDD4', color: '#C4623A' },
|
||||
alert: { icon: '警', bg: '#FFF3E0', color: '#C4873A' },
|
||||
followup: { icon: '随', bg: '#E8F0E8', color: '#5B7A5E' },
|
||||
points: { icon: '分', bg: '#F0DDD4', color: '#C4623A' },
|
||||
report: { icon: '报', bg: '#E8F0E8', color: '#5B7A5E' },
|
||||
};
|
||||
|
||||
export default function Messages() {
|
||||
const user = useAuthStore((s) => s.user);
|
||||
const modeClass = useElderClass();
|
||||
const [activeTab, setActiveTab] = useState<MsgTab>('consultation');
|
||||
const [sessions, setSessions] = useState<ConsultationSession[]>([]);
|
||||
const [notifications, setNotifications] = useState<NotificationItem[]>([]);
|
||||
@@ -25,10 +39,6 @@ export default function Messages() {
|
||||
const [total, setTotal] = useState(0);
|
||||
const loadingRef = useRef(false);
|
||||
|
||||
useDidShow(() => {
|
||||
loadData(activeTab, 1, true);
|
||||
});
|
||||
|
||||
const loadData = async (tab: MsgTab, pageNum: number = 1, isRefresh = false) => {
|
||||
if (loadingRef.current) return;
|
||||
loadingRef.current = true;
|
||||
@@ -65,6 +75,10 @@ export default function Messages() {
|
||||
}
|
||||
};
|
||||
|
||||
useDidShow(() => {
|
||||
if (user) loadData(activeTab, 1, true);
|
||||
});
|
||||
|
||||
const handleTabChange = (tab: MsgTab) => {
|
||||
setActiveTab(tab);
|
||||
loadData(tab, 1, true);
|
||||
@@ -89,94 +103,123 @@ export default function Messages() {
|
||||
return dateStr.slice(0, 10);
|
||||
};
|
||||
|
||||
if (!user) {
|
||||
return <GuestGuard title='请先登录' desc='登录后即可查看消息和通知' />;
|
||||
}
|
||||
|
||||
const unreadConsultCount = sessions.filter((s) => s.unread_count_patient > 0).length;
|
||||
|
||||
return (
|
||||
<View className='messages-page'>
|
||||
<View className={`messages-page ${modeClass}`}>
|
||||
{/* 页头 */}
|
||||
<View className='messages-header'>
|
||||
<Text className='messages-title'>消息</Text>
|
||||
</View>
|
||||
|
||||
{/* Tab 切换 */}
|
||||
<View className='msg-tabs'>
|
||||
{/* 分段控件 Tab */}
|
||||
<View className='msg-segment'>
|
||||
<View
|
||||
className={`msg-tab ${activeTab === 'consultation' ? 'msg-tab-active' : ''}`}
|
||||
className={`msg-segment-tab ${activeTab === 'consultation' ? 'msg-segment-active' : ''}`}
|
||||
onClick={() => handleTabChange('consultation')}
|
||||
>
|
||||
<Text className='msg-tab-text'>咨询</Text>
|
||||
<Text className='msg-segment-text'>咨询</Text>
|
||||
{unreadConsultCount > 0 && (
|
||||
<View className='msg-segment-badge'>
|
||||
<Text className='msg-segment-badge-text'>{unreadConsultCount}</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
<View
|
||||
className={`msg-tab ${activeTab === 'notification' ? 'msg-tab-active' : ''}`}
|
||||
className={`msg-segment-tab ${activeTab === 'notification' ? 'msg-segment-active' : ''}`}
|
||||
onClick={() => handleTabChange('notification')}
|
||||
>
|
||||
<Text className='msg-tab-text'>通知</Text>
|
||||
<Text className='msg-segment-text'>通知</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className='msg-tab-indicator'>
|
||||
<View className={`msg-tab-bar ${activeTab === 'notification' ? 'msg-tab-bar-right' : ''}`} />
|
||||
</View>
|
||||
|
||||
{/* 咨询列表 */}
|
||||
{activeTab === 'consultation' && (
|
||||
<View className='msg-content'>
|
||||
{loading ? (
|
||||
<View className='msg-content'>
|
||||
{/* 咨询列表 */}
|
||||
{activeTab === 'consultation' && (
|
||||
loading ? (
|
||||
<Loading />
|
||||
) : sessions.length === 0 ? (
|
||||
<View className='msg-empty'>
|
||||
<Text className='msg-empty-text'>暂无咨询消息</Text>
|
||||
</View>
|
||||
) : (
|
||||
sessions.map((session) => (
|
||||
<View
|
||||
key={session.id}
|
||||
className='consult-card'
|
||||
onClick={() => Taro.navigateTo({ url: `/pages/consultation/detail/index?id=${session.id}` })}
|
||||
>
|
||||
<View className='consult-info'>
|
||||
<Text className='consult-doctor'>
|
||||
{session.consultation_type === 'online' ? '在线咨询' : '门诊咨询'}
|
||||
</Text>
|
||||
<Text className='consult-preview'>
|
||||
{session.last_message || session.subject || '暂无消息'}
|
||||
</Text>
|
||||
</View>
|
||||
<View className='consult-meta'>
|
||||
<Text className='consult-time'>{formatTime(session.last_message_at)}</Text>
|
||||
{session.unread_count_patient > 0 && (
|
||||
<View className='consult-badge'>
|
||||
<Text className='consult-badge-text'>
|
||||
{session.unread_count_patient > 99 ? '99+' : session.unread_count_patient}
|
||||
</Text>
|
||||
<View className='msg-list'>
|
||||
{sessions.map((session) => {
|
||||
const doctorName = session.last_message?.slice(0, 1) || '医';
|
||||
const hasUnread = session.unread_count_patient > 0;
|
||||
return (
|
||||
<View
|
||||
key={session.id}
|
||||
className={`consult-card ${hasUnread ? '' : 'consult-card-muted'}`}
|
||||
onClick={() => Taro.navigateTo({ url: `/pages/consultation/detail/index?id=${session.id}` })}
|
||||
>
|
||||
<View className={`consult-avatar ${hasUnread ? 'consult-avatar-active' : ''}`}>
|
||||
<Text className='consult-avatar-char'>{doctorName}</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
))
|
||||
)}
|
||||
</View>
|
||||
)}
|
||||
<View className='consult-body'>
|
||||
<View className='consult-row'>
|
||||
<Text className='consult-doctor'>
|
||||
{session.consultation_type === 'online' ? '在线咨询' : '门诊咨询'}
|
||||
</Text>
|
||||
<Text className='consult-time'>{formatTime(session.last_message_at)}</Text>
|
||||
</View>
|
||||
<View className='consult-row'>
|
||||
<Text className='consult-preview'>
|
||||
{session.last_message || session.subject || '暂无消息'}
|
||||
</Text>
|
||||
{hasUnread && (
|
||||
<View className='consult-badge'>
|
||||
<Text className='consult-badge-text'>
|
||||
{session.unread_count_patient > 99 ? '99+' : session.unread_count_patient}
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
)
|
||||
)}
|
||||
|
||||
{/* 通知列表 */}
|
||||
{activeTab === 'notification' && (
|
||||
<View className='msg-content'>
|
||||
{loading ? (
|
||||
{/* 通知列表 */}
|
||||
{activeTab === 'notification' && (
|
||||
loading ? (
|
||||
<Loading />
|
||||
) : notifications.length === 0 ? (
|
||||
<View className='msg-empty'>
|
||||
<Text className='msg-empty-text'>暂无新通知</Text>
|
||||
</View>
|
||||
) : (
|
||||
notifications.map((n) => (
|
||||
<View key={n.id} className='notify-card'>
|
||||
<View className='notify-info'>
|
||||
<Text className='notify-title'>{n.title}</Text>
|
||||
<Text className='notify-desc'>{n.desc}</Text>
|
||||
</View>
|
||||
<Text className='notify-time'>{n.time}</Text>
|
||||
</View>
|
||||
))
|
||||
)}
|
||||
</View>
|
||||
)}
|
||||
<View className='msg-list'>
|
||||
{notifications.map((n) => {
|
||||
const cfg = NOTIFY_ICONS[n.type] || NOTIFY_ICONS.report;
|
||||
const isUnread = !n.read;
|
||||
return (
|
||||
<View key={n.id} className={`notify-card ${isUnread ? '' : 'notify-card-muted'}`}>
|
||||
<View className='notify-icon' style={`background:${cfg.bg};`}>
|
||||
<Text className='notify-icon-char' style={`color:${cfg.color};`}>{cfg.icon}</Text>
|
||||
</View>
|
||||
<View className='notify-body'>
|
||||
<View className='notify-row'>
|
||||
<Text className={`notify-title ${isUnread ? 'notify-title-bold' : ''}`}>{n.title}</Text>
|
||||
<Text className='notify-time'>{n.time}</Text>
|
||||
</View>
|
||||
<Text className='notify-desc'>{n.desc}</Text>
|
||||
</View>
|
||||
{isUnread && <View className='notify-dot' />}
|
||||
</View>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
)
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
}
|
||||
|
||||
.alerts-tab-text {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -75,12 +75,12 @@
|
||||
}
|
||||
|
||||
.alert-badge-text {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.alert-badge.sev-info .alert-badge-text {
|
||||
color: $tx3;
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
.alert-badge.sev-warning .alert-badge-text {
|
||||
@@ -96,12 +96,12 @@
|
||||
}
|
||||
|
||||
.alert-time {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
.alert-title {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
line-height: 1.5;
|
||||
}
|
||||
@@ -115,14 +115,14 @@
|
||||
}
|
||||
|
||||
.alerts-empty-text {
|
||||
font-size: 30px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-num);
|
||||
color: var(--tk-text-secondary);
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.alerts-empty-hint {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
.alerts-empty-action {
|
||||
@@ -134,5 +134,5 @@
|
||||
|
||||
.alerts-empty-action-text {
|
||||
color: $card;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro';
|
||||
import { listPatientAlerts, type Alert } from '@/services/alert';
|
||||
import { useAuthStore } from '@/stores/auth';
|
||||
import Loading from '@/components/Loading';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const SEVERITY_MAP: Record<string, { label: string; className: string }> = {
|
||||
@@ -21,6 +22,7 @@ const STATUS_TABS = [
|
||||
];
|
||||
|
||||
export default function PatientAlerts() {
|
||||
const modeClass = useElderClass();
|
||||
const { currentPatient } = useAuthStore();
|
||||
const [alerts, setAlerts] = useState<Alert[]>([]);
|
||||
const [total, setTotal] = useState(0);
|
||||
@@ -74,7 +76,7 @@ export default function PatientAlerts() {
|
||||
|
||||
if (!currentPatient) {
|
||||
return (
|
||||
<View className='alerts-page'>
|
||||
<View className={`alerts-page ${modeClass}`}>
|
||||
<View className='alerts-empty'>
|
||||
<Text className='alerts-empty-text'>请先完善个人档案</Text>
|
||||
<View className='alerts-empty-action' onClick={() => Taro.navigateTo({ url: '/pages/pkg-profile/family-add/index' })}>
|
||||
@@ -86,7 +88,7 @@ export default function PatientAlerts() {
|
||||
}
|
||||
|
||||
return (
|
||||
<View className='alerts-page'>
|
||||
<View className={`alerts-page ${modeClass}`}>
|
||||
<View className='alerts-tabs'>
|
||||
{STATUS_TABS.map((tab) => (
|
||||
<View
|
||||
|
||||
@@ -26,20 +26,20 @@
|
||||
|
||||
.dm-hero-icon-text {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 40px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.dm-hero-title {
|
||||
@include section-title;
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.dm-hero-sub {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
/* ── card (standalone, used for date picker) ── */
|
||||
@@ -60,14 +60,14 @@
|
||||
|
||||
.dm-card-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.dm-card-badge {
|
||||
@include tag($acc-l, $acc);
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
@@ -82,7 +82,7 @@
|
||||
}
|
||||
|
||||
.dm-date-value {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $pri;
|
||||
@include serif-number;
|
||||
font-weight: bold;
|
||||
@@ -90,8 +90,8 @@
|
||||
|
||||
.dm-date-arrow {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
transform: rotate(180deg);
|
||||
display: inline-block;
|
||||
}
|
||||
@@ -118,14 +118,14 @@
|
||||
|
||||
.dm-group-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
color: $tx;
|
||||
}
|
||||
|
||||
.dm-group-arrow {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
transition: transform 0.2s ease;
|
||||
display: inline-block;
|
||||
}
|
||||
@@ -163,7 +163,7 @@
|
||||
}
|
||||
|
||||
.dm-field-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
@@ -185,14 +185,14 @@
|
||||
|
||||
.dm-bp-slash {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 36px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
color: var(--tk-text-secondary);
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.dm-field-unit {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
font-style: italic;
|
||||
@@ -210,8 +210,8 @@
|
||||
}
|
||||
|
||||
.dm-unit-inline {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: var(--tk-text-secondary);
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
@@ -221,7 +221,7 @@
|
||||
background: $bg;
|
||||
border-radius: $r-sm;
|
||||
padding: 20px 24px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
@include serif-number;
|
||||
box-sizing: border-box;
|
||||
@@ -238,7 +238,7 @@
|
||||
}
|
||||
|
||||
.dm-field-warning {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $wrn;
|
||||
margin-top: 8px;
|
||||
display: block;
|
||||
@@ -269,7 +269,7 @@
|
||||
}
|
||||
|
||||
.dm-submit-text {
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-num);
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
letter-spacing: 2px;
|
||||
@@ -283,6 +283,6 @@
|
||||
}
|
||||
|
||||
.dm-reset-text {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
@@ -8,6 +8,7 @@ import { useHealthStore } from '@/stores/health';
|
||||
import { usePointsStore } from '@/stores/points';
|
||||
import { clearRequestCache } from '@/services/request';
|
||||
import { trackEvent } from '@/services/analytics';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const bpSchema = z.number().min(30, '血压值不能低于30').max(300, '血压值不能高于300').optional();
|
||||
@@ -58,6 +59,7 @@ const FIELD_LABELS: Record<string, string> = {
|
||||
};
|
||||
|
||||
export default function DailyMonitoring() {
|
||||
const modeClass = useElderClass();
|
||||
const { currentPatient } = useAuthStore();
|
||||
|
||||
const today = formatDate(new Date());
|
||||
@@ -258,7 +260,7 @@ export default function DailyMonitoring() {
|
||||
const bloodSugarAbnormal = checkAbnormal(bloodSugar, 'bloodSugar');
|
||||
|
||||
return (
|
||||
<View className='dm-page'>
|
||||
<View className={`dm-page ${modeClass}`}>
|
||||
{/* 页面标题 */}
|
||||
<View className='dm-hero'>
|
||||
<View className='dm-hero-icon'>
|
||||
|
||||
@@ -26,20 +26,20 @@
|
||||
|
||||
.input-hero-icon-text {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 40px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.input-hero-title {
|
||||
@include section-title;
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.input-hero-sub {
|
||||
font-size: 24px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
/* ── sync entry ── */
|
||||
@@ -60,14 +60,14 @@
|
||||
}
|
||||
|
||||
.input-sync-entry-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: 600;
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.input-sync-entry-hint {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
}
|
||||
|
||||
/* ── card ── */
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
.input-card-indicator-char {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
font-weight: bold;
|
||||
color: $acc;
|
||||
}
|
||||
|
||||
.input-card-label {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
}
|
||||
@@ -119,15 +119,15 @@
|
||||
}
|
||||
|
||||
.input-picker-value {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
@include serif-number;
|
||||
}
|
||||
|
||||
.input-picker-arrow {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
transform: rotate(180deg);
|
||||
display: inline-block;
|
||||
}
|
||||
@@ -135,7 +135,7 @@
|
||||
/* ── section title ── */
|
||||
.input-section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 16px;
|
||||
@@ -154,7 +154,7 @@
|
||||
}
|
||||
|
||||
.input-field-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
@@ -176,8 +176,8 @@
|
||||
|
||||
.input-bp-slash {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 36px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
color: var(--tk-text-secondary);
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
@@ -186,7 +186,7 @@
|
||||
background: $bg;
|
||||
border-radius: $r-sm;
|
||||
padding: 20px 24px;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
@include serif-number;
|
||||
box-sizing: border-box;
|
||||
@@ -197,8 +197,8 @@
|
||||
}
|
||||
|
||||
.input-field-unit {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
font-size: var(--tk-font-body);
|
||||
color: var(--tk-text-secondary);
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
font-style: italic;
|
||||
@@ -225,7 +225,7 @@
|
||||
}
|
||||
|
||||
.input-submit-text {
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-num);
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
letter-spacing: 2px;
|
||||
|
||||
@@ -8,6 +8,7 @@ import { useHealthStore } from '@/stores/health';
|
||||
import { usePointsStore } from '@/stores/points';
|
||||
import { clearRequestCache } from '@/services/request';
|
||||
import { trackEvent } from '@/services/analytics';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const INDICATORS = [
|
||||
@@ -56,6 +57,7 @@ function getWarnForIndicator(
|
||||
}
|
||||
|
||||
export default function HealthInput() {
|
||||
const modeClass = useElderClass();
|
||||
const [indicatorIdx, setIndicatorIdx] = useState(0);
|
||||
const [thresholds, setThresholds] = useState<HealthThreshold[]>(DEFAULT_THRESHOLDS);
|
||||
const [value, setValue] = useState('');
|
||||
@@ -155,7 +157,7 @@ export default function HealthInput() {
|
||||
const indicatorInitial = INDICATORS[indicatorIdx].label.charAt(0);
|
||||
|
||||
return (
|
||||
<View className='input-page'>
|
||||
<View className={`input-page ${modeClass}`}>
|
||||
{/* 页面标题 */}
|
||||
<View className='input-hero'>
|
||||
<View className='input-hero-icon'>
|
||||
|
||||
@@ -26,14 +26,14 @@
|
||||
|
||||
.trend-hero-icon-text {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 40px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.trend-hero-title {
|
||||
@include section-title;
|
||||
font-size: 36px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@@ -59,7 +59,7 @@
|
||||
}
|
||||
|
||||
.trange-tab-text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -91,13 +91,13 @@
|
||||
}
|
||||
|
||||
.trend-ref-label {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $acc;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.trend-ref-value {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $acc;
|
||||
@include serif-number;
|
||||
font-weight: 500;
|
||||
@@ -110,7 +110,7 @@
|
||||
|
||||
.trend-list-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -146,7 +146,7 @@
|
||||
}
|
||||
|
||||
.trend-item-date {
|
||||
font-size: 26px;
|
||||
font-size: var(--tk-font-h1);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
@@ -159,7 +159,7 @@
|
||||
}
|
||||
|
||||
.trend-item-value {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $pri;
|
||||
@include serif-number;
|
||||
font-weight: bold;
|
||||
|
||||
@@ -3,6 +3,7 @@ import { View, Text } from '@tarojs/components';
|
||||
import { useRouter } from '@tarojs/taro';
|
||||
import { useHealthStore } from '@/stores/health';
|
||||
import TrendChart from '@/components/TrendChart';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const RANGE_OPTIONS = [
|
||||
@@ -22,6 +23,7 @@ const INDICATOR_META: Record<string, { label: string; unit: string; refMin?: num
|
||||
};
|
||||
|
||||
export default function Trend() {
|
||||
const modeClass = useElderClass();
|
||||
const router = useRouter();
|
||||
const indicator = router.params.indicator || 'heart_rate';
|
||||
const [range, setRange] = useState('7d');
|
||||
@@ -41,7 +43,7 @@ export default function Trend() {
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='trend-page'>
|
||||
<View className={`trend-page ${modeClass}`}>
|
||||
{/* 页面标题 */}
|
||||
<View className='trend-hero'>
|
||||
<View className='trend-hero-icon'>
|
||||
|
||||
@@ -1,34 +1,5 @@
|
||||
@import '../../../styles/variables.scss';
|
||||
|
||||
@mixin serif-number {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
@mixin section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@mixin tag($bg, $color) {
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
background: $bg;
|
||||
color: $color;
|
||||
}
|
||||
|
||||
@mixin flex-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@import '../../../styles/mixins.scss';
|
||||
|
||||
.detail-page {
|
||||
min-height: 100vh;
|
||||
@@ -46,7 +17,7 @@
|
||||
}
|
||||
|
||||
.balance-label {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx2;
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
@@ -54,7 +25,7 @@
|
||||
|
||||
.balance-value {
|
||||
@include serif-number;
|
||||
font-size: 60px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
display: block;
|
||||
@@ -79,7 +50,7 @@
|
||||
|
||||
.stat-value {
|
||||
@include serif-number;
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
|
||||
@@ -97,7 +68,7 @@
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -135,7 +106,7 @@
|
||||
}
|
||||
|
||||
.type-tab-text {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx3;
|
||||
|
||||
.type-tab.active & {
|
||||
@@ -182,7 +153,7 @@
|
||||
|
||||
.tx-badge-text {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
font-weight: bold;
|
||||
|
||||
.tx-badge-earn & {
|
||||
@@ -204,7 +175,7 @@
|
||||
}
|
||||
|
||||
.tx-desc {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
@@ -214,7 +185,7 @@
|
||||
}
|
||||
|
||||
.tx-date {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
display: block;
|
||||
}
|
||||
@@ -229,7 +200,7 @@
|
||||
|
||||
.tx-amount {
|
||||
@include serif-number;
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
|
||||
@@ -244,6 +215,6 @@
|
||||
|
||||
.tx-remaining {
|
||||
@include serif-number;
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
@@ -6,6 +6,7 @@ import type { PointsTransaction } from '../../../services/points';
|
||||
import { usePointsStore } from '../../../stores/points';
|
||||
import EmptyState from '../../../components/EmptyState';
|
||||
import Loading from '../../../components/Loading';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const TYPE_TABS = [
|
||||
@@ -15,6 +16,7 @@ const TYPE_TABS = [
|
||||
];
|
||||
|
||||
export default function PointsDetail() {
|
||||
const modeClass = useElderClass();
|
||||
const { account, refresh: refreshPoints } = usePointsStore();
|
||||
const [transactions, setTransactions] = useState<PointsTransaction[]>([]);
|
||||
const [activeTab, setActiveTab] = useState('');
|
||||
@@ -112,7 +114,7 @@ export default function PointsDetail() {
|
||||
const balance = account?.balance ?? 0;
|
||||
|
||||
return (
|
||||
<View className='detail-page'>
|
||||
<View className={`detail-page ${modeClass}`}>
|
||||
{/* 余额卡片 */}
|
||||
<View className='balance-card'>
|
||||
<Text className='balance-label'>当前积分</Text>
|
||||
|
||||
@@ -1,34 +1,5 @@
|
||||
@import '../../../styles/variables.scss';
|
||||
|
||||
@mixin serif-number {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
@mixin section-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@mixin tag($bg, $color) {
|
||||
display: inline-block;
|
||||
padding: 4px 12px;
|
||||
border-radius: 8px;
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
background: $bg;
|
||||
color: $color;
|
||||
}
|
||||
|
||||
@mixin flex-center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@import '../../../styles/mixins.scss';
|
||||
|
||||
.exchange-page {
|
||||
min-height: 100vh;
|
||||
@@ -58,7 +29,7 @@
|
||||
|
||||
.product-icon-char {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 52px;
|
||||
font-size: var(--tk-font-hero);
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
@@ -69,7 +40,7 @@
|
||||
}
|
||||
|
||||
.product-name {
|
||||
font-size: 32px;
|
||||
font-size: var(--tk-font-num);
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
display: block;
|
||||
@@ -113,19 +84,19 @@
|
||||
}
|
||||
|
||||
.detail-label {
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx2;
|
||||
}
|
||||
|
||||
.detail-value {
|
||||
@include serif-number;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
color: $tx;
|
||||
font-weight: bold;
|
||||
|
||||
&.detail-cost {
|
||||
color: $pri;
|
||||
font-size: 34px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
}
|
||||
|
||||
&.detail-sufficient {
|
||||
@@ -148,12 +119,12 @@
|
||||
|
||||
.notice-title {
|
||||
@include section-title;
|
||||
font-size: 28px;
|
||||
font-size: var(--tk-font-body-lg);
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.notice-text {
|
||||
font-size: 24px;
|
||||
font-size: var(--tk-font-h2);
|
||||
color: $tx3;
|
||||
display: block;
|
||||
line-height: 1.7;
|
||||
@@ -182,19 +153,19 @@
|
||||
}
|
||||
|
||||
.footer-cost-label {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
.footer-cost-num {
|
||||
@include serif-number;
|
||||
font-size: 38px;
|
||||
font-size: var(--tk-font-num-lg);
|
||||
font-weight: bold;
|
||||
color: $pri;
|
||||
}
|
||||
|
||||
.footer-cost-unit {
|
||||
font-size: 22px;
|
||||
font-size: var(--tk-font-body);
|
||||
color: $tx2;
|
||||
margin-left: 4px;
|
||||
}
|
||||
@@ -212,7 +183,7 @@
|
||||
}
|
||||
|
||||
.confirm-btn-text {
|
||||
font-size: 30px;
|
||||
font-size: var(--tk-font-num);
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@@ -8,6 +8,7 @@ import {
|
||||
import type { PointsProduct } from '../../../services/points';
|
||||
import { usePointsStore } from '../../../stores/points';
|
||||
import Loading from '../../../components/Loading';
|
||||
import { useElderClass } from '../../../hooks/useElderClass';
|
||||
import './index.scss';
|
||||
|
||||
const TYPE_INITIAL: Record<string, string> = {
|
||||
@@ -29,6 +30,7 @@ const TYPE_COLOR: Record<string, string> = {
|
||||
};
|
||||
|
||||
export default function ExchangeConfirm() {
|
||||
const modeClass = useElderClass();
|
||||
const [product, setProduct] = useState<PointsProduct | null>(null);
|
||||
const { account, refresh: refreshPoints } = usePointsStore();
|
||||
const [loading, setLoading] = useState(true);
|
||||
@@ -119,7 +121,7 @@ export default function ExchangeConfirm() {
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<View className='exchange-page'>
|
||||
<View className={`exchange-page ${modeClass}`}>
|
||||
<Loading />
|
||||
</View>
|
||||
);
|
||||
@@ -131,7 +133,7 @@ export default function ExchangeConfirm() {
|
||||
const typeColor = TYPE_COLOR[productType] || '#C4623A';
|
||||
|
||||
return (
|
||||
<View className='exchange-page'>
|
||||
<View className={`exchange-page ${modeClass}`}>
|
||||
{/* 商品预览卡片 */}
|
||||
<View className='product-card'>
|
||||
<View
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user