xref: /MusicFree/src/pages/sheetDetail/components/navBar.tsx (revision 6704747af84cebd842b258efac7143542722fac5)
1import React from 'react';
2import {Appbar} from 'react-native-paper';
3import {StyleSheet, View} from 'react-native';
4import rpx from '@/utils/rpx';
5import {useNavigation, useRoute} from '@react-navigation/native';
6import usePrimaryColor from '@/hooks/usePrimaryColor';
7import AppBarWithSearch from '@/components/base/appBarWithSearch';
8import MusicSheet from '@/core/musicSheet';
9import {ROUTE_PATH} from '@/entry/router';
10import useDialog from '@/components/dialogs/useDialog';
11
12interface IProps {}
13export default function (props: IProps) {
14  const navigation = useNavigation<any>();
15  const route = useRoute<any>();
16  const id = route.params?.id ?? 'favorite';
17  const musicSheet = MusicSheet.useSheets(id);
18  const {showDialog} = useDialog();
19
20  return (
21    <AppBarWithSearch
22      title="歌单"
23      onSearchPress={() => {
24        navigation.navigate(ROUTE_PATH.SEARCH_MUSIC_LIST, {
25          musicList: musicSheet?.musicList,
26        });
27      }}
28      menuOptions={[
29        {
30          icon: 'trash-can-outline',
31          title: '删除歌单',
32          show: id !== 'favorite',
33          onPress() {
34            showDialog('SimpleDialog', {
35              title: '删除歌单',
36              content: `确定删除歌单${musicSheet.title}吗?`,
37              onOk: async () => {
38                await MusicSheet.removeSheet(id);
39                navigation.goBack();
40              },
41            });
42          },
43        },
44      ]}></AppBarWithSearch>
45  );
46}
47
48const style = StyleSheet.create({
49  appbar: {
50    shadowColor: 'transparent',
51    flexDirection: 'row',
52    width: rpx(750),
53  },
54});
55