Skip to content

Commit 585db3a

Browse files
imsyyimsyy
committed
Revert "✨ feat: 移动端基础支持 Part.1"
This reverts commit 8a749ac.
1 parent 40b4e8d commit 585db3a

17 files changed

Lines changed: 217 additions & 539 deletions

File tree

‎src/components/Card/SongCard.vue‎

Lines changed: 5 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
v-if="!hiddenCover"
2525
:key="song.cover"
2626
:src="song.path ? song.cover : song.coverSize?.s || song.cover"
27-
:class="['cover', { mobile: isMobile }]"
27+
class="cover"
2828
@update:show="localCover"
2929
/>
3030
<!-- 信息 -->
@@ -43,15 +43,15 @@
4343
</n-ellipsis>
4444
<!-- 音质 -->
4545
<n-tag
46-
v-if="song?.quality && settingStore.showSongQuality && !isMobile"
46+
v-if="song?.quality && settingStore.showSongQuality"
4747
:type="qualityColor"
4848
class="quality"
4949
round
5050
>
5151
{{ song.quality }}
5252
</n-tag>
5353
<!-- 原唱翻唱 -->
54-
<template v-if="!isMobile">
54+
<template>
5555
<n-tag v-if="song.originCoverType === 1" :bordered="false" type="primary" round>
5656
原
5757
</n-tag>
@@ -60,7 +60,7 @@
6060
</n-tag>
6161
</template>
6262
<!-- 特权 -->
63-
<template v-if="settingStore.showSongPrivilegeTag && !isMobile">
63+
<template v-if="settingStore.showSongPrivilegeTag">
6464
<n-tag v-if="song.free === 1" :bordered="false" type="error" round> VIP </n-tag>
6565
<n-tag v-if="song.free === 4" :bordered="false" type="error" round> EP </n-tag>
6666
<!-- 云盘 -->
@@ -163,7 +163,7 @@ import { toLikeSong } from "@/utils/auth";
163163
import { isObject } from "lodash-es";
164164
import { formatTimestamp, msToTime } from "@/utils/time";
165165
import { usePlayer } from "@/utils/player";
166-
import { isElectron, isMobile } from "@/utils/env";
166+
import { isElectron } from "@/utils/env";
167167
import blob from "@/utils/blob";
168168
169169
const props = defineProps<{
@@ -303,13 +303,6 @@ const localCover = async (show: boolean) => {
303303
align-items: center;
304304
justify-content: center;
305305
overflow: hidden;
306-
&.mobile {
307-
width: 40px;
308-
height: 40px;
309-
min-width: 40px;
310-
margin-right: 8px;
311-
border-radius: 6px;
312-
}
313306
}
314307
.info {
315308
display: flex;

‎src/components/Layout/Nav.vue‎

Lines changed: 14 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -2,27 +2,16 @@
22
<n-layout-header class="nav">
33
<!-- 页面导航 -->
44
<n-flex class="page-control">
5-
<!-- 桌面端：后退/前进 -->
6-
<template v-if="!isMobile">
7-
<n-button :focusable="false" tertiary circle @click="router.go(-1)">
8-
<template #icon>
9-
<SvgIcon name="NavigateBefore" :size="26" />
10-
</template>
11-
</n-button>
12-
<n-button :focusable="false" tertiary circle @click="router.go(1)">
13-
<template #icon>
14-
<SvgIcon name="NavigateNext" :size="26" />
15-
</template>
16-
</n-button>
17-
</template>
18-
<!-- 移动端：菜单/设置 -->
19-
<template v-else>
20-
<n-button :focusable="false" tertiary circle @click="statusStore.showMobileSidebar = true">
21-
<template #icon>
22-
<SvgIcon name="Menu" :size="22" />
23-
</template>
24-
</n-button>
25-
</template>
5+
<n-button :focusable="false" tertiary circle @click="router.go(-1)">
6+
<template #icon>
7+
<SvgIcon name="NavigateBefore" :size="26" />
8+
</template>
9+
</n-button>
10+
<n-button :focusable="false" tertiary circle @click="router.go(1)">
11+
<template #icon>
12+
<SvgIcon name="NavigateNext" :size="26" />
13+
</template>
14+
</n-button>
2615
</n-flex>
2716
<!-- 主内容 -->
2817
<n-flex class="nav-main">
@@ -101,14 +90,14 @@
10190

10291
<script setup lang="ts">
10392
import type { DropdownOption } from "naive-ui";
104-
import { useSettingStore, useStatusStore } from "@/stores";
105-
import { renderIcon } from "@/utils/helper";
93+
import { useSettingStore } from "@/stores";
94+
import { openLink, renderIcon } from "@/utils/helper";
10695
import { openSetting } from "@/utils/modal";
107-
import { isDev, isElectron, isMobile } from "@/utils/env";
96+
import { isDev, isElectron } from "@/utils/env";
97+
import packageJson from "@/../package.json";
10898
10999
const router = useRouter();
110100
const settingStore = useSettingStore();
111-
const statusStore = useStatusStore();
112101
113102
const showCloseModal = ref(false);
114103
// 是否记住

‎src/components/List/SongList.vue‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@
4444
</div>
4545
</n-dropdown>
4646
<n-text v-else class="title">标题</n-text>
47-
<n-text v-if="type !== 'radio' && !hiddenAlbum && !isMobile" class="album">专辑</n-text>
47+
<n-text v-if="type !== 'radio' && !hiddenAlbum" class="album">专辑</n-text>
4848
<n-text v-if="type !== 'radio'" class="actions">操作</n-text>
4949
<n-text v-if="type === 'radio'" class="meta date">更新日期</n-text>
5050
<n-text v-if="type === 'radio'" class="meta">播放量</n-text>
@@ -58,7 +58,7 @@
5858
:song="itemData"
5959
:index="index"
6060
:hiddenCover="hiddenCover"
61-
:hiddenAlbum="hiddenAlbum || isMobile"
61+
:hiddenAlbum="hiddenAlbum"
6262
:hiddenSize="hiddenSize"
6363
@dblclick.stop="
6464
doubleClickAction === 'add'
@@ -130,7 +130,6 @@ import { entries, isEmpty } from "lodash-es";
130130
import { sortOptions } from "@/utils/meta";
131131
import { renderIcon } from "@/utils/helper";
132132
import { usePlayer } from "@/utils/player";
133-
import { isMobile } from "@/utils/env";
134133
import SongListMenu from "@/components/Menu/SongListMenu.vue";
135134
136135
const props = withDefaults(

‎src/components/Player/FullPlayer.vue‎

Lines changed: 6 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@
88
cursor: statusStore.playerMetaShow || isShowComment ? 'auto' : 'none',
99
}"
1010
:class="['full-player', { 'show-comment': isShowComment }]"
11-
@click="onPlayerClick"
1211
@mouseleave="playerLeave"
1312
>
1413
<!-- 背景 -->
@@ -39,29 +38,20 @@
3938
]"
4039
@mousemove="playerMove"
4140
>
42-
4341
<Transition name="zoom">
44-
<div
45-
v-if="!pureLyricMode"
46-
v-show="!isMobile"
47-
:key="musicStore.playSong.id"
48-
class="content-left"
49-
>
42+
<div v-if="!pureLyricMode" :key="musicStore.playSong.id" class="content-left">
5043
<!-- 封面 -->
5144
<PlayerCover />
5245
<!-- 数据 -->
5346
<PlayerData :center="playerDataCenter" :theme="statusStore.mainColor" />
5447
</div>
5548
</Transition>
5649
<!-- 歌词 -->
57-
<div
58-
v-show="!isMobile || true"
59-
class="content-right"
60-
>
50+
<div class="content-right">
6151
<!-- 数据 -->
6252
<PlayerData
63-
v-if="(statusStore.pureLyricMode && musicStore.isHasLrc) || isMobile"
64-
:center="statusStore.pureLyricMode || isMobile"
53+
v-if="statusStore.pureLyricMode && musicStore.isHasLrc"
54+
:center="statusStore.pureLyricMode"
6555
:theme="statusStore.mainColor"
6656
:light="pureLyricMode"
6757
/>
@@ -91,14 +81,12 @@
9181

9282
<script setup lang="ts">
9383
import { useStatusStore, useMusicStore, useSettingStore } from "@/stores";
94-
import { isElectron, isMobile } from "@/utils/env";
84+
import { isElectron } from "@/utils/env";
9585
9686
const musicStore = useMusicStore();
9787
const statusStore = useStatusStore();
9888
const settingStore = useSettingStore();
9989
100-
101-
10290
// 是否显示评论
10391
const isShowComment = computed<boolean>(
10492
() => !musicStore.playSong.path && statusStore.showPlayerComment,
@@ -153,8 +141,7 @@ const {
153141
const playerMove = useThrottleFn(
154142
() => {
155143
statusStore.playerMetaShow = true;
156-
// Mobile: Always visible, do not start hide timer
157-
if (!isPending.value && !isMobile) startShow();
144+
if (!isPending.value) startShow();
158145
},
159146
300,
160147
false,
@@ -172,18 +159,7 @@ const playerLeave = () => {
172159
stopShow();
173160
};
174161
175-
// 点击播放器 (移动端显示控制)
176-
const onPlayerClick = () => {
177-
if (isMobile && !statusStore.playerMetaShow) {
178-
statusStore.playerMetaShow = true;
179-
}
180-
};
181-
182162
onMounted(() => {
183-
// Mobile: Always show controls
184-
if (isMobile) {
185-
statusStore.playerMetaShow = true;
186-
}
187163
// 阻止息屏
188164
if (isElectron && settingStore.preventSleep) {
189165
window.electron.ipcRenderer.send("prevent-sleep", true);
@@ -255,9 +231,6 @@ onBeforeUnmount(() => {
255231
transition:
256232
opacity 0.5s cubic-bezier(0.34, 1.56, 0.64, 1),
257233
transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
258-
@media (max-width: 768px) {
259-
display: none;
260-
}
261234
}
262235
.content-right {
263236
position: absolute;
@@ -270,12 +243,6 @@ onBeforeUnmount(() => {
270243
flex-direction: column;
271244
transition: opacity 0.3s;
272245
transition-delay: 0.5s;
273-
@media (max-width: 768px) {
274-
width: 100%;
275-
max-width: 100%;
276-
left: 0;
277-
right: auto;
278-
}
279246
.player-data {
280247
margin-top: 0;
281248
margin-bottom: 26px;

‎src/components/Player/MainAMLyric.vue‎

Lines changed: 1 addition & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
:playing="statusStore.playStatus"
1414
:enableSpring="settingStore.useAMSpring"
1515
:enableScale="settingStore.useAMSpring"
16-
:alignPosition="settingStore.lyricsScrollPosition === 'center' || isMobile ? 0.5 : 0.2"
16+
:alignPosition="settingStore.lyricsScrollPosition === 'center' ? 0.5 : 0.2"
1717
:enableBlur="settingStore.lyricsBlur"
1818
:style="{
1919
'--amll-lyric-view-color': mainColor,
@@ -38,7 +38,6 @@ import { type LyricLine } from "@applemusic-like-lyrics/lyric";
3838
import { useMusicStore, useSettingStore, useStatusStore } from "@/stores";
3939
import { getLyricLanguage } from "@/utils/format";
4040
import { usePlayer } from "@/utils/player";
41-
import { isMobile } from "@/utils/env";
4241
import LyricMenu from "./LyricMenu.vue";
4342
4443
const player = usePlayer();
@@ -149,13 +148,6 @@ onBeforeUnmount(() => {
149148
padding-left: 10px;
150149
padding-right: 80px;
151150
// margin-left: -2rem;
152-
@media (max-width: 768px) {
153-
padding-left: 20px;
154-
padding-right: 20px;
155-
--amll-lyric-player-font-size: calc(var(--amll-lyric-player-font-size) - 4px);
156-
pointer-events: auto;
157-
cursor: pointer;
158-
}
159151
}
160152
161153
&.pure {
@@ -164,9 +156,6 @@ onBeforeUnmount(() => {
164156
:deep(.am-lyric) {
165157
margin: 0;
166158
padding: 0 80px;
167-
@media (max-width: 768px) {
168-
padding: 0 20px;
169-
}
170159
171160
div {
172161
transform-origin: center;

‎src/components/Player/MainLyric.vue‎

Lines changed: 14 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -175,7 +175,7 @@ import { NScrollbar } from "naive-ui";
175175
import { useMusicStore, useSettingStore, useStatusStore } from "@/stores";
176176
import { usePlayer } from "@/utils/player";
177177
import { getLyricLanguage } from "@/utils/format";
178-
import { isElectron, isMobile } from "@/utils/env";
178+
import { isElectron } from "@/utils/env";
179179
import LyricMenu from "./LyricMenu.vue";
180180
181181
const player = usePlayer();
@@ -210,7 +210,7 @@ const lyricsScroll = (index: number) => {
210210
// 调整滚动的距离
211211
const scrollDistance = lrcItemDom.offsetTop - container.offsetTop - 100;
212212
// 开始滚动
213-
if (settingStore.lyricsScrollPosition === "center" || isMobile) {
213+
if (settingStore.lyricsScrollPosition === "center") {
214214
lrcItemDom?.scrollIntoView({ behavior: "smooth", block: "center" });
215215
} else {
216216
lyricScroll.value?.scrollTo({ top: scrollDistance, behavior: "smooth" });
@@ -346,10 +346,6 @@ onBeforeUnmount(() => {
346346
padding-right: 80px;
347347
max-width: 100%; /* 新增：防止宽度溢出 */
348348
box-sizing: border-box; /* 新增：确保 padding 不影响宽度 */
349-
@media (max-width: 768px) {
350-
padding-left: 20px;
351-
padding-right: 20px;
352-
}
353349
}
354350
.placeholder {
355351
width: 100%;
@@ -379,16 +375,21 @@ onBeforeUnmount(() => {
379375
padding: 10px 16px;
380376
transform: scale(0.86);
381377
transform-origin: left center;
382-
@media (max-width: 768px) {
383-
align-items: flex-start;
384-
font-size: calc(var(--lrc-size) - 4px);
385-
}
386378
will-change: filter, opacity, transform;
387379
transition:
388380
filter 0.35s,
389381
opacity 0.35s,
390382
transform 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
391383
cursor: pointer;
384+
width: 100%;
385+
.content {
386+
display: block;
387+
font-size: var(--lrc-size);
388+
font-weight: var(--lrc-bold);
389+
width: 100%;
390+
overflow-wrap: anywhere; /* 支持超长单词换行 */
391+
word-break: break-word; /* 优先空格或连字符换行，超长单词强制换行 */
392+
white-space: normal; /* 新增：明确文本换行行为 */
392393
hyphens: auto; /* 英文自动连字符 */
393394
.content-text {
394395
position: relative;
@@ -446,7 +447,7 @@ onBeforeUnmount(() => {
446447
&:lang(ja) {
447448
font-family: var(--ja-font-family);
448449
}
449-
450+
}
450451
.tran {
451452
margin-top: 8px;
452453
opacity: 0.6;
@@ -602,11 +603,8 @@ onBeforeUnmount(() => {
602603
&.pure {
603604
:deep(.n-scrollbar-content) {
604605
padding: 0 80px;
605-
max-width: 100%;
606-
box-sizing: border-box;
607-
@media (max-width: 768px) {
608-
padding: 0 20px;
609-
}
606+
max-width: 100%; /* 新增：防止宽度溢出 */
607+
box-sizing: border-box; /* 新增：确保 padding 不影响宽度 */
610608
}
611609
.lyric-content {
612610
.placeholder {

0 commit comments

Comments
 (0)