Skip to content

Commit 2f3f9dd

Browse files
author
Taois
committed
feat:几个细节优化
1.换源全局loading支持手动关闭 2.切换分类增加分类数据loading 3.目录模式进入的详情页,返回时需要回到目录模式进入前的位置
1 parent 9572a0d commit 2f3f9dd

File tree

4 files changed

+250
-201
lines changed

4 files changed

+250
-201
lines changed

dashboard/src/components/VideoGrid.vue

Lines changed: 10 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -130,6 +130,11 @@ const props = defineProps({
130130
apiUrl: {
131131
type: String,
132132
default: ''
133+
},
134+
// 新增:folder状态信息,用于详情页返回时恢复
135+
folderState: {
136+
type: Object,
137+
default: null
133138
}
134139
});
135140
@@ -154,7 +159,6 @@ const handleVideoClick = async (video) => {
154159
if (video && video.vod_id) {
155160
// 检查是否为folder类型
156161
if (video.vod_tag && video.vod_tag.includes('folder')) {
157-
console.log('VideoGrid检测到folder类型:', video);
158162
// 触发folder导航事件,传递当前点击的视频信息
159163
emit('folder-navigate', {
160164
vod_id: video.vod_id,
@@ -169,14 +173,12 @@ const handleVideoClick = async (video) => {
169173
try {
170174
// 尝试解析vod_id中的JSON字符串获取action配置
171175
const actionConfig = JSON.parse(video.vod_id);
172-
console.log('VideoGrid解析action配置:', actionConfig);
173176
174177
// 传递解析后的action配置给ActionRenderer
175178
currentActionData.value = actionConfig;
176179
showActionRenderer.value = true;
177180
return;
178181
} catch (error) {
179-
console.log('VideoGrid vod_id不是JSON格式,调用T4 action接口:', video.vod_id);
180182
181183
// 如果解析失败,说明vod_id是普通文本,需要调用T4 action接口获取真正的action配置
182184
await handleT4ActionCall(video.vod_id);
@@ -205,6 +207,11 @@ const handleVideoClick = async (video) => {
205207
sourcePic: video.vod_pic
206208
}
207209
210+
// 如果当前在folder模式下,传递folderState用于返回时恢复
211+
if (props.folderState && props.folderState.isActive) {
212+
routeQuery.folderState = JSON.stringify(props.folderState);
213+
}
214+
208215
router.push({
209216
name: 'VideoDetail',
210217
params: { id: video.vod_id },
@@ -225,8 +232,6 @@ const handleT4ActionCall = async (actionName) => {
225232
extend: props.extend.ext
226233
}
227234
);
228-
229-
console.log('result:', result);
230235
231236
// 检查返回结果是否包含action配置
232237
if (result && result.action) {
@@ -289,8 +294,6 @@ const updateScrollAreaHeight = () => {
289294
containerHeight = baseHeight;
290295
}
291296
292-
console.log(`CategoryNavigation高度: ${categoryNavHeight}px, 内容区域高度: ${containerHeight}px`);
293-
294297
// 改进的高度计算逻辑:
295298
// 1. 正确计算网格列数(基于容器宽度)
296299
// 2. 估算内容实际需要的高度
@@ -315,19 +318,16 @@ const updateScrollAreaHeight = () => {
315318
// 对于空数据,需要确保有足够的滚动空间来触发翻页
316319
// 减去更多高度以确保滚动条出现
317320
heightReduction = Math.min(containerHeight * 0.4, 300); // 增加减值比例
318-
console.log(`无视频数据,使用保守高度减值: ${heightReduction}px`);
319321
} else if (estimatedContentHeight < containerHeight) {
320322
// 有数据但内容不足时,需要减少容器高度以触发滚动
321323
// 策略:容器高度 = 内容高度 - 150px(确保有足够滚动空间)
322324
const minDisplayHeight = Math.floor(estimatedItemHeight * 1.2) + 60; // 至少显示1.2行
323325
const idealHeight = estimatedContentHeight - 5; // 增加滚动空间
324326
const targetHeight = Math.max(idealHeight, minDisplayHeight, containerHeight * 0.3); // 降低最小比例
325327
heightReduction = Math.max(containerHeight - targetHeight, 50); // 增加最小减值
326-
console.log(`内容高度不足,估算内容高度: ${estimatedContentHeight}px, 理想高度: ${idealHeight}px, 最小显示高度: ${minDisplayHeight}px, 容器高度: ${containerHeight}px, 调整高度减值: ${heightReduction}px`);
327328
} else {
328329
// 内容充足时,减少一些高度确保滚动正常
329330
heightReduction = Math.min(containerHeight * 0.02, 20);
330-
console.log(`内容充足,使用标准高度减值: ${heightReduction}px`);
331331
}
332332
333333
const newHeight = Math.max(containerHeight - footerHeight - heightReduction, 250); // 降低最小高度
@@ -337,8 +337,6 @@ const updateScrollAreaHeight = () => {
337337
containerHeight = newHeight;
338338
containerHeightRef.value = newHeight;
339339
}
340-
341-
console.log(`视频数量: ${videoCount}, 估算行数: ${estimatedRows}, 列数: ${gridCols}, 容器宽度: ${containerWidth}px, 最终高度: ${newHeight}px`);
342340
} catch (error) {
343341
console.warn('updateScrollAreaHeight error:', error);
344342
} finally {
@@ -506,7 +504,6 @@ const restoreScrollPosition = (scrollPosition) => {
506504
top: scrollPosition,
507505
behavior: 'smooth'
508506
});
509-
console.log('VideoGrid恢复滚动位置:', scrollPosition);
510507
}
511508
});
512509
}
@@ -528,14 +525,11 @@ const handleActionClose = () => {
528525
};
529526
530527
const handleActionSubmit = (result) => {
531-
console.log('Action提交结果:', result);
532528
// 这里可以根据需要处理action的提交结果
533529
// 比如刷新列表、显示消息等
534530
};
535531
536532
const handleSpecialAction = (actionType, actionData) => {
537-
console.log('VideoGrid处理专项动作:', actionType, actionData);
538-
539533
// 将special-action事件传递给父组件处理
540534
emit('special-action', actionType, actionData);
541535

0 commit comments

Comments
 (0)