sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改部分显示逻辑

master
于肖磊 2026-02-13 10:14:18 +08:00
parent 7ec5dccc85
commit 85f1af5f86
4 changed files with 135 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
pages/plugins/video/detail/detail.vue
View File

@ -88,7 +88,7 @@
<!-- 评论弹窗 -->
<view v-if="show_comment_modal" class="comment-modal" @tap="close_comment_modal">
<view class="comment-content" :style="commentContentStyle" @tap.stop @touchstart="handle_comment_touch_start" @touchmove="handle_comment_touch_move" @touchend="handle_comment_touch_end">
<view class="comment-content bottom-line-exclude-bottom" :style="commentContentStyle" @tap.stop @touchstart="handle_comment_touch_start" @touchmove="handle_comment_touch_move" @touchend="handle_comment_touch_end">
<view class="comment-header">
<text class="comment-count">评论</text>
<view class="close-btn" @tap="close_comment_modal">✕</view>
@ -168,7 +168,7 @@
<!-- 主要内容区域 -->
<view class="report-body">
<!-- 第一层：举报原因选择 -->
<view class="report-section">
<view v-if="report_type_list.length > 0" class="report-section">
<view class="report-label">举报原因<text class="ml-10">*</text></view>
<view class="flex-row align-c gap-10 flex-wrap">
<view v-for="(mainItem, main_index) in report_type_list" :key="main_index" class="flex-row align-c" :data-index="main_index" @tap="select_main_reason">
@ -181,7 +181,7 @@
</view>
<!-- 第二层：具体类型选择（当有主类别选中时显示） -->
<view class="report-section mt-20" v-if="current_main_index >= 0">
<view class="report-section mt-20" v-if="current_main_index >= 0 && report_type_list[current_main_index]">
<view class="report-label">请选择具体的类型<text class="ml-10">*</text></view>
<view class="flex-row align-c gap-10 flex-wrap">
<view v-for="(subItem, sub_index) in report_type_list[current_main_index].data" :key="sub_index" class="flex-row align-c" :data-index="sub_index" @tap="select_sub_reason">
@ -297,7 +297,11 @@
},
// 如果是第一个或者最后一个的情况下，取消无限轮播
close_circular() {
return this.video_data_list[0].id == this.current_video_id || this.video_data_list[this.video_data_list.length - 1].id == this.current_video_id;
if (this.video_data_list.length > 0) {
return this.video_data_list[0].id == this.current_video_id || this.video_data_list[this.video_data_list.length - 1].id == this.current_video_id;
} else {
return true
}
}
},
onLoad(params) {
@ -475,13 +479,22 @@
this.display_video_list.forEach((item, index) => {
this.create_video_contexts[index] = uni.createVideoContext(`video_${index}`, this);
//#ifdef H5
this.video_contexts[index] = document.getElementById(`video_${index}`).querySelector('video');
//#endif
});
setTimeout(() => {
//#ifdef H5
if (this.video_contexts[0]) { // 当前播放的视频索引为0
this.video_play_event(this.video_contexts[0], true);
}
//#endif
//#ifndef H5
if (this.create_video_contexts[0]) { // 当前播放的视频索引为0
this.video_play_event(this.create_video_contexts[0], true);
}
//#endif
}, 200);
}, 0);
}
@ -656,9 +669,14 @@
try {
if (is_first_play) {
//#ifdef H5
videoContext.play().catch((error) => {
this.setData({ paused: true });
});
//#endif
//#ifndef H5
videoContext.play();
//#endif
} else {
videoContext.play();
}
@ -993,6 +1011,11 @@
page: 0,
sub_comments: [],
})
this.video_data_list.forEach(item => {
if (item.id == this.current_video_id) {
item.comments_count++;
}
})
} else {
this.active_comments.forEach(item => {
if (item.id == new_video_comments_id) {
@ -1003,6 +1026,8 @@
}
// 清空输入框, 更新数据内容
this.setData({
active_comments: this.active_comments,
video_data_list: this.video_data_list,
form_images_list: [],
comment_input_value: '',
comments_data: {},
@ -1094,6 +1119,9 @@
item = new_item;
}
});
this.setData({
video_data_list: this.video_data_list
})
}
}
});
@ -1152,6 +1180,9 @@
break; // 处理完当前item后跳出外层循环
}
}
this.setData({
video_data_list: this.video_data_list
})
} else {
if (app.globalData.is_login_check(res.data)) {
app.globalData.showToast(res.data.msg);
@ -1233,6 +1264,9 @@
item.show_goods = false;
}
});
this.setData({
video_data_list: this.video_data_list
})
},
handle_product_card_item(e) {
const id = e?.currentTarget?.dataset?.id || '';
@ -1252,6 +1286,9 @@
}
}
});
this.setData({
video_data_list: this.video_data_list
})
},
// 清理所有视频资源
cleanup_all_videos() {
@ -1430,7 +1467,7 @@
}
},
// 新增方法：直接选择子类型（用于一行显示的点击）
// 直接选择子类型（用于一行显示的点击）
select_sub_reason(e) {
const index = e?.currentTarget?.dataset?.index || 0;
const sub_index = parseInt(index);

13
pages/plugins/video/index/index.vue
View File

@ -1,5 +1,5 @@
<template>
<view class="wh-auto ht-auto pr video-container">
<view class="wh-auto ht-auto pr video-container bottom-line-exclude-bottom">
<template v-if="tabs.length > 0">
<scroll-view scroll-y :show-scrollbar="false" class="ht" lower-threshold="60" scroll-with-animation="true">
<view class="wh-auto ht-auto pr">
@ -15,7 +15,10 @@
<view class="nav-tabs">
<scroll-view scroll-x :show-scrollbar="false" class="tabs-scroll" style="white-space: nowrap;">
<view class="tabs-scroll-content">
<view v-for="(item, index) in tabs" :key="index" class="tab-item" :class="{ active: current_tabs_index === index }" :data-index="index" :data-id="item.id" @tap="switch_tab">{{ item.name }}</view>
<view v-for="(item, index) in tabs" :key="index" class="tab-item flex-row align-c gap-5" :class="{ active: current_tabs_index === index }" :data-index="index" :data-id="item.id" @tap="switch_tab">
<image v-if="!isEmpty(item.icon)" class="tabs-scroll-image" :src="item.icon" mode="aspectFit"></image>
{{ item.name }}
</view>
</view>
</scroll-view>
</view>
@ -57,6 +60,7 @@
import searchComponent from '@/pages/plugins/video/components/search.vue';
import componentNoData from '@/components/no-data/no-data';
import { video_get_top_left_padding } from '@/common/js/common/common.js';
import { isEmpty } from '../../../../common/js/common/common';
const app = getApp();
// 状态栏高度
var bar_height = parseInt(app.globalData.get_system_info('statusBarHeight', 0));
@ -98,6 +102,7 @@ export default {
this.init();
},
methods: {
isEmpty,
init() {
// 小程序下，获取小程序胶囊的宽度
let menu_button_info = 'max-width:100%';
@ -323,4 +328,8 @@ export default {
line-height: 34rpx;
}
}
.tabs-scroll-image {
width: 40rpx;
height: 40rpx;
}
</style>

126
pages/plugins/video/search/search-record.vue
View File

@ -1,65 +1,71 @@
<template>
<view class="wh-auto ht pr search-record-container">
<!-- 搜索框 -->
<view class="header-top" :style="top_content_style + menu_button_info">
<view id="search-height" class="flex-row align-c">
<!-- 支付宝小程序自带返回按钮，这里就不给返回按钮了，这里给留出一点空间就行 -->
<!-- #ifndef MP-ALIPAY -->
<view class="cp" @tap="handle_back">
<iconfont name="icon-arrow-left " size="36rpx" color="#333" class="mr-10"></iconfont>
</view>
<!-- #endif -->
<view class="wh-auto ht-auto" :style="header_padding_left">
<search-component :propSearchQuery="search_query" @search="handle_search" />
</view>
</view>
</view>
<!-- 搜索历史记录 -->
<view v-if="show_search_history.length > 0" class="search-history flex-col jc-c align-c">
<view v-for="(history, index) in show_search_history" :key="index" class="wh-auto history-item flex-row align-c jc-sb">
<view class="flex-row align-c search-history-title cp" :data-value="history" @tap.stop="perform_search">
<iconfont name="icon-time" size="32rpx"></iconfont>
<text>{{ history }}</text>
</view>
<iconfont name="icon-close-line" size="24rpx" :data-index="index" @tap="delete_history"></iconfont>
</view>
<!-- 查看更多 -->
<template v-if="search_history.length > (show_search_history.length + 4)">
<template v-if="is_view_more">
<loadingComponent></loadingComponent>
</template>
<template v-else>
<view class="more-history-btn cp" @tap="view_more_history">查看更多历史</view>
</template>
</template>
</view>
<!-- 热搜列表 -->
<view v-if="search_history_data.length > 0" class="hot-search">
<view class="hot-tabs">
<scroll-view scroll-x :show-scrollbar="false" class="tabs-scroll" style="white-space: nowrap;">
<view class="tabs-scroll-content">
<view v-for="(tab, index) in search_history_data" :key="index" class="hot-tab-item cp" :class="(hot_current_tab === index) ? 'active' : ''" :data-index="index" @tap="switch_hot_tab">{{ tab.name }}</view>
<view class="wh-auto ht pr search-record-container bottom-line-exclude-bottom">
<template v-if="search_history_data.length > 0">
<!-- 搜索框 -->
<view class="header-top" :style="top_content_style + menu_button_info">
<view id="search-height" class="flex-row align-c">
<!-- 支付宝小程序自带返回按钮，这里就不给返回按钮了，这里给留出一点空间就行 -->
<!-- #ifndef MP-ALIPAY -->
<view class="cp" @tap="handle_back">
<iconfont name="icon-arrow-left " size="36rpx" color="#333" class="mr-10"></iconfont>
</view>
</scroll-view>
<!-- #endif -->
<view class="wh-auto ht-auto" :style="header_padding_left">
<search-component :propSearchQuery="search_query" @search="handle_search" />
</view>
</view>
</view>
<view class="hot-list flex-col align-c gap-10">
<view v-for="(item, index) in search_history_data[hot_current_tab].data" :key="index" :class="'cp wh-auto flex-row align-c jc-sb gap-10 hot-item' + (index < 3 ? ' hot-item-top' : '')" :data-value="item.title" @tap.stop="perform_search">
<view class="flex-1 flex-row align-c gap-10">
<view class="hot-num flex-row align-c jc-c">
<view :class="index < 3 ? `hexagon-top hexagon-top-${index + 1}` : 'hexagon-no-top'"><span>{{ index + 1 }}</span></view>
<!-- 搜索历史记录 -->
<view v-if="show_search_history.length > 0" class="search-history flex-col jc-c align-c">
<view v-for="(history, index) in show_search_history" :key="index" class="wh-auto history-item flex-row align-c jc-sb">
<view class="flex-row align-c search-history-title cp" :data-value="history" @tap.stop="perform_search">
<iconfont name="icon-time" size="32rpx"></iconfont>
<text>{{ history }}</text>
</view>
<iconfont name="icon-close-line" size="24rpx" :data-index="index" @tap="delete_history"></iconfont>
</view>
<!-- 查看更多 -->
<template v-if="search_history.length > (show_search_history.length + 4)">
<template v-if="is_view_more">
<loadingComponent></loadingComponent>
</template>
<template v-else>
<view class="more-history-btn cp" @tap="view_more_history">查看更多历史</view>
</template>
</template>
</view>
<!-- 热搜列表 -->
<view v-if="search_history_data.length > 0" class="hot-search">
<view class="hot-tabs">
<scroll-view scroll-x :show-scrollbar="false" class="tabs-scroll" style="white-space: nowrap;">
<view class="tabs-scroll-content">
<view v-for="(tab, index) in search_history_data" :key="index" class="hot-tab-item cp" :class="(hot_current_tab === index) ? 'active' : ''" :data-index="index" @tap="switch_hot_tab">{{ tab.name }}</view>
</view>
<view class="hot-title">{{ item.title }}</view>
</scroll-view>
</view>
<view class="hot-list flex-col align-c gap-10">
<view v-for="(item, index) in search_history_data[hot_current_tab].data" :key="index" :class="'cp wh-auto flex-row align-c jc-sb gap-10 hot-item' + (index < 3 ? ' hot-item-top' : '')" :data-value="item.title" @tap.stop="perform_search">
<view class="flex-1 flex-row align-c gap-10">
<view class="hot-num flex-row align-c jc-c">
<view :class="index < 3 ? `hexagon-top hexagon-top-${index + 1}` : 'hexagon-no-top'"><span>{{ index + 1 }}</span></view>
</view>
<view class="hot-title">{{ item.title }}</view>
</view>
<view class="hot-hotness">热度 {{ item.hotness }}</view>
</view>
<view class="hot-hotness">热度 {{ item.hotness }}</view>
</view>
</view>
</view>
</template>
<template v-else>
<component-no-data :propStatus="data_loding_status" :propMsg="data_loding_msg"></component-no-data>
</template>
</view>
</template>
<script>
import searchComponent from '@/pages/plugins/video/components/search.vue';
import loadingComponent from '@/pages/plugins/video/components/loading.vue';
import componentNoData from '@/components/no-data/no-data';
import { video_get_top_left_padding } from '@/common/js/common/common.js';
import { isEmpty } from '../../../../common/js/common/common';
const app = getApp();
@ -72,7 +78,8 @@ bar_height = 0;
export default {
components: {
searchComponent,
loadingComponent
loadingComponent,
componentNoData
},
data() {
return {
@ -93,7 +100,8 @@ export default {
hot_current_tab: 0,
is_view_more: false,
header_padding_left: '',
data_loding_status: 1,
data_loding_msg: '',
};
},
onShow() {
@ -142,7 +150,18 @@ export default {
this.setData({
search_history_data: new_data.search_history_data
})
} else {
this.setData({
data_loding_status: 2,
data_loding_msg: data.msg,
});
}
},
fail: (err) => {
this.setData({
data_loding_status: 2,
data_loding_msg: this.$t('common.internet_error_tips'),
});
}
});
},
@ -159,7 +178,9 @@ export default {
app.globalData.url_open(`/pages/plugins/video/search/search?search_query=${this.search_query}`, false);
},
perform_search(e) {
this.search_query = e.currentTarget.dataset.value;
const value = e?.currentTarget?.dataset?.value || '';
// 直接跳转到搜索页
this.handle_search(value);
},
delete_history(e) {
const index = e.currentTarget.dataset.index;
@ -178,7 +199,6 @@ export default {
this.setData({
hot_current_tab: e.currentTarget.dataset.index,
});
// 根据当前标签加载对应的数据
}
}
};

15
pages/plugins/video/search/search.vue
View File

@ -1,6 +1,5 @@
<template>
<view class="wh-auto ht-auto pr video-container">
<view class="wh-auto ht-auto pr video-container bottom-line-exclude-bottom">
<view class="wh-auto ht-auto pr">
<template v-if="tabs.length > 0">
<!-- 搜索框 -->
@ -33,7 +32,7 @@
<scroll-view scroll-y :show-scrollbar="false" class="recommend-scroll" @scrolltolower="on_scroll_lower_event" lower-threshold="150" scroll-with-animation="true" enhanced="true">
<template v-if="recommend_videos.length > 0">
<view class="video-grid">
<view v-for="(item, index) in recommend_videos" :key="index" class="video-card" :data-value="item" @click="navigate_to_detail">
<view v-for="(item, index) in recommend_videos" :key="index" class="video-card" :data-id="item.id" @click="navigate_to_detail">
<image class="video-thumbnail" :src="item.cover" mode="widthFix"></image>
<view class="video-info flex-col jc-c">
<view class="video-title text-line-2">{{ item.title }}</view>
@ -241,7 +240,7 @@ export default {
fail: (err) => {
this.setData({
data_tabs_loding_status: 2,
data_list_loding_msg: this.$t('common.internet_error_tips'),
data_tabs_loding_msg: this.$t('common.internet_error_tips'),
});
}
});
@ -321,8 +320,12 @@ export default {
});
},
navigate_to_detail(e) {
const item = e.currentTarget.dataset.value;
app.globalData.url_open(`/pages/plugins/video/detail/detail?id=${item.detailId}`, false);
const id = e?.currentTarget?.dataset?.id || '';
if (id == '') {
return false;
} else {
app.globalData.url_open(`/pages/plugins/video/detail/detail?id=${id}`, false);
}
},
on_scroll_lower_event() {
// 添加额外的检查条件