· 5 years ago · Mar 26, 2020, 02:32 PM
1import React, { Component, useState, useEffect } from 'react';
2import { StyleSheet, Text, View, Image, Button, TextInput, Picker, Alert } from 'react-native';
3import { NavigationContainer, StackAction, NacigationContext} from '@react-navigation/native';
4import { createStackNavigator} from '@react-navigation/stack';
5import * as SQLite from 'expo-sqlite';
6import { FlatList } from 'react-native-gesture-handler';
7import firebase from 'firebase';
8
9const firebaseConfig = {
10
11 };
12
13if(!firebase.apps.length){
14firebase.initializeApp(firebaseConfig);
15}
16const Stack = createStackNavigator();
17var sqllitedb = SQLite.openDatabase('Samochody.db');
18
19function ListaSamochodow( {navigation} )
20{
21 var [autka, setLista] = useState([]);
22 sqllitedb.transaction(tx => {
23 tx.executeSql("select rowid, * from fury",[],(t,results)=>{setLista(results.rows._array)},(t,e)=>{console.log(t,e)}
24 );
25 });
26
27 if(autka.length>0){
28 autka.sort(function(a, b) {
29 var keyA = a.nazwa, keyB = b.nazwa;
30 if (keyA < keyB) return -1;
31 if (keyA > keyB) return 1;
32 return 0;
33 });
34}
35
36 return (
37 <View style={styles.container}>
38 <FlatList
39 data={autka}
40 renderItem = { ( {item } ) => (
41 <View style={{margin:10,borderBottomWidth:1, borderBottomColor:"black"}}>
42 <Text style={{fontSize:20}} onPress={() => navigation.navigate('Szczegoly Samochodu',item)}>{item.nazwa}</Text>
43 </View>
44 )}/>
45 <View style={{marginBottom:400}}>
46 <Button title="Dodaj" onPress={() => navigation.navigate('Dodaj samochod')}/>
47 </View>
48 </View>
49 )
50}
51
52function SzczegolySamochodu({route, navigation})
53{
54 var samochod = route.params;
55 return(
56 <View style={styles.container}>
57 <Text style={{fontSize:20}}>Nazwa: {samochod.nazwa}</Text>
58 <Image
59 style={{ width: 200, height: 150, borderWidth:5,borderColor:"black" }}
60 source={{ uri: samochod.link.toString() }}
61 />
62 <Text style={{fontSize:20}}>Rodzaj paliwa: {samochod.paliwo}</Text>
63 <Text style={{fontSize:20}}>Spalanie: {samochod.spalanie}</Text>
64 <Text style={{fontSize:17}}>Data dodania: {samochod.datadodania}</Text>
65 <View style={{marginTop:50}}>
66 <Button title="Usun samochod" onPress={()=>{
67 Alert.alert('Usuń','Czy napewno usunąć?',
68 [{text:'Tak',onPress:()=>
69 {navigation.navigate("Lista Samochodow");
70 UsunSamochod(samochod.rowid, samochod.nazwa);}},
71 {text:'Nie',onPress:()=>
72 { null;}}
73 ])}}/>
74 </View>
75 </View>
76 );
77}
78
79function DodajDoTabeli(nazwa,link,rodzaj,ilosc,data){
80 sqllitedb.transaction(tx => {
81 tx.executeSql("insert into fury values (?,?,?,?,?);",[nazwa,link,rodzaj,ilosc,data],()=>{console.log("Dodano do bazy")},(t,e)=>{console.log(t,e)}
82 );});
83 firebase.database().ref(nazwa).set(
84 { nazwa: nazwa,
85 link: link,
86 paliwo: rodzaj,
87 spalanie: ilosc,
88 datadodania: data }
89 ).then(() => {
90 console.log('INSERTED');
91 }).catch((error) => {
92 console.log('ERROR'); }); }
93
94function UsunSamochod(id,nzw){
95 sqllitedb.transaction(tx => {
96 tx.executeSql("delete from fury where rowid = ?",[id],()=>{console.log("samochod usuniety z bazy"),(t,e)=>{console.log(t,e)}}
97 );
98 });
99
100 firebase.database().ref(nzw).remove();
101}
102
103function znajdzNazwePoId(id){
104 var [szukanaNazwa, ustawnazwe] = useState();
105 sqllitedb.transaction(tx => {
106 tx.executeSql("select nazwa from fury where rowid = ?",[id],()=>{ustawnazwe(result.rows._array[0].nazwa),(t,e)=>{console.log(t,e)}});
107 });
108 return szukanaNazwa;
109}
110
111function WypiszWszystko(){
112 sqllitedb.transaction(tx => {
113 tx.executeSql("select rowid, * from fury",[],(t,results)=>{console.log(results.rows._array)},(t,e)=>{console.log(t,e)}
114 );
115 });
116}
117
118function DodajSamochod({route,navigation}){
119 var [nazwaSamochodu, setNazwa] = useState("nazwa");
120 var [linkZdjecia, setLink] = useState();
121 var [rodzajPaliwa, setPaliwo] = useState("Benzyna");
122 var [iloscSpalania, setSpalanie] = useState();
123 var [dataDodania, setDataDodania] = useState();
124
125 return (
126 <View style={styles.container}>
127 <Text>Podaj nazwe:</Text>
128 <TextInput style={styles.TextInput} onChangeText={(val) => setNazwa(val)}/>
129 <Text>Podaj link:</Text>
130 <TextInput style={styles.TextInput} onChangeText={(val) => setLink(val)}/>
131 <Text>Wybierz rodzaj paliwa:</Text>
132 <Picker style={{width:'50%'}}
133 selectedValue={rodzajPaliwa}
134 onValueChange={(itemValue) => {setPaliwo(itemValue)}}>
135 <Picker.Item label="Benzyna" value="Benzyna"/>
136 <Picker.Item label="Diesel" value="Diesel"/>
137 <Picker.Item label="kWhs" value="kWhs"/>
138 </Picker>
139 <Text>Podaj spalanie:</Text>
140 <TextInput style={styles.TextInput} onChangeText={(val) => setSpalanie(val)}/>
141<View>
142 <Button title="Dodaj" onPress={()=>{
143 var TablicaDoDodania = [];
144 var CurDate = new Date().toUTCString();
145 DodajDoTabeli(nazwaSamochodu,linkZdjecia,rodzajPaliwa,iloscSpalania,CurDate);
146 navigation.navigate("Lista Samochodow");
147 }}/>
148</View>
149 </View>
150 )
151}
152
153export default function App() {
154sqllitedb.transaction(tx => {
155 tx.executeSql(
156 "create table if not exists fury (nazwa text, link text, paliwo text, spalanie text, datadodania text);",[],()=>{console.log("Baza dziala")},(t,e)=>{console.log(t,e)}
157 );
158});
159
160 return (
161 <NavigationContainer>
162 <Stack.Navigator initialRouteName="Lista Samochodow">
163 <Stack.Screen name="Lista Samochodow" component={ListaSamochodow}/>
164 <Stack.Screen name="Szczegoly Samochodu" component={SzczegolySamochodu}/>
165 <Stack.Screen name="Dodaj samochod" component={DodajSamochod}/>
166 </Stack.Navigator>
167 </NavigationContainer>
168 );
169}
170
171const styles = StyleSheet.create({
172 container: {
173 flex: 1,
174 backgroundColor: '#fff',
175 alignItems: 'center',
176 justifyContent: 'center',
177 textAlign: 'center',
178 display: 'flex',
179 },
180 TextInput: {
181 borderWidth: 1,
182 borderColor: '#777',
183 padding: 8,
184 margin: 10,
185 width: 200,
186 },
187 Picker: {
188 height: 50,
189 width: 100,
190 borderColor: '#777'
191 }
192});