fix(Activities): 修复错误状态处理并添加返回按钮
- 移除错误状态下的默认URL回退逻辑,改为显示错误提示 - 在错误状态中添加返回按钮,提供更好的用户体验 - 优化错误状态下的按钮布局样式
Showing
1 changed file
with
38 additions
and
12 deletions
| ... | @@ -16,11 +16,14 @@ | ... | @@ -16,11 +16,14 @@ |
| 16 | <view class="loading-text">加载中...</view> | 16 | <view class="loading-text">加载中...</view> |
| 17 | </view> | 17 | </view> |
| 18 | 18 | ||
| 19 | - <!---but态 --> | 19 | + <!-- 错误状态 --> |
| 20 | <view v-if="error" class="error-container"> | 20 | <view v-if="error" class="error-container"> |
| 21 | <view class="error-icon">⚠️</view> | 21 | <view class="error-icon">⚠️</view> |
| 22 | <view class="error-text">页面加载失败</view> | 22 | <view class="error-text">页面加载失败</view> |
| 23 | - <nut-button type="primary" size="small" @click="handleRetry">重试</nut-button> | 23 | + <view class="error-buttons"> |
| 24 | + <nut-button type="primary" size="small" @click="handleRetry">重试</nut-button> | ||
| 25 | + <nut-button type="default" size="small" @click="handleGoBack">返回</nut-button> | ||
| 26 | + </view> | ||
| 24 | </view> | 27 | </view> |
| 25 | 28 | ||
| 26 | <!-- 底部导航 --> | 29 | <!-- 底部导航 --> |
| ... | @@ -84,12 +87,22 @@ const handleMessage = (e) => { | ... | @@ -84,12 +87,22 @@ const handleMessage = (e) => { |
| 84 | const handleRetry = () => { | 87 | const handleRetry = () => { |
| 85 | loading.value = true | 88 | loading.value = true |
| 86 | error.value = false | 89 | error.value = false |
| 87 | - // 重新设置URL触发重新加载 | 90 | + // 重新初始化页面数据 |
| 88 | - const currentUrl = webUrl.value | 91 | + initPageData() |
| 89 | - webUrl.value = '' | 92 | +} |
| 90 | - setTimeout(() => { | 93 | + |
| 91 | - webUrl.value = currentUrl | 94 | +/** |
| 92 | - }, 100) | 95 | + * 返回上一页 |
| 96 | + */ | ||
| 97 | +const handleGoBack = () => { | ||
| 98 | + Taro.navigateBack({ | ||
| 99 | + delta: 1 | ||
| 100 | + }).catch(() => { | ||
| 101 | + // 如果无法返回,则跳转到首页 | ||
| 102 | + Taro.switchTab({ | ||
| 103 | + url: '/pages/Dashboard/index' | ||
| 104 | + }) | ||
| 105 | + }) | ||
| 93 | } | 106 | } |
| 94 | 107 | ||
| 95 | /** | 108 | /** |
| ... | @@ -115,8 +128,14 @@ const initPageData = async () => { | ... | @@ -115,8 +128,14 @@ const initPageData = async () => { |
| 115 | console.log('获取到的地图URL:', baseUrl.value) | 128 | console.log('获取到的地图URL:', baseUrl.value) |
| 116 | } else { | 129 | } else { |
| 117 | console.error('获取地图URL失败:', mapUrlResponse.msg) | 130 | console.error('获取地图URL失败:', mapUrlResponse.msg) |
| 118 | - // 使用默认URL作为备用 | 131 | + // 显示错误提示,不使用默认URL |
| 119 | - baseUrl.value = 'https://oa.onwall.cn/f/map/#/checkin/?id=2400107' | 132 | + error.value = true |
| 133 | + loading.value = false | ||
| 134 | + Taro.showToast({ | ||
| 135 | + title: mapUrlResponse.msg || '获取地图信息失败', | ||
| 136 | + icon: 'none' | ||
| 137 | + }) | ||
| 138 | + return | ||
| 120 | } | 139 | } |
| 121 | 140 | ||
| 122 | // 获取用户信息 | 141 | // 获取用户信息 |
| ... | @@ -136,8 +155,9 @@ const initPageData = async () => { | ... | @@ -136,8 +155,9 @@ const initPageData = async () => { |
| 136 | } | 155 | } |
| 137 | } catch (error) { | 156 | } catch (error) { |
| 138 | console.error('初始化页面数据失败:', error) | 157 | console.error('初始化页面数据失败:', error) |
| 139 | - // 使用默认URL作为备用 | 158 | + // 显示错误状态,不使用默认URL |
| 140 | - baseUrl.value = 'https://oa.onwall.cn/f/map/#/checkin/?id=2400107' | 159 | + error.value = true |
| 160 | + loading.value = false | ||
| 141 | 161 | ||
| 142 | Taro.showToast({ | 162 | Taro.showToast({ |
| 143 | title: '获取地图信息失败', | 163 | title: '获取地图信息失败', |
| ... | @@ -221,4 +241,10 @@ onMounted(async () => { | ... | @@ -221,4 +241,10 @@ onMounted(async () => { |
| 221 | color: #666; | 241 | color: #666; |
| 222 | margin-bottom: 32rpx; | 242 | margin-bottom: 32rpx; |
| 223 | } | 243 | } |
| 244 | + | ||
| 245 | +.error-buttons { | ||
| 246 | + display: flex; | ||
| 247 | + gap: 24rpx; | ||
| 248 | + align-items: center; | ||
| 249 | +} | ||
| 224 | </style> | 250 | </style> | ... | ... |
-
Please register or login to post a comment