hookehuyr

refactor(AdPage): 替换手动刷新按钮为步骤说明

将手动刷新按钮和重试按钮替换为网络连接异常的步骤说明,并更新相关样式
...@@ -191,40 +191,22 @@ ...@@ -191,40 +191,22 @@
191 line-height: 1.5; 191 line-height: 1.5;
192 } 192 }
193 193
194 - .refresh-buttons { 194 + .refresh-steps {
195 - display: flex; 195 + text-align: left;
196 - gap: 20rpx; 196 + background: #f8f9fa;
197 - justify-content: center;
198 - }
199 -
200 - .refresh-button {
201 - flex: 1;
202 - padding: 24rpx 32rpx;
203 - background: linear-gradient(135deg, #007aff, #0056cc);
204 - color: white;
205 border-radius: 12rpx; 197 border-radius: 12rpx;
206 - font-size: 32rpx; 198 + padding: 32rpx;
207 - font-weight: 600; 199 + margin-top: 20rpx;
208 - text-align: center;
209 -
210 - &:active {
211 - background: linear-gradient(135deg, #0056cc, #003d99);
212 - transform: scale(0.98);
213 - }
214 } 200 }
215 201
216 - .retry-button-small { 202 + .step-item {
217 - flex: 1; 203 + font-size: 30rpx;
218 - padding: 24rpx 32rpx; 204 + color: #333;
219 - background: #f0f0f0; 205 + line-height: 1.6;
220 - color: #666; 206 + margin-bottom: 16rpx;
221 - border-radius: 12rpx;
222 - font-size: 32rpx;
223 - text-align: center;
224 207
225 - &:active { 208 + &:last-child {
226 - background: #e0e0e0; 209 + margin-bottom: 0;
227 - transform: scale(0.98);
228 } 210 }
229 } 211 }
230 212
......
1 <!-- 1 <!--
2 * @Date: 2022-09-19 14:11:06 2 * @Date: 2022-09-19 14:11:06
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-09-25 21:22:49 4 + * @LastEditTime: 2025-09-26 08:14:03
5 * @FilePath: /lls_program/src/pages/AdPage/index.vue 5 * @FilePath: /lls_program/src/pages/AdPage/index.vue
6 * @Description: 广告页面 6 * @Description: 广告页面
7 --> 7 -->
...@@ -24,11 +24,11 @@ ...@@ -24,11 +24,11 @@
24 <view v-if="showManualRefresh" class="manual-refresh-container"> 24 <view v-if="showManualRefresh" class="manual-refresh-container">
25 <view class="refresh-content"> 25 <view class="refresh-content">
26 <view class="refresh-icon">⚠️</view> 26 <view class="refresh-icon">⚠️</view>
27 - <view class="refresh-title">加载遇到问题</view> 27 + <view class="refresh-title">网络连接异常</view>
28 - <view class="refresh-subtitle">网络可能不稳定,请尝试刷新页面</view> 28 + <view class="refresh-subtitle">请检查网络连接后重新进入小程序</view>
29 - <view class="refresh-buttons"> 29 + <view class="refresh-steps">
30 - <view class="refresh-button" @tap="manualRefresh">刷新页面</view> 30 + <view class="step-item">1. 点击右上角 ⋯ 菜单</view>
31 - <view class="retry-button-small" @tap="retryLoadImage">重试</view> 31 + <view class="step-item">2. 选择"重新进入小程序"</view>
32 </view> 32 </view>
33 </view> 33 </view>
34 </view> 34 </view>
...@@ -181,22 +181,6 @@ const retryLoadImage = () => { ...@@ -181,22 +181,6 @@ const retryLoadImage = () => {
181 }; 181 };
182 182
183 /** 183 /**
184 - * 手动刷新页面
185 - */
186 -const manualRefresh = () => {
187 - // 重置所有状态
188 - retryCount.value = 0;
189 - imageLoading.value = true;
190 - imageLoadError.value = false;
191 - isTimeout.value = false;
192 - showManualRefresh.value = false;
193 - loading.value = true;
194 -
195 - // 重新初始化页面
196 - initializePage();
197 -};
198 -
199 -/**
200 * 开始加载超时检测 184 * 开始加载超时检测
201 */ 185 */
202 const startLoadingTimeout = () => { 186 const startLoadingTimeout = () => {
...@@ -204,7 +188,7 @@ const startLoadingTimeout = () => { ...@@ -204,7 +188,7 @@ const startLoadingTimeout = () => {
204 if (loadingTimeout.value) { 188 if (loadingTimeout.value) {
205 clearTimeout(loadingTimeout.value); 189 clearTimeout(loadingTimeout.value);
206 } 190 }
207 - 191 +
208 // 设置10秒超时 192 // 设置10秒超时
209 loadingTimeout.value = setTimeout(() => { 193 loadingTimeout.value = setTimeout(() => {
210 if (imageLoading.value) { 194 if (imageLoading.value) {
...@@ -249,7 +233,7 @@ const initializePage = async () => { ...@@ -249,7 +233,7 @@ const initializePage = async () => {
249 try { 233 try {
250 // 开始超时检测 234 // 开始超时检测
251 startLoadingTimeout(); 235 startLoadingTimeout();
252 - 236 +
253 // 执行静默授权 237 // 执行静默授权
254 await performSilentAuth(); 238 await performSilentAuth();
255 239
......