ZhaoYang
2 months ago
13 changed files with 1235 additions and 378 deletions
-
3app.json
-
2pages/home/home.wxss
-
7pagesA/pages/expertChat/expertChat.wxml
-
15pagesA/pages/expertChat/expertChat.wxss
-
274pagesA/pages/noticeList/noticeList.js
-
44pagesA/pages/noticeList/noticeList.wxml
-
101pagesA/pages/noticeList/noticeList.wxss
-
100pagesA/pages/noticeListDetails/noticeListDetails.js
-
4pagesA/pages/noticeListDetails/noticeListDetails.json
-
102pagesA/pages/noticeListDetails/noticeListDetails.wxml
-
353pagesA/pages/noticeListDetails/noticeListDetails.wxss
-
14utils/api.js
-
4utils/baseUrl.js
@ -1,97 +1,279 @@ |
|||||
import http from '../../../utils/api' |
import http from '../../../utils/api' |
||||
|
|
||||
Page({ |
Page({ |
||||
data: { |
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', // 当前选中分类
|
|
||||
|
categories: [], |
||||
|
currentCategory: '全部', // 当前选中分类
|
||||
|
currentType: '', // 当前选中的分类值
|
||||
searchKeyword: '', // 搜索关键字
|
searchKeyword: '', // 搜索关键字
|
||||
noticeList: [], // 渲染列表数据
|
noticeList: [], // 渲染列表数据
|
||||
pageIndex: 1, // 页码
|
pageIndex: 1, // 页码
|
||||
pageSize: 8, // 每页条数
|
pageSize: 8, // 每页条数
|
||||
hasMore: true, // 是否有更多
|
hasMore: true, // 是否有更多
|
||||
loading: false, // 首次加载/加载中
|
|
||||
|
loading: false, // 加载中
|
||||
refreshing: false, // 下拉刷新状态
|
refreshing: false, // 下拉刷新状态
|
||||
mockTotal: 28, // 模拟总条数
|
|
||||
|
total: 0, // 总条数
|
||||
|
searchTimer: null, // 搜索防抖定时器
|
||||
|
isSearching: false, // 是否正在搜索
|
||||
}, |
}, |
||||
|
|
||||
onLoad() { |
onLoad() { |
||||
// this.loadFirstPage();
|
|
||||
this.getdisaster() |
|
||||
|
this.getwarningType() |
||||
|
this.fetchNotices(true) |
||||
}, |
}, |
||||
|
|
||||
|
onUnload() { |
||||
|
// 页面卸载时清除定时器
|
||||
|
if (this.data.searchTimer) { |
||||
|
clearTimeout(this.data.searchTimer) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
// 通知公告
|
|
||||
getdisaster(){ |
|
||||
http.disaster({ |
|
||||
data:{}, |
|
||||
|
// 获取分类数据
|
||||
|
getwarningType() { |
||||
|
http.warningType({ |
||||
|
data: { |
||||
|
dictType: 'warning_type' |
||||
|
}, |
||||
success: res => { |
success: res => { |
||||
console.log(111,res); |
|
||||
|
console.log('分类数据:', res) |
||||
this.setData({ |
this.setData({ |
||||
noticeList:res.rows |
|
||||
|
categories: res.rows || [] |
||||
}) |
}) |
||||
|
}, |
||||
|
fail: err => { |
||||
|
console.error('获取分类失败:', err) |
||||
} |
} |
||||
}) |
}) |
||||
}, |
}, |
||||
|
|
||||
|
// 获取通知公告列表
|
||||
|
fetchNotices(isRefresh = false) { |
||||
|
const { pageIndex, pageSize, searchKeyword, currentType, loading, hasMore } = this.data |
||||
|
|
||||
|
// 如果是刷新或者没有更多数据且不是刷新，则返回
|
||||
|
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) { |
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) { |
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() { |
handleSearch() { |
||||
this.loadFirstPage(); |
|
||||
|
// 清除防抖定时器
|
||||
|
if (this.data.searchTimer) { |
||||
|
clearTimeout(this.data.searchTimer) |
||||
|
} |
||||
|
|
||||
|
// 立即执行搜索
|
||||
|
this.setData({ |
||||
|
pageIndex: 1, |
||||
|
hasMore: true, |
||||
|
noticeList: [] |
||||
|
}, () => { |
||||
|
this.fetchNotices(true) |
||||
|
}) |
||||
}, |
}, |
||||
|
|
||||
// 清空搜索框
|
// 清空搜索框
|
||||
clearSearch() { |
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() { |
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() { |
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) { |
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)' |
||||
} |
} |
||||
}) |
}) |
||||
@ -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' |
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,4 @@ |
|||||
|
{ |
||||
|
"navigationBarTitleText":"通知公告详情", |
||||
|
"usingComponents": {} |
||||
|
} |
||||
@ -0,0 +1,102 @@ |
|||||
|
<view class="detail-page"> |
||||
|
<!-- 背景 --> |
||||
|
<view class="bg-blur"></view> |
||||
|
|
||||
|
<!-- 加载中状态 --> |
||||
|
<view class="loading-container" wx:if="{{loading}}"> |
||||
|
<view class="loading-spinner"></view> |
||||
|
<text>加载中...</text> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 主要内容 --> |
||||
|
<scroll-view |
||||
|
class="detail-scroll" |
||||
|
scroll-y |
||||
|
enhanced |
||||
|
show-scrollbar="{{false}}" |
||||
|
wx:else |
||||
|
> |
||||
|
<view class="detail-content" wx:if="{{noticeDetail.id}}"> |
||||
|
<!-- 标题卡片 --> |
||||
|
<view class="title-card"> |
||||
|
<!-- 分类标签 --> |
||||
|
<view class="category-wrap"> |
||||
|
<view class="category-tag" style="background: {{getTagBg(noticeDetail.warningType)}}; color: {{getLevelColor(noticeDetail.warningLevel)}};"> |
||||
|
{{noticeDetail.warningType || '通知公告'}} |
||||
|
</view> |
||||
|
<view class="level-tag" style="background: {{getLevelBg(noticeDetail.warningLevel)}}; color: {{getLevelColor(noticeDetail.warningLevel)}};"> |
||||
|
{{noticeDetail.warningLevel}} |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 标题 --> |
||||
|
<text class="title">{{noticeDetail.title}}</text> |
||||
|
|
||||
|
<!-- 时间信息 --> |
||||
|
<view class="time-info"> |
||||
|
<text class="time-icon">📅</text> |
||||
|
<text class="time-text">发布时间：{{noticeDetail.createdTime || noticeDetail.lastUpdated || '未知时间'}}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 影响区域卡片 --> |
||||
|
<view class="info-card" wx:if="{{noticeDetail.affectedRegions}}"> |
||||
|
<view class="info-header"> |
||||
|
<text class="info-icon">📍</text> |
||||
|
<text class="info-title">影响区域</text> |
||||
|
</view> |
||||
|
<view class="region-tags"> |
||||
|
<text class="region-tag"> |
||||
|
{{noticeDetail.affectedRegions}} |
||||
|
</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 简要内容卡片 --> |
||||
|
<view class="content-card" wx:if="{{noticeDetail.briefContent}}"> |
||||
|
<view class="content-header"> |
||||
|
<text class="content-icon">📋</text> |
||||
|
<text class="content-title">简要内容</text> |
||||
|
</view> |
||||
|
<view class="brief-content"> |
||||
|
<rich-text nodes="{{noticeDetail.briefContent}}" space="emsp"></rich-text> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 详细内容卡片 --> |
||||
|
<view class="content-card" wx:if="{{noticeDetail.detailContent}}"> |
||||
|
<view class="content-header"> |
||||
|
<text class="content-icon">📄</text> |
||||
|
<text class="content-title">详细内容</text> |
||||
|
</view> |
||||
|
<view class="detail-body"> |
||||
|
<rich-text nodes="{{noticeDetail.detailContent}}" space="emsp"></rich-text> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 应对措施卡片 --> |
||||
|
<view class="measures-card" wx:if="{{noticeDetail.responseMeasures}}"> |
||||
|
<view class="measures-header"> |
||||
|
<text class="measures-icon">🛡️</text> |
||||
|
<text class="measures-title">应对措施</text> |
||||
|
</view> |
||||
|
<view class="measures-list"> |
||||
|
<view class="measure-item" > |
||||
|
<text class="measure-text">{{noticeDetail.responseMeasures}}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 底部留白 --> |
||||
|
<view class="bottom-space"></view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 错误状态 --> |
||||
|
<view class="error-state" wx:else> |
||||
|
<image src="/images/empty-notice.png" mode="aspectFit" style="width: 240rpx; height: 240rpx;" wx:if="{{false}}"></image> |
||||
|
<text class="error-emoji">📭</text> |
||||
|
<text class="error-text">公告不存在或已删除</text> |
||||
|
<button class="back-btn" bindtap="goBack">返回列表</button> |
||||
|
</view> |
||||
|
</scroll-view> |
||||
|
</view> |
||||
@ -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; |
||||
|
} |
||||
@ -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.105:8082'
|
||||
// var baseUrl = 'http://192.168.101.111:8081'
|
// var baseUrl = 'http://192.168.101.111:8081'
|
||||
module.exports = baseUrl |
module.exports = baseUrl |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue