feat: 简化代码

maotoumao · Jan 22, 2023 · be53954 · be53954
1 parent 78fb5cb
commit be53954
Show file tree

Hide file tree

Showing 13 changed files with 62 additions and 321 deletions.
diff --git a/src/components/musicList/index.tsx b/src/components/musicList/index.tsx
@@ -23,6 +23,8 @@ interface IMusicListProps {
     ) => void;
 }
 const ITEM_HEIGHT = rpx(120);
+
+/** 音乐列表 */
 export default function MusicList(props: IMusicListProps) {
     const {Header, musicList, musicSheet, showIndex, onItemPress} = props;
 

diff --git a/...pListDetail/components/albumMusicList.tsx → ...icSheetPage/components/albumMusicList.tsx b/...pListDetail/components/albumMusicList.tsx → ...icSheetPage/components/albumMusicList.tsx
@@ -9,11 +9,11 @@ import Config from '@/core/config';
 import MusicQueue from '@/core/musicQueue';
 
 interface IMusicListProps {
-    topListDetail: IMusic.IMusicTopListItem | null;
+    sheetInfo: IMusic.IMusicSheetItemBase | null;
     musicList?: IMusic.IMusicItem[] | null;
 }
-export default function TopListMusicList(props: IMusicListProps) {
-    const {topListDetail, musicList} = props;
+export default function AlbumMusicList(props: IMusicListProps) {
+    const {sheetInfo: topListDetail, musicList} = props;
 
     return (
         <View style={style.wrapper}>

diff --git a/...pages/topListDetail/components/header.tsx → ...ents/musicSheetPage/components/header.tsx b/...pages/topListDetail/components/header.tsx → ...ents/musicSheetPage/components/header.tsx
@@ -36,7 +36,7 @@ export default function Header(props: IHeaderProps) {
                 <View style={style.content}>
                     <FastImage
                         style={style.coverImg}
-                        uri={topListDetail?.coverImg}
+                        uri={topListDetail?.artwork ?? topListDetail?.coverImg}
                         emptySrc={ImgAsset.albumDefault}
                     />
                     <View style={style.details}>

diff --git a/...pages/topListDetail/components/navBar.tsx → ...ents/musicSheetPage/components/navBar.tsx b/...pages/topListDetail/components/navBar.tsx → ...ents/musicSheetPage/components/navBar.tsx
@@ -4,16 +4,17 @@ import {ROUTE_PATH, useNavigate} from '@/entry/router';
 import ComplexAppBar from '@/components/base/ComplexAppBar';
 
 interface INavBarProps {
+    navTitle: string;
     musicList: IMusic.IMusicItem[] | null;
 }
 
 export default function (props: INavBarProps) {
     const navigate = useNavigate();
-    const {musicList = []} = props;
+    const {navTitle, musicList = []} = props;
 
     return (
         <ComplexAppBar
-            title="榜单"
+            title={navTitle}
             onSearchPress={() => {
                 navigate(ROUTE_PATH.SEARCH_MUSIC_LIST, {
                     musicList: musicList,
@@ -27,7 +28,7 @@ export default function (props: INavBarProps) {
                         navigate(ROUTE_PATH.MUSIC_LIST_EDITOR, {
                             musicList: musicList,
                             musicSheet: {
-                                title: '榜单',
+                                title: navTitle,
                             },
                         });
                     },

diff --git a/src/components/musicSheetPage/index.tsx b/src/components/musicSheetPage/index.tsx
@@ -0,0 +1,39 @@
+import React from 'react';
+import {StyleSheet} from 'react-native';
+import rpx from '@/utils/rpx';
+import NavBar from './components/navBar';
+import MusicBar from '@/components/musicBar';
+import AlbumMusicList from './components/albumMusicList';
+import StatusBar from '@/components/base/statusBar';
+import {SafeAreaView} from 'react-native-safe-area-context';
+
+interface IMusicSheetPageProps {
+    navTitle: string;
+    sheetInfo: ICommon.WithMusicList<IMusic.IMusicSheetItemBase> | null;
+}
+
+export default function MusicSheetPage(props: IMusicSheetPageProps) {
+    const {navTitle, sheetInfo} = props;
+
+    return (
+        <SafeAreaView style={style.wrapper}>
+            <StatusBar />
+            <NavBar
+                musicList={sheetInfo?.musicList ?? []}
+                navTitle={navTitle}
+            />
+            <AlbumMusicList
+                sheetInfo={sheetInfo}
+                musicList={sheetInfo?.musicList}
+            />
+            <MusicBar />
+        </SafeAreaView>
+    );
+}
+
+const style = StyleSheet.create({
+    wrapper: {
+        width: rpx(750),
+        flex: 1,
+    },
+});
diff --git a/src/pages/albumDetail/components/albumMusicList.tsx b/src/pages/albumDetail/components/albumMusicList.tsx
diff --git a/src/pages/albumDetail/components/header.tsx b/src/pages/albumDetail/components/header.tsx
diff --git a/src/pages/albumDetail/components/navBar.tsx b/src/pages/albumDetail/components/navBar.tsx
diff --git a/src/pages/albumDetail/index.tsx b/src/pages/albumDetail/index.tsx
@@ -1,34 +1,11 @@
 import React from 'react';
-import {StyleSheet} from 'react-native';
-import rpx from '@/utils/rpx';
-import NavBar from './components/navBar';
-import MusicBar from '@/components/musicBar';
-import AlbumMusicList from './components/albumMusicList';
 import useAlbumDetail from './hooks/useAlbumMusicList';
-import StatusBar from '@/components/base/statusBar';
-import {SafeAreaView} from 'react-native-safe-area-context';
 import {useParams} from '@/entry/router';
+import MusicSheetPage from '@/components/musicSheetPage';
 
 export default function AlbumDetail() {
     const {albumItem} = useParams<'album-detail'>();
     const albumDetail = useAlbumDetail(albumItem);
 
-    return (
-        <SafeAreaView style={style.wrapper}>
-            <StatusBar />
-            <NavBar musicList={albumDetail?.musicList ?? []} />
-            <AlbumMusicList
-                albumItem={albumDetail}
-                musicList={albumDetail?.musicList}
-            />
-            <MusicBar />
-        </SafeAreaView>
-    );
+    return <MusicSheetPage navTitle="专辑" sheetInfo={albumDetail} />;
 }
-
-const style = StyleSheet.create({
-    wrapper: {
-        width: rpx(750),
-        flex: 1,
-    },
-});