1import React from 'react'; 2import {StyleSheet, View} from 'react-native'; 3import rpx from '@/utils/rpx'; 4import VerticalSafeAreaView from '@/components/base/verticalSafeAreaView'; 5import globalStyle from '@/constants/globalStyle'; 6import SimpleAppBar from '@/components/base/simpleAppBar'; 7import StatusBar from '@/components/base/statusBar'; 8import musicHistory from '@/core/musicHistory'; 9import MusicList from '@/components/musicList'; 10import {musicHistorySheetId} from '@/constants/commonConst'; 11import MusicBar from '@/components/musicBar'; 12import Button from '@/components/base/button'; 13 14export default function History() { 15 const musicHistoryList = musicHistory.useMusicHistory(); 16 return ( 17 <VerticalSafeAreaView style={globalStyle.fwflex1}> 18 <StatusBar /> 19 <SimpleAppBar title="播放记录" /> 20 <View style={style.opeartions}> 21 <Button 22 onPress={() => { 23 if (musicHistoryList.length) { 24 musicHistory.clearMusic(); 25 } 26 }}> 27 清空 28 </Button> 29 </View> 30 <MusicList 31 musicList={musicHistoryList} 32 showIndex 33 musicSheet={{ 34 id: musicHistorySheetId, 35 title: '播放记录', 36 musicList: musicHistoryList, 37 }} 38 /> 39 <MusicBar /> 40 </VerticalSafeAreaView> 41 ); 42} 43 44const style = StyleSheet.create({ 45 opeartions: { 46 height: rpx(88), 47 flexDirection: 'row', 48 alignItems: 'center', 49 width: '100%', 50 paddingHorizontal: rpx(24), 51 }, 52}); 53