|
@@ -28,10 +28,9 @@
|
|
|
<!-- 卡片主体 -->
|
|
<!-- 卡片主体 -->
|
|
|
<div class="card-body" :class="{ 'body-student': sentence.role === 'student' }">
|
|
<div class="card-body" :class="{ 'body-student': sentence.role === 'student' }">
|
|
|
<div class="card-left">
|
|
<div class="card-left">
|
|
|
- <!-- 语音条 -->
|
|
|
|
|
- <div class="card-voice-bar" :class="sentence.role === 'ai' ? 'bar-ai' : 'bar-student'">
|
|
|
|
|
|
|
+ <!-- 语音条(仅学生卡片,AI 无 audio_url 故纯文字呈现) -->
|
|
|
|
|
+ <div v-if="sentence.role === 'student'" class="card-voice-bar bar-student">
|
|
|
<button
|
|
<button
|
|
|
- v-if="sentence.role === 'student'"
|
|
|
|
|
class="card-play-btn play-student"
|
|
class="card-play-btn play-student"
|
|
|
:disabled="!sentence.audioUrl"
|
|
:disabled="!sentence.audioUrl"
|
|
|
@click.stop="handleSentencePlay(sentence)"
|
|
@click.stop="handleSentencePlay(sentence)"
|
|
@@ -75,15 +74,11 @@
|
|
|
<div
|
|
<div
|
|
|
v-for="i in 8"
|
|
v-for="i in 8"
|
|
|
:key="i"
|
|
:key="i"
|
|
|
- class="card-wave-bar"
|
|
|
|
|
- :class="sentence.role === 'ai' ? 'cw-ai' : 'cw-student'"
|
|
|
|
|
|
|
+ class="card-wave-bar cw-student"
|
|
|
:style="{ height: `${Math.sin(i * 0.6) * 4 + 3}px` }"
|
|
:style="{ height: `${Math.sin(i * 0.6) * 4 + 3}px` }"
|
|
|
/>
|
|
/>
|
|
|
</div>
|
|
</div>
|
|
|
- <span
|
|
|
|
|
- v-if="sentence.role === 'student'"
|
|
|
|
|
- class="card-duration cd-student"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ <span class="card-duration cd-student">
|
|
|
{{ formatDuration(sentence.audioDuration) }}
|
|
{{ formatDuration(sentence.audioDuration) }}
|
|
|
</span>
|
|
</span>
|
|
|
</div>
|
|
</div>
|