diff --git a/TODO.md b/TODO.md index 31b9243..7798663 100644 --- a/TODO.md +++ b/TODO.md @@ -1,272 +1,29 @@ -# 精品课页面功能改进完成 +# TODO List -## ✅ 已完成功能 +## 已完成任务 +- [x] 调用API里的指南标签接口并集成到筛选功能 +- [x] 为指南列表页面添加scroll-view的上拉加载和下拉刷新功能 +- [x] 为指南列表标题添加超过2行显示省略号功能 +- [x] 修复PPT页面的上拉加载功能 + - [x] 修复页码递增逻辑问题 + - [x] 添加详细的调试日志 + - [x] 添加测试按钮用于手动触发 + - [x] 修复排序功能 -### 🎯 **主横幅板块升级** -1. **多个横幅图片** - 从单个图片改为5个轮播横幅 -2. **自动滑动功能** - 使用swiper组件实现自动轮播 -3. **丰富的内容展示** - 每个横幅包含标题、副标题、专家信息等 -4. **指示器显示** - 底部圆点指示器显示当前页面位置 +## 当前任务 +- [ ] 修复指南列表页面的上拉加载功能 + - [x] 修复页码递增逻辑问题 + - [x] 添加详细的调试日志 + - [x] 添加测试按钮用于手动触发 + - [ ] 测试scroll-view的scrolltolower事件是否正常触发 + - [ ] 检查API返回数据结构是否正确 -### 🎯 **福利课堂板块升级** -1. **多个福利项目** - 从单个横幅改为5个福利项目 -2. **左右滑动功能** - 使用scroll-view实现横向滚动 -3. **丰富的内容展示** - 每个项目包含标题、副标题、讲师、价格等信息 +## 待办任务 +- [ ] 优化页面性能 +- [ ] 添加错误处理机制 +- [ ] 完善用户体验 -### 🎯 **课程详情页面创建** -1. **100%还原设计图** - 完全按照图片设计实现 -2. **完整的页面结构** - 包含所有设计元素和功能 -3. **专业的UI设计** - 符合医疗课程的专业性要求 - -## 📱 **具体实现内容** - -### **主横幅轮播功能** - -#### **数据结构** -- 添加了`bannerList`数组，包含5个横幅项目 -- 每个项目包含：id、title、subtitle、image、link等字段 - -#### **UI组件** -- 使用`swiper`组件实现自动轮播 -- 设置`autoplay="true"`启用自动播放 -- 设置`interval="3000"`每3秒切换一次 -- 设置`duration="500"`切换动画时长500ms -- 设置`indicator-dots="true"`显示指示器 - -#### **样式设计** -- 轮播图高度：300rpx -- 圆角设计：16rpx -- 文字覆盖层：底部渐变背景 -- 文字阴影：提升可读性 - -#### **横幅内容** -1. **小懂医生讲HIV和感染** - 黄湛镰 副主任医师 -2. **肝脏肿瘤临床影像学习** - 王学浩 教授 -3. **慢性肝病营养治疗指南** - 段钟平 教授 -4. **肝移植术后管理要点** - 郑树森 院士 -5. **肝癌早期筛查与预防** - 陈孝平 院士 - -### **福利课堂板块** - -#### **数据结构** -- 添加了`welfareList`数组，包含5个福利项目 -- 每个项目包含：id、title、subtitle、teacher、price、image等字段 - -#### **UI组件** -- 使用`scroll-view`组件实现横向滚动 -- 设置`scroll-x="true"`启用水平滚动 -- 设置`show-scrollbar="false"`隐藏滚动条 - -#### **样式设计** -- 每个福利卡片宽度：400rpx -- 卡片间距：24rpx -- 圆角设计：16rpx -- 阴影效果：0 4rpx 12rpx rgba(0,0,0,0.1) -- 文字溢出处理：ellipsis + nowrap - -#### **交互功能** -- 点击横幅触发`goBannerDetail`方法 -- 点击福利卡片触发`goWelfareDetail`方法 -- 显示Toast提示信息 -- 预留了详情页面跳转接口 - -### **课程详情页面** - -#### **页面结构** -- **自定义导航栏** - 红色标题"课程详情"，左侧返回按钮，右侧分享按钮 -- **主横幅区域** - 400rpx高度，蓝色背景，居中显示课程标题 -- **课程信息区** - 白色背景，显示课程标题、课时信息、返现标签 -- **标签导航栏** - 三个标签：课程介绍（激活）、课程目录、评价(2) -- **课程介绍内容** - 小横幅和6位讲师信息网格布局 -- **底部购买栏** - 固定底部，显示价格¥80.00和立即购买按钮 - -#### **设计细节** -- **导航栏标题**：红色字体，符合医疗主题 -- **主横幅**：蓝色渐变背景，白色文字阴影 -- **返现标签**：红色背景，白色文字 -- **标签导航**：红色下划线指示器 -- **讲师网格**：3列布局，圆形头像，医院信息 -- **购买按钮**：红色主题色，圆角设计 - -#### **讲师信息** -1. **王建设 教授** - 复旦大学附属儿童医院 -2. **黄燕 教授** - 中南大学湘雅医院 -3. **田沂 教授** - 中南大学湘雅二医院 -4. **李教授** - 知名医院 -5. **张教授** - 知名医院 -6. **刘教授** - 知名医院 - -## 🖼️ **图片资源** -- 使用现有的static目录图片 -- 包括：lunbo_bg.png、paper_bg.png、pap_bg.png、bo_bg.png、livebg.png - -## 🚀 **技术特点** - -- ✅ 响应式设计，适配不同屏幕尺寸 -- ✅ 流畅的自动轮播体验 -- ✅ 优雅的横向滚动体验 -- ✅ 优雅的卡片式布局 -- ✅ 完整的数据绑定和事件处理 -- ✅ 符合uniapp最佳实践 -- ✅ 100%还原设计图效果 - -## 📝 **后续优化建议** - -1. **添加分页指示器** - 显示当前滚动位置 -2. **实现手动滑动** - 支持用户手动滑动轮播图 -3. **添加加载动画** - 提升用户体验 -4. **图片懒加载** - 优化性能 -5. **缓存机制** - 减少重复请求 -6. **轮播图暂停** - 触摸时暂停自动播放 -7. **课程目录功能** - 实现课程目录标签页 -8. **评价系统** - 实现评价标签页功能 -9. **购买流程** - 完善购买和支付功能 - -## 🔧 **问题修复记录** - -### **课程跳转功能修复** ✅ -- **问题描述**: 点击课程卡片没有跳转页面，只显示Toast提示 -- **修复内容**: - - 修改`goWelfareDetail`方法，从Toast提示改为页面跳转 - - 修改`goCourseDetail`方法，添加页面跳转功能 - - 修改`goBannerDetail`方法，添加页面跳转功能 - - 给精品小课添加点击事件和跳转方法 - - 给学完返现卡片添加点击事件和跳转方法 -- **跳转目标**: 所有课程相关点击都跳转到`/pages_course/course_detail/course_detail` -- **修复状态**: 已完成，所有课程卡片现在都能正常跳转 - -### **标签导航切换功能修复** ✅ -- **问题描述**: 课程详情页面的标签导航点击没有切换功能 -- **修复内容**: - - 添加`activeTab`状态管理当前激活的标签 - - 实现`switchTab`方法处理标签切换逻辑 - - 为每个标签添加点击事件和动态样式绑定 - - 添加标签切换的反馈提示 -- **功能实现**: - - 课程介绍（默认激活） - - 课程目录（显示开发中提示） - - 评价(2)（显示开发中提示） -- **修复状态**: 已完成，标签导航现在可以正常点击切换 - -### **课程目录功能开发** ✅ -- **功能描述**: 实现完整的课程目录标签页功能 -- **开发内容**: - - 课程概览：总课时、总时长、学习进度 - - 章节列表：3个章节，每个章节包含多个课时 - - 交互功能：章节展开/收起、课时点击 - - 状态管理：未解锁、已解锁、已完成状态 -- **数据结构**: - - `chapterList`：章节数组，包含标题、时长、状态、课时列表 - - `reviewList`：评价数组，包含用户信息、评分、内容、时间 -- **交互方法**: - - `toggleChapter(index)`：切换章节展开状态 - - `goLesson(lesson)`：进入课时学习 -- **UI设计**: - - 课程概览卡片：渐变背景，三列布局 - - 章节卡片：圆角设计，阴影效果，状态标签 - - 课时列表：缩进布局，播放图标，状态显示 -- **开发状态**: 已完成，课程目录功能完全可用 - -### **二级评论功能开发** ✅ -- **功能描述**: 实现完整的二级评论和回复功能 -- **开发内容**: - - 二级评论展示：支持多级回复结构 - - 回复按钮：每个评价都有回复功能 - - 回复输入框：动态显示/隐藏的输入界面 - - 讲师标识：讲师回复显示特殊标签 -- **数据结构**: - - 扩展`reviewList`：每个评价包含`replies`数组 - - 回复对象：包含用户信息、时间、内容、讲师标识 - - 状态管理：`activeReplyId`、`replyText`等 -- **交互方法**: - - `showReplyInput(reviewId)`：显示回复输入框 - - `cancelReply()`：取消回复 - - `submitReply(reviewId)`：提交回复 -- **UI设计**: - - 回复按钮：圆角设计，聊天图标 - - 二级评论：左侧边框，缩进布局 - - 讲师标签：红色背景，白色文字 - - 回复输入框：灰色背景，取消/发送按钮 -- **开发状态**: 已完成，二级评论功能完全可用 - -### **限时优惠模块开发** ✅ -- **功能描述**: 实现完整的限时优惠和倒计时功能 -- **开发内容**: - - 价格展示：当前价格¥39.00，原价¥390.00（划线显示） - - 优惠标签：白色背景的"限时优惠"标签 - - 倒计时功能：实时倒计时显示剩余时间 - - 自动更新：每秒更新倒计时数据 -- **数据结构**: - - `countdown`：包含天、时、分、秒的倒计时对象 - - `countdownTimer`：倒计时定时器引用 -- **交互方法**: - - `startCountdown()`：启动倒计时，计算剩余时间 - - 自动清理：页面卸载时清除定时器 -- **UI设计**: - - 渐变背景：红色到橙色的渐变效果 - - 左侧布局：价格信息和优惠标签（占2/3宽度） - - 右侧布局：倒计时文字和时间显示（占1/3宽度） - - 时间盒子：橙色背景的时分秒显示框 -- **开发状态**: 已完成，限时优惠功能完全可用 - -### **课程评论页面开发** ✅ -- **功能描述**: 创建专门的课程评价提交页面 -- **开发内容**: - - 自定义导航栏：红色"评价课程"标题，左侧返回按钮 - - 星级评分系统：5颗星星，点击选择评分 - - 动态反馈文字：根据评分显示对应的评价反馈 - - 评价输入框：300字限制，多行提示文字 - - 字数统计：实时显示已输入字数/总字数 - - 提交按钮：青色主题色，圆角设计 - - 奖励信息：显示积分奖励说明 -- **具体实现**: - - **评分系统**：1-5星评分，对应不同反馈文字 - - **输入验证**：必须选择评分和填写内容才能提交 - - **页面跳转**：从课程详情页"评价"标签页进入 - - **返回逻辑**：提交成功后自动返回上一页 -- **数据结构**: - - `currentRating`：当前选择的星级评分 - - `reviewContent`：评价内容文本 - - `ratingFeedback`：评分对应的反馈文字 -- **交互方法**: - - `setRating(rating)`：设置星级评分 - - `updateRatingFeedback()`：更新评分反馈文字 - - `submitReview()`：提交评价内容 - - `goToReview()`：跳转到评论页面 -- **UI设计**: - - 导航栏：红色标题，符合医疗主题 - - 星星图标：48rpx大小，黄色填充，灰色未填充 - - 输入框：浅灰色背景，圆角设计，300rpx高度 - - 提交按钮：青色背景，白色文字，88rpx高度 -- **开发状态**: 已完成，课程评论功能完全可用 - -### **我的课程页面开发** ✅ -- **功能描述**: 创建完整的"我的课程"页面，包含标签切换和课程管理 -- **开发内容**: - - 自定义导航栏：红色"我的课程"标题，左侧返回按钮，右侧搜索按钮 - - 标签切换功能：学习中/已学完两个标签，带分隔线设计 - - 课程列表展示：课程图片、标题、课时信息、学习进度 - - 特殊标签显示：福利课堂、学完返现等特殊标识 - - 订单记录浮动按钮：青色圆形按钮，固定位置显示 - - 底部导航栏：精品课（未激活）、我的课程（激活状态） -- **具体实现**: - - **标签系统**：默认激活"学习中"标签，点击切换显示不同课程列表 - - **课程数据结构**：包含id、标题、课时数、状态、已学课时、图片、标签等 - - **响应式布局**：课程卡片自适应，文字溢出处理，标签动态显示 - - **交互功能**：点击课程跳转详情页，点击标签切换内容，底部导航跳转 -- **数据结构**: - - `activeTab`：当前激活的标签（learning/completed） - - `courseList`：按标签分组的课程数据 - - `currentCourseList`：计算属性，根据当前标签返回对应课程列表 -- **交互方法**: - - `switchTab(tab)`：切换标签，更新课程列表显示 - - `goCourseDetail(course)`：跳转到课程详情页面 - - `goOrderRecord()`：进入订单记录功能 - - `goPremiumCourses()`：跳转到精品课页面 -- **UI设计**: - - 导航栏：红色主题色，符合医疗应用风格 - - 标签设计：居中布局，分隔线分隔，激活状态红色高亮 - - 课程卡片：白色背景，圆角设计，阴影效果，左侧图片右侧信息 - - 浮动按钮：青色背景，圆形图标，固定位置，阴影效果 - - 底部导航：红色激活状态，图标+文字布局 -- **开发状态**: 已完成，"我的课程"页面功能完全可用 +## 技术债务 +- [ ] 代码重构和优化 +- [ ] 添加单元测试 +- [ ] 文档更新 diff --git a/api/api.js b/api/api.js index 855bef3..632281b 100644 --- a/api/api.js +++ b/api/api.js @@ -248,7 +248,7 @@ const api = { }, //指南标签 guideTag(data){ - return request('/expertApp/tagList', data, 'post', false); + return request('/expertAPI/tagList', data, 'post', false); }, // 会议列表 @@ -319,7 +319,27 @@ const api = { return request('/expertAPI/newsTagList', data, 'post', false); }, - + meetingListV2U(data){ + return request('/expertAPI/meetingListV2U', data, 'post', false); + }, + applyList(data){ + return request('/expertAPI/applyList', data, 'post', false); + }, + patientListByGBK(data){ + return request('/expertAPI/patientListByGBK', data, 'post', false); + }, + followUpList(data){ + return request('/expertAPI/followUpList', data, 'post', false); + }, + relationRecordLately(data){ + return request('/expertAPI/relationRecordLately', data, 'post', false); + }, + applyListOperate(data){ + return request('/expertAPI/applyListOperate', data, 'post', false); + }, + groupList(data){ + return request('/expertAPI/groupListU', data, 'post', false); + }, } export default api \ No newline at end of file diff --git a/package.json b/package.json index c7fe411..231ecbb 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "dayjs": "^1.11.18", "js-base64": "^3.7.8", "js-md5": "^0.8.3", + "pinyin": "^4.0.0", "uview-plus": "^3.4.73" } } diff --git a/pages.json b/pages.json index 4d5fdd0..2d8faaf 100644 --- a/pages.json +++ b/pages.json @@ -238,6 +238,47 @@ } } }, + { + "path": "patientSetting/patientSetting", + "style": { + "navigationStyle": "custom", + "navigationBarTitleText": "uni-app分页", + "app": { + "bounce": "none" + } + } + }, + { + "path": "patientRemark/patientRemark", + "style": { + "navigationStyle": "custom", + "navigationBarTitleText": "uni-app分页", + "app": { + "bounce": "none" + } + } + }, + { + "path": "groupEdit/groupEdit", + "style": { + "navigationStyle": "custom", + "navigationBarTitleText": "uni-app分页", + "app": { + "bounce": "none" + } + } + }, + { + "path": "selectPatient/selectPatient", + "style": { + "navigationStyle": "custom", + "navigationBarTitleText": "uni-app分页", + "app": { + "bounce": "none" + } + } + }, + { "path": "videoDetail/videoDetail", "style": { diff --git a/pages/live/live.vue b/pages/live/live.vue index 0c12390..3e45f19 100644 --- a/pages/live/live.vue +++ b/pages/live/live.vue @@ -36,8 +36,8 @@ 2025年08月 - - + + {{ item.date }} @@ -47,11 +47,20 @@ {{ item.title }} - + - 预告 + 预告 + 直播中 + 回放 @@ -69,6 +78,15 @@ + + + + + + 暂无会议数据 + 请稍后再试或调整筛选条件 + + @@ -138,10 +156,13 @@ import { ref,nextTick} from 'vue'; import { onShow } from "@dcloudio/uni-app"; import CustomTabbar from '@/components/tabBar/tabBar.vue'; + import api from '@/api/api.js'; import select from "@/static/triangle_normal.png" import selectOn from "@/static/triangle_normal.png" import playImg from "@/static/bofang.png" import timeImg from "@/static/play_long.png" + import docUrl from "@/utils/docUrl" + // 弹窗状态 const isTimePopupShow = ref(false); const isLocationPopupShow = ref(false); @@ -214,32 +235,153 @@ ]); // 会议列表数据 - const meetingList = ref([ - { - date: '13', - tagColor: '#FF4444', - title: '"天山论·见"—疑难危重病患维训练营', - poster: '/static/meeting-poster-1.jpg', - time: '2025.08.13', - location: '线上' - }, - { - date: '13', - tagColor: '#FFA500', - title: '护肝新声大咖谈', - poster: '/static/meeting-poster-2.jpg', - time: '2025.08.13', - location: '线上' - }, - { - date: '15', - tagColor: '#00BCD4', - title: '小罐医生讲HIV和感染｜专题二:抗菌药物-抗真菌药物特性解读', - poster: '/static/meeting-poster-3.jpg', - time: '2025.08.15', - location: '线上' + const meetingList = ref([]); + + // 页面显示时获取会议列表数据 + onShow(() => { + getMeetingList(true); + }); + + // 获取会议列表数据的函数 + const getMeetingList = async (isRefresh = false) => { + if (isRefresh) { + currentPage.value = 1; + hasMoreData.value = true; } - ]); + + const params = { + page: currentPage.value, + pageSize: pageSize.value, + month: selectedMonth.value !== 'all' ? selectedMonth.value : '', + province: selectedProvince.value !== 'all' ? selectedProvince.value : '' + }; + + try { + console.log('获取会议列表参数:', params); + const response = await api.meetingListV2U(params); + console.log('会议列表API响应:', response); + + if (response && response.code === 200 && response.data) { + let newItems = []; + let totalCount = 0; + + // 处理不同的数据结构 + if (response.data.list && Array.isArray(response.data.list)) { + newItems = response.data.list; + totalCount = response.data.total || response.data.totalRow || 0; + console.log('使用 res.data.list 结构'); + } else if (response.data && Array.isArray(response.data)) { + newItems = response.data; + totalCount = response.total || response.totalRow || newItems.length; + console.log('使用 res.data 结构'); + } else if (Array.isArray(response)) { + newItems = response; + totalCount = newItems.length; + console.log('使用 res 数组结构'); + } + + console.log('解析后的数据:', { newItems, totalCount }); + console.log('图片字段映射示例:', newItems.slice(0, 2).map(item => ({ + liveimg: item.liveimg || item.live_image || item.live_img, + poster: item.poster || item.cover_image || item.image + }))); + + if (Array.isArray(newItems) && newItems.length > 0) { + // 处理会议数据，添加必要的字段 + const processedItems = newItems.map(item => ({ + id: item.id || item.meeting_id || Math.random().toString(36).substr(2, 9), + date: item.date || item.meeting_date || item.start_time || '13', + tagColor: getTagColor(item.status || item.meeting_status || 'upcoming'), + title: item.title || item.meeting_title || item.name || '会议标题', + liveimg: item.liveimg || item.live_image || item.live_img || '', + poster: item.poster || item.cover_image || item.image || '/static/meeting-poster-1.jpg', + time: formatMeetingTime(item.start_time || item.meeting_time || item.time), + location: item.location || item.address || item.venue || '线上', + status: item.status || item.meeting_status || 'upcoming', + description: item.description || item.content || '', + organizer: item.organizer || item.host || '', + speakers: item.speakers || item.experts || [] + })); + + if (isRefresh) { + meetingList.value = processedItems; + } else { + meetingList.value.push(...processedItems); + } + + // 检查是否还有更多数据 + if (meetingList.value.length >= totalCount) { + hasMoreData.value = false; + } + + console.log('会议列表更新成功，当前总数:', meetingList.value.length); + console.log('图片字段详情:', processedItems.slice(0, 2).map(item => ({ + id: item.id, + liveimg: item.liveimg, + poster: item.poster, + finalImage: item.liveimg || item.poster + }))); + } else { + console.log('API返回的数据为空'); + if (isRefresh) { + meetingList.value = []; + } + } + } else { + console.log('API响应格式不正确:', response); + if (isRefresh) { + meetingList.value = []; + } + } + } catch (error) { + console.error('获取会议列表失败:', error); + if (isRefresh) { + meetingList.value = []; + } + uni.showToast({ + title: '获取会议列表失败', + icon: 'error', + duration: 2000 + }); + } + }; + + // 根据会议状态获取标签颜色 + const getTagColor = (status) => { + const colorMap = { + 'upcoming': '#FF4444', // 预告 + 'live': '#00BCD4', // 直播中 + 'replay': '#9C27B0', // 回放 + 'finished': '#4CAF50', // 已结束 + 'cancelled': '#FF9800' // 已取消 + }; + return colorMap[status] || '#FF4444'; + }; + + // 格式化会议时间 + const formatMeetingTime = (timeStr) => { + if (!timeStr) return '2025.08.13'; + + try { + // 如果是时间戳 + if (typeof timeStr === 'number') { + const date = new Date(timeStr); + return `${date.getFullYear()}.${String(date.getMonth() + 1).padStart(2, '0')}.${String(date.getDate()).padStart(2, '0')}`; + } + + // 如果是字符串，尝试解析 + const date = new Date(timeStr); + if (!isNaN(date.getTime())) { + return `${date.getFullYear()}.${String(date.getMonth() + 1).padStart(2, '0')}.${String(date.getDate()).padStart(2, '0')}`; + } + + // 如果解析失败，返回原字符串 + return timeStr; + } catch (error) { + console.error('时间格式化失败:', error); + return timeStr; + } + }; // 显示时间选择弹窗 const showTimePopup = () => { @@ -255,7 +397,8 @@ const selectMonth = (month) => { selectedMonth.value = month.value; console.log('选择月份:', month.label); - // 这里可以根据选择的月份筛选会议数据 + // 选择月份后重新加载数据 + getMeetingList(true); hideTimePopup(); }; @@ -273,7 +416,8 @@ const selectProvince = (province) => { selectedProvince.value = province.code; console.log('选择省份:', province.name); - // 这里可以根据选择的省份筛选会议数据 + // 选择省份后重新加载数据 + getMeetingList(true); hideLocationPopup(); }; @@ -283,102 +427,64 @@ // 这里可以实现视频播放逻辑 }; + // 图片加载失败处理 + const onImageError = (e) => { + const itemId = e.currentTarget.dataset.itemId; + console.log('图片加载失败，项目ID:', itemId); + + // 找到对应的项目并设置默认图片 + const itemIndex = meetingList.value.findIndex(item => item.id === itemId); + if (itemIndex !== -1) { + // 如果liveimg加载失败，尝试使用poster + if (meetingList.value[itemIndex].liveimg && meetingList.value[itemIndex].liveimg !== meetingList.value[itemIndex].poster) { + console.log('liveimg加载失败，切换到poster'); + meetingList.value[itemIndex].liveimg = meetingList.value[itemIndex].poster; + } else { + // 如果poster也失败，使用默认图片 + console.log('设置默认图片'); + meetingList.value[itemIndex].poster = '/static/meeting-poster-1.jpg'; + } + } + }; + + // 图片加载成功处理 + const onImageLoad = (e) => { + const itemId = e.currentTarget.dataset.itemId; + console.log('图片加载成功，项目ID:', itemId, '图片地址:', e.currentTarget.src); + }; + // 下拉刷新 const onRefresh = () => { isRefreshing.value = true; currentPage.value = 1; hasMoreData.value = true; - // 模拟网络请求 - setTimeout(() => { - // 重置会议列表为初始数据 - meetingList.value = [ - { - date: '13', - tagColor: '#FF4444', - title: '"天山论·见"—疑难危重病患维训练营', - poster: '/static/meeting-poster-1.jpg', - time: '2025.08.13', - location: '线上' - }, - { - date: '13', - tagColor: '#FFA500', - title: '护肝新声大咖谈', - poster: '/static/meeting-poster-2.jpg', - time: '2025.08.13', - location: '线上' - }, - { - date: '15', - tagColor: '#00BCD4', - title: '小罐医生讲HIV和感染｜专题二:抗菌药物-抗真菌药物特性解读', - poster: '/static/meeting-poster-3.jpg', - time: '2025.08.15', - location: '线上' - } - ]; - isRefreshing.value = false; - uni.showToast({ - title: '刷新成功', - icon: 'success', - duration: 1500 - }); - }, 1500); + // 调用获取会议列表函数 + getMeetingList(true).finally(() => { + // 延迟关闭刷新状态，给用户更好的体验 + setTimeout(() => { + isRefreshing.value = false; + uni.showToast({ + title: '刷新成功', + icon: 'success', + duration: 1500 + }); + }, 500); + }); }; // 上拉加载更多 const onLoadMore = () => { - console.log('上拉加载'); + console.log('上拉加载更多'); if (isLoadingMore.value || !hasMoreData.value) return; isLoadingMore.value = true; currentPage.value++; - // 模拟网络请求 - setTimeout(() => { - // 模拟新增数据 - const newMeetings = [ - { - date: '16', - tagColor: '#9C27B0', - title: '肝胆外科微创技术研讨会', - poster: '/static/meeting-poster-4.jpg', - time: '2025.08.16', - location: '北京' - }, - { - date: '17', - tagColor: '#FF9800', - title: '胆囊疾病诊疗新进展', - poster: '/static/meeting-poster-5.jpg', - time: '2025.08.17', - location: '上海' - }, - { - date: '18', - tagColor: '#4CAF50', - title: '肝移植术后管理专题讲座', - poster: '/static/meeting-poster-6.jpg', - time: '2025.08.18', - location: '广州' - } - ]; - - meetingList.value.push(...newMeetings); - - // 模拟没有更多数据的情况（第3页后） - if (currentPage.value >= 3) { - hasMoreData.value = false; - } - + // 调用API获取更多数据 + getMeetingList(false).finally(() => { isLoadingMore.value = false; - - // 强制更新页面，确保scroll-view可以正常滚动 - nextTick(() => { - console.log('数据加载完成，列表长度:', meetingList.value.length); - }); - }, 1000); + }); }; @@ -701,7 +807,29 @@ $shadow: 0 2px 8px rgba(0,0,0,0.1); position: absolute; top: 16rpx; right: 16rpx; - border: 4rpx solid #fff; + background-color: #FF4444; + color: $white; + font-size: 24rpx; + padding: 4rpx 16rpx; + border-radius: 20rpx; + } + + .live-tag { + position: absolute; + top: 16rpx; + right: 16rpx; + background-color: #00BCD4; + color: $white; + font-size: 24rpx; + padding: 4rpx 16rpx; + border-radius: 20rpx; + } + + .replay-tag { + position: absolute; + top: 16rpx; + right: 16rpx; + background-color: #9C27B0; color: $white; font-size: 24rpx; padding: 4rpx 16rpx; @@ -730,6 +858,31 @@ $shadow: 0 2px 8px rgba(0,0,0,0.1); } } +// 空状态 +.empty-state { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 100rpx 30rpx; + + .empty-icon { + margin-bottom: 30rpx; + } + + .empty-text { + font-size: 32rpx; + color: $gray; + margin-bottom: 16rpx; + } + + .empty-subtext { + font-size: 26rpx; + color: $gray-text; + text-align: center; + } +} + // 加载更多提示 .load-more { padding: 30rpx; diff --git a/pages_app/groupEdit/groupEdit.vue b/pages_app/groupEdit/groupEdit.vue new file mode 100644 index 0000000..b4fadb3 --- /dev/null +++ b/pages_app/groupEdit/groupEdit.vue @@ -0,0 +1,196 @@ + + + + + diff --git a/pages_app/myPatient/myPatient.vue b/pages_app/myPatient/myPatient.vue index 4ccf8cb..a7ceff9 100644 --- a/pages_app/myPatient/myPatient.vue +++ b/pages_app/myPatient/myPatient.vue @@ -24,20 +24,20 @@ -