From 48474197e50b406bddb68eaebb81481a48c16186 Mon Sep 17 00:00:00 2001 From: ZhaoYang <565837861@qq.com> Date: Tue, 24 Feb 2026 18:38:25 +0800 Subject: [PATCH] =?UTF-8?q?=E9=80=9A=E7=9F=A5=E5=85=AC=E5=91=8A=E7=B1=BB?= =?UTF-8?q?=E5=88=AB=EF=BC=8C=E6=90=9C=E7=B4=A2=EF=BC=8C=E8=AF=A6=E6=83=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app.json | 3 +- pages/home/home.wxss | 2 +- pagesA/pages/expertChat/expertChat.wxml | 7 +- pagesA/pages/expertChat/expertChat.wxss | 15 +- pagesA/pages/noticeList/noticeList.js | 298 ++++++-- pagesA/pages/noticeList/noticeList.wxml | 44 +- pagesA/pages/noticeList/noticeList.wxss | 667 ++++++++++-------- .../noticeListDetails/noticeListDetails.js | 100 +++ .../noticeListDetails/noticeListDetails.json | 4 + .../noticeListDetails/noticeListDetails.wxml | 102 +++ .../noticeListDetails/noticeListDetails.wxss | 353 +++++++++ utils/api.js | 14 +- utils/baseUrl.js | 4 +- 13 files changed, 1235 insertions(+), 378 deletions(-) create mode 100644 pagesA/pages/noticeListDetails/noticeListDetails.js create mode 100644 pagesA/pages/noticeListDetails/noticeListDetails.json create mode 100644 pagesA/pages/noticeListDetails/noticeListDetails.wxml create mode 100644 pagesA/pages/noticeListDetails/noticeListDetails.wxss diff --git a/app.json b/app.json index ee7d9be..1eacbdb 100644 --- a/app.json +++ b/app.json @@ -19,7 +19,8 @@ "pages/medicine/medicine", "pages/medicineDetails/medicineDetails", "pages/attestation/attestation", - "pages/noticeList/noticeList" + "pages/noticeList/noticeList", + "pages/noticeListDetails/noticeListDetails" ] }, { diff --git a/pages/home/home.wxss b/pages/home/home.wxss index f136757..5dc7b51 100644 --- a/pages/home/home.wxss +++ b/pages/home/home.wxss @@ -360,7 +360,7 @@ .notice-more { font-size: 24rpx; - color: #96DBD4; + color: #6ddacf; padding: 8rpx 16rpx; background: rgba(150, 219, 212, 0.1); border-radius: 20rpx; diff --git a/pagesA/pages/expertChat/expertChat.wxml b/pagesA/pages/expertChat/expertChat.wxml index 75e4deb..a66fbce 100644 --- a/pagesA/pages/expertChat/expertChat.wxml +++ b/pagesA/pages/expertChat/expertChat.wxml @@ -35,7 +35,7 @@ - + @@ -139,7 +139,7 @@ - + @@ -151,7 +151,6 @@ - 暂无聊天记录，开始咨询吧 @@ -186,7 +185,7 @@ diff --git a/pagesA/pages/expertChat/expertChat.wxss b/pagesA/pages/expertChat/expertChat.wxss index 18ffbef..39db2c5 100644 --- a/pagesA/pages/expertChat/expertChat.wxss +++ b/pagesA/pages/expertChat/expertChat.wxss @@ -366,12 +366,7 @@ color: #999999; } -.empty-icon { - width: 200rpx; - height: 200rpx; - margin-bottom: 30rpx; - opacity: 0.6; -} + .empty-text { font-size: 28rpx; @@ -419,7 +414,7 @@ flex: 1; position: relative; background: #f5f5f5; - border-radius: 36rpx; + border-radius: 10rpx; min-height: 72rpx; display: flex; align-items: center; @@ -500,11 +495,11 @@ .send-btn { background: linear-gradient(135deg, #07c160 0%, #06ae56 100%); width: 112rpx; - height: 72rpx; - border-radius: 36rpx; + height: 66rpx; + border-radius: 10rpx; border: none; display: flex; - align-items: center; + align-items: center;s justify-content: center; transition: all 0.3s ease; padding: 0; diff --git a/pagesA/pages/noticeList/noticeList.js b/pagesA/pages/noticeList/noticeList.js index 378cf0d..15f8e65 100644 --- a/pagesA/pages/noticeList/noticeList.js +++ b/pagesA/pages/noticeList/noticeList.js @@ -1,97 +1,279 @@ import http from '../../../utils/api' + Page({ data: { // 分类数据 - categories: [ - { name: '全部', value: 'all' }, - { name: '系统公告', value: 'system', tagBg: '#e9efff', importanceColor: '#3b82f6' }, - { name: '活动通知', value: 'activity', tagBg: '#f3e8ff', importanceColor: '#8b5cf6' }, - { name: '紧急提醒', value: 'urgent', tagBg: '#ffe4e2', importanceColor: '#ef4444' }, - { name: '学术讲座', value: 'academic', tagBg: '#dcfce7', importanceColor: '#10b981' }, - { name: '校园生活', value: 'campus', tagBg: '#fff3cd', importanceColor: '#f59e0b' }, - ], - currentCategory: 'all', // 当前选中分类 - searchKeyword: '', // 搜索关键字 - noticeList: [], // 渲染列表数据 - pageIndex: 1, // 页码 - pageSize: 8, // 每页条数 - hasMore: true, // 是否有更多 - loading: false, // 首次加载/加载中 - refreshing: false, // 下拉刷新状态 - mockTotal: 28, // 模拟总条数 + categories: [], + currentCategory: '全部', // 当前选中分类 + currentType: '', // 当前选中的分类值 + searchKeyword: '', // 搜索关键字 + noticeList: [], // 渲染列表数据 + pageIndex: 1, // 页码 + pageSize: 8, // 每页条数 + hasMore: true, // 是否有更多 + loading: false, // 加载中 + refreshing: false, // 下拉刷新状态 + total: 0, // 总条数 + searchTimer: null, // 搜索防抖定时器 + isSearching: false, // 是否正在搜索 }, onLoad() { - // this.loadFirstPage(); - this.getdisaster() + this.getwarningType() + this.fetchNotices(true) + }, + + onUnload() { + // 页面卸载时清除定时器 + if (this.data.searchTimer) { + clearTimeout(this.data.searchTimer) + } + }, + + // 获取分类数据 + getwarningType() { + http.warningType({ + data: { + dictType: 'warning_type' + }, + success: res => { + console.log('分类数据:', res) + this.setData({ + categories: res.rows || [] + }) + }, + fail: err => { + console.error('获取分类失败:', err) + } + }) }, + // 获取通知公告列表 + fetchNotices(isRefresh = false) { + const { pageIndex, pageSize, searchKeyword, currentType, loading, hasMore } = this.data - // 通知公告 - getdisaster(){ - http.disaster({ - data:{}, - success: res => { - console.log(111,res); - this.setData({ - noticeList:res.rows - }) - } - }) - }, + // 如果是刷新或者没有更多数据且不是刷新，则返回 + if (!isRefresh && !hasMore) return + if (loading) return + + this.setData({ loading: true }) + + // 构建请求参数 + const params = { + pageNum: isRefresh ? 1 : pageIndex, + pageSize: pageSize, + } + + // 添加搜索关键字（如果有关键字） + if (searchKeyword && searchKeyword.trim() !== '') { + params.keyword = searchKeyword.trim() + } + // 添加分类筛选（如果有分类且不是"全部"） + if (currentType) { + params.warningType = currentType + } + console.log('请求参数:', params, '当前分类:', this.data.currentCategory, '当前类型:', currentType) + http.disaster({ + data: params, + success: res => { + console.log('公告数据:', res) + + const newList = res.rows || [] + const total = res.total || 0 + + this.setData({ + noticeList: isRefresh ? newList : [...this.data.noticeList, ...newList], + total: total, + hasMore: newList.length >= pageSize, + pageIndex: isRefresh ? 2 : pageIndex + 1, + loading: false, + refreshing: false, + isSearching: false + }) + }, + fail: err => { + console.error('获取公告失败:', err) + this.setData({ + loading: false, + refreshing: false, + isSearching: false + }) + wx.showToast({ + title: '加载失败', + icon: 'none' + }) + } + }) + }, // 切换分类 switchCategory(e) { - const category = e.currentTarget.dataset.category; - if (category === this.data.currentCategory) return; - this.setData({ currentCategory: category }); - this.loadFirstPage(); + const category = e.currentTarget.dataset.category + const type = e.currentTarget.dataset.type || '' + + if (category === this.data.currentCategory) return + + console.log('切换分类:', category, type) + + this.setData({ + currentCategory: category, + currentType: type, + pageIndex: 1, + hasMore: true, + noticeList: [] + }, () => { + // 切换分类后立即加载数据（保留当前搜索关键词） + this.fetchNotices(true) + }) }, - // 搜索输入 + // 搜索输入 - 实时搜索 onSearchInput(e) { - this.setData({ searchKeyword: e.detail.value }); + const keyword = e.detail.value + this.setData({ + searchKeyword: keyword, + isSearching: true + }) + + // 清除之前的定时器 + if (this.data.searchTimer) { + clearTimeout(this.data.searchTimer) + } + + // 设置新的定时器，300ms后执行搜索 + const timer = setTimeout(() => { + this.performSearch() + }, 300) + + this.setData({ + searchTimer: timer + }) }, - // 执行搜索（确认或点击清空后也会触发重置） + // 执行搜索 + performSearch() { + const { searchKeyword } = this.data + + console.log('执行搜索:', searchKeyword) + + // 重置列表并加载新数据 + this.setData({ + pageIndex: 1, + hasMore: true, + noticeList: [] + }, () => { + this.fetchNotices(true) + }) + }, + + // 手动搜索（点击确认时） handleSearch() { - this.loadFirstPage(); + // 清除防抖定时器 + if (this.data.searchTimer) { + clearTimeout(this.data.searchTimer) + } + + // 立即执行搜索 + this.setData({ + pageIndex: 1, + hasMore: true, + noticeList: [] + }, () => { + this.fetchNotices(true) + }) }, // 清空搜索框 clearSearch() { - this.setData({ searchKeyword: '' }, () => { - this.loadFirstPage(); - }); + // 清除防抖定时器 + if (this.data.searchTimer) { + clearTimeout(this.data.searchTimer) + } + + this.setData({ + searchKeyword: '', + pageIndex: 1, + hasMore: true, + noticeList: [] + }, () => { + // 清空搜索后重新加载数据（保持当前分类） + this.fetchNotices(true) + }) }, // 上拉加载更多 loadMore() { - const { hasMore, loading, refreshing } = this.data; - if (!hasMore || loading || refreshing) return; - this.setData({ loading: true }); - this.fetchNotices(false); + const { hasMore, loading, refreshing, isSearching } = this.data + if (!hasMore || loading || refreshing || isSearching) return + this.fetchNotices(false) }, // 下拉刷新 onRefresh() { - this.setData({ refreshing: true }); - // 重置到第一页 - this.setData({ pageIndex: 1, hasMore: true }, () => { - this.fetchNotices(true); - }); + // 清除防抖定时器 + if (this.data.searchTimer) { + clearTimeout(this.data.searchTimer) + } + + this.setData({ + refreshing: true, + pageIndex: 1, + hasMore: true + }, () => { + this.fetchNotices(true) + }) }, - // 查看详情 (仅跳转示意) + // 查看详情 viewDetail(e) { - const id = e.currentTarget.dataset.id; - wx.showToast({ - title: `查看公告 ${id}`, - icon: 'none' - }); - // 实际开发: wx.navigateTo... + const id = e.currentTarget.dataset.id + + //跳转详情页 + wx.navigateTo({ + url: `/pagesA/pages/noticeListDetails/noticeListDetails?id=${id}`, + }) + }, + + // 根据重要性获取颜色 + getImportanceColor(level) { + const colorMap = { + '紧急': '#f43f5e', + '重要': '#f97316', + '一般': '#3b82f6' + } + return colorMap[level] || '#3b82f6' + }, + + // 获取标签背景色 + getTagBg(level) { + const bgMap = { + '紧急': '#fee2e2', + '重要': '#fff3e0', + '一般': '#eef2ff' + } + return bgMap[level] || '#eef2ff' + }, + + // 获取级别文字颜色 + getLevelColor(level) { + const colorMap = { + '紧急': '#f43f5e', + '重要': '#f97316', + '一般': '#3b82f6' + } + return colorMap[level] || '#3b82f6' + }, + + // 获取级别背景色 + getLevelBg(level) { + const bgMap = { + '紧急': 'rgba(244, 63, 94, 0.1)', + '重要': 'rgba(249, 115, 22, 0.1)', + '一般': 'rgba(59, 130, 246, 0.1)' + } + return bgMap[level] || 'rgba(59, 130, 246, 0.1)' } }) \ No newline at end of file diff --git a/pagesA/pages/noticeList/noticeList.wxml b/pagesA/pages/noticeList/noticeList.wxml index bed9727..2f0b41b 100644 --- a/pagesA/pages/noticeList/noticeList.wxml +++ b/pagesA/pages/noticeList/noticeList.wxml @@ -1,5 +1,5 @@ - + @@ -22,18 +22,28 @@ - + + + 全部 + + - {{item.name}} - + {{item.dictLabel}} + @@ -68,18 +78,21 @@ data-id="{{item.id}}" > - + {{item.title}} - {{item.warningType}} + {{item.warningType}} - {{item.responseMeasures}} + {{item.responseMeasures || '暂无摘要'}} 📅 {{item.createdTime}} + + {{item.warningLevel || '一般'}} + @@ -87,9 +100,13 @@ - + ⋯ - 加载更多 + 加载中... + + + ↓ + 上拉加载更多 —— 已经到底了 —— @@ -98,9 +115,10 @@ - 📭 暂无相关公告 - 试试其他关键词或分类 + + {{searchKeyword ? '试试其他关键词' : currentCategory !== '全部' ? '试试其他分类' : '暂无数据'}} + diff --git a/pagesA/pages/noticeList/noticeList.wxss b/pagesA/pages/noticeList/noticeList.wxss index b40154b..678d7fb 100644 --- a/pagesA/pages/noticeList/noticeList.wxss +++ b/pagesA/pages/noticeList/noticeList.wxss @@ -1,289 +1,380 @@ .page { - background: linear-gradient(145deg, #f5f7fa 0%, #f0f2f5 100%); - } - .notice-page { - min-height: 100vh; - background: transparent; - position: relative; - font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif; - } - .bg-blur { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: radial-gradient(circle at 20% 30%, rgba(235, 245, 255, 0.7) 0%, rgba(255, 255, 255, 0.9) 70%); - backdrop-filter: blur(20px); - -webkit-backdrop-filter: blur(20px); - z-index: 0; - pointer-events: none; - } - .content { - position: relative; - z-index: 2; - display: flex; - flex-direction: column; - padding: 30rpx 32rpx 0; - box-sizing: border-box; - } - - /* 头部与搜索 */ - .header { - margin-bottom: 36rpx; - } - .title { - font-size: 48rpx; - font-weight: 700; - color: #1e293b; - letter-spacing: 2rpx; - display: block; - margin-bottom: 24rpx; - text-shadow: 0 4rpx 12rpx rgba(0,0,0,0.02); - } - .search-box { - background: rgba(255,255,255,0.7); - backdrop-filter: blur(8px); - -webkit-backdrop-filter: blur(8px); - border-radius: 48rpx; - padding: 16rpx 32rpx; - display: flex; - align-items: center; - border: 1rpx solid rgba(255,255,255,0.9); - box-shadow: 0 8rpx 20rpx rgba(0,0,0,0.02), 0 2rpx 4rpx rgba(0,0,0,0.02); - transition: all 0.2s; - } - .search-box:focus-within { - border-color: #b2d9ff; - background: rgba(255,255,255,0.9); - box-shadow: 0 12rpx 28rpx rgba(0,120,255,0.08); - } - .search-box .icon { - font-size: 32rpx; - color: #7c8ea0; - margin-right: 16rpx; - } - .search-box input { - flex: 1; - font-size: 30rpx; - padding: 8rpx 0; - color: #1e293b; - } - .placeholder { - color: #9aa6b2; - font-weight: 400; - } - .clear-icon { - font-size: 36rpx; - color: #8e9dac; - padding: 8rpx; - border-radius: 50%; - background: rgba(0,0,0,0.02); - width: 40rpx; - height: 40rpx; - display: flex; - align-items: center; - justify-content: center; - } - - /* 分类导航 — 磨砂质感 */ - .category-scroll { - white-space: nowrap; - margin-bottom: 32rpx; - background: rgba(255,255,255,0.5); - backdrop-filter: blur(12px); - -webkit-backdrop-filter: blur(12px); - border-radius: 60rpx; - padding: 8rpx 0; - border: 1rpx solid rgba(255,255,255,0.8); - } - .category-list { - display: inline-flex; - padding: 0 24rpx; - } - .category-item { - display: inline-flex; - flex-direction: column; - align-items: center; - justify-content: center; - padding: 16rpx 36rpx; - margin-right: 12rpx; - border-radius: 60rpx; - font-size: 30rpx; - color: #475569; - background: transparent; - transition: all 0.18s; - position: relative; - font-weight: 500; - } - .category-item.active { - background: #ffffff; - color: #1e4bd2; - font-weight: 600; - box-shadow: 0 6rpx 14rpx rgba(0,80,255,0.1); - } - .dot { - width: 8rpx; - height: 8rpx; - background: #1e4bd2; - border-radius: 50%; - margin-top: 6rpx; - } - - /* 列表容器 */ - .list-container { - flex: 1; - height: calc(100vh - 280rpx); - background: transparent; - border-radius: 40rpx 40rpx 0 0; - margin-top: 8rpx; - } - .notice-scroll { - height: 100%; - padding-bottom: 20rpx; - } - .notice-list { - display: flex; - flex-direction: column; - gap: 28rpx; - } - /* 卡片设计 — 轻盈毛玻璃 */ - .notice-card { - background: rgba(255,255,255,0.7); - backdrop-filter: blur(16px); - -webkit-backdrop-filter: blur(16px); - border-radius: 36rpx; - border: 1rpx solid rgba(255,255,255,0.9); - box-shadow: 0 8rpx 18rpx rgba(0,0,0,0.02); - display: flex; - overflow: hidden; - transition: transform 0.2s, box-shadow 0.3s; - } - .notice-card:active { - transform: scale(0.99); - box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.04); - } - .card-left-bar { - width: 12rpx; - flex-shrink: 0; - background: #3b82f6; - } - .card-content { - flex: 1; - padding: 32rpx 28rpx; - } - .card-header { - display: flex; - align-items: center; - justify-content: space-between; - margin-bottom: 16rpx; - } - .notice-title { - font-size: 34rpx; - font-weight: 600; - color: #0a1e3c; - max-width: 460rpx; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - .notice-tag { - font-size: 24rpx; - padding: 8rpx 24rpx; - border-radius: 48rpx; - background: #eef2ff; - color: #1e4bd2; - font-weight: 500; - letter-spacing: 1rpx; - } - .notice-abstract { - font-size: 28rpx; - color: #55657a; - line-height: 1.5; - margin-bottom: 28rpx; - display: -webkit-box; - -webkit-line-clamp: 2; - -webkit-box-orient: vertical; - overflow: hidden; - text-overflow: ellipsis; - } - .card-footer { - display: flex; - justify-content: space-between; - align-items: center; - color: #778a9b; - font-size: 26rpx; - } - .date-time, .view-count { - display: flex; - align-items: center; - gap: 8rpx; - } - - /* 加载更多 / 状态 */ - .load-more { - text-align: center; - padding: 48rpx 0 36rpx; - color: #8f9eb0; - font-size: 28rpx; - display: flex; - align-items: center; - justify-content: center; - gap: 12rpx; - } - .loading-icon { - font-size: 48rpx; - line-height: 1; - animation: pulse 1.2s infinite; - } - @keyframes pulse { - 0%, 100% { opacity: 0.6; } - 50% { opacity: 1; } - } - - /* 骨架屏 */ - .skeleton-list { - padding: 0 8rpx; - } - .skeleton-item { - background: rgba(255,255,255,0.6); - border-radius: 32rpx; - height: 220rpx; - margin-bottom: 28rpx; - position: relative; - overflow: hidden; - } - .skeleton-item::after { - content: ""; - position: absolute; - top: 0; - left: -150%; - width: 200%; - height: 100%; - background: linear-gradient(90deg, transparent, rgba(255,255,255,0.7), transparent); - animation: shimmer 1.5s infinite; - } - @keyframes shimmer { - 100% { left: 100%; } - } - - /* 空状态 */ - .empty-state { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - padding: 120rpx 0; - color: #6f7d8c; - font-size: 32rpx; - background: rgba(255,255,255,0.4); - backdrop-filter: blur(8px); - border-radius: 48rpx; - margin-top: 60rpx; - } - - /* 模拟图片(无实际图片用文字代替) */ - .empty-state text:first-of-type { - font-size: 64rpx; - margin-bottom: 24rpx; - } \ No newline at end of file + background: linear-gradient(145deg, #f5f7fa 0%, #f0f2f5 100%); +} + +.notice-page { + min-height: 100vh; + background: transparent; + position: relative; + font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif; +} + +.bg-blur { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: radial-gradient(circle at 20% 30%, rgba(235, 245, 255, 0.7) 0%, rgba(255, 255, 255, 0.9) 70%); + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); + z-index: 0; + pointer-events: none; +} + +.content { + position: relative; + z-index: 2; + display: flex; + flex-direction: column; + padding: 30rpx 32rpx 0; + box-sizing: border-box; +} + +/* 头部与搜索 */ +.header { + margin-bottom: 36rpx; +} + +.title { + font-size: 48rpx; + font-weight: 700; + color: #1e293b; + letter-spacing: 2rpx; + display: block; + margin-bottom: 24rpx; + text-shadow: 0 4rpx 12rpx rgba(0,0,0,0.02); +} + +.search-box { + background: rgba(255,255,255,0.7); + backdrop-filter: blur(8px); + -webkit-backdrop-filter: blur(8px); + border-radius: 48rpx; + padding: 16rpx 32rpx; + display: flex; + align-items: center; + border: 1rpx solid rgba(255,255,255,0.9); + box-shadow: 0 8rpx 20rpx rgba(0,0,0,0.02), 0 2rpx 4rpx rgba(0,0,0,0.02); + transition: all 0.2s; +} + +.search-box:focus-within { + border-color: #b2d9ff; + background: rgba(255,255,255,0.9); + box-shadow: 0 12rpx 28rpx rgba(0,120,255,0.08); +} + +.search-box .icon { + font-size: 32rpx; + color: #7c8ea0; + margin-right: 16rpx; +} + +.search-box input { + flex: 1; + font-size: 30rpx; + padding: 8rpx 0; + color: #1e293b; +} + +.placeholder { + color: #9aa6b2; + font-weight: 400; +} + +.clear-icon { + font-size: 36rpx; + color: #8e9dac; + padding: 8rpx; + border-radius: 50%; + background: rgba(0,0,0,0.02); + width: 40rpx; + height: 40rpx; + display: flex; + align-items: center; + justify-content: center; +} + +/* 分类导航 */ +.category-scroll { + white-space: nowrap; + margin-bottom: 32rpx; + background: rgba(255,255,255,0.5); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px); + border-radius: 60rpx; + padding: 8rpx 0; + border: 1rpx solid rgba(255,255,255,0.8); +} + +.category-list { + display: inline-flex; + padding: 0 24rpx; +} + +.category-item { + display: inline-flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 16rpx 36rpx; + margin-right: 12rpx; + border-radius: 60rpx; + font-size: 30rpx; + color: #475569; + background: transparent; + transition: all 0.18s; + position: relative; + font-weight: 500; +} + +.category-item.active { + background: #ffffff; + color: #1e4bd2; + font-weight: 600; + box-shadow: 0 6rpx 14rpx rgba(0,80,255,0.1); +} + +.dot { + width: 8rpx; + height: 8rpx; + background: #1e4bd2; + border-radius: 50%; + margin-top: 6rpx; +} + +/* 列表容器 */ +.list-container { + flex: 1; + height: calc(100vh - 280rpx); + background: transparent; + border-radius: 40rpx 40rpx 0 0; + margin-top: 8rpx; +} + +.notice-scroll { + height: 100%; + padding-bottom: 20rpx; +} + +.notice-list { + display: flex; + flex-direction: column; + gap: 28rpx; +} + +/* 卡片设计 */ +.notice-card { + background: rgba(255,255,255,0.7); + backdrop-filter: blur(16px); + -webkit-backdrop-filter: blur(16px); + border-radius: 36rpx; + border: 1rpx solid rgba(255,255,255,0.9); + box-shadow: 0 8rpx 18rpx rgba(0,0,0,0.02); + display: flex; + overflow: hidden; + transition: transform 0.2s, box-shadow 0.3s; +} + +.notice-card:active { + transform: scale(0.99); + box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.04); +} + +.card-left-bar { + width: 12rpx; + flex-shrink: 0; + background: #3b82f6; +} + +.card-content { + flex: 1; + padding: 32rpx 28rpx; +} + +.card-header { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 16rpx; +} + +.notice-title { + font-size: 34rpx; + font-weight: 600; + color: #0a1e3c; + max-width: 460rpx; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.notice-tag { + font-size: 24rpx; + padding: 8rpx 24rpx; + border-radius: 48rpx; + background: #eef2ff; + color: #1e4bd2; + font-weight: 500; + letter-spacing: 1rpx; +} + +.notice-abstract { + font-size: 28rpx; + color: #55657a; + line-height: 1.5; + margin-bottom: 28rpx; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; +} + +.card-footer { + display: flex; + justify-content: space-between; + align-items: center; + color: #778a9b; + font-size: 26rpx; +} + +.date-time { + display: flex; + align-items: center; + gap: 8rpx; +} + +.warning-level { + font-size: 26rpx; + font-weight: 500; + padding: 4rpx 16rpx; + border-radius: 30rpx; + background: rgba(255,255,255,0.5); +} + +/* 加载更多*/ +.load-more { + text-align: center; + padding: 48rpx 0 36rpx; + color: #8f9eb0; + font-size: 28rpx; + display: flex; + align-items: center; + justify-content: center; + gap: 12rpx; +} + +.loading-icon { + font-size: 48rpx; + line-height: 1; + animation: pulse 1.2s infinite; +} + +@keyframes pulse { + 0%, 100% { opacity: 0.6; } + 50% { opacity: 1; } +} + +/* 骨架屏 */ +.skeleton-list { + padding: 0 8rpx; +} + +.skeleton-item { + background: rgba(255,255,255,0.6); + border-radius: 32rpx; + height: 220rpx; + margin-bottom: 28rpx; + position: relative; + overflow: hidden; +} + +.skeleton-item::after { + content: ""; + position: absolute; + top: 0; + left: -150%; + width: 200%; + height: 100%; + background: linear-gradient(90deg, transparent, rgba(255,255,255,0.7), transparent); + animation: shimmer 1.5s infinite; +} + +@keyframes shimmer { + 100% { left: 100%; } +} + +/* 空状态 */ +.empty-state { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 120rpx 0; + color: #6f7d8c; + font-size: 32rpx; + background: rgba(255,255,255,0.4); + backdrop-filter: blur(8px); + border-radius: 48rpx; + margin-top: 60rpx; +} + + +.empty-state text:first-of-type { + font-size: 64rpx; + margin-bottom: 24rpx; +} + + +.warning-level { + font-size: 26rpx; + font-weight: 500; + padding: 6rpx 20rpx; + border-radius: 30rpx; + background: rgba(59, 130, 246, 0.1); + backdrop-filter: blur(4px); + -webkit-backdrop-filter: blur(4px); +} + +/* 搜索状态提示 */ +.searching-indicator { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background: rgba(0, 0, 0, 0.7); + color: white; + padding: 20rpx 40rpx; + border-radius: 60rpx; + font-size: 28rpx; + z-index: 100; + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); +} + +/* 优化空状态提示 */ +.empty-state { + background: rgba(255, 255, 255, 0.5); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + border-radius: 40rpx; + margin-top: 80rpx; + padding: 80rpx 40rpx; +} + +.empty-state text:first-of-type { + font-size: 60rpx; + margin-bottom: 24rpx; + opacity: 0.8; +} + +.empty-state text:last-of-type { + background: rgba(255, 255, 255, 0.6); + padding: 12rpx 32rpx; + border-radius: 60rpx; + color: #666; + font-size: 28rpx; + margin-top: 24rpx; +} \ No newline at end of file diff --git a/pagesA/pages/noticeListDetails/noticeListDetails.js b/pagesA/pages/noticeListDetails/noticeListDetails.js new file mode 100644 index 0000000..948f1af --- /dev/null +++ b/pagesA/pages/noticeListDetails/noticeListDetails.js @@ -0,0 +1,100 @@ +import http from '../../../utils/api' + +Page({ + data: { + noticeDetail: {}, // 公告详情 + loading: true, // 加载中 + }, + + onLoad(options) { + const { id } = options + if (id) { + this.fetchNoticeDetail(id) + } else { + this.setData({ loading: false }) + wx.showToast({ + title: '参数错误', + icon: 'none' + }) + } + }, + + // 获取公告详情 + fetchNoticeDetail(id) { + http.disasterDetail({ + data: { id }, + success: res => { + console.log('详情数据:', res) + if (res.code === 200 && res.data) { + this.setData({ + noticeDetail: res.data, + loading: false + }) + } else { + this.setData({ loading: false }) + wx.showToast({ + title: res.msg || '数据加载失败', + icon: 'none' + }) + } + }, + fail: err => { + console.error('获取详情失败:', err) + this.setData({ loading: false }) + wx.showToast({ + title: '网络错误', + icon: 'none' + }) + } + }) + }, + + // 返回上一页 + goBack() { + wx.navigateBack({ + delta: 1 + }) + }, + + // 格式化应对措施 + formatMeasures(measures) { + if (!measures) return [] + // 按数字序号分割 + const items = measures.split(/[0-9]+\./).filter(item => item.trim() !== '') + return items.map(item => item.trim()) + }, + + // 获取分类标签背景色 + getTagBg(type) { + const bgMap = { + '天气预警': '#e0f2fe', + '安全提醒': '#f3e8ff', + '通知公告': '#eef2ff', + '重要通知': '#fff3e0', + '紧急通知': '#fee2e2' + } + return bgMap[type] || '#eef2ff' + }, + + // 获取级别标签背景色 + getLevelBg(level) { + const bgMap = { + '紧急': '#fee2e2', + '重要': '#fff3e0', + '通知': '#eef2ff', + '一般': '#f1f5f9' + } + return bgMap[level] || '#f1f5f9' + }, + + // 获取级别文字颜色 + getLevelColor(level) { + const colorMap = { + '紧急': '#b91c1c', + '重要': '#b45309', + '通知': '#1e40af', + '一般': '#334155' + } + return colorMap[level] || '#334155' + } +}) \ No newline at end of file diff --git a/pagesA/pages/noticeListDetails/noticeListDetails.json b/pagesA/pages/noticeListDetails/noticeListDetails.json new file mode 100644 index 0000000..1df38e3 --- /dev/null +++ b/pagesA/pages/noticeListDetails/noticeListDetails.json @@ -0,0 +1,4 @@ +{ + "navigationBarTitleText":"通知公告详情", + "usingComponents": {} +} \ No newline at end of file diff --git a/pagesA/pages/noticeListDetails/noticeListDetails.wxml b/pagesA/pages/noticeListDetails/noticeListDetails.wxml new file mode 100644 index 0000000..ed578d6 --- /dev/null +++ b/pagesA/pages/noticeListDetails/noticeListDetails.wxml @@ -0,0 +1,102 @@ + + + + + + + + 加载中... + + + + + + + + + + + {{noticeDetail.warningType || '通知公告'}} + + + {{noticeDetail.warningLevel}} + + + + + {{noticeDetail.title}} + + + + 📅 + 发布时间：{{noticeDetail.createdTime || noticeDetail.lastUpdated || '未知时间'}} + + + + + + + 📍 + 影响区域 + + + + {{noticeDetail.affectedRegions}} + + + + + + + + 📋 + 简要内容 + + + + + + + + + + 📄 + 详细内容 + + + + + + + + + + 🛡️ + 应对措施 + + + + {{noticeDetail.responseMeasures}} + + + + + + + + + + + + 📭 + 公告不存在或已删除 + + + + \ No newline at end of file diff --git a/pagesA/pages/noticeListDetails/noticeListDetails.wxss b/pagesA/pages/noticeListDetails/noticeListDetails.wxss new file mode 100644 index 0000000..16f358e --- /dev/null +++ b/pagesA/pages/noticeListDetails/noticeListDetails.wxss @@ -0,0 +1,353 @@ +.detail-page { + min-height: 100vh; + background: transparent; + position: relative; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; + } + + .bg-blur { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: linear-gradient(145deg, #f8fafd 0%, #f1f5f9 100%); + z-index: 0; + pointer-events: none; + } + + /* 加载状态 */ + .loading-container { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + display: flex; + flex-direction: column; + align-items: center; + gap: 24rpx; + color: #64748b; + font-size: 28rpx; + } + + .loading-spinner { + width: 80rpx; + height: 80rpx; + border: 4rpx solid #e2e8f0; + border-top-color: #3b82f6; + border-radius: 50%; + animation: spin 1s linear infinite; + } + + @keyframes spin { + to { transform: rotate(360deg); } + } + + /* 滚动内容 */ + .detail-scroll { + height: 100vh; + position: relative; + z-index: 2; + } + + .detail-content { + padding: 24rpx 32rpx 40rpx; + } + + /* 卡片通用样式 */ + .title-card, + .info-card, + .content-card, + .measures-card { + background: rgba(255, 255, 255, 0.9); + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); + border-radius: 32rpx; + padding: 32rpx; + margin-bottom: 24rpx; + box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.02), 0 2rpx 4rpx rgba(0, 0, 0, 0.02); + border: 1rpx solid rgba(255, 255, 255, 0.8); + } + + /* 标题卡片 */ + .title-card { + margin-top: 8rpx; + } + + .category-wrap { + display: flex; + align-items: center; + gap: 16rpx; + margin-bottom: 24rpx; + } + + .category-tag, + .level-tag { + display: inline-block; + padding: 8rpx 24rpx; + border-radius: 60rpx; + font-size: 24rpx; + font-weight: 500; + background: #eef2ff; + } + + .title { + font-size: 44rpx; + font-weight: 700; + color: #0f172a; + line-height: 1.4; + margin-bottom: 24rpx; + display: block; + letter-spacing: 0.5rpx; + } + + .time-info { + display: flex; + align-items: center; + gap: 8rpx; + padding-top: 24rpx; + border-top: 1rpx solid #e2e8f0; + } + + .time-icon { + font-size: 32rpx; + opacity: 0.6; + } + + .time-text { + font-size: 26rpx; + color: #64748b; + } + + /* 卡片头部 */ + .info-header, + .content-header, + .measures-header { + display: flex; + align-items: center; + gap: 12rpx; + margin-bottom: 24rpx; + } + + .info-icon, + .content-icon, + .measures-icon { + font-size: 36rpx; + } + + .info-title, + .content-title, + .measures-title { + font-size: 32rpx; + font-weight: 600; + color: #1e293b; + } + + /* 影响区域 */ + .region-tags { + display: flex; + flex-wrap: wrap; + gap: 16rpx; + } + + .region-tag { + font-size: 28rpx; + display: block; + } + + /* 内容卡片 */ + .brief-content, + .detail-body { + font-size: 32rpx; + color: #334155; + line-height: 1.7; + background: #f8fafc; + padding: 28rpx; + border-radius: 24rpx; + border: 1rpx solid #e2e8f0; + } + + /* 应对措施卡片 */ + .measures-list { + display: flex; + flex-direction: column; + gap: 20rpx; + } + + .measure-item { + display: flex; + align-items: flex-start; + gap: 16rpx; + background: #f8fafc; + padding: 24rpx; + border-radius: 20rpx; + border: 1rpx solid #e2e8f0; + } + + .measure-number { + width: 40rpx; + height: 40rpx; + background: #3b82f6; + color: white; + font-size: 24rpx; + font-weight: 600; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + flex-shrink: 0; + } + + .measure-text { + flex: 1; + font-size: 30rpx; + color: #334155; + line-height: 1.5; + } + + /* 底部留白 */ + .bottom-space { + height: 40rpx; + } + + /* 错误状态 */ + .error-state { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + background: rgba(255, 255, 255, 0.9); + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); + padding: 60rpx 80rpx; + border-radius: 48rpx; + border: 1rpx solid rgba(255, 255, 255, 0.8); + box-shadow: 0 20rpx 40rpx rgba(0, 0, 0, 0.02); + min-width: 500rpx; + } + + .error-emoji { + font-size: 120rpx; + margin-bottom: 24rpx; + opacity: 0.8; + } + + .error-text { + font-size: 32rpx; + color: #475569; + margin-bottom: 48rpx; + } + + .back-btn { + background: #3b82f6; + color: white; + font-size: 30rpx; + padding: 20rpx 60rpx; + border-radius: 48rpx; + border: none; + box-shadow: 0 8rpx 24rpx rgba(59, 130, 246, 0.3); + } + + .back-btn:active { + opacity: 0.8; + transform: scale(0.98); + } + + /* 富文本样式 */ + rich-text { + width: 100%; + } + + rich-text p { + margin-bottom: 16rpx; + } + + rich-text h1, + rich-text h2, + rich-text h3, + rich-text h4 { + font-weight: 600; + color: #0f172a; + margin: 24rpx 0 16rpx; + } + + rich-text h1 { font-size: 40rpx; } + rich-text h2 { font-size: 36rpx; } + rich-text h3 { font-size: 34rpx; } + rich-text h4 { font-size: 32rpx; } + + rich-text ul, + rich-text ol { + padding-left: 40rpx; + margin: 16rpx 0; + } + + rich-text li { + margin-bottom: 8rpx; + color: #334155; + } + + rich-text a { + color: #3b82f6; + text-decoration: underline; + } + + rich-text img { + max-width: 100%; + border-radius: 20rpx; + margin: 20rpx 0; + box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05); + } + + rich-text blockquote { + border-left: 6rpx solid #3b82f6; + background: #f1f5f9; + padding: 20rpx 24rpx; + margin: 20rpx 0; + border-radius: 12rpx; + color: #475569; + font-style: italic; + } + + rich-text table { + width: 100%; + border-collapse: collapse; + margin: 20rpx 0; + background: white; + border-radius: 16rpx; + overflow: hidden; + } + + rich-text td, + rich-text th { + border: 1rpx solid #e2e8f0; + padding: 16rpx; + text-align: left; + } + + rich-text th { + background: #f8fafc; + font-weight: 600; + color: #1e293b; + } + + rich-text code { + background: #f1f5f9; + padding: 4rpx 12rpx; + border-radius: 8rpx; + font-family: monospace; + color: #dc2626; + } + + rich-text pre { + background: #1e293b; + color: #e2e8f0; + padding: 24rpx; + border-radius: 20rpx; + overflow-x: auto; + margin: 20rpx 0; + } \ No newline at end of file diff --git a/utils/api.js b/utils/api.js index 28a97dd..b2097e1 100644 --- a/utils/api.js +++ b/utils/api.js @@ -21,6 +21,11 @@ function disaster(params) { http('/muhu/warning/list', 'get', params) } +// 通知公告详情 +function disasterDetail(params) { + http('/muhu/warning/' + params.data.id, 'get', params) +} + // 地图导航药店诊所 function pharmacy(params) { http('/muhu/info/list', 'get', params) @@ -212,6 +217,12 @@ function feedback(params) { http('/muhu/feedback', 'post', params) } +// 预警类型 +function warningType(params) { + http('/system/dict/data/list', 'get', params) +} + + export default { // 暴露接口 @@ -219,5 +230,6 @@ export default { // 暴露接口 search,trend,feed,sales,wzd,wzdxq,wzdAdd,expertsList,recommendationList,policyeZd, recommendationXq,queryList,tipList,article,articleDetails,articleZd,policyelucidation, areaChildren,userCode,UserInfo,videoList,videoZd,videoDetails,forumList,forumAdd,forumDetails, - forumReply,commentReply,experience,experiencezd,experienceDetails,realName,revise,feedback + forumReply,commentReply,experience,experiencezd,experienceDetails,realName,revise,feedback, + warningType,disasterDetail } diff --git a/utils/baseUrl.js b/utils/baseUrl.js index 79483b5..3de0bb9 100644 --- a/utils/baseUrl.js +++ b/utils/baseUrl.js @@ -1,5 +1,5 @@ -var baseUrl = 'https://wx.chenhaitech.com/ymtx-prod-api' -// var baseUrl = 'http://192.168.101.109:8080' +// var baseUrl = 'https://wx.chenhaitech.com/ymtx-prod-api' +var baseUrl = 'http://192.168.101.109:8080' // var baseUrl = 'http://192.168.101.105:8082' // var baseUrl = 'http://192.168.101.111:8081' module.exports = baseUrl