Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Hooke
/
mlaj
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
hookehuyr
2025-06-10 10:58:37 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
632b1caf243dec06c35172fdb50159758ad7eff4
632b1caf
1 parent
12426726
feat: 添加音频播放埋点功能并引入uuid库
添加音频播放器的播放和暂停事件监听,用于学习时长埋点统计 引入uuid库生成唯一标识符,用于跟踪用户操作
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
68 additions
and
1 deletions
package.json
src/views/study/StudyDetailPage.vue
yarn.lock
package.json
View file @
632b1ca
...
...
@@ -30,6 +30,7 @@
"dayjs"
:
"^1.11.13"
,
"lodash"
:
"^4.17.21"
,
"swiper"
:
"^11.2.6"
,
"uuid"
:
"^11.1.0"
,
"vant"
:
"^4.9.18"
,
"vconsole"
:
"^3.15.1"
,
"video.js"
:
"^7.21.7"
,
...
...
src/views/study/StudyDetailPage.vue
View file @
632b1ca
...
...
@@ -29,7 +29,7 @@
<div v-if="course.course_type === 'audio'" class="w-full relative"
style="border-bottom: 1px solid #F3F4F6;">
<!-- 音频播放器 -->
<AudioPlayer v-if="audioList.length" :songs="audioList" />
<AudioPlayer v-if="audioList.length" :songs="audioList"
@play="onAudioPlay" @pause="onAudioPause"
/>
</div>
<!-- 图片列表展示区域 -->
<div v-if="course.course_type === 'image'" class="w-full relative">
...
...
@@ -250,6 +250,7 @@ import AudioPlayer from '@/components/ui/AudioPlayer.vue';
import dayjs from 'dayjs';
import { formatDate } from '@/utils/tools'
import axios from 'axios';
import { v4 as uuidv4 } from "uuid";
import PdfPreview from '@/components/ui/PdfPreview.vue';
...
...
@@ -289,10 +290,14 @@ const startPlay = async () => {
// 处理视频播放状态
const handleVideoPlay = () => {
isPlaying.value = true;
// 学习时长埋点开始
startAction();
};
const handleVideoPause = () => {
// 保持视频播放器可见,只在初始状态显示封面
// 学习时长埋点结束
endAction();
};
// 图片预览相关
...
...
@@ -678,6 +683,62 @@ const downloadFile = ({ title, url }) => {
console.error('下载文件出错:', error);
});
}
/**
* 音频播放事件
* @param audio 音频对象
*/
const onAudioPlay = (audio) => {
console.log('开始播放音频', audio);
// 学习时长埋点开始
startAction();
}
/**
* 音频暂停事件
* @param audio 音频对象
*/
const onAudioPause = (audio) => {
console.log('暂停播放音频', audio);
// 学习时长埋点结束
endAction();
}
/**
* 开始操作
* @param action
* @param item
*/
const startAction = (action, item) => {
// 先清除可能存在的定时器
if (window.actionTimer) {
clearInterval(window.actionTimer);
}
// 生成唯一标识符
let uuid = uuidv4();
console.warn('开始操作', uuid);
// 设置定时器,持续执行操作
window.actionTimer = setInterval(() => {
console.warn('持续操作中', uuid);
// 这里可以添加需要持续执行的具体操作
}, 1000); // 每秒执行一次,可以根据需求调整时间间隔
}
/**
* 结束操作
* @param action
* @param item
*/
const endAction = (action, item) => {
// 清除定时器,停止执行startAction
if (window.actionTimer) {
clearInterval(window.actionTimer);
window.actionTimer = null;
console.warn('操作已停止');
}
}
</script>
<style lang="less" scoped>
...
...
yarn.lock
View file @
632b1ca
...
...
@@ -2776,6 +2776,11 @@ util-deprecate@^1.0.1, util-deprecate@^1.0.2:
resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
integrity sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==
uuid@^11.1.0:
version "11.1.0"
resolved "https://registry.yarnpkg.com/uuid/-/uuid-11.1.0.tgz#9549028be1753bb934fc96e2bca09bb4105ae912"
integrity sha512-0/A9rDy9P7cJ+8w1c9WD9V//9Wj15Ce2MPz8Ri6032usz+NfePxx5AcN3bN+r6ZL6jEo066/yNYB3tn4pQEx+A==
vant@^4.9.18:
version "4.9.19"
resolved "https://registry.yarnpkg.com/vant/-/vant-4.9.19.tgz#315bebe0e8a58237c8fffaec2d1c162b9f112a23"
...
...
Please
register
or
login
to post a comment