A1300399510/PC-official
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

refactor(播放器): 优化音频播放逻辑和学生切换功能

Browse Source 
- 重构音频播放管理逻辑，简化播放状态控制
- 改进学生切换功能，使用索引代替顺序号
- 移除冗余代码，优化音量控制实现
- 调整CSS布局样式，增强页面展示效果
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-09-12 18:59:47 +08:00
parent 5a957acf3f
commit 35e3a11427
4 changed files with 51 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
index.html
View File

@@ -57,7 +57,7 @@
<img class="bj bj1" src="./static/img/album-bj1.svg" />
<img class="bj bj2" src="./static/img/album-bj2.svg" />
<div class="album-box" ref="albumBoxRef">
<div class="item" v-for="(item, index) in bannerList" :key="index" @click="openPreview(item.id, item.img)">
<div class="item" v-for="(item, index) in bannerList" :key="index" @click="openPreview(item.id)">
<img class="img" :src="item.img" />
<img class="bj bj3" src="./static/img/album-bj3.svg" />
<img class="bj bj4" src="./static/img/album-bj4.png" />
@@ -68,7 +68,7 @@
</div>
</div>
<div class="trait flexflex mar1200">
<div class="item flexflex flex1" v-for="(item, index) in trait" :key="index">
<div class="item flexflex" v-for="(item, index) in trait" :key="index">
<img class="icon" :src="item.icon" />
<div class="title">{{ item.title }}</div>
<div class="text">{{ item.text }}</div>
@@ -99,7 +99,7 @@
<div class="time">{{ item.date }}</div>
</div>
<div class="media" @click="openPreview(item.id, item.img)">
<div class="media" @click="openPreview(item.id)">
<img class="img" :src="item.img" />
<img class="play" src="./static/img/play-white-icon.svg" />
</div>
@@ -119,7 +119,7 @@
<div class="name">{{ item.title }}</div>
<div class="subtitle">{{ item.desc }}</div>
<div class="time">{{ item.date }}</div>
<div class="progress-bar flexacenter">
<div class="progress-bar flexacenter" @click="handleBarDragBottomClick">
<div class="bar white" :style="{ width: item.progress + '%' }"></div>
<div class="bar black flex1"></div>
</div>
@@ -145,7 +145,7 @@
<div class="info flexflex">
<div class="name">{{ item.title }}</div>
<div class="lyric">{{ item.desc }}</div>
<div class="progress-bar flexacenter">
<div class="progress-bar flexacenter" @click="handleBarDragBottomClick">
<div class="bar white" :style="{ width: item.progress + '%' }"></div>
<div class="bar black flex1"></div>
</div>
@@ -172,7 +172,7 @@
<div class="student-box flexflex">
<img class="title" src="./static/img/student-title.png" alt="" />
<div class="list flexacenter">
<img class="img" :class="[`img${ item.order }`]" v-for="(item, index) in studentList" :src="item.img" :key="index" @click="cutStudent(item.order)" />
<img class="img" :class="[`img${ item.order }`]" v-for="(item, index) in studentList" :src="item.img" :key="index" @click="cutStudent(index, item.order)" />
</div>
<div class="name">《{{ zeroOrderStudents.title }}》</div>
<div class="info flexacenter">
@@ -180,7 +180,7 @@
{{ zeroOrderStudents.name }} | {{ zeroOrderStudents.age }}岁 | {{ zeroOrderStudents.city }}
</div>
<div class="progress-bar flexacenter">
<div class="progress-bar flexacenter" @click="handleBarDragBottomClick">
<div class="bar white" :style="{ width: zeroOrderStudents.progress + '%' }"></div>
<div class="bar black flex1"></div>
</div>