|
@@ -35,12 +35,17 @@
|
|
|
<div v-else-if="'small' === viewSize" class="audio-icons">
|
|
<div v-else-if="'small' === viewSize" class="audio-icons">
|
|
|
<span>{{ audioIndex + 1 }}.</span>
|
|
<span>{{ audioIndex + 1 }}.</span>
|
|
|
<span class="icon-box">
|
|
<span class="icon-box">
|
|
|
- <SvgIcon :icon-class="audio.paused ? 'writepaused' : 'playing'" size="14" @click="playAudio" />
|
|
|
|
|
|
|
+ <SvgIcon
|
|
|
|
|
+ :icon-class="iconClass"
|
|
|
|
|
+ size="14"
|
|
|
|
|
+ :style="{ marginLeft: audio.paused ? '4px' : '0' }"
|
|
|
|
|
+ @click="playAudio"
|
|
|
|
|
+ />
|
|
|
</span>
|
|
</span>
|
|
|
</div>
|
|
</div>
|
|
|
<div v-else :class="['audio-list', audioIndex === curAudioIndex ? 'active' : '']">
|
|
<div v-else :class="['audio-list', audioIndex === curAudioIndex ? 'active' : '']">
|
|
|
<div class="active-mark">
|
|
<div class="active-mark">
|
|
|
- <SvgIcon v-if="audioIndex === curAudioIndex" icon-class="bluepaused" size="12" style="cursor: default" />
|
|
|
|
|
|
|
+ <SvgIcon v-if="audioIndex === curAudioIndex" icon-class="paused" size="12" style="cursor: default" />
|
|
|
</div>
|
|
</div>
|
|
|
<span class="audio-name">{{ audioIndex + 1 }}. {{ fileName }}</span>
|
|
<span class="audio-name">{{ audioIndex + 1 }}. {{ fileName }}</span>
|
|
|
<span class="audio-time">{{ audio_allTime }}</span>
|
|
<span class="audio-time">{{ audio_allTime }}</span>
|
|
@@ -275,7 +280,7 @@ export default {
|
|
|
border-radius: 20px;
|
|
border-radius: 20px;
|
|
|
|
|
|
|
|
.svg-icon {
|
|
.svg-icon {
|
|
|
- // color: red;
|
|
|
|
|
|
|
+ color: #fff;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -293,6 +298,10 @@ export default {
|
|
|
.active-mark {
|
|
.active-mark {
|
|
|
width: 20px;
|
|
width: 20px;
|
|
|
height: 28px;
|
|
height: 28px;
|
|
|
|
|
+
|
|
|
|
|
+ .svg-icon {
|
|
|
|
|
+ color: #076aff;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.audio-name {
|
|
.audio-name {
|
zq
