From b2c6d9c8c8bc72e833e1b90e09c7836567d5a975 Mon Sep 17 00:00:00 2001 From: iven Date: Sun, 10 May 2026 16:23:17 +0800 Subject: [PATCH] =?UTF-8?q?feat(miniprogram):=20=E8=AE=BF=E5=AE=A2?= =?UTF-8?q?=E9=A6=96=E9=A1=B5=E8=BD=AE=E6=92=AD=E5=9B=BE=E6=8E=A5=E5=85=A5?= =?UTF-8?q?=E5=85=AC=E5=BC=80=20API=20+=20=E6=96=87=E7=AB=A0=E5=88=97?= =?UTF-8?q?=E8=A1=A8=E6=9B=BF=E6=8D=A2=E6=A0=B8=E5=BF=83=E5=8A=9F=E8=83=BD?= =?UTF-8?q?=E5=8C=BA=E5=9F=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/miniprogram/src/pages/index/index.scss | 28 ++++- apps/miniprogram/src/pages/index/index.tsx | 119 ++++++++++++++++---- 2 files changed, 122 insertions(+), 25 deletions(-) diff --git a/apps/miniprogram/src/pages/index/index.scss b/apps/miniprogram/src/pages/index/index.scss index 24d5060..8aa77de 100644 --- a/apps/miniprogram/src/pages/index/index.scss +++ b/apps/miniprogram/src/pages/index/index.scss @@ -339,6 +339,19 @@ &--1 { background: linear-gradient(135deg, $pri-d 0%, $pri 60%, $pri-l 100%); } + &--2 { + background: linear-gradient(135deg, $acc 0%, #3D5A40 60%, $acc-l 100%); + } + &--3 { + background: linear-gradient(135deg, #8B6F4E 0%, $wrn 60%, $wrn-l 100%); + } +} + +.guest-slide-image { + position: absolute; + inset: 0; + width: 100%; + height: 100%; } .guest-slide:nth-child(2) .guest-slide-bg { @@ -397,14 +410,27 @@ .guest-article-card { background: $card; border-radius: $r; - padding: 16px 18px; + overflow: hidden; box-shadow: $shadow-sm; + display: flex; &:active { opacity: 0.85; } } +.guest-article-cover { + width: 100px; + height: 80px; + flex-shrink: 0; +} + +.guest-article-body { + padding: 12px 14px; + flex: 1; + min-width: 0; +} + .guest-article-title { font-size: var(--tk-font-body-sm); font-weight: 600; diff --git a/apps/miniprogram/src/pages/index/index.tsx b/apps/miniprogram/src/pages/index/index.tsx index 34799ff..efe6854 100644 --- a/apps/miniprogram/src/pages/index/index.tsx +++ b/apps/miniprogram/src/pages/index/index.tsx @@ -1,5 +1,5 @@ -import { View, Text, Swiper, SwiperItem } from '@tarojs/components'; -import { useState, useCallback } from 'react'; +import { View, Text, Swiper, SwiperItem, Image } from '@tarojs/components'; +import { useState } from 'react'; import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro'; import { useAuthStore } from '../../stores/auth'; import { useUIStore } from '../../stores/ui'; @@ -12,6 +12,8 @@ import * as appointmentApi from '@/services/appointment'; import * as followupApi from '@/services/followup'; import { listPendingSuggestions, type AiSuggestionItem } from '@/services/ai-analysis'; import { notificationService } from '@/services/notification'; +import { api } from '@/services/request'; +import type { Article } from '@/services/article'; import './index.scss'; interface ReminderItem { @@ -21,15 +23,62 @@ interface ReminderItem { tag: string; } +interface PublicBanner { + id: string; + title?: string; + subtitle?: string; + image_url?: string; + link_type?: string; + link_target?: string; +} + // ─── 访客首页 ─── -const CAROUSEL_SLIDES = [ - { id: 'slide-1', title: '专业血透中心', desc: '三甲级医护团队全程守护' }, - { id: 'slide-2', title: '智慧健康管理', desc: 'AI 驱动个性化健康方案' }, - { id: 'slide-3', title: '温馨就医环境', desc: '舒适安全的治疗体验' }, +const FALLBACK_SLIDES = [ + { id: 'slide-1', title: '专业血透中心', desc: '三甲级医护团队全程守护', image_url: '' }, + { id: 'slide-2', title: '智慧健康管理', desc: 'AI 驱动个性化健康方案', image_url: '' }, + { id: 'slide-3', title: '温馨就医环境', desc: '舒适安全的治疗体验', image_url: '' }, ]; function GuestHome({ modeClass }: { modeClass: string }) { + const [banners, setBanners] = useState([]); + const [articles, setArticles] = useState([]); + + useDidShow(() => { + loadPublicData(); + }); + + const loadPublicData = async () => { + const tenantId = Taro.getStorageSync('tenant_id'); + if (!tenantId) { + setBanners(FALLBACK_SLIDES); + return; + } + try { + const [bannerData, articleData] = await Promise.allSettled([ + api.get('/public/banners', { tenant_id: tenantId }, 300_000), + api.get<{ data: Article[]; total: number }>('/health/articles', { + status: 'published', + page_size: 4, + }, 300_000), + ]); + + if (bannerData.status === 'fulfilled' && bannerData.value?.length > 0) { + setBanners(bannerData.value); + } else { + setBanners(FALLBACK_SLIDES); + } + + if (articleData.status === 'fulfilled' && articleData.value?.data?.length > 0) { + setArticles(articleData.value.data); + } + } catch { + setBanners(FALLBACK_SLIDES); + } + }; + + const slides = banners.length > 0 ? banners : FALLBACK_SLIDES; + return ( {/* 轮播图 */} @@ -43,36 +92,58 @@ function GuestHome({ modeClass }: { modeClass: string }) { interval={4000} duration={500} > - {CAROUSEL_SLIDES.map((slide) => ( - + {slides.map((slide, idx) => ( + - + {slide.image_url ? ( + + ) : ( + + )} {slide.title} - {slide.desc} + {slide.subtitle || slide.desc} ))} - {/* 功能亮点 */} + {/* 推荐文章（替换原来的"核心功能"区域） */} - 核心功能 - - - 健康数据管理 - 记录并追踪您的体征数据 + 健康资讯 + {articles.length > 0 ? ( + + {articles.map((article) => ( + + {article.cover_image && ( + + )} + + {article.title} + + {article.summary || '点击查看详情'} + + + + ))} - - 智能预约排班 - 在线预约透析和治疗 + ) : ( + + + 健康数据管理 + 记录并追踪您的体征数据 + + + 智能预约排班 + 在线预约透析和治疗 + + + AI 健康分析 + 个性化健康趋势解读 + - - AI 健康分析 - 个性化健康趋势解读 - - + )} {/* 底部登录引导 */}