feat: 优化 SongList 组件,增强歌曲管理功能

- 增加了歌曲搜索和筛选功能,支持按语言、标签和作者筛选。
- 改进了歌曲编辑和删除操作的用户体验,添加了确认提示。
- 更新了表格列定义,确保动态生成筛选选项。
- 优化了歌曲播放器的状态管理,增强了播放体验。
- 规范化了代码注释,提升了可读性和维护性。
This commit is contained in:
2025-04-20 14:32:10 +08:00
parent febfa132c8
commit 94a315a906
4 changed files with 1130 additions and 767 deletions

View File

@@ -5,6 +5,8 @@ import { onMounted, onUnmounted, ref } from 'vue'
const timer = ref<any>()
const visible = ref(true)
const active = ref(true)
const originalBackgroundColor = ref('')
onMounted(() => {
timer.value = setInterval(() => {
if (!visible.value || !active.value) return
@@ -22,9 +24,21 @@ onMounted(() => {
active.value = a
}
}
// 使 .n-layout-content 背景透明
const layoutContent = document.querySelector('.n-layout-content');
if (layoutContent instanceof HTMLElement) {
originalBackgroundColor.value = layoutContent.style.backgroundColor
layoutContent.style.setProperty('background-color', 'transparent');
}
})
onUnmounted(() => {
clearInterval(timer.value)
// 还原 .n-layout-content 背景颜色
const layoutContent = document.querySelector('.n-layout-content');
if (layoutContent instanceof HTMLElement) {
layoutContent.style.setProperty('background-color', originalBackgroundColor.value);
}
})
</script>
@@ -46,9 +60,3 @@ onUnmounted(() => {
</RouterView>
</div>
</template>
<style>
.body,html,.n-element,.n-layout-content {
background-color: transparent !important;
}
</style>