mirror of
https://github.com/atdunbg/Nekosonic-Music.git
synced 2026-08-06 03:44:18 +08:00
atdunbg
263e9b31d9
- 详情页统一 DetailLayout 组件（常驻头部 + 独立滚动 + 紧凑态动画） - 歌曲/评论 tab 切换（懒加载 + 保活），专辑模糊搜索 - 皮肤系统 skins.ts（19 语义色 + 14 预设 + 自定义皮肤 + 壁纸） - 设置页皮肤模块（外观/主题色/皮肤编辑器/壁纸选择） - 可折叠侧边栏 + TopBar + 折叠态歌单浮层（高度不越 PlayerBar） - 首页扩展至 6 区块 + 通用卡片组件 + 虚拟歌曲列表 - audio.rs 拆为 8 模块，api.ts 拆为 api/ 目录，player store 拆为 4 store - 修复播放竞态、seek 暂停、评论提前加载、紧凑态卡死等
41 lines
1.4 KiB
Vue
41 lines
1.4 KiB
Vue
<template>
|
|
<div
|
|
data-tauri-drag-region
|
|
class="h-10 flex items-center justify-between px-4 flex-shrink-0 select-none relative z-10"
|
|
:style="titleBarBgStyle"
|
|
>
|
|
<slot name="left">
|
|
<span v-if="!darkMode" class="text-xs text-content-3 font-medium ml-2">Nekosonic Music</span>
|
|
</slot>
|
|
<div class="flex items-center gap-1.5">
|
|
<button @click="minimizeWindow" class="w-3 h-3 rounded-full bg-yellow-500 hover:bg-yellow-400 transition" title="最小化"></button>
|
|
<button @click="toggleMaximize" class="w-3 h-3 rounded-full bg-green-500 hover:bg-green-400 transition" title="最大化/还原"></button>
|
|
<button @click="$emit('close')" class="w-3 h-3 rounded-full bg-red-500 hover:bg-red-400 transition" title="关闭"></button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed } from 'vue';
|
|
import { useSettingsStore } from '../stores/settings';
|
|
import { minimizeWindow, toggleMaximize } from '../composables/useWindowControls';
|
|
|
|
const props = defineProps<{
|
|
darkMode?: boolean;
|
|
transparent?: boolean;
|
|
}>();
|
|
|
|
defineEmits<{
|
|
close: [];
|
|
}>();
|
|
|
|
const settings = useSettingsStore();
|
|
|
|
const titleBarBgStyle = computed(() => {
|
|
if (props.transparent) return {};
|
|
if (settings.currentWallpaper.path) return {}; // 有壁纸时透明，由遮罩层统一提供背景
|
|
if (props.darkMode) return {};
|
|
return { backgroundColor: settings.currentColors.surface };
|
|
});
|
|
</script>
|