├── .expo-shared └── assets.json ├── .gitignore ├── API ├── Controllers │ └── WeatherForecastController.cs ├── FoodDelivery.csproj ├── Program.cs ├── Properties │ └── launchSettings.json ├── Startup.cs ├── WeatherForecast.cs ├── appsettings.Development.json └── appsettings.json ├── App.js ├── Flow Diagrams └── 1.JPG ├── README.html ├── README.md ├── Screenshots ├── 1.JPG ├── 11.JPG ├── 12.JPG ├── 13.JPG ├── 14.JPG ├── 15.JPG ├── 2.JPG ├── 3.JPG ├── 4.JPG ├── 5.JPG ├── 6.JPG ├── 8.JPG ├── 9.JPG ├── Capture.JPG ├── DarkTheme1.JPG ├── DarkTheme3.JPG ├── Darktheme2.JPG └── Notifications.JPG ├── app.json ├── assets ├── favicon.png ├── fonts │ ├── quicksand │ │ ├── Quicksand-Bold.ttf │ │ ├── Quicksand-Light.ttf │ │ ├── Quicksand-Medium.ttf │ │ ├── Quicksand-Regular.ttf │ │ └── Quicksand-SemiBold.ttf │ └── raleway │ │ ├── Raleway-Black.ttf │ │ ├── Raleway-BlackItalic.ttf │ │ ├── Raleway-Bold.ttf │ │ ├── Raleway-BoldItalic.ttf │ │ ├── Raleway-ExtraBold.ttf │ │ ├── Raleway-ExtraBoldItalic.ttf │ │ ├── Raleway-ExtraLight.ttf │ │ ├── Raleway-ExtraLightItalic.ttf │ │ ├── Raleway-Italic.ttf │ │ ├── Raleway-Light.ttf │ │ ├── Raleway-LightItalic.ttf │ │ ├── Raleway-Medium.ttf │ │ ├── Raleway-MediumItalic.ttf │ │ ├── Raleway-Regular.ttf │ │ ├── Raleway-SemiBold.ttf │ │ ├── Raleway-SemiBoldItalic.ttf │ │ ├── Raleway-Thin.ttf │ │ └── Raleway-ThinItalic.ttf ├── icon.png └── splash.png ├── babel.config.js ├── config └── config.json ├── debug.log ├── package-lock.json ├── package.json ├── src ├── components │ ├── FlatText.js │ └── HeadText.js └── screens │ ├── Account.js │ ├── Cart.js │ ├── Checkout.js │ ├── Details.js │ ├── Home.js │ ├── Info.js │ ├── Login.js │ ├── Order.js │ ├── Orderview.js │ ├── Redirect.js │ ├── Register.js │ ├── Reredirect.js │ ├── Search.js │ ├── Settings.js │ ├── Thanks.js │ ├── Welcome.js │ └── section │ └── Header.js └── web-build └── register-service-worker.js /.expo-shared/assets.json: -------------------------------------------------------------------------------- 1 | { 2 | "12bb71342c6255bbf50437ec8f4441c083f47cdb74bd89160c15e4f43e52a1cb": true, 3 | "40b842e832070c58deac6aa9e08fa459302ee3f9da492c7e77d93d2fbf4a56fd": true 4 | } 5 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .expo/ 2 | 3 | # Xcode 4 | !**/*.xcodeproj 5 | !**/*.pbxproj 6 | !**/*.xcworkspacedata 7 | !**/*.xcsettings 8 | !**/*.xcscheme 9 | *.pbxuser 10 | !default.pbxuser 11 | *.mode1v3 12 | !default.mode1v3 13 | *.mode2v3 14 | !default.mode2v3 15 | *.perspectivev3 16 | !default.perspectivev3 17 | xcuserdata 18 | *.xccheckout 19 | *.moved-aside 20 | DerivedData 21 | *.hmap 22 | *.ipa 23 | *.xcuserstate 24 | project.xcworkspace 25 | 26 | # Gradle 27 | /build/ 28 | /packages/react-native-codegen/android/build/ 29 | /packages/react-native-codegen/android/gradlePlugin-build/gradlePlugin/build 30 | /packages/react-native-gradle-plugin/build/ 31 | /packages/rn-tester/android/app/.cxx/ 32 | /packages/rn-tester/android/app/build/ 33 | /packages/rn-tester/android/app/gradle/ 34 | /packages/rn-tester/android/app/gradlew 35 | /packages/rn-tester/android/app/gradlew.bat 36 | /ReactAndroid/build/ 37 | /ReactAndroid/gradle/ 38 | /ReactAndroid/gradlew 39 | /ReactAndroid/gradlew.bat 40 | 41 | # Buck 42 | .buckd 43 | buck-out 44 | /.lsp.buckd 45 | /.lsp-buck-out 46 | /ReactAndroid/src/main/jni/prebuilt/lib/ 47 | /ReactAndroid/src/main/gen 48 | 49 | # Android Studio 50 | .project 51 | .settings 52 | .classpath 53 | 54 | # Watchman 55 | .watchmanconfig 56 | 57 | # Android 58 | .idea 59 | .gradle 60 | local.properties 61 | *.iml 62 | /android/ 63 | 64 | # Node 65 | node_modules 66 | *.log 67 | .nvm 68 | /bots/node_modules/ 69 | package-lock.json 70 | 71 | # OS X 72 | .DS_Store 73 | 74 | # Test generated files 75 | /ReactAndroid/src/androidTest/assets/AndroidTestBundle.js 76 | *.js.meta 77 | 78 | /coverage 79 | /third-party 80 | 81 | # Root dir shouldn't have Xcode project 82 | /*.xcodeproj 83 | 84 | # ReactCommon subdir shouldn't have Xcode project 85 | /ReactCommon/**/*.xcodeproj 86 | /packages/rn-tester/build 87 | /packages/rn-tester/android/app/build/* 88 | 89 | # Libs that shouldn't have Xcode project 90 | /Libraries/FBLazyVector/**/*.xcodeproj 91 | /Libraries/RCTRequired/**/*.xcodeproj 92 | /React/CoreModules/**/*.xcodeproj 93 | /React/FBReactNativeSpec/**/*.xcodeproj 94 | /packages/react-native-codegen/**/*.xcodeproj 95 | 96 | # CocoaPods 97 | /template/ios/Pods/ 98 | /template/ios/Podfile.lock 99 | /packages/rn-tester/Gemfile.lock 100 | 101 | # Ignore RNTester specific Pods, but keep the __offline_mirrors__ here. 102 | /packages/rn-tester/Pods/* 103 | !/packages/rn-tester/Pods/__offline_mirrors__ 104 | 105 | # react-native-codegen 106 | /React/FBReactNativeSpec/FBReactNativeSpec 107 | /packages/react-native-codegen/lib 108 | /ReactCommon/react/renderer/components/rncore/ 109 | 110 | # Visual studio 111 | .vscode 112 | .vs 113 | 114 | # Android memory profiler files 115 | *.hprof 116 | 117 | 118 | *.swp 119 | *.*~ 120 | project.lock.json 121 | .DS_Store 122 | *.pyc 123 | nupkg/ 124 | 125 | # Visual Studio Code 126 | .vscode 127 | 128 | # Rider 129 | .idea 130 | 131 | # User-specific files 132 | *.suo 133 | *.user 134 | *.userosscache 135 | *.sln.docstates 136 | 137 | # Build results 138 | [Dd]ebug/ 139 | [Dd]ebugPublic/ 140 | [Rr]elease/ 141 | [Rr]eleases/ 142 | x64/ 143 | x86/ 144 | build/ 145 | bld/ 146 | [Bb]in/ 147 | [Oo]bj/ 148 | [Oo]ut/ 149 | msbuild.log 150 | msbuild.err 151 | msbuild.wrn 152 | 153 | # Visual Studio 2015 154 | .vs/ -------------------------------------------------------------------------------- /API/Controllers/WeatherForecastController.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Linq; 4 | using System.Threading.Tasks; 5 | using Microsoft.AspNetCore.Mvc; 6 | using Microsoft.Extensions.Logging; 7 | 8 | namespace FoodDelivery 9 | { 10 | [ApiController] 11 | [Route("[controller]")] 12 | public class WeatherForecastController : ControllerBase 13 | { 14 | private static readonly string[] Summaries = new[] 15 | { 16 | "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" 17 | }; 18 | 19 | private readonly ILogger _logger; 20 | 21 | public WeatherForecastController(ILogger logger) 22 | { 23 | _logger = logger; 24 | } 25 | 26 | [HttpGet] 27 | public IEnumerable Get() 28 | { 29 | var rng = new Random(); 30 | return Enumerable.Range(1, 5).Select(index => new WeatherForecast 31 | { 32 | Date = DateTime.Now.AddDays(index), 33 | TemperatureC = rng.Next(-20, 55), 34 | Summary = Summaries[rng.Next(Summaries.Length)] 35 | }) 36 | .ToArray(); 37 | } 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /API/FoodDelivery.csproj: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | net5.0 5 | Grocery_Store_in_Flutter_.Net_Core_Firebase_One_Signal_SQL_Server 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /API/Program.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Linq; 4 | using System.Threading.Tasks; 5 | using Microsoft.AspNetCore.Hosting; 6 | using Microsoft.Extensions.Configuration; 7 | using Microsoft.Extensions.Hosting; 8 | using Microsoft.Extensions.Logging; 9 | 10 | namespace FoodDelivery 11 | { 12 | public class Program 13 | { 14 | public static void Main(string[] args) 15 | { 16 | CreateHostBuilder(args).Build().Run(); 17 | } 18 | 19 | public static IHostBuilder CreateHostBuilder(string[] args) => 20 | Host.CreateDefaultBuilder(args) 21 | .ConfigureWebHostDefaults(webBuilder => 22 | { 23 | webBuilder.UseStartup(); 24 | }); 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /API/Properties/launchSettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "http://json.schemastore.org/launchsettings.json", 3 | "iisSettings": { 4 | "windowsAuthentication": false, 5 | "anonymousAuthentication": true, 6 | "iisExpress": { 7 | "applicationUrl": "http://localhost:53677", 8 | "sslPort": 44356 9 | } 10 | }, 11 | "profiles": { 12 | "IIS Express": { 13 | "commandName": "IISExpress", 14 | "launchBrowser": true, 15 | "launchUrl": "swagger", 16 | "environmentVariables": { 17 | "ASPNETCORE_ENVIRONMENT": "Development" 18 | } 19 | }, 20 | "Grocery_Store_in_Flutter_.Net_Core_Firebase_One_Signal_SQL_Server": { 21 | "commandName": "Project", 22 | "dotnetRunMessages": "true", 23 | "launchBrowser": true, 24 | "launchUrl": "swagger", 25 | "applicationUrl": "https://localhost:5001;http://localhost:5000", 26 | "environmentVariables": { 27 | "ASPNETCORE_ENVIRONMENT": "Development" 28 | } 29 | } 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /API/Startup.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Generic; 3 | using System.Linq; 4 | using System.Threading.Tasks; 5 | using Microsoft.AspNetCore.Builder; 6 | using Microsoft.AspNetCore.Hosting; 7 | using Microsoft.AspNetCore.HttpsPolicy; 8 | using Microsoft.AspNetCore.Mvc; 9 | using Microsoft.Extensions.Configuration; 10 | using Microsoft.Extensions.DependencyInjection; 11 | using Microsoft.Extensions.Hosting; 12 | using Microsoft.Extensions.Logging; 13 | using Microsoft.OpenApi.Models; 14 | 15 | namespace FoodDelivery 16 | { 17 | public class Startup 18 | { 19 | public Startup(IConfiguration configuration) 20 | { 21 | Configuration = configuration; 22 | } 23 | 24 | public IConfiguration Configuration { get; } 25 | 26 | // This method gets called by the runtime. Use this method to add services to the container. 27 | public void ConfigureServices(IServiceCollection services) 28 | { 29 | 30 | services.AddControllers(); 31 | services.AddSwaggerGen(c => 32 | { 33 | c.SwaggerDoc("v1", new OpenApiInfo { Title = "Grocery_Store_in_Flutter_.Net_Core_Firebase_One_Signal_SQL_Server", Version = "v1" }); 34 | }); 35 | } 36 | 37 | // This method gets called by the runtime. Use this method to configure the HTTP request pipeline. 38 | public void Configure(IApplicationBuilder app, IWebHostEnvironment env) 39 | { 40 | if (env.IsDevelopment()) 41 | { 42 | app.UseDeveloperExceptionPage(); 43 | app.UseSwagger(); 44 | app.UseSwaggerUI(c => c.SwaggerEndpoint("/swagger/v1/swagger.json", "Grocery_Store_in_Flutter_.Net_Core_Firebase_One_Signal_SQL_Server v1")); 45 | } 46 | 47 | app.UseHttpsRedirection(); 48 | 49 | app.UseRouting(); 50 | 51 | app.UseAuthorization(); 52 | 53 | app.UseEndpoints(endpoints => 54 | { 55 | endpoints.MapControllers(); 56 | }); 57 | } 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /API/WeatherForecast.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | 3 | namespace FoodDelivery 4 | { 5 | public class WeatherForecast 6 | { 7 | public DateTime Date { get; set; } 8 | 9 | public int TemperatureC { get; set; } 10 | 11 | public int TemperatureF => 32 + (int)(TemperatureC / 0.5556); 12 | 13 | public string Summary { get; set; } 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /API/appsettings.Development.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "LogLevel": { 4 | "Default": "Information", 5 | "Microsoft": "Warning", 6 | "Microsoft.Hosting.Lifetime": "Information" 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /API/appsettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "LogLevel": { 4 | "Default": "Information", 5 | "Microsoft": "Warning", 6 | "Microsoft.Hosting.Lifetime": "Information" 7 | } 8 | }, 9 | "AllowedHosts": "*" 10 | } 11 | -------------------------------------------------------------------------------- /App.js: -------------------------------------------------------------------------------- 1 | import { StatusBar } from 'expo-status-bar'; 2 | import React from 'react'; 3 | import { StyleSheet, Text, View } from 'react-native'; 4 | import { NavigationContainer } from '@react-navigation/native'; 5 | import { createStackNavigator } from '@react-navigation/stack'; 6 | import { createDrawerNavigator } from '@react-navigation/drawer'; 7 | import { createMaterialBottomTabNavigator } from '@react-navigation/material-bottom-tabs'; 8 | import { AntDesign } from '@expo/vector-icons'; 9 | 10 | 11 | 12 | 13 | // import screens 14 | import Welcome from './src/screens/Welcome'; 15 | import Search from './src/screens/Search'; 16 | import Home from './src/screens/Home'; 17 | import Details from './src/screens/Details'; 18 | import Checkout from './src/screens/Checkout'; 19 | import Account from './src/screens/Account'; 20 | import Info from './src/screens/Info'; 21 | import Cart from './src/screens/Cart'; 22 | import Login from './src/screens/Login'; 23 | import Register from './src/screens/Register'; 24 | import Thanks from './src/screens/Thanks'; 25 | import Order from './src/screens/Order'; 26 | import Orderview from './src/screens/Orderview'; 27 | import Redirect from './src/screens/Redirect'; 28 | import Reredirect from './src/screens/Reredirect'; 29 | import Settings from './src/screens/Settings'; 30 | import Header from './src/screens/section/Header'; 31 | 32 | const Stack = createStackNavigator(); 33 | const DrewerStack = createDrawerNavigator(); 34 | const Tab = createMaterialBottomTabNavigator(); 35 | 36 | 37 | const HomeTabScreen = () => ( 38 | 40 | ( 43 | 44 | ), 45 | }}/> 46 | ( 49 | 50 | ), 51 | }}/> 52 | ( 55 | 56 | ), 57 | }}/> 58 | ( 61 | 62 | ), 63 | }}/> 64 | ( 67 | 68 | ), 69 | }} /> 70 | 71 | ) 72 | 73 | export default function App() { 74 | return ( 75 | 76 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | ); 99 | } 100 | 101 | const styles = StyleSheet.create({ 102 | container: { 103 | flex: 1, 104 | backgroundColor: '#fff', 105 | alignItems: 'center', 106 | justifyContent: 'center', 107 | } 108 | 109 | }) 110 | -------------------------------------------------------------------------------- /Flow Diagrams/1.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Flow Diagrams/1.JPG -------------------------------------------------------------------------------- /README.html: -------------------------------------------------------------------------------- 1 | 2 |

:blush: :blush: :blush: Food Order Delivery System is a complete app developed in React Native, Firebase and .Net Core API

3 |

Food Delivery customer app is a multi-restaurant, food ordering app. It’s built on react native(expo). You can easily customize your app favaorites, card payment options, favorite food and all. Food Delivery customer app is fully functional and ready to use the app with .net core backend. 4 |

5 | 6 | 7 | 8 | 9 | 10 | 27 | 45 | 46 |
FeaturesTechnologies Used
11 |
    12 |
  • React Native
    • 13 |
  • DotNet Core
    • 14 |
  • Firebase
    • 15 |
  • Stripe
    • 16 |
  • SCSS
    • 17 |
  • HTML5
    • 18 | Other Features 19 |
  • Font Icons
    • 20 |
  • Google Fonts
    • 21 |
  • Easy to Customize
    • 22 |
  • Cross Browser Optimization
    • 23 |
  • Clean code
    • 24 |
  • Modern Design
    • 25 |
26 | 		28 |
    29 |
  • Search Restaurants
    • 30 |
  • Search Favorite Food
    • 31 |
  • Order Details
    • 32 |
  • Live order tracking
    • 33 |
  • Cash on Delivery
    • 34 |
  • IPhone and android app – 2 in one source code – React Native
    • 35 |
  • Autocomplete Google Maps
    • 36 |
  • Manage Profile
    • 37 |
  • All Order list
    • 38 |
  • Push notifications for order status
    • 39 |
  • Marketing push notification via OneSignal
    • 40 |
  • Payments via Stripe
    • 41 |
  • Time slots on orders
    • 42 |
  • Intuitive address entering
    • 43 |
  • Pickup or Delivery options
    • 44 |
47 | 48 |

The app will serve in Mobile mode compact features.

49 | 50 |

:blush: :blush: :blush: Mobile App Screens

51 | 52 |

53 |

Dark Theme

54 | 55 | 56 | 57 | 58 | 59 |

Fresh Look

60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 |

-------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 |

:blush: :blush: :blush: Food Order Delivery System is a complete app developed in React Native, Firebase and .Net Core API

3 |

Food Delivery customer app is a multi-restaurant, food ordering app. It’s built on react native(expo). You can easily customize your app favaorites, card payment options, favorite food and all. Food Delivery customer app is fully functional and ready to use the app with .net core backend. 4 |

5 | 6 | 7 | 8 | 9 | 10 | 27 | 45 | 46 |
FeaturesTechnologies Used
11 |
    12 |
  • React Native
    • 13 |
  • DotNet Core
    • 14 |
  • Firebase
    • 15 |
  • Stripe
    • 16 |
  • SCSS
    • 17 |
  • HTML5
    • 18 | Other Features 19 |
  • Font Icons
    • 20 |
  • Google Fonts
    • 21 |
  • Easy to Customize
    • 22 |
  • Cross Browser Optimization
    • 23 |
  • Clean code
    • 24 |
  • Modern Design
    • 25 |
26 | 		28 |
    29 |
  • Search Restaurants
    • 30 |
  • Search Favorite Food
    • 31 |
  • Order Details
    • 32 |
  • Live order tracking
    • 33 |
  • Cash on Delivery
    • 34 |
  • IPhone and android app – 2 in one source code – React Native
    • 35 |
  • Autocomplete Google Maps
    • 36 |
  • Manage Profile
    • 37 |
  • All Order list
    • 38 |
  • Push notifications for order status
    • 39 |
  • Marketing push notification via OneSignal
    • 40 |
  • Payments via Stripe
    • 41 |
  • Time slots on orders
    • 42 |
  • Intuitive address entering
    • 43 |
  • Pickup or Delivery options
    • 44 |
47 | 48 |

The app will serve in Mobile mode compact features.

49 | 50 |

:blush: :blush: :blush: Mobile App Screens

51 |

Dark Theme

52 |

53 | 54 | 55 | 56 | 57 | 58 |

59 |

Fresh Look

60 |

61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 |

-------------------------------------------------------------------------------- /Screenshots/1.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/1.JPG -------------------------------------------------------------------------------- /Screenshots/11.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/11.JPG -------------------------------------------------------------------------------- /Screenshots/12.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/12.JPG -------------------------------------------------------------------------------- /Screenshots/13.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/13.JPG -------------------------------------------------------------------------------- /Screenshots/14.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/14.JPG -------------------------------------------------------------------------------- /Screenshots/15.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/15.JPG -------------------------------------------------------------------------------- /Screenshots/2.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/2.JPG -------------------------------------------------------------------------------- /Screenshots/3.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/3.JPG -------------------------------------------------------------------------------- /Screenshots/4.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/4.JPG -------------------------------------------------------------------------------- /Screenshots/5.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/5.JPG -------------------------------------------------------------------------------- /Screenshots/6.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/6.JPG -------------------------------------------------------------------------------- /Screenshots/8.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/8.JPG -------------------------------------------------------------------------------- /Screenshots/9.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/9.JPG -------------------------------------------------------------------------------- /Screenshots/Capture.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/Capture.JPG -------------------------------------------------------------------------------- /Screenshots/DarkTheme1.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/DarkTheme1.JPG -------------------------------------------------------------------------------- /Screenshots/DarkTheme3.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/DarkTheme3.JPG -------------------------------------------------------------------------------- /Screenshots/Darktheme2.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/Darktheme2.JPG -------------------------------------------------------------------------------- /Screenshots/Notifications.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/Screenshots/Notifications.JPG -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "expo": { 3 | "name": "khana", 4 | "slug": "khana", 5 | "version": "1.0.0", 6 | "orientation": "portrait", 7 | "icon": "./assets/icon.png", 8 | "splash": { 9 | "image": "./assets/splash.png", 10 | "resizeMode": "contain", 11 | "backgroundColor": "#ffffff" 12 | }, 13 | "updates": { 14 | "fallbackToCacheTimeout": 0 15 | }, 16 | "assetBundlePatterns": [ 17 | "**/*" 18 | ], 19 | "ios": { 20 | "supportsTablet": true, 21 | "bundleIdentifier": "com.amcoders.khana", 22 | "buildNumber": "1.0.0", 23 | "config": { 24 | "googleMapsApiKey": "" 25 | } 26 | }, 27 | "web": { 28 | "favicon": "./assets/favicon.png" 29 | }, 30 | "android": { 31 | "package": "com.yourcompany.yourappname", 32 | "versionCode": 1, 33 | "config": { 34 | "googleMaps": { "apiKey": "" } 35 | } 36 | } 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /assets/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/favicon.png -------------------------------------------------------------------------------- /assets/fonts/quicksand/Quicksand-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/quicksand/Quicksand-Bold.ttf -------------------------------------------------------------------------------- /assets/fonts/quicksand/Quicksand-Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/quicksand/Quicksand-Light.ttf -------------------------------------------------------------------------------- /assets/fonts/quicksand/Quicksand-Medium.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/quicksand/Quicksand-Medium.ttf -------------------------------------------------------------------------------- /assets/fonts/quicksand/Quicksand-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/quicksand/Quicksand-Regular.ttf -------------------------------------------------------------------------------- /assets/fonts/quicksand/Quicksand-SemiBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/quicksand/Quicksand-SemiBold.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-Black.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-Black.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-BlackItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-BlackItalic.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-Bold.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-BoldItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-BoldItalic.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-ExtraBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-ExtraBold.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-ExtraBoldItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-ExtraBoldItalic.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-ExtraLight.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-ExtraLight.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-ExtraLightItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-ExtraLightItalic.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-Italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-Italic.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-Light.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-LightItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-LightItalic.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-Medium.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-Medium.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-MediumItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-MediumItalic.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-Regular.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-SemiBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-SemiBold.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-SemiBoldItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-SemiBoldItalic.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-Thin.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-Thin.ttf -------------------------------------------------------------------------------- /assets/fonts/raleway/Raleway-ThinItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/fonts/raleway/Raleway-ThinItalic.ttf -------------------------------------------------------------------------------- /assets/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/icon.png -------------------------------------------------------------------------------- /assets/splash.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunilvijayan7/Food-Order-Delivery-System-in-React-Native/5e04cdc7ac226695b8448a1c31a9e0a4085e6bb0/assets/splash.png -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = function(api) { 2 | api.cache(true); 3 | return { 4 | presets: ['babel-preset-expo'], 5 | }; 6 | }; 7 | -------------------------------------------------------------------------------- /config/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "APP_URL": "https://domain.com", 3 | "GOOGLE_MAP_API_KEY": "api_key_here", 4 | "CURRENCY_SYMBOL": "$", 5 | "CURRENCY_CODE": "USD", 6 | "BANNER_IMAGE": "https://i.imgur.com/yjiRzQx.png" 7 | } -------------------------------------------------------------------------------- /debug.log: -------------------------------------------------------------------------------- 1 | [1014/115635.226:ERROR:directory_reader_win.cc(43)] FindFirstFile: The system cannot find the path specified. (0x3) 2 | [1017/151713.187:ERROR:directory_reader_win.cc(43)] FindFirstFile: The system cannot find the path specified. (0x3) 3 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "main": "node_modules/expo/AppEntry.js", 3 | "scripts": { 4 | "start": "expo start", 5 | "android": "expo start --android", 6 | "ios": "expo start --ios", 7 | "web": "expo start --web", 8 | "eject": "expo eject" 9 | }, 10 | "dependencies": { 11 | "@expo-google-fonts/inter": "^0.1.0", 12 | "@react-native-community/async-storage": "^1.12.0", 13 | "@react-native-community/masked-view": "0.1.10", 14 | "@react-navigation/drawer": "^5.9.3", 15 | "@react-navigation/material-bottom-tabs": "^5.2.19", 16 | "@react-navigation/native": "^5.7.3", 17 | "@react-navigation/stack": "^5.9.0", 18 | "expo": "~38.0.8", 19 | "expo-font": "~8.2.1", 20 | "expo-payments-stripe": "~8.2.1", 21 | "expo-status-bar": "^1.0.2", 22 | "geolib": "^3.3.1", 23 | "react": "~16.11.0", 24 | "react-dom": "~16.11.0", 25 | "react-native": "https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz", 26 | "react-native-gesture-handler": "~1.6.0", 27 | "react-native-maps": "^0.27.1", 28 | "react-native-paper": "^4.2.0", 29 | "react-native-reanimated": "~1.9.0", 30 | "react-native-safe-area-context": "~3.0.7", 31 | "react-native-screens": "~2.9.0", 32 | "react-native-simple-toast": "^1.1.3", 33 | "react-native-stripe-payments": "^1.0.5", 34 | "react-native-web": "~0.11.7" 35 | }, 36 | "devDependencies": { 37 | "@babel/core": "^7.8.6", 38 | "babel-preset-expo": "~8.1.0" 39 | }, 40 | "private": true 41 | } 42 | -------------------------------------------------------------------------------- /src/components/FlatText.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Text } from "react-native"; 3 | import { AppLoading } from "expo"; 4 | import { useFonts } from "expo-font"; 5 | 6 | export default function FlatText({ text, font, color, size, textalign }) { 7 | let [fontsLoaded] = useFonts({ 8 | medium: require("../../assets/fonts/raleway/Raleway-Medium.ttf"), 9 | bold: require("../../assets/fonts/raleway/Raleway-Bold.ttf"), 10 | black: require("../../assets/fonts/raleway/Raleway-Black.ttf"), 11 | extrabold: require("../../assets/fonts/raleway/Raleway-ExtraBold.ttf"), 12 | extralight: require("../../assets/fonts/raleway/Raleway-ExtraLight.ttf"), 13 | regular: require("../../assets/fonts/raleway/Raleway-Regular.ttf"), 14 | semibold: require("../../assets/fonts/raleway/Raleway-SemiBold.ttf"), 15 | q_bold: require("../../assets/fonts/quicksand/Quicksand-Bold.ttf"), 16 | q_light: require("../../assets/fonts/quicksand/Quicksand-Light.ttf"), 17 | q_medium: require("../../assets/fonts/quicksand/Quicksand-Medium.ttf"), 18 | q_regular: require("../../assets/fonts/quicksand/Quicksand-Regular.ttf"), 19 | q_semibold: require("../../assets/fonts/quicksand/Quicksand-SemiBold.ttf"), 20 | }); 21 | 22 | if (!fontsLoaded) { 23 | return ; 24 | } else { 25 | return ( 26 | 34 | {text} 35 | 36 | ); 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /src/components/HeadText.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Text } from "react-native"; 3 | import { AppLoading } from "expo"; 4 | import { useFonts } from "expo-font"; 5 | 6 | export default function HeadText({ text, font, color, size, textalign }) { 7 | let [fontsLoaded] = useFonts({ 8 | medium: require("../../assets/fonts/raleway/Raleway-Medium.ttf"), 9 | bold: require("../../assets/fonts/raleway/Raleway-Bold.ttf"), 10 | black: require("../../assets/fonts/raleway/Raleway-Black.ttf"), 11 | extrabold: require("../../assets/fonts/raleway/Raleway-ExtraBold.ttf"), 12 | extralight: require("../../assets/fonts/raleway/Raleway-ExtraLight.ttf"), 13 | regular: require("../../assets/fonts/raleway/Raleway-Regular.ttf"), 14 | semibold: require("../../assets/fonts/raleway/Raleway-SemiBold.ttf"), 15 | q_bold: require("../../assets/fonts/quicksand/Quicksand-Bold.ttf"), 16 | q_light: require("../../assets/fonts/quicksand/Quicksand-Light.ttf"), 17 | q_medium: require("../../assets/fonts/quicksand/Quicksand-Medium.ttf"), 18 | q_regular: require("../../assets/fonts/quicksand/Quicksand-Regular.ttf"), 19 | q_semibold: require("../../assets/fonts/quicksand/Quicksand-SemiBold.ttf"), 20 | }); 21 | 22 | if (!fontsLoaded) { 23 | return ; 24 | } else { 25 | return ( 26 | 36 | {text} 37 | 38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /src/screens/Account.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet, Image } from 'react-native'; 3 | import FlatText from '../components/FlatText'; 4 | import Header from './../screens/section/Header'; 5 | import { Ionicons,Octicons, Feather,AntDesign } from '@expo/vector-icons'; 6 | import { ScrollView, TouchableOpacity } from 'react-native-gesture-handler'; 7 | import AsyncStorage from '@react-native-community/async-storage'; 8 | 9 | import config from '../../config/config.json'; 10 | import { ActivityIndicator } from 'react-native-paper'; 11 | 12 | export default class Account extends Component { 13 | constructor(props) { 14 | super(props); 15 | this.state = { 16 | isLoading: true, 17 | name: "", 18 | avatar: "", 19 | authorization_key: null, 20 | error: false 21 | }; 22 | } 23 | 24 | componentDidMount() { 25 | 26 | setTimeout(() => { 27 | AsyncStorage.getItem('login').then((login) => { 28 | if (login !== null) { 29 | const logininfo = JSON.parse(login) 30 | this.setState({ authorization_key: logininfo.token }); 31 | }else{ 32 | this.props.navigation.navigate('Login',{ 33 | screen: 'Account' 34 | }); 35 | return true; 36 | } 37 | }) 38 | .catch((err) => { 39 | 40 | }); 41 | }, 200); 42 | 43 | 44 | setTimeout(() => { 45 | return fetch(config.APP_URL+'/api/info', { 46 | method: 'POST', 47 | headers: { 48 | Accept: 'application/json', 49 | 'Content-Type': 'application/json', 50 | Authorization: this.state.authorization_key 51 | } 52 | }) 53 | .then((response) => response.json()) 54 | .then((json) => { 55 | this.setState({ 56 | name: json.name, 57 | avatar: json.avatar, 58 | isLoading: false 59 | }) 60 | }) 61 | .catch((error) => { 62 | this.setState({ 63 | isLoading: false, 64 | error: true 65 | }); 66 | }); 67 | },500); 68 | } 69 | 70 | 71 | logout() 72 | { 73 | AsyncStorage.removeItem('login'); 74 | this.props.navigation.navigate('Home'); 75 | } 76 | 77 | render() { 78 | console.disableYellowBox = true; 79 | 80 | 81 | if(this.state.isLoading) 82 | { 83 | return ( 84 | 85 |
86 | 87 | 88 | 89 | 90 | ) 91 | }else{ 92 | if(this.state.error) 93 | { 94 | return ( 95 | 96 |
97 | 98 | 99 | 100 | 101 | ) 102 | }else{ 103 | 104 | return ( 105 | 106 |
107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | this.props.navigation.navigate('Home')}> 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | this.props.navigation.navigate('Order')}> 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | this.props.navigation.navigate('Settings')}> 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | 147 | this.logout()}> 148 | 149 | 150 | 151 | 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | 160 | 161 | ); 162 | } 163 | } 164 | } 165 | } 166 | 167 | 168 | const styles = StyleSheet.create({ 169 | flex: { 170 | flex: 1 171 | }, 172 | conatiner: { 173 | flex: 1, 174 | justifyContent: 'center', 175 | alignItems: 'center', 176 | marginHorizontal: 30, 177 | marginVertical: 30 178 | }, 179 | profileImg: { 180 | width: 100, 181 | height: 100, 182 | borderRadius: 100 183 | }, 184 | username: { 185 | marginTop: 10, 186 | marginBottom: 20 187 | }, 188 | singleList: { 189 | backgroundColor: '#fff', 190 | width: '100%', 191 | borderRadius: 5, 192 | paddingHorizontal: 20, 193 | paddingVertical: 20, 194 | marginBottom: 20 195 | }, 196 | flexDirection: { 197 | flexDirection: 'row', 198 | justifyContent: 'space-between', 199 | width: '100%', 200 | alignItems: 'center' 201 | }, 202 | flexContain: { 203 | flexDirection: 'row', 204 | alignItems: 'center' 205 | }, 206 | icon: { 207 | marginRight: 5 208 | }, 209 | mainContainer: { 210 | flex: 1, 211 | justifyContent: 'center', 212 | alignItems: 'center' 213 | } 214 | }); -------------------------------------------------------------------------------- /src/screens/Cart.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View,StyleSheet,Image,Dimensions,RefreshControl } from 'react-native'; 3 | import { ScrollView, TouchableOpacity } from 'react-native-gesture-handler'; 4 | import FlatText from '../components/FlatText'; 5 | import Header from '../screens/section/Header'; 6 | import { Entypo,MaterialCommunityIcons } from '@expo/vector-icons'; 7 | import AsyncStorage from '@react-native-community/async-storage'; 8 | import { ActivityIndicator } from 'react-native-paper'; 9 | import config from '../../config/config.json'; 10 | const { width } = Dimensions.get('window'); 11 | 12 | export default class Cart extends Component { 13 | constructor(props) { 14 | super(props); 15 | this.state = { 16 | isLoading: true, 17 | dataCart: [], 18 | error: false, 19 | refreshing: false, 20 | }; 21 | } 22 | 23 | onRefresh = () => { 24 | this.setState({ refreshing: true }); 25 | this.componentDidMount(); 26 | 27 | }; 28 | 29 | componentDidMount() 30 | { 31 | AsyncStorage.getItem('cart').then((cart)=>{ 32 | if (cart !== null) { 33 | const cartfood = JSON.parse(cart) 34 | this.setState({dataCart:cartfood,isLoading:false,refreshing: false}); 35 | }else{ 36 | this.setState({isLoading:false,refreshing: false}); 37 | } 38 | }) 39 | .catch((err)=>{ 40 | this.setState({ 41 | isLoading: false, 42 | error: true 43 | }); 44 | }) 45 | } 46 | 47 | onChangeQual(i,type) 48 | { 49 | const dataCar = this.state.dataCart 50 | let cantd = dataCar[i].quantity; 51 | 52 | if (type) { 53 | cantd = cantd + 1 54 | dataCar[i].quantity = cantd 55 | this.setState({dataCart:dataCar}) 56 | AsyncStorage.setItem('cart',JSON.stringify(dataCar)); 57 | } 58 | else if (type==false&&cantd>=2){ 59 | cantd = cantd - 1 60 | dataCar[i].quantity = cantd 61 | this.setState({dataCart:dataCar}) 62 | AsyncStorage.setItem('cart',JSON.stringify(dataCar)); 63 | } 64 | else if (type==false&&cantd==1){ 65 | dataCar.splice(i,1) 66 | this.setState({dataCart:dataCar}) 67 | AsyncStorage.setItem('cart',JSON.stringify(dataCar)); 68 | } 69 | } 70 | 71 | render() { 72 | 73 | if(this.state.isLoading) 74 | { 75 | return ( 76 | 77 |
78 | 79 | 80 | 81 | 82 | ) 83 | }else{ 84 | if(this.state.error) 85 | { 86 | return( 87 | 88 |
89 | 90 | 91 | 92 | 93 | ) 94 | }else{ 95 | if(this.state.dataCart.length > 0) 96 | { 97 | return ( 98 | 99 |
100 | 106 | }> 107 | { 108 | this.state.dataCart.map((item,i) => { 109 | return( 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | {item.quantity == 1 ? 118 | this.onChangeQual(i,false)}> 119 | 120 | 121 | : this.onChangeQual(i,false)}> 122 | 123 | 124 | } 125 | 126 | 127 | this.onChangeQual(i,true)}> 128 | 129 | 130 | 131 | 132 | 133 | 134 | ) 135 | }) 136 | } 137 | 138 | 139 | this.props.navigation.navigate('Checkout')}> 140 | 141 | 142 | 143 | 144 | ); 145 | }else{ 146 | return( 147 | 148 |
149 | 150 | 151 | 152 | 153 | ) 154 | } 155 | } 156 | } 157 | } 158 | } 159 | 160 | const styles = StyleSheet.create({ 161 | flex: { 162 | flex: 1, 163 | }, 164 | cartItemImage: { 165 | width: 100, 166 | height: 100, 167 | borderRadius: 50 168 | }, 169 | singleCartItem: { 170 | marginHorizontal: 20, 171 | marginVertical: 20, 172 | borderBottomWidth: 1, 173 | paddingBottom: 20, 174 | borderBottomColor: '#ddd', 175 | width: width, 176 | flexDirection: 'row', 177 | alignItems: 'center', 178 | flex: 1 179 | }, 180 | cartRightSection:{ 181 | flexDirection: 'row', 182 | marginTop: 15, 183 | justifyContent: 'space-between' 184 | }, 185 | widthSection: { 186 | width: width - 140, 187 | paddingLeft: 10 188 | }, 189 | qualityCart: { 190 | flexDirection: 'row', 191 | alignItems: 'center' 192 | }, 193 | bottomButton: { 194 | alignItems: 'center', 195 | backgroundColor: '#C01C27', 196 | paddingVertical: 20 197 | }, 198 | mainContainer: { 199 | flex: 1, 200 | justifyContent: 'center', 201 | alignItems: 'center' 202 | }, 203 | scrollHeight: { 204 | flex: 1 205 | } 206 | }); -------------------------------------------------------------------------------- /src/screens/Checkout.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet } from 'react-native'; 3 | import { ScrollView, TextInput, TouchableOpacity } from 'react-native-gesture-handler'; 4 | import FlatText from '../components/FlatText'; 5 | import Header from './../screens/section/Header'; 6 | import * as geolib from 'geolib'; 7 | import Toast from 'react-native-simple-toast'; 8 | 9 | import config from '../../config/config.json'; 10 | 11 | import AsyncStorage from '@react-native-community/async-storage'; 12 | import { ActivityIndicator } from 'react-native-paper'; 13 | 14 | 15 | export default class Checkout extends Component { 16 | constructor(props) { 17 | super(props); 18 | this.state = { 19 | isLoading: true, 20 | latitude: 0, 21 | longitude: 0, 22 | storelatitude: 0, 23 | storelongitude: 0, 24 | city: "", 25 | address: "", 26 | name: "", 27 | km_fee: 0, 28 | delivery_fee: 0, 29 | dataCart: [], 30 | username: "", 31 | usernumber: "", 32 | authorization_key: null, 33 | vendor_id: null, 34 | place_order: "Place Order", 35 | error: false 36 | }; 37 | } 38 | 39 | componentDidMount() { 40 | 41 | AsyncStorage.getItem('login').then((login) => { 42 | if (login !== null) { 43 | const logininfo = JSON.parse(login) 44 | this.setState({ authorization_key: logininfo.token, isLoading: false }); 45 | } 46 | }) 47 | .catch((err) => { 48 | this.setState({ 49 | isLoading: false, 50 | error: true 51 | }); 52 | }) 53 | 54 | AsyncStorage.getItem('store').then((storedata) => { 55 | if (storedata !== null) { 56 | const info = JSON.parse(storedata) 57 | this.setState({ 58 | storelatitude: info.latitude, 59 | storelongitude: info.longitude, 60 | name: info.name, 61 | vendor_id: info.id, 62 | isLoading: false 63 | }) 64 | } 65 | }) 66 | .catch((err) => { 67 | this.setState({ 68 | isLoading: false, 69 | error: true 70 | }); 71 | }); 72 | 73 | AsyncStorage.getItem('location').then((location) => { 74 | if (location !== null) { 75 | const locationdata = JSON.parse(location) 76 | this.setState({ 77 | latitude: locationdata.latitude, 78 | longitude: locationdata.longitude, 79 | city: locationdata.city, 80 | address: locationdata.address, 81 | isLoading: false 82 | }) 83 | } 84 | }) 85 | .catch((err) => { 86 | this.setState({ 87 | isLoading: false, 88 | error: true 89 | }); 90 | }); 91 | 92 | AsyncStorage.getItem('cart').then((cart) => { 93 | if (cart !== null) { 94 | // We have data!! 95 | const cartfood = JSON.parse(cart) 96 | this.setState({ dataCart: cartfood, isLoading: false }) 97 | } 98 | }) 99 | .catch((err) => { 100 | this.setState({ 101 | isLoading: false, 102 | error: true 103 | }); 104 | }) 105 | 106 | fetch(config.APP_URL + '/api/delivery_fee', { 107 | method: 'GET', 108 | headers: { 109 | Accept: 'application/json', 110 | 'Content-Type': 'application/json' 111 | } 112 | }) 113 | .then((response) => response.json()) 114 | .then((json) => { 115 | this.setState({ 116 | km_fee: json, 117 | isLoading: false, 118 | refreshing: false, 119 | }) 120 | 121 | }) 122 | .catch((error) => { 123 | this.setState({ 124 | isLoading: false, 125 | error: true 126 | }) 127 | }); 128 | 129 | 130 | 131 | this.distance(); 132 | } 133 | 134 | 135 | loginCheck() { 136 | AsyncStorage.getItem('login').then((login) => { 137 | if (login !== null) { 138 | const logininfo = JSON.parse(login) 139 | this.setState({ authorization_key: logininfo.token }); 140 | } 141 | }) 142 | .catch((err) => { 143 | this.setState({ 144 | isLoading: false, 145 | error: true 146 | }); 147 | }) 148 | } 149 | 150 | 151 | handleText = (text) => { 152 | this.setState({ username: text }); 153 | }; 154 | 155 | handlePhone = (text) => { 156 | this.setState({ usernumber: text }); 157 | }; 158 | 159 | distance() { 160 | setTimeout(() => { 161 | var data = geolib.getDistance( 162 | { latitude: this.state.latitude, longitude: this.state.longitude }, 163 | { latitude: this.state.storelatitude, longitude: this.state.storelongitude } 164 | ); 165 | 166 | var km = data / 1000; 167 | 168 | var delivery_fee = km * this.state.km_fee; 169 | this.setState({ delivery_fee: delivery_fee }); 170 | 171 | }, 1000); 172 | } 173 | 174 | NumberFormat(number, decPlaces, decSep, thouSep) { 175 | decPlaces = isNaN(decPlaces = Math.abs(decPlaces)) ? 2 : decPlaces, 176 | decSep = typeof decSep === "undefined" ? "." : decSep; 177 | thouSep = typeof thouSep === "undefined" ? "," : thouSep; 178 | var sign = number < 0 ? "-" : ""; 179 | var i = String(parseInt(number = Math.abs(Number(number) || 0).toFixed(decPlaces))); 180 | var j = (j = i.length) > 3 ? j % 3 : 0; 181 | 182 | return sign + 183 | (j ? i.substr(0, j) + thouSep : "") + 184 | i.substr(j).replace(/(\decSep{3})(?=\decSep)/g, "$1" + thouSep) + 185 | (decPlaces ? decSep + Math.abs(number - i).toFixed(decPlaces).slice(2) : ""); 186 | } 187 | 188 | subtotal() { 189 | var total = 0; 190 | const cart = this.state.dataCart; 191 | 192 | for (var i = 0; i < cart.length; i++) { 193 | total = total + (cart[i].price * cart[i].quantity) 194 | } 195 | var total_price = this.NumberFormat(total); 196 | return total_price; 197 | } 198 | 199 | total() { 200 | var total = 0; 201 | const cart = this.state.dataCart; 202 | 203 | for (var i = 0; i < cart.length; i++) { 204 | total = total + (cart[i].price * cart[i].quantity) 205 | } 206 | var total_price = this.NumberFormat(total + this.state.delivery_fee); 207 | return total_price; 208 | } 209 | 210 | create_order() { 211 | 212 | this.setState({ place_order: 'Please Wait...' }); 213 | 214 | this.loginCheck(); 215 | 216 | setTimeout(() => { 217 | if (this.state.authorization_key == null) { 218 | this.props.navigation.navigate('Login', { 219 | screen: 'Checkout' 220 | }); 221 | this.setState({ place_order: 'Place Order' }); 222 | return true; 223 | } 224 | 225 | 226 | if (this.state.username == '') { 227 | Toast.showWithGravity('The Name filed is required', Toast.LONG, Toast.CENTER); 228 | this.setState({ place_order: 'Place Order' }); 229 | return true; 230 | } 231 | 232 | if (this.state.usernumber == '') { 233 | Toast.showWithGravity( 234 | "The Phone Number filed is required", 235 | Toast.SHORT, 236 | Toast.CENTER 237 | ); 238 | this.setState({ place_order: 'Place Order' }); 239 | return true; 240 | } 241 | 242 | if (!this.state.dataCart.length > 0) { 243 | Toast.showWithGravity( 244 | "Your Cart is Empty", 245 | Toast.SHORT, 246 | Toast.CENTER 247 | ); 248 | this.setState({ place_order: 'Place Order' }); 249 | return true; 250 | } 251 | let str = this.NumberFormat(this.total()); 252 | let totalAmount = str.replace(',', ''); 253 | fetch(config.APP_URL + '/api/create_order', { 254 | method: 'POST', 255 | headers: { 256 | Accept: 'application/json', 257 | 'Content-Type': 'application/json', 258 | Authorization: this.state.authorization_key 259 | }, 260 | body: JSON.stringify({ 261 | vendor_id: this.state.vendor_id, 262 | order_type: 1, 263 | payment_method: 'cod', 264 | payment_status: 0, 265 | total: totalAmount, 266 | shipping: this.state.delivery_fee, 267 | commission: 0, 268 | discount: 0.00, 269 | status: 2, 270 | name: this.state.username, 271 | phone: this.state.usernumber, 272 | delivery_address: this.state.address, 273 | latitude: this.state.latitude, 274 | longitude: this.state.longitude, 275 | order_note: 'Lorem ispum', 276 | datacart: this.state.dataCart, 277 | }) 278 | }).then((response) => response.json()) 279 | .then((json) => { 280 | this.setState({ place_order: 'Place Order' }); 281 | AsyncStorage.removeItem('cart'); 282 | AsyncStorage.removeItem('store'); 283 | this.props.navigation.navigate('Thanks'); 284 | }) 285 | .catch((error) => { 286 | this.setState({ 287 | isLoading: false, 288 | error: true 289 | }); 290 | }); 291 | }, 100); 292 | 293 | } 294 | 295 | render() { 296 | 297 | 298 | if (this.state.isLoading) { 299 | return ( 300 | 301 |
302 | 303 | 304 | 305 | 306 | ) 307 | } else { 308 | if (this.state.error) { 309 | return ( 310 | 311 |
312 | 313 | 314 | 315 | 316 | ) 317 | } else { 318 | return ( 319 | 320 |
321 | 322 | 323 | 324 | 325 | 326 | 327 | {this.state.dataCart.map((item, i) => { 328 | return ( 329 | 330 | 331 | 332 | 333 | 334 | 335 | 336 | 337 | ) 338 | })} 339 | 340 | 341 | 342 | 343 | 344 | 345 | 346 | 347 | 348 | 349 | 350 | 351 | 352 | 353 | 354 | 355 | 356 | 357 | 358 | 359 | 360 | 361 | 362 | 363 | 364 | 365 | 366 | 367 | 368 | 369 | 370 | 371 | 372 | 373 | 374 | this.handleText(text)} /> 375 | 376 | 377 | 378 | this.handlePhone(text)} /> 379 | 380 | 381 | 382 | 383 | 384 | 385 | this.create_order()}> 386 | 387 | 388 | 389 | 390 | 391 | 392 | 393 | ); 394 | } 395 | } 396 | } 397 | } 398 | 399 | const styles = StyleSheet.create({ 400 | mainContainer: { 401 | marginHorizontal: 10, 402 | marginVertical: 10, 403 | backgroundColor: '#fff', 404 | paddingVertical: 20, 405 | paddingHorizontal: 20, 406 | borderRadius: 5 407 | }, 408 | checkoutForm: { 409 | marginVertical: 20 410 | }, 411 | deliveryTitle: { 412 | borderBottomWidth: 1, 413 | borderBottomColor: '#ddd', 414 | paddingBottom: 20 415 | }, 416 | inputText: { 417 | borderWidth: 1, 418 | borderColor: '#ddd', 419 | borderRadius: 5, 420 | paddingHorizontal: 15, 421 | paddingVertical: 10, 422 | marginTop: 10, 423 | color: '#333' 424 | }, 425 | formGroup: { 426 | marginBottom: 20 427 | }, 428 | textarea: { 429 | borderWidth: 1, 430 | borderColor: '#ddd', 431 | borderRadius: 5, 432 | paddingHorizontal: 15, 433 | paddingVertical: 10, 434 | marginTop: 10, 435 | color: '#333', 436 | paddingBottom: 50 437 | }, 438 | orderConfirm: { 439 | backgroundColor: '#ff3252', 440 | paddingVertical: 20, 441 | alignItems: 'center', 442 | borderRadius: 5, 443 | marginBottom: 80 444 | }, 445 | StoreName: { 446 | borderBottomWidth: 1, 447 | borderBottomColor: '#ddd', 448 | paddingBottom: 20, 449 | alignItems: 'center' 450 | }, 451 | cartItem: { 452 | flexDirection: 'row', 453 | justifyContent: 'space-between', 454 | marginTop: 15 455 | }, 456 | CartGroup: { 457 | borderBottomWidth: 1, 458 | borderBottomColor: '#ddd', 459 | paddingBottom: 20 460 | }, 461 | paymentMethod: { 462 | flexDirection: 'row', 463 | marginTop: 10 464 | }, 465 | buttonMethod: { 466 | backgroundColor: "#ddd", 467 | marginRight: 10, 468 | paddingHorizontal: 10, 469 | paddingVertical: 10, 470 | borderRadius: 5 471 | }, 472 | buttonMethodActive: { 473 | backgroundColor: "#ddd", 474 | marginRight: 10, 475 | paddingHorizontal: 10, 476 | paddingVertical: 10, 477 | borderRadius: 5, 478 | color: '#fff' 479 | }, 480 | mergeGroup: { 481 | flexDirection: 'row', 482 | justifyContent: 'space-between' 483 | }, 484 | cardForm: { 485 | marginTop: 10 486 | }, 487 | flex: { 488 | flex: 1 489 | }, 490 | container: { 491 | flex: 1, 492 | justifyContent: 'center', 493 | alignItems: 'center' 494 | } 495 | }); -------------------------------------------------------------------------------- /src/screens/Details.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet, ImageBackground, Dimensions, Image, YellowBox, Share, RefreshControl, ActivityIndicator } from 'react-native'; 3 | import { AntDesign } from '@expo/vector-icons'; 4 | import { FlatList, ScrollView, TouchableOpacity } from 'react-native-gesture-handler'; 5 | import FlatText from '../components/FlatText'; 6 | import { Entypo, Feather } from '@expo/vector-icons'; 7 | import AsyncStorage from '@react-native-community/async-storage'; 8 | 9 | import config from '../../config/config.json'; 10 | import Header from './section/Header'; 11 | 12 | const { width } = Dimensions.get('window'); 13 | 14 | class Details extends Component { 15 | constructor(props) { 16 | super(props); 17 | this.state = { 18 | isLoading: true, 19 | dataFood: [], 20 | name: "", 21 | delivery_time: 0, 22 | ratting: 0, 23 | reviews: [], 24 | avg_ratting: 0, 25 | preview: "", 26 | dataCart: [], 27 | latitude: 0, 28 | longitude: 0, 29 | menus: [], 30 | selectMenu: 0, 31 | id: null, 32 | shopday: [], 33 | about: [], 34 | slug: "", 35 | error: false, 36 | refreshing: false, 37 | } 38 | } 39 | 40 | onRefresh = () => { 41 | this.setState({ refreshing: true }); 42 | this.componentDidMount(); 43 | 44 | }; 45 | 46 | componentDidMount() { 47 | AsyncStorage.getItem('cart').then((cart) => { 48 | if (cart !== null) { 49 | // We have data!! 50 | const cartfood = JSON.parse(cart) 51 | this.setState({ dataCart: cartfood }) 52 | } 53 | }) 54 | .catch((err) => { 55 | this.setState({ 56 | isLoading: false, 57 | error: true 58 | }) 59 | }) 60 | 61 | const { id } = this.props.route.params; 62 | return fetch(config.APP_URL + '/api/restaurant/'+id+'', { 63 | method: 'GET', 64 | headers: { 65 | Accept: 'application/json', 66 | 'Content-Type': 'application/json' 67 | } 68 | }) 69 | .then((response) => response.json()) 70 | .then((json) => { 71 | this.setState({ 72 | name: json.info.info.name, 73 | slug: json.info.info.slug, 74 | id: json.info.info.id, 75 | delivery_time: json.info.info.delivery, 76 | ratting: json.info.info.reviews.length, 77 | avg_ratting: json.info.info.avg_ratting, 78 | preview: json.info.info.preview, 79 | dataFood: json.products, 80 | latitude: parseFloat(json.info.info.location.latitude), 81 | longitude: parseFloat(json.info.info.location.longitude), 82 | menus: json.menus, 83 | reviews: json.info.info.reviews, 84 | shopday: json.info.info.shopday, 85 | about: json.info.info.about, 86 | isLoading: false, 87 | refreshing: false, 88 | }) 89 | 90 | let dta = { 91 | "name": "Reset", 92 | "id": 0, 93 | } 94 | 95 | let menu = this.state.menus; 96 | if (menu.length > 0) { 97 | menu.push(dta); 98 | } 99 | 100 | 101 | 102 | }) 103 | .catch((error) => { 104 | this.setState({ 105 | isLoading: false, 106 | error: true 107 | }) 108 | }); 109 | } 110 | 111 | onLoadTotal() { 112 | var total = 0; 113 | const cart = this.state.dataCart; 114 | 115 | for (var i = 0; i < cart.length; i++) { 116 | total = total + (cart[i].price * cart[i].quantity) 117 | } 118 | return total; 119 | } 120 | 121 | onloadQty() { 122 | var qty = 0; 123 | const cart = this.state.dataCart; 124 | 125 | for (var i = 0; i < cart.length; i++) { 126 | qty = qty + cart[i].quantity; 127 | } 128 | 129 | return qty; 130 | } 131 | 132 | 133 | render() { 134 | 135 | YellowBox.ignoreWarnings([ 136 | 'VirtualizedLists should never be nested', // TODO: Remove when fixed 137 | ]); 138 | 139 | const onShare = async () => { 140 | try { 141 | const result = await Share.share({ 142 | message: 143 | '' + config.APP_URL + '/store/' + this.state.slug + '', 144 | }); 145 | if (result.action === Share.sharedAction) { 146 | if (result.activityType) { 147 | // shared with activity type of result.activityType 148 | } else { 149 | // shared 150 | } 151 | } else if (result.action === Share.dismissedAction) { 152 | // dismissed 153 | } 154 | } catch (error) { 155 | this.setState({ 156 | isLoading: false, 157 | error: true 158 | }) 159 | } 160 | }; 161 | 162 | if (this.state.isLoading) { 163 | return ( 164 | 165 |
166 | 167 | 168 | 169 | 170 | ) 171 | } else { 172 | if (this.state.error) { 173 | return ( 174 | 175 |
176 | 177 | 178 | 179 | 180 | ) 181 | } else { 182 | return ( 183 | 184 | 185 | 186 | 187 | 188 | this.props.navigation.goBack()}> 189 | 190 | 191 | 192 | 193 | 194 | 195 | 196 | this.props.navigation.navigate('Info', 197 | { 198 | preview: this.state.preview, 199 | name: this.state.name, 200 | about: this.state.about, 201 | shopday: this.state.shopday, 202 | reviews: this.state.reviews, 203 | latitude: this.state.latitude, 204 | longitude: this.state.longitude, 205 | ratting: this.state.ratting, 206 | avg: this.state.avg_ratting 207 | } 208 | )}> 209 | 210 | 211 | 212 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | 227 | { this.state.dataFood.length > 0 ? 228 | 229 | 230 | this._renderMenuItem(item)} 236 | keyExtractor={(item, index) => index.toString()} 237 | 238 | /> 239 | 240 | 241 | 247 | }> 248 | 249 | this._renderItemFood(item)} 253 | keyExtractor={(item, index) => index.toString()} 254 | /> 255 | 256 | 257 | 258 | this.props.navigation.navigate('Cart')}> 259 | 260 | 261 | 262 | 263 | 264 | 265 | 266 | 267 | 268 | 269 | 270 | 271 | 272 | 273 | 274 | 275 | : 276 | 277 | 278 | 279 | } 280 | 281 | ) 282 | } 283 | } 284 | } 285 | _renderItemFood(item) { 286 | let catg = this.state.selectMenu; 287 | 288 | var productMenu = []; 289 | 290 | for (let row of item.postcategory) { 291 | let cat = parseInt(row.category_id); 292 | productMenu.push(cat); 293 | } 294 | 295 | if (catg == 0 || productMenu.includes(catg)) { 296 | 297 | 298 | return ( 299 | 300 | this.onClickAddCart(item)}> 301 | 302 | 303 | 304 | 305 | 306 | 307 | 308 | 309 | 310 | 311 | 312 | 313 | 314 | 315 | 316 | 317 | ); 318 | } 319 | } 320 | 321 | _renderMenuItem(item) { 322 | return ( 323 | this.setState({ selectMenu: item.id })}> 324 | 325 | 326 | 327 | 328 | 329 | 330 | ) 331 | } 332 | 333 | onClickAddCart(data) { 334 | 335 | const itemcart = { 336 | food: data, 337 | quantity: 1, 338 | price: data.price.price 339 | } 340 | 341 | const storedata = { 342 | latitude: this.state.latitude, 343 | longitude: this.state.longitude, 344 | name: this.state.name, 345 | id: this.state.id 346 | } 347 | 348 | AsyncStorage.getItem('store').then(() => { 349 | AsyncStorage.setItem('store', JSON.stringify(storedata)); 350 | }) 351 | .catch((err) => { 352 | alert(err) 353 | }) 354 | 355 | AsyncStorage.getItem('cart').then((datacart) => { 356 | if (datacart !== null) { 357 | // We have data!! 358 | const cart = JSON.parse(datacart) 359 | cart.push(itemcart) 360 | AsyncStorage.setItem('cart', JSON.stringify(cart)); 361 | this.setState({ dataCart: cart }); 362 | } 363 | else { 364 | const cart = [] 365 | cart.push(itemcart) 366 | AsyncStorage.setItem('cart', JSON.stringify(cart)); 367 | this.setState({ dataCart: cart }); 368 | } 369 | }) 370 | .catch((err) => { 371 | alert(err) 372 | }) 373 | } 374 | 375 | } 376 | 377 | export default Details; 378 | 379 | const styles = StyleSheet.create({ 380 | flex: { 381 | flex: 1 382 | }, 383 | backgroundImage: { 384 | width: width, 385 | height: 300 386 | }, 387 | overlay: { 388 | ...StyleSheet.absoluteFillObject, 389 | backgroundColor: 'rgba(0,0,0,0.5)' 390 | }, 391 | foodList: { 392 | paddingVertical: 20, 393 | paddingHorizontal: 20, 394 | flex: 1 395 | }, 396 | singleFood: { 397 | width: ((width / 2) - 20) - 10, 398 | paddingHorizontal: 10, 399 | paddingVertical: 10, 400 | backgroundColor: '#fff', 401 | borderRadius: 5, 402 | marginRight: 20, 403 | marginBottom: 20 404 | }, 405 | 406 | menuItem: { 407 | width: ((width / 2) - 20) - 10, 408 | marginTop: 20, 409 | backgroundColor: '#fff', 410 | marginBottom: 20, 411 | paddingVertical: 25, 412 | marginRight: 20, 413 | borderRadius: 10, 414 | }, 415 | 416 | foodImage: { 417 | width: '100%', 418 | height: 150, 419 | borderRadius: 5 420 | }, 421 | foodTitle: { 422 | marginTop: 5, 423 | marginBottom: 5 424 | }, 425 | 426 | menuTitle: { 427 | flexDirection: 'row', 428 | justifyContent: 'center', 429 | alignItems: 'center' 430 | }, 431 | foodPrice: { 432 | flexDirection: 'row', 433 | justifyContent: 'space-between', 434 | alignItems: 'center' 435 | }, 436 | cartBar: { 437 | backgroundColor: '#ff3252', 438 | paddingHorizontal: 20, 439 | flexDirection: 'row', 440 | justifyContent: 'space-between', 441 | paddingVertical: 20 442 | }, 443 | leftCartBar: { 444 | flexDirection: 'row' 445 | }, 446 | rightCarBar: { 447 | flexDirection: 'row' 448 | }, 449 | carBarIcon: { 450 | marginTop: 5, 451 | marginLeft: 5 452 | }, 453 | mainContainer: { 454 | flex: 1, 455 | justifyContent: 'center', 456 | alignItems: 'center' 457 | }, 458 | detailsImageContent: { 459 | flexDirection: 'row', 460 | justifyContent: 'space-between', 461 | marginTop: 50, 462 | paddingHorizontal: 15 463 | }, 464 | backBtn: { 465 | backgroundColor: '#fff', 466 | paddingHorizontal: 10, 467 | paddingVertical: 10, 468 | borderRadius: 30 469 | }, 470 | shareBtn: { 471 | backgroundColor: '#fff', 472 | padding: 10, 473 | borderRadius: 50, 474 | marginRight: 10 475 | }, 476 | infoBtn: { 477 | backgroundColor: '#fff', 478 | padding: 10, 479 | borderRadius: 50 480 | }, 481 | bgImageInfoArea: { 482 | flex: 1, 483 | justifyContent: 'center', 484 | alignItems: 'center' 485 | }, 486 | deliveryTime: { 487 | borderWidth: 1, 488 | borderColor: '#fff', 489 | paddingHorizontal: 10, 490 | paddingVertical: 5, 491 | borderRadius: 5, 492 | marginTop: 10 493 | }, 494 | marginTop: { 495 | marginTop: 10 496 | }, 497 | reviewContent: { 498 | flexDirection: 'row', 499 | alignItems: 'center' 500 | }, 501 | marginRight: { 502 | marginRight: 5 503 | }, 504 | renderMenuItem: { 505 | marginHorizontal: 20 506 | }, 507 | height70: { 508 | height: 75 509 | }, 510 | flexRow: { 511 | flexDirection: 'row' 512 | } 513 | }); 514 | -------------------------------------------------------------------------------- /src/screens/Home.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet, Image, ActivityIndicator,RefreshControl,ImageBackground } from 'react-native'; 3 | 4 | import AsyncStorage from '@react-native-community/async-storage'; 5 | 6 | import config from '../.././config/config.json'; 7 | // import header 8 | import Header from './section/Header'; 9 | import { ScrollView, TouchableOpacity, FlatList } from 'react-native-gesture-handler'; 10 | import FlatText from '../components/FlatText'; 11 | import { Entypo } from '@expo/vector-icons'; 12 | 13 | class Home extends Component { 14 | constructor(props) { 15 | super(props); 16 | this.state = { 17 | isLoading: true, 18 | latitude: '', 19 | longitude: '', 20 | city: '', 21 | address: '', 22 | city_id: null, 23 | Offerresturants: [], 24 | AllResturents: [], 25 | Categories: [], 26 | PageNo: 1, 27 | selectCatg: 0, 28 | error: false, 29 | refreshing: false, 30 | reload: 'no' 31 | } 32 | } 33 | 34 | onRefresh = () => { 35 | this.setState({ refreshing: true }); 36 | this.componentDidMount(); 37 | }; 38 | 39 | 40 | componentDidMount() { 41 | 42 | this.props.navigation.addListener('focus', () => { 43 | AsyncStorage.getItem('location').then((location) => { 44 | if (location !== null) { 45 | // We have data!! 46 | const locationdata = JSON.parse(location) 47 | this.setState({ 48 | latitude: locationdata.latitude, 49 | longitude: locationdata.longitude, 50 | city: locationdata.city, 51 | address: locationdata.address, 52 | city_id:locationdata.city_id, 53 | refreshing: false 54 | }) 55 | }else{ 56 | 57 | } 58 | }) 59 | .catch((err) => { 60 | 61 | }); 62 | 63 | setTimeout(() => { 64 | let city_id = this.state.city_id; 65 | 66 | fetch(config.APP_URL + '/api/home/' + city_id, { 67 | method: 'GET', 68 | headers: { 69 | Accept: 'application/json', 70 | 'Content-Type': 'application/json' 71 | } 72 | }) 73 | .then((response) => response.json()) 74 | .then((json) => { 75 | this.setState({ 76 | Offerresturants: json.offerables.data, 77 | AllResturents: [...json.all_resturants.data], 78 | Categories: json.categories, 79 | isLoading: false 80 | }) 81 | }) 82 | .catch((error) => { 83 | this.setState({ 84 | error: true, 85 | isLoading: false 86 | }) 87 | }); 88 | }, 100); 89 | }); 90 | 91 | AsyncStorage.getItem('location').then((location) => { 92 | if (location !== null) { 93 | // We have data!! 94 | const locationdata = JSON.parse(location) 95 | this.setState({ 96 | latitude: locationdata.latitude, 97 | longitude: locationdata.longitude, 98 | city: locationdata.city, 99 | address: locationdata.address, 100 | city_id:locationdata.city_id, 101 | refreshing: false 102 | }) 103 | }else{ 104 | 105 | } 106 | }) 107 | .catch((err) => { 108 | 109 | }); 110 | 111 | setTimeout(() => { 112 | let city_id = this.state.city_id; 113 | 114 | fetch(config.APP_URL + '/api/home/' + city_id, { 115 | method: 'GET', 116 | headers: { 117 | Accept: 'application/json', 118 | 'Content-Type': 'application/json' 119 | } 120 | }) 121 | .then((response) => response.json()) 122 | .then((json) => { 123 | this.setState({ 124 | Offerresturants: json.offerables.data, 125 | AllResturents: [...json.all_resturants.data], 126 | Categories: json.categories, 127 | isLoading: false 128 | }) 129 | }) 130 | .catch((error) => { 131 | this.setState({ 132 | error: true, 133 | isLoading: false 134 | }) 135 | }); 136 | }, 100); 137 | 138 | 139 | } 140 | 141 | 142 | 143 | LoadResturants() { 144 | let page_no = this.state.PageNo; 145 | let city_id = this.state.city_id; 146 | setTimeout(() => { 147 | 148 | return fetch(config.APP_URL + '/api/get_resturents/' + city_id + '?page=' + page_no, { 149 | method: 'GET', 150 | headers: { 151 | Accept: 'application/json', 152 | 'Content-Type': 'application/json' 153 | } 154 | }) 155 | .then((response) => response.json()) 156 | .then((json) => { 157 | this.setState({ 158 | AllResturents: [...json.all_restaurants.data], 159 | isLoading: false 160 | }) 161 | }) 162 | .catch((error) => { 163 | this.setState({ 164 | isLoading: false 165 | }); 166 | }); 167 | }, 1500) 168 | } 169 | 170 | LoadMore = () => { 171 | this.setState({ 172 | PageNo: this.state.PageNo + 1, 173 | }, 174 | () => { 175 | this.LoadResturants(); 176 | } 177 | ); 178 | } 179 | 180 | _renderItem(item) { 181 | return ( 182 | this.props.navigation.navigate('Details',{ id: item.offerables.restaurants.id })}> 183 | 184 | 185 | 186 | 187 | 188 | 189 | 190 | ) 191 | } 192 | 193 | _renderCategory(item) { 194 | return ( 195 | this.setState({ selectCatg: item.id })} style={styles.renderCategory}> 196 | 197 | 198 | 199 | 200 | 201 | 202 | 203 | 204 | 205 | ) 206 | } 207 | 208 | render() { 209 | console.disableYellowBox = true; 210 | 211 | 212 | if(this.state.isLoading) 213 | { 214 | return ( 215 | 216 |
217 | 218 | 219 | 220 | 221 | ) 222 | }else{ 223 | if(this.state.error) 224 | { 225 | return ( 226 | 227 |
228 | 229 | 230 | 231 | 232 | ) 233 | }else{ 234 | if(this.state.city_id == null) 235 | { 236 | return ( 237 | 238 |
239 | 240 | 241 | 242 | 243 | ) 244 | }else{ 245 | 246 | return ( 247 | 248 |
249 | 255 | }> 256 | 257 | 258 | 259 | this._renderItem(item)} 264 | keyExtractor={(item, index) => index.toString()} 265 | /> 266 | 267 | 268 | 269 | this._renderCategory(item)} 274 | keyExtractor={(item, index) => index.toString()} 275 | /> 276 | 277 | 278 | 279 | 280 | this.setState({ selectCatg: 0, isLoading: false })} style={styles.paddingLeft}> 281 | 282 | this._renderAllResturents(item)} 285 | keyExtractor={(item, index) => index.toString()} 286 | onEndReached={this.LoadMore} 287 | onEndReachedThreshold={100} 288 | /> 289 | 290 | 291 | 292 | 293 | ) 294 | } 295 | } 296 | } 297 | 298 | } 299 | 300 | _renderAllResturents(param) { 301 | let totalRates = param.restaurant_info.ratting.content; 302 | let catg = this.state.selectCatg; 303 | 304 | var shopCats = []; 305 | 306 | for (let dta of param.restaurant_info.shoptag) { 307 | let cat = parseInt(dta.pivot.category_id); 308 | shopCats.push(cat); 309 | } 310 | 311 | if (catg == 0 || shopCats.includes(catg)) { 312 | return ( 313 | this.props.navigation.navigate('Details', { 314 | id: param.restaurant_info.id 315 | })}> 316 | 317 | 318 | 319 | 320 | 321 | 322 | 323 | 324 | 325 | 326 | 327 | 328 | 329 | 330 | 331 | 332 | 333 | 334 | 335 | 336 | 337 | ); 338 | } 339 | 340 | } 341 | } 342 | 343 | 344 | export default Home; 345 | 346 | const styles = StyleSheet.create({ 347 | flex: { 348 | flex: 1 349 | }, 350 | mainContainer: { 351 | flex: 1, 352 | justifyContent: 'center', 353 | alignItems: 'center' 354 | }, 355 | hconatiner: { 356 | paddingHorizontal: 15, 357 | backgroundColor: '#fff', 358 | flex: 1, 359 | paddingVertical: 5, 360 | }, 361 | dFlex: { 362 | flexDirection: 'row', 363 | justifyContent: 'space-between', 364 | paddingBottom: 10 365 | }, 366 | renderfeaured: { 367 | marginRight: 15, 368 | marginTop: 10, 369 | paddingBottom: 10 370 | }, 371 | renderfeaureds: { 372 | marginTop: 10, 373 | paddingBottom: 10, 374 | marginBottom: 10 375 | }, 376 | overlay: { 377 | ...StyleSheet.absoluteFillObject, 378 | backgroundColor: 'rgba(0, 0, 0, 0.25)', 379 | borderRadius: 100 380 | }, 381 | marginBottomView: { 382 | marginTop: 10, 383 | marginBottom: 10 384 | }, 385 | row: { 386 | flexDirection: "row", 387 | justifyContent: 'space-between' 388 | }, 389 | paddingLeft: { 390 | marginBottom: 10 391 | }, 392 | imageWidth: { 393 | width: '100%', 394 | height: 200 395 | }, 396 | badge: { 397 | position: 'absolute', 398 | right: 0, 399 | top: 0, 400 | backgroundColor: '#fff', 401 | paddingHorizontal: 15, 402 | paddingVertical: 5 403 | }, 404 | productTitle: { 405 | flexDirection: 'row', 406 | justifyContent: 'space-between', 407 | paddingTop: 5 408 | }, 409 | productContentFlex: { 410 | flexDirection: 'row', 411 | alignItems: 'center' 412 | }, 413 | paddingHorizontal5: { 414 | paddingHorizontal: 5 415 | }, 416 | renderCategory: { 417 | marginRight: 15, 418 | marginBottom: 15, 419 | marginTop: 15 420 | }, 421 | renderBg: { 422 | backgroundColor: '#fff', 423 | borderRadius: 10 424 | }, 425 | categoryBgImg: { 426 | width: 150, 427 | height: 150, 428 | flexDirection: 'row', 429 | justifyContent: 'center', 430 | alignItems: 'center' 431 | }, 432 | categoryImageStyle: { 433 | borderRadius: 15 434 | }, 435 | categoryNameStyle: { 436 | backgroundColor: '#C01C27', 437 | borderRadius: 5, 438 | paddingHorizontal: 10, 439 | paddingVertical: 6 440 | }, 441 | renderItemStyle: { 442 | marginRight: 15, 443 | marginBottom: 15, 444 | marginTop: 15 445 | }, 446 | renderItemContent: { 447 | backgroundColor: '#fff', 448 | borderRadius: 10 449 | }, 450 | renderItemImg: { 451 | width: 190, 452 | height: 150, 453 | borderRadius: 5 454 | }, 455 | renderItemBadge: { 456 | position: 'absolute', 457 | bottom: 15, 458 | color: '#fff', 459 | left: 15, 460 | backgroundColor: '#C01C27', 461 | borderRadius: 5, 462 | paddingHorizontal: 10, 463 | paddingVertical: 6 464 | } 465 | }); -------------------------------------------------------------------------------- /src/screens/Info.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, ImageBackground, StyleSheet, Dimensions } from 'react-native'; 3 | import { AntDesign } from '@expo/vector-icons'; 4 | import { FlatList, ScrollView, TouchableOpacity } from 'react-native-gesture-handler'; 5 | import FlatText from '../components/FlatText'; 6 | import { Entypo, EvilIcons } from '@expo/vector-icons'; 7 | import MapView from 'react-native-maps'; 8 | 9 | const { width } = Dimensions.get('window'); 10 | 11 | export default class Info extends Component { 12 | constructor(props) { 13 | super(props); 14 | this.state = { 15 | 16 | }; 17 | } 18 | 19 | render() { 20 | 21 | const { preview, name, about, shopday, reviews, latitude, longitude, ratting, avg } = this.props.route.params; 22 | 23 | 24 | return ( 25 | 26 | 27 | 28 | 29 | 30 | this.props.navigation.goBack()}> 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | this._renderTime(item)} 76 | keyExtractor={(item, index) => index.toString()} 77 | /> 78 | 79 | 80 | 81 | 90 | 97 | 98 | 99 | 100 | 101 | ); 102 | } 103 | 104 | _renderTime(item) { 105 | if (item.status == "1") { 106 | return ( 107 | 108 | 109 | 110 | ); 111 | } 112 | 113 | 114 | } 115 | } 116 | 117 | 118 | 119 | const styles = StyleSheet.create({ 120 | flex: { 121 | flex: 1 122 | }, 123 | backgroundImage: { 124 | width: width, 125 | height: 250 126 | }, 127 | overlay: { 128 | ...StyleSheet.absoluteFillObject, 129 | backgroundColor: 'rgba(0,0,0,0.5)' 130 | }, 131 | infoArea: { 132 | paddingVertical: 20, 133 | paddingHorizontal: 20 134 | }, 135 | flexContainer: { 136 | flexDirection: 'row', 137 | alignItems: 'center', 138 | marginBottom: 20 139 | 140 | }, 141 | flexContainer1: { 142 | flexDirection: 'row', 143 | marginTop: 10, 144 | marginBottom: 20 145 | }, 146 | locationIcon: { 147 | marginTop: 5, 148 | paddingTop: 5, 149 | textAlign: "justify", 150 | marginRight: 5 151 | 152 | }, 153 | 154 | locationIcon1: { 155 | marginHorizontal: 20 156 | 157 | }, 158 | 159 | marginTop: { 160 | marginTop: 20 161 | }, 162 | mapHeight: { 163 | height: 250 164 | }, 165 | mainContainer: { 166 | flex: 1, 167 | justifyContent: 'center', 168 | alignItems: 'center' 169 | }, 170 | mapArea: { 171 | paddingVertical: 20 172 | }, 173 | marginBottom: { 174 | marginBottom: 20 175 | }, 176 | InfoImgBgConTent: { 177 | flexDirection: 'row', 178 | justifyContent: 'space-between', 179 | marginTop: 50, 180 | paddingHorizontal: 15 181 | }, 182 | backBtn: { 183 | backgroundColor: '#fff', 184 | paddingHorizontal: 10, 185 | paddingVertical: 10, 186 | borderRadius: 30 187 | }, 188 | infoTitle: { 189 | flexDirection: 'row', 190 | justifyContent: 'space-between', 191 | alignItems: 'center', 192 | paddingHorizontal: 20, 193 | paddingVertical: 20, 194 | borderBottomWidth: 1, 195 | borderBottomColor: '#ddd' 196 | }, 197 | infoFlex: { 198 | flexDirection: 'row', 199 | alignItems: 'center' 200 | }, 201 | marginRight5: { 202 | marginRight: 5 203 | }, 204 | marginTop5: { 205 | marginTop: 5 206 | } 207 | }) -------------------------------------------------------------------------------- /src/screens/Login.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet } from 'react-native'; 3 | import { ScrollView, TextInput, TouchableOpacity } from 'react-native-gesture-handler'; 4 | import FlatText from '../components/FlatText'; 5 | import Header from './section/Header'; 6 | import AsyncStorage from '@react-native-community/async-storage'; 7 | import config from '../.././config/config.json'; 8 | 9 | export default class Login extends Component { 10 | constructor(props) { 11 | super(props); 12 | this.state = { 13 | btnText: "Login", 14 | email: "", 15 | password: "", 16 | errormessage: "", 17 | screen: "Account", 18 | error: false 19 | }; 20 | } 21 | 22 | 23 | componentDidMount() 24 | { 25 | const {screen} = this.props.route.params; 26 | this.setState({ 27 | screen: screen 28 | }) 29 | } 30 | 31 | handleEmail = (text) => { 32 | this.setState({ email: text }); 33 | }; 34 | 35 | handlePassword = (text) => { 36 | this.setState({ password: text }); 37 | }; 38 | 39 | login() 40 | { 41 | 42 | this.setState({btnText: 'Please Wait...'}); 43 | if(this.state.email == "") 44 | { 45 | this.setState({errormessage: 'The Email filed is required',btnText: 'Login'}); 46 | return true; 47 | } 48 | 49 | if(this.state.password == "") 50 | { 51 | this.setState({errormessage: 'The Password filed is required',btnText: 'Login'}); 52 | return true; 53 | } 54 | 55 | fetch(config.APP_URL+'/api/login', { 56 | method: 'POST', 57 | headers: { 58 | Accept: 'application/json', 59 | 'Content-Type': 'application/json' 60 | }, 61 | body: JSON.stringify({ 62 | email: this.state.email, 63 | password: this.state.password 64 | }) 65 | }).then((response) => response.json()) 66 | .then((json) => { 67 | if(json.email) 68 | { 69 | this.setState({errormessage: json.email,btnText: 'Login'}); 70 | } 71 | if(json.token) 72 | { 73 | const logininfo = { 74 | token: 'Bearer '+json.token, 75 | login_id: json.login_id 76 | } 77 | AsyncStorage.getItem('login').then(()=>{ 78 | AsyncStorage.setItem('login',JSON.stringify(logininfo)); 79 | }) 80 | .catch((err)=>{ 81 | alert(err) 82 | }) 83 | 84 | this.setState({btnText: 'Login'}); 85 | 86 | this.props.navigation.navigate(this.state.screen); 87 | 88 | 89 | } 90 | }) 91 | .catch((error) => { 92 | this.setState({ 93 | error: true 94 | }) 95 | }); 96 | } 97 | 98 | render() { 99 | if(this.state.error) 100 | { 101 | return ( 102 | 103 |
104 | 105 | 106 | 107 | 108 | ) 109 | }else{ 110 | return ( 111 | 112 |
113 | 114 | 115 | 116 | 117 | 118 | {this.state.errormessage != "" ? 119 | 120 | : } 121 | 122 | 123 | this.handleEmail(text)}/> 124 | 125 | 126 | 127 | this.handlePassword(text)} secureTextEntry={true}/> 128 | 129 | 130 | this.login()}> 131 | 132 | 133 | 134 | 135 | this.props.navigation.navigate('Register')}> 136 | 137 | 138 | 139 | 140 | 141 | 142 | ); 143 | } 144 | } 145 | } 146 | 147 | 148 | const styles = StyleSheet.create({ 149 | flex: { 150 | flex: 1 151 | }, 152 | mainContainer: { 153 | paddingHorizontal: 20, 154 | paddingVertical: 40 155 | }, 156 | title: { 157 | marginBottom: 7 158 | }, 159 | textInput: { 160 | borderWidth: 1, 161 | borderColor: '#ddd', 162 | paddingVertical: 20, 163 | borderRadius: 5, 164 | paddingHorizontal: 20, 165 | marginTop: 10 166 | }, 167 | formGroup: { 168 | marginBottom: 20 169 | }, 170 | btn: { 171 | alignItems: 'center', 172 | backgroundColor: '#C01C27', 173 | paddingVertical: 20, 174 | borderRadius: 5 175 | }, 176 | textCenter: { 177 | alignItems: 'center', 178 | marginTop: 20 179 | }, 180 | errorMessage: { 181 | marginBottom: 7 182 | }, 183 | container: { 184 | flex: 1, 185 | justifyContent: 'center', 186 | alignItems: 'center' 187 | } 188 | }); -------------------------------------------------------------------------------- /src/screens/Order.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet,ActivityIndicator,RefreshControl } from 'react-native'; 3 | import { ScrollView, TouchableOpacity } from 'react-native-gesture-handler'; 4 | import FlatText from '../components/FlatText'; 5 | import Header from './section/Header'; 6 | import { Feather } from '@expo/vector-icons'; 7 | import AsyncStorage from '@react-native-community/async-storage'; 8 | import config from '../../config/config.json'; 9 | 10 | export default class Order extends Component { 11 | constructor(props) { 12 | super(props); 13 | this.state = { 14 | isLoading: true, 15 | authorization_key: null, 16 | dataOrder: [], 17 | error: false, 18 | refreshing: false, 19 | }; 20 | } 21 | 22 | onRefresh = () => { 23 | this.setState({ refreshing: true }); 24 | this.componentDidMount(); 25 | 26 | }; 27 | 28 | componentDidMount() { 29 | AsyncStorage.getItem('login').then((login) => { 30 | if (login !== null) { 31 | const logininfo = JSON.parse(login) 32 | this.setState({ authorization_key: logininfo.token }); 33 | }else{ 34 | this.props.navigation.navigate('Login',{ 35 | screen: 'Account' 36 | }); 37 | return true; 38 | } 39 | }) 40 | .catch((err) => { 41 | this.setState({ 42 | isLoading: false, 43 | error: true 44 | }); 45 | }) 46 | 47 | setTimeout(() => { 48 | return fetch(config.APP_URL+'/api/customer/orders', { 49 | method: 'GET', 50 | headers: { 51 | Accept: 'application/json', 52 | 'Content-Type': 'application/json', 53 | Authorization: this.state.authorization_key 54 | } 55 | }) 56 | .then((response) => response.json()) 57 | .then((json) => { 58 | this.setState({dataOrder: json,isLoading:false,refreshing: false}); 59 | }) 60 | .catch((error) => { 61 | this.setState({ 62 | isLoading: false, 63 | error: true 64 | }) 65 | }); 66 | },100); 67 | } 68 | 69 | render() { 70 | 71 | console.disableYellowBox = true; 72 | 73 | if(this.state.isLoading) 74 | { 75 | return ( 76 | 77 |
78 | 79 | 80 | 81 | 82 | ) 83 | }else{ 84 | if(this.state.error) 85 | { 86 | return ( 87 | 88 |
89 | 90 | 91 | 92 | 93 | ) 94 | }else{ 95 | if(this.state.dataOrder.length > 0 ) 96 | { 97 | return ( 98 | 99 |
100 | 106 | }> 107 | 108 | 109 | 110 | 111 | { 112 | this.state.dataOrder.map((order,i) => { 113 | return( 114 | this.props.navigation.navigate('Orderview',{id:order.id})}> 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | ) 131 | }) 132 | } 133 | 134 | 135 | 136 | ); 137 | }else{ 138 | return ( 139 | 140 |
141 | 142 | 143 | 144 | 145 | ) 146 | } 147 | } 148 | } 149 | } 150 | } 151 | 152 | const styles = StyleSheet.create({ 153 | flex: { 154 | flex: 1 155 | }, 156 | container: { 157 | flex: 1, 158 | paddingVertical: 20, 159 | paddingHorizontal: 20, 160 | marginBottom: 0 161 | }, 162 | headerTitle: { 163 | marginBottom: 20 164 | }, 165 | singleOrder: { 166 | backgroundColor: '#fff', 167 | paddingVertical: 20, 168 | paddingHorizontal: 20, 169 | borderRadius: 5, 170 | marginBottom: 20, 171 | flexDirection: 'row', 172 | justifyContent: 'space-between', 173 | alignItems: 'center' 174 | }, 175 | flexDirection: { 176 | flexDirection: 'row', 177 | marginBottom: 5 178 | }, 179 | orderPrice: { 180 | marginTop: 7 181 | }, 182 | viewOrderBtn: { 183 | backgroundColor: '#C01C27', 184 | paddingHorizontal: 10, 185 | paddingVertical: 10, 186 | borderRadius: 5 187 | }, 188 | mainContainer: { 189 | flex: 1, 190 | justifyContent: 'center', 191 | alignItems: 'center' 192 | } 193 | }); -------------------------------------------------------------------------------- /src/screens/Orderview.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View,StyleSheet,ActivityIndicator,RefreshControl } from 'react-native'; 3 | import FlatText from '../components/FlatText'; 4 | import Header from './section/Header'; 5 | import MapView from 'react-native-maps'; 6 | import { FlatList, ScrollView } from 'react-native-gesture-handler'; 7 | import AsyncStorage from '@react-native-community/async-storage'; 8 | import config from '../../config/config.json'; 9 | 10 | export default class Orderview extends Component { 11 | constructor(props) { 12 | super(props); 13 | this.state = { 14 | isLoading: true, 15 | authorization_key: null, 16 | id: "", 17 | status: "", 18 | delivery_status: "", 19 | total: 0, 20 | order_amount:0, 21 | delivery_fee: 0, 22 | vendor_name: "", 23 | vendor_phone: "", 24 | vendor_address: "", 25 | rider_name: "", 26 | rider_phone: "", 27 | OrderItems:[], 28 | resturentName:"", 29 | resturentPhone:"", 30 | resturentAddress:"", 31 | lat:null, 32 | long:null, 33 | error: false, 34 | refreshing: false, 35 | }; 36 | } 37 | 38 | onRefresh = () => { 39 | this.setState({ refreshing: true }); 40 | this.componentDidMount(); 41 | 42 | }; 43 | 44 | 45 | componentDidMount() { 46 | AsyncStorage.getItem('login').then((login) => { 47 | if (login !== null) { 48 | const logininfo = JSON.parse(login) 49 | this.setState({ authorization_key: logininfo.token }); 50 | }else{ 51 | this.props.navigation.navigate('Login',{ 52 | screen: 'Account' 53 | }); 54 | return true; 55 | } 56 | }) 57 | .catch((err) => { 58 | this.setState({ 59 | isLoading: false, 60 | error: true 61 | }) 62 | }) 63 | 64 | const {id} = this.props.route.params; 65 | 66 | setTimeout(() => { 67 | return fetch(config.APP_URL+'/api/customer/order/'+id+'', { 68 | method: 'GET', 69 | headers: { 70 | Accept: 'application/json', 71 | 'Content-Type': 'application/json', 72 | Authorization: this.state.authorization_key 73 | } 74 | }) 75 | .then((response) => response.json()) 76 | .then((json) => { 77 | let int_status =parseInt(json.status); 78 | if (int_status==2) { 79 | var status="Pending"; 80 | this.setState({ 81 | status: status, 82 | }); 83 | } 84 | else if(int_status==3){ 85 | var status="Accepted"; 86 | this.setState({ 87 | status: status, 88 | }); 89 | } 90 | else if(int_status==1){ 91 | var status="Complete"; 92 | this.setState({ 93 | status: status, 94 | }); 95 | } 96 | else{ 97 | var status="Canceled"; 98 | this.setState({ 99 | status: status, 100 | }); 101 | } 102 | 103 | let total = parseFloat(json.total); 104 | let shipping = parseFloat(json.shipping); 105 | let info=JSON.parse(json.vendorinfo.info.content); 106 | if (json.riderinfo != null) { 107 | let rider_parse=JSON.parse(json.riderinfo.info.content); 108 | 109 | this.setState({ 110 | rider_name:json.riderinfo.name, 111 | rider_phone:rider_parse.phone1, 112 | }); 113 | } 114 | 115 | if (json.liveorder != null) { 116 | this.setState({ 117 | lat:json.liveorder.latitute, 118 | long:json.liveorder.longlatitute 119 | }); 120 | } 121 | else{ 122 | this.setState({ 123 | lat:json.vendorinfo.location.latitude, 124 | long:json.vendorinfo.location.longitude 125 | }); 126 | } 127 | 128 | this.setState({ 129 | id: json.id, 130 | total: total, 131 | OrderItems:json.orderlist, 132 | delivery_fee:shipping, 133 | order_amount: total-shipping, 134 | resturentName:json.vendorinfo.name, 135 | resturentPhone:info.phone1, 136 | resturentAddress:info.full_address, 137 | isLoading: false, 138 | refreshing: false 139 | }); 140 | }) 141 | .catch((error) => { 142 | this.setState({ 143 | isLoading: false, 144 | error: true, 145 | refreshing: false 146 | }) 147 | }); 148 | },100); 149 | } 150 | 151 | 152 | NumberFormat(number, decPlaces, decSep, thouSep) { 153 | decPlaces = isNaN(decPlaces = Math.abs(decPlaces)) ? 2 : decPlaces, 154 | decSep = typeof decSep === "undefined" ? "." : decSep; 155 | thouSep = typeof thouSep === "undefined" ? "," : thouSep; 156 | var sign = number < 0 ? "-" : ""; 157 | var i = String(parseInt(number = Math.abs(Number(number) || 0).toFixed(decPlaces))); 158 | var j = (j = i.length) > 3 ? j % 3 : 0; 159 | 160 | return sign + 161 | (j ? i.substr(0, j) + thouSep : "") + 162 | i.substr(j).replace(/(\decSep{3})(?=\decSep)/g, "$1" + thouSep) + 163 | (decPlaces ? decSep + Math.abs(number - i).toFixed(decPlaces).slice(2) : ""); 164 | } 165 | 166 | render() { 167 | 168 | if(this.state.isLoading) 169 | { 170 | return ( 171 | 172 |
173 | 174 | 175 | 176 | 177 | ) 178 | }else{ 179 | if(this.state.error) 180 | { 181 | return ( 182 | 183 |
184 | 185 | 186 | 187 | 188 | ) 189 | }else{ 190 | return ( 191 | 192 |
193 | 199 | }> 200 | 201 | 202 | 203 | 204 | 205 | 206 | 207 | 208 | 209 | 210 | 211 | 212 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | this._renderOrderItem(item)} 228 | keyExtractor = { (item,index) => index.toString() } /> 229 | 230 | 231 | 232 | 233 | 234 | 235 | 236 | 237 | 238 | 239 | 240 | 241 | 242 | 243 | 244 | 245 | 246 | 247 | 248 | 249 | 250 | {(() => { 251 | if (this.state.rider_name !== ''){ 252 | 253 | return ( 254 | 255 | 256 | 257 | 258 | 259 | 260 | 261 | 262 | 263 | 264 | 265 | ) 266 | } 267 | 268 | return null; 269 | })()} 270 | 271 | {(() => { 272 | if (this.state.lat !== null){ 273 | let lat = parseFloat(this.state.lat); 274 | let long = parseFloat(this.state.long); 275 | return ( 276 | 277 | 278 | 279 | 280 | 281 | 291 | 296 | 297 | 298 | 299 | ) 300 | } 301 | 302 | return null; 303 | })()} 304 | 305 | 306 | 307 | 308 | 309 | 310 | 311 | ); 312 | } 313 | } 314 | 315 | } 316 | 317 | 318 | _renderOrderItem(param){ 319 | return ( 320 | 321 | 322 | 323 | ); 324 | } 325 | 326 | 327 | 328 | } 329 | 330 | 331 | 332 | 333 | const styles = StyleSheet.create({ 334 | flex: { 335 | flex: 1 336 | }, 337 | card: { 338 | backgroundColor: '#fff', 339 | marginHorizontal: 20, 340 | marginVertical: 20, 341 | borderRadius: 5, 342 | paddingHorizontal: 20, 343 | paddingVertical: 20, 344 | marginBottom: 20 345 | }, 346 | title: { 347 | marginBottom: 15 348 | }, 349 | marginBottom: { 350 | marginBottom: 10 351 | }, 352 | mapHeight: { 353 | height: 350, 354 | borderRadius: 5 355 | }, 356 | orderContainer: { 357 | marginBottom: 20 358 | }, 359 | mainContainer: { 360 | flex: 1, 361 | justifyContent: 'center', 362 | alignItems: 'center' 363 | } 364 | }); -------------------------------------------------------------------------------- /src/screens/Redirect.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View } from 'react-native'; 3 | 4 | export default class Redirect extends Component { 5 | constructor(props) { 6 | super(props); 7 | this.state = { 8 | }; 9 | } 10 | 11 | componentDidMount() 12 | { 13 | const { data } = this.props.route.params; 14 | if(data == true) 15 | { 16 | this.props.navigation.navigate('Reredirect', 17 | { 18 | data: true 19 | }); 20 | return true; 21 | }else{ 22 | console.log('Redirect'); 23 | } 24 | } 25 | 26 | render() { 27 | return ( 28 | 29 | 30 | 31 | ); 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /src/screens/Register.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet,TextInput,TouchableOpacity } from 'react-native'; 3 | import { ScrollView } from 'react-native-gesture-handler'; 4 | import Header from './section/Header'; 5 | import FlatText from '../components/FlatText'; 6 | import AsyncStorage from '@react-native-community/async-storage'; 7 | import config from '../.././config/config.json'; 8 | import Toast from 'react-native-simple-toast'; 9 | 10 | export default class Register extends Component { 11 | constructor(props) { 12 | super(props); 13 | this.state = { 14 | btnText: 'Register', 15 | name: '', 16 | email: '', 17 | password: '', 18 | confirm_pass: '', 19 | error: false 20 | }; 21 | } 22 | 23 | handleRegisterName = (text) => { 24 | this.setState({ name: text }); 25 | }; 26 | 27 | handleRegisterEmail = (text) => { 28 | this.setState({ email: text }); 29 | }; 30 | 31 | handleRegisterPassword = (text) => { 32 | this.setState({ password: text }); 33 | }; 34 | 35 | handleConfirmPassword = (text) => { 36 | this.setState({ confirm_pass: text }); 37 | }; 38 | 39 | register() 40 | { 41 | if(this.state.name == '') 42 | { 43 | Toast.showWithGravity( 44 | "The Name filed is required", 45 | Toast.SHORT, 46 | Toast.CENTER 47 | ); 48 | return true; 49 | } 50 | 51 | if(this.state.email == '') 52 | { 53 | Toast.showWithGravity( 54 | "The Email filed is required", 55 | Toast.SHORT, 56 | Toast.CENTER 57 | ); 58 | return true; 59 | } 60 | 61 | if(this.state.password == '') 62 | { 63 | Toast.showWithGravity( 64 | "The Password filed is required", 65 | Toast.SHORT, 66 | Toast.CENTER 67 | ); 68 | return true; 69 | } 70 | 71 | if(this.state.confirm_pass == '') 72 | { 73 | Toast.showWithGravity( 74 | "The Confirmation Password filed is required", 75 | Toast.SHORT, 76 | Toast.CENTER 77 | ); 78 | return true; 79 | } 80 | 81 | if(this.state.password.length < 8) 82 | { 83 | Toast.showWithGravity( 84 | "The password must be at least 8 characters.", 85 | Toast.SHORT, 86 | Toast.CENTER 87 | ); 88 | return true; 89 | } 90 | 91 | if(this.state.password != this.state.confirm_pass) 92 | { 93 | Toast.showWithGravity( 94 | "The Confirmation password doesn't match", 95 | Toast.SHORT, 96 | Toast.CENTER 97 | ); 98 | return true; 99 | } 100 | 101 | this.setState({ 102 | btnText: 'Please Wait...' 103 | }); 104 | 105 | 106 | fetch(config.APP_URL+'/api/register', { 107 | method: 'POST', 108 | headers: { 109 | Accept: 'application/json', 110 | 'Content-Type': 'application/json' 111 | }, 112 | body: JSON.stringify({ 113 | name: this.state.name, 114 | email: this.state.email, 115 | password: this.state.password 116 | }) 117 | }).then((response) => response.json()) 118 | .then((json) => { 119 | if(json.errors) 120 | { 121 | Toast.showWithGravity( 122 | json.errors, 123 | Toast.SHORT, 124 | Toast.CENTER 125 | ); 126 | this.setState({ 127 | btnText: 'Register' 128 | }); 129 | } 130 | if(json.token) 131 | { 132 | const logininfo = { 133 | token: 'Bearer '+json.token, 134 | login_id: json.login_id 135 | } 136 | AsyncStorage.getItem('login').then(()=>{ 137 | AsyncStorage.setItem('login',JSON.stringify(logininfo)); 138 | }) 139 | .catch((err)=>{ 140 | alert(err) 141 | }) 142 | 143 | this.setState({btnText: 'Register'}); 144 | this.props.navigation.navigate('Home'); 145 | } 146 | }) 147 | .catch((error) => { 148 | this.setState({ 149 | error: true 150 | }) 151 | }); 152 | 153 | 154 | } 155 | 156 | render() { 157 | 158 | if(this.state.error) 159 | { 160 | return ( 161 | 162 |
163 | 164 | 165 | 166 | 167 | ) 168 | }else{ 169 | return ( 170 | 171 |
172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | this.handleRegisterName(text)}/> 181 | 182 | 183 | 184 | this.handleRegisterEmail(text)}/> 185 | 186 | 187 | 188 | this.handleRegisterPassword(text)}/> 189 | 190 | 191 | 192 | this.handleConfirmPassword(text)}/> 193 | 194 | this.register()}> 195 | 196 | 197 | 198 | this.props.navigation.navigate('Login')}> 199 | 200 | 201 | 202 | 203 | 204 | 205 | 206 | ); 207 | } 208 | } 209 | } 210 | 211 | 212 | const styles = StyleSheet.create({ 213 | flex: { 214 | flex: 1 215 | }, 216 | mainContainer: { 217 | paddingHorizontal: 20, 218 | paddingVertical: 40 219 | }, 220 | textInput: { 221 | borderWidth: 1, 222 | borderColor: '#ddd', 223 | paddingVertical: 20, 224 | borderRadius: 5, 225 | paddingHorizontal: 20, 226 | marginTop: 10 227 | }, 228 | formGroup: { 229 | marginBottom: 20 230 | }, 231 | title: { 232 | marginBottom: 7 233 | }, 234 | btn: { 235 | alignItems: 'center', 236 | backgroundColor: '#C01C27', 237 | paddingVertical: 20, 238 | borderRadius: 5 239 | }, 240 | textCenter: { 241 | alignItems: 'center', 242 | marginTop: 20 243 | }, 244 | container: { 245 | flex: 1, 246 | justifyContent: 'center', 247 | alignItems: 'center' 248 | } 249 | }); -------------------------------------------------------------------------------- /src/screens/Reredirect.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text } from 'react-native'; 3 | 4 | export default class Reredirect extends Component { 5 | constructor(props) { 6 | super(props); 7 | this.state = { 8 | }; 9 | } 10 | 11 | componentDidMount() 12 | { 13 | const { data } = this.props.route.params; 14 | if(data == true) 15 | { 16 | this.props.navigation.navigate('Home'); 17 | console.log('RE Redirect'); 18 | return true; 19 | }else{ 20 | console.log('Redirect'); 21 | } 22 | } 23 | 24 | render() { 25 | return ( 26 | 27 | Reredirect 28 | 29 | ); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/screens/Search.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text, StyleSheet, Dimensions,Keyboard } from 'react-native'; 3 | 4 | import MapView from 'react-native-maps'; 5 | 6 | import Toast from 'react-native-simple-toast'; 7 | 8 | import config from '../../config/config.json'; 9 | 10 | const { width,height } = Dimensions.get('window'); 11 | 12 | import { MaterialIcons } from '@expo/vector-icons'; 13 | import FLatText from '../components/FlatText'; 14 | 15 | import AsyncStorage from '@react-native-community/async-storage'; 16 | import { TextInput, TouchableOpacity, TouchableWithoutFeedback } from 'react-native-gesture-handler'; 17 | 18 | import { SimpleLineIcons } from '@expo/vector-icons'; 19 | 20 | 21 | class Search extends Component{ 22 | 23 | constructor(props) 24 | { 25 | super(props); 26 | this.state = { 27 | isLoading: false, 28 | latitude: 37.78825, 29 | longitude: -122.4324, 30 | city: '', 31 | address: '', 32 | dataCity: [], 33 | searchContent: 'Search', 34 | SearchColor: '#C01C27', 35 | error: false 36 | }; 37 | } 38 | 39 | hideKeyboard() 40 | { 41 | Keyboard.dismiss(); 42 | } 43 | 44 | 45 | handleText = (text) => { 46 | this.setState({ 47 | address: text, 48 | SearchColor: '#969696', 49 | searchContent: 'Loading...' 50 | }); 51 | return fetch('https://maps.googleapis.com/maps/api/place/autocomplete/json?input='+text+'&key='+config.GOOGLE_MAP_API_KEY+'') 52 | .then((response) => response.json()) 53 | .then((json) => { 54 | this.setState({ 55 | dataCity: json.predictions, 56 | SearchColor: '#C01C27', 57 | searchContent: 'Search' 58 | }); 59 | }) 60 | .catch((error) => { 61 | this.setState({ 62 | error: true 63 | }) 64 | }); 65 | }; 66 | 67 | selectLocation(address,place_id) 68 | { 69 | return fetch('https://maps.googleapis.com/maps/api/place/details/json?place_id='+place_id+'&fields=geometry&key='+config.GOOGLE_MAP_API_KEY+'') 70 | .then((response) => response.json()) 71 | .then((json) => { 72 | this.setState({ 73 | latitude: json.result.geometry.location.lat, 74 | longitude: json.result.geometry.location.lng, 75 | dataCity: [], 76 | address: address, 77 | SearchColor: '#969696', 78 | searchContent: 'Loading...' 79 | }); 80 | this.storePosition(); 81 | }) 82 | .catch((error) => { 83 | this.setState({ 84 | error: true 85 | }) 86 | }); 87 | } 88 | 89 | currenLocation() 90 | { 91 | this.setState({ 92 | isLoading: true, 93 | SearchColor: '#969696', 94 | searchContent: 'Loading...' 95 | }); 96 | 97 | if (navigator.geolocation) { 98 | navigator.geolocation.getCurrentPosition( 99 | ({ coords: { latitude, longitude } }) => this.setState({ latitude, longitude }, this.storePosition), 100 | (error) => console.log('Error:', error) 101 | ) 102 | } else { 103 | alert("Geolocation is not supported by this phone."); 104 | } 105 | } 106 | 107 | storePosition() 108 | { 109 | return fetch('https://maps.googleapis.com/maps/api/geocode/json?latlng='+this.state.latitude+','+this.state.longitude+'&key='+config.GOOGLE_MAP_API_KEY+'') 110 | .then((response) => response.json()) 111 | .then((json) => { 112 | if(json.status == 'OK') 113 | { 114 | if (json.results[1]) { 115 | var country = null, countryCode = null, city = null, cityAlt = null; 116 | var c, lc, component; 117 | for (var r = 0, rl = json.results.length; r < rl; r += 1) { 118 | var result = json.results[r]; 119 | 120 | if (!city && result.types[0] === 'locality') { 121 | for (c = 0, lc = result.address_components.length; c < lc; c += 1) { 122 | component = result.address_components[c]; 123 | 124 | if (component.types[0] === 'locality') { 125 | city = component.long_name; 126 | break; 127 | } 128 | } 129 | } 130 | else if (!city && !cityAlt && result.types[0] === 'administrative_area_level_1') { 131 | for (c = 0, lc = result.address_components.length; c < lc; c += 1) { 132 | component = result.address_components[c]; 133 | 134 | if (component.types[0] === 'administrative_area_level_1') { 135 | cityAlt = component.long_name; 136 | break; 137 | } 138 | } 139 | } else if (!country && result.types[0] === 'country') { 140 | country = result.address_components[0].long_name; 141 | countryCode = result.address_components[0].short_name; 142 | } 143 | 144 | if (city && country) { 145 | break; 146 | } 147 | } 148 | 149 | this.setState({ 150 | city: city, 151 | address: json.results[1].formatted_address, 152 | searchContent: 'Search', 153 | SearchColor: '#C01C27' 154 | }); 155 | 156 | 157 | let url =config.APP_URL+'/api/area/'+this.state.city; 158 | 159 | fetch(url) 160 | .then((response) => response.json()) 161 | .then((json) => { 162 | if (json.data != null) { 163 | var id = json.data.id; 164 | 165 | const location = { 166 | latitude: this.state.latitude, 167 | longitude: this.state.longitude, 168 | city: this.state.city, 169 | address: this.state.address, 170 | city_id:id, 171 | city_change:true 172 | } 173 | AsyncStorage.setItem('location',JSON.stringify(location)); 174 | 175 | } 176 | else{ 177 | const location = { 178 | latitude: this.state.latitude, 179 | longitude: this.state.longitude, 180 | city: this.state.city, 181 | address: this.state.address, 182 | city_id: null, 183 | city_change:true 184 | } 185 | AsyncStorage.setItem('location',JSON.stringify(location)); 186 | 187 | 188 | } 189 | 190 | 191 | }) 192 | .catch((error) => console.error(error)); 193 | 194 | 195 | 196 | 197 | } 198 | } 199 | 200 | }) 201 | .catch((error) => { 202 | this.setState({ 203 | error: true 204 | }) 205 | }); 206 | 207 | 208 | } 209 | 210 | draggleStart() 211 | { 212 | this.setState({ 213 | SearchColor: '#969696', 214 | searchContent: 'Loading...' 215 | }) 216 | } 217 | 218 | draggableMap(e) 219 | { 220 | 221 | const latitude = e.nativeEvent.coordinate.latitude 222 | const longitude = e.nativeEvent.coordinate.longitude 223 | 224 | this.setState({ 225 | latitude: latitude, 226 | longitude: longitude, 227 | }) 228 | 229 | this.storePosition(); 230 | } 231 | 232 | MoveHome() 233 | { 234 | this.setState({ searchContent: 'Please Wait...' }) 235 | AsyncStorage.getItem('location').then((data)=>{ 236 | if (data !== null) { 237 | this.setState({ 238 | searchContent: 'Search' 239 | }); 240 | this.props.navigation.navigate('Home'); 241 | } 242 | else{ 243 | Toast.showWithGravity( 244 | "Please Select a Location", 245 | Toast.SHORT, 246 | Toast.CENTER 247 | ); 248 | this.setState({ 249 | searchContent: 'Search' 250 | }); 251 | } 252 | }) 253 | .catch((err)=>{ 254 | alert(err) 255 | }) 256 | 257 | 258 | } 259 | 260 | mapStyle = [ { "featureType": "water", "elementType": "geometry", "stylers": [ { "color": "#e9e9e9" }, { "lightness": 17 } ] }, { "featureType": "landscape", "elementType": "geometry", "stylers": [ { "color": "#f5f5f5" }, { "lightness": 20 } ] }, { "featureType": "road.highway", "elementType": "geometry.fill", "stylers": [ { "color": "#ffffff" }, { "lightness": 17 } ] }, { "featureType": "road.highway", "elementType": "geometry.stroke", "stylers": [ { "color": "#ffffff" }, { "lightness": 29 }, { "weight": 0.2 } ] }, { "featureType": "road.arterial", "elementType": "geometry", "stylers": [ { "color": "#ffffff" }, { "lightness": 18 } ] }, { "featureType": "road.local", "elementType": "geometry", "stylers": [ { "color": "#ffffff" }, { "lightness": 16 } ] }, { "featureType": "poi", "elementType": "geometry", "stylers": [ { "color": "#f5f5f5" }, { "lightness": 21 } ] }, { "featureType": "poi.park", "elementType": "geometry", "stylers": [ { "color": "#dedede" }, { "lightness": 21 } ] }, { "elementType": "labels.text.stroke", "stylers": [ { "visibility": "on" }, { "color": "#ffffff" }, { "lightness": 16 } ] }, { "elementType": "labels.text.fill", "stylers": [ { "saturation": 36 }, { "color": "#333333" }, { "lightness": 40 } ] }, { "elementType": "labels.icon", "stylers": [ { "visibility": "off" } ] }, { "featureType": "transit", "elementType": "geometry", "stylers": [ { "color": "#f2f2f2" }, { "lightness": 19 } ] }, { "featureType": "administrative", "elementType": "geometry.fill", "stylers": [ { "color": "#fefefe" }, { "lightness": 20 } ] }, { "featureType": "administrative", "elementType": "geometry.stroke", "stylers": [ { "color": "#fefefe" }, { "lightness": 17 }, { "weight": 1.2 } ] } ]; 261 | 262 | render() 263 | { 264 | 265 | if(this.state.error) 266 | { 267 | return ( 268 | 269 | 270 | 271 | ) 272 | }else{ 273 | return( 274 | 275 | 276 | 286 | this.draggleStart()} 293 | onDragEnd={(e) => this.draggableMap(e)} 294 | /> 295 | 296 | 297 | this.handleText(text)} value={this.state.address}> 298 | 299 | this.currenLocation()}> 300 | 301 | 302 | 303 | 304 | { 305 | this.state.dataCity.map((item)=>{ 306 | return ( 307 | this.selectLocation(item.description,item.place_id)}> 308 | 309 | 310 | 311 | 312 | 313 | 314 | 315 | 316 | 317 | ) 318 | }) 319 | } 320 | 321 | 322 | 323 | 324 | this.MoveHome()}> 325 | 326 | 327 | 328 | 329 | 330 | 331 | ) 332 | } 333 | } 334 | } 335 | 336 | 337 | export default Search; 338 | 339 | const styles = StyleSheet.create({ 340 | mainContainer: { 341 | flex: 1, 342 | justifyContent: 'center', 343 | alignItems: 'center' 344 | }, 345 | customMap: { 346 | width: width, 347 | height: height 348 | }, 349 | searchContent: { 350 | position:'absolute', 351 | top:40, 352 | left:0, 353 | right: 0 354 | }, 355 | searchInput: { 356 | backgroundColor: '#fff', 357 | width: width, 358 | height:60, 359 | marginLeft:'auto', 360 | marginRight:'auto', 361 | paddingLeft: 20, 362 | paddingRight: 60, 363 | color:'#222', 364 | fontWeight: '600', 365 | fontSize: 16, 366 | borderBottomWidth: 1, 367 | borderBottomColor: '#ddd' 368 | }, 369 | currenLocation: { 370 | position: 'absolute', 371 | right: 35, 372 | top: 18 373 | }, 374 | autocompleteArea: { 375 | flexDirection: 'row', 376 | backgroundColor:'#fff', 377 | width: width, 378 | height: 80, 379 | alignItems: 'center', 380 | borderBottomWidth: 1, 381 | borderBottomColor: '#ddd', 382 | paddingHorizontal: 15 383 | }, 384 | marginRight10: { 385 | marginRight: 10 386 | }, 387 | btnArea: { 388 | position: 'absolute', 389 | bottom: 70, 390 | left: 0, 391 | right: 0 392 | }, 393 | btnContentArea: { 394 | width: width -30, 395 | height: 60, 396 | marginLeft:'auto', 397 | marginRight:'auto', 398 | borderRadius: 5, 399 | backgroundColor: '#C01C27', 400 | flex: 1, 401 | justifyContent:'center', 402 | alignItems:'center' 403 | }, 404 | btnTouchAble: { 405 | width: width -30, 406 | height: 60, 407 | flexDirection:'row', 408 | justifyContent:'center', 409 | alignItems: 'center' 410 | } 411 | }); -------------------------------------------------------------------------------- /src/screens/Settings.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet } from 'react-native'; 3 | import { ScrollView, TextInput, TouchableOpacity } from 'react-native-gesture-handler'; 4 | import FlatText from '../components/FlatText'; 5 | import Header from './section/Header'; 6 | import AsyncStorage from '@react-native-community/async-storage'; 7 | import config from '../../config/config.json'; 8 | import Toast from 'react-native-simple-toast'; 9 | 10 | export default class Settings extends Component { 11 | constructor(props) { 12 | super(props); 13 | this.state = { 14 | authorization_key: null, 15 | name: "", 16 | email: "", 17 | current_pass: "", 18 | password: "", 19 | confirm_pass: "", 20 | btnText: "Update", 21 | error: false 22 | }; 23 | } 24 | 25 | componentDidMount() { 26 | 27 | AsyncStorage.getItem('login').then((login) => { 28 | if (login !== null) { 29 | const logininfo = JSON.parse(login) 30 | this.setState({ authorization_key: logininfo.token }); 31 | }else{ 32 | this.props.navigation.navigate('Login',{ 33 | screen: 'Account' 34 | }); 35 | return true; 36 | } 37 | }) 38 | .catch((err) => { 39 | this.setState({ 40 | error: true 41 | }) 42 | }) 43 | 44 | setTimeout(() => { 45 | return fetch(config.APP_URL+'/api/info', { 46 | method: 'POST', 47 | headers: { 48 | Accept: 'application/json', 49 | 'Content-Type': 'application/json', 50 | Authorization: this.state.authorization_key 51 | } 52 | }) 53 | .then((response) => response.json()) 54 | .then((json) => { 55 | this.setState({ 56 | name: json.name, 57 | email: json.email 58 | }) 59 | }) 60 | .catch((error) => { 61 | this.setState({ 62 | error: true 63 | }) 64 | }); 65 | },100); 66 | } 67 | 68 | handleName = (text) => { 69 | this.setState({ name: text }); 70 | }; 71 | 72 | handleEmail = (text) => { 73 | this.setState({ email: text }); 74 | }; 75 | 76 | handleCurrentPass = (text) => { 77 | this.setState({ current_pass: text }); 78 | }; 79 | 80 | handlePass = (text) => { 81 | this.setState({ password: text }); 82 | }; 83 | 84 | handleConfirmPass = (text) => { 85 | this.setState({ confirm_pass: text }); 86 | }; 87 | 88 | 89 | logincheck() 90 | { 91 | AsyncStorage.getItem('login').then((login) => { 92 | if (login !== null) { 93 | const logininfo = JSON.parse(login) 94 | this.setState({ authorization_key: logininfo.token }); 95 | }else{ 96 | this.setState({ 97 | authorization_key: null 98 | }) 99 | } 100 | }) 101 | .catch((err) => { 102 | this.setState({ 103 | error: true 104 | }) 105 | }) 106 | } 107 | 108 | profile_update() 109 | { 110 | 111 | this.logincheck(); 112 | 113 | if (this.state.authorization_key == null) { 114 | this.props.navigation.navigate('Login',{ 115 | screen: 'Account' 116 | }); 117 | return true; 118 | } 119 | 120 | if(this.state.name == '') 121 | { 122 | Toast.showWithGravity( 123 | "The Name field is required", 124 | Toast.SHORT, 125 | Toast.CENTER 126 | ); 127 | return true; 128 | } 129 | 130 | if(this.state.email == '') 131 | { 132 | Toast.showWithGravity( 133 | "The Email field is required", 134 | Toast.SHORT, 135 | Toast.CENTER 136 | ); 137 | return true; 138 | } 139 | 140 | if(this.state.current_pass != '') 141 | { 142 | if(this.state.password == '') 143 | { 144 | Toast.showWithGravity( 145 | "The Password field is required", 146 | Toast.SHORT, 147 | Toast.CENTER 148 | ); 149 | return true; 150 | } 151 | 152 | if(this.state.confirm_pass == '') 153 | { 154 | Toast.showWithGravity( 155 | "The Confirmation Password field is required", 156 | Toast.SHORT, 157 | Toast.CENTER 158 | ); 159 | return true; 160 | } 161 | 162 | } 163 | 164 | this.setState({btnText: 'Please Wait...'}); 165 | 166 | fetch(config.APP_URL+'/api/user/settings', { 167 | method: 'POST', 168 | headers: { 169 | Accept: 'application/json', 170 | 'Content-Type': 'application/json', 171 | Authorization: this.state.authorization_key 172 | }, 173 | body: JSON.stringify({ 174 | name: this.state.name, 175 | email: this.state.email, 176 | current_password: this.state.current_pass, 177 | password: this.state.password, 178 | password_confirmation: this.state.confirm_pass 179 | }) 180 | }).then((response) => response.json()) 181 | .then((json) => { 182 | if(json.error) 183 | { 184 | Toast.showWithGravity( 185 | json.error, 186 | Toast.SHORT, 187 | Toast.CENTER 188 | ); 189 | this.setState({btnText: 'Update'}); 190 | } 191 | if(json.name) 192 | { 193 | Toast.showWithGravity( 194 | 'Profile Successfully Updated', 195 | Toast.SHORT, 196 | Toast.CENTER 197 | ); 198 | 199 | this.setState({ 200 | btnText: "Update" 201 | }) 202 | 203 | this.props.navigation.navigate('Account'); 204 | } 205 | }) 206 | .catch((error) => { 207 | this.setState({ 208 | error: true 209 | }) 210 | }); 211 | } 212 | 213 | render() { 214 | 215 | if(this.state.error) 216 | { 217 | return( 218 | 219 |
220 | 221 | 222 | 223 | 224 | ) 225 | }else{ 226 | 227 | } 228 | return ( 229 | 230 |
231 | 232 | 233 | 234 | 235 | 236 | 237 | 238 | this.handleName(text)} /> 239 | 240 | 241 | 242 | this.handleEmail(text)}/> 243 | 244 | 245 | 246 | 247 | 248 | 249 | this.handleCurrentPass(text)} secureTextEntry={true}/> 250 | 251 | 252 | 253 | this.handlePass(text)} secureTextEntry={true}/> 254 | 255 | 256 | 257 | this.handleConfirmPass(text)} secureTextEntry={true}/> 258 | 259 | 260 | this.profile_update()}> 261 | 262 | 263 | 264 | 265 | 266 | 267 | ); 268 | } 269 | } 270 | 271 | 272 | const styles = StyleSheet.create({ 273 | flex: { 274 | flex: 1 275 | }, 276 | card: { 277 | marginHorizontal: 20, 278 | marginVertical: 20, 279 | paddingHorizontal: 20, 280 | paddingVertical: 20, 281 | backgroundColor: '#fff' 282 | }, 283 | inputText: { 284 | borderWidth: 1, 285 | borderColor: '#ddd', 286 | borderRadius: 5, 287 | paddingHorizontal: 15, 288 | paddingVertical: 10, 289 | marginTop: 10, 290 | color: '#333' 291 | }, 292 | formGroup: { 293 | marginBottom: 20 294 | }, 295 | title: { 296 | marginBottom: 20 297 | }, 298 | btn: { 299 | backgroundColor: '#C01C27', 300 | paddingVertical: 20, 301 | paddingHorizontal: 20, 302 | alignItems: 'center', 303 | borderRadius: 5 304 | }, 305 | mainContainer: { 306 | flex: 1, 307 | justifyContent: 'center', 308 | alignItems: 'center' 309 | } 310 | }); -------------------------------------------------------------------------------- /src/screens/Thanks.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, StyleSheet, Dimensions } from 'react-native'; 3 | import FlatText from '../components/FlatText'; 4 | import Header from './section/Header'; 5 | import { Feather } from '@expo/vector-icons'; 6 | import { TouchableOpacity } from 'react-native-gesture-handler'; 7 | 8 | 9 | export default class Thanks extends Component { 10 | constructor(props) { 11 | super(props); 12 | this.state = { 13 | }; 14 | } 15 | 16 | render() { 17 | return ( 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | this.props.navigation.navigate('Account')}> 26 | 27 | 28 | 29 | 30 | ); 31 | } 32 | } 33 | 34 | 35 | const styles = StyleSheet.create({ 36 | flex: { 37 | flex: 1 38 | }, 39 | container: { 40 | flex: 1, 41 | justifyContent: 'center', 42 | alignItems: 'center' 43 | }, 44 | message: { 45 | marginTop: 10, 46 | marginBottom: 20 47 | }, 48 | btntext: { 49 | backgroundColor: '#333', 50 | borderRadius: 5, 51 | paddingHorizontal: 30, 52 | paddingVertical: 15 53 | } 54 | }); -------------------------------------------------------------------------------- /src/screens/Welcome.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | import { 3 | View, 4 | Image, 5 | StyleSheet, 6 | TouchableOpacity, 7 | Dimensions 8 | } from "react-native"; 9 | 10 | const { width, height } = Dimensions.get("window"); 11 | 12 | import AsyncStorage from "@react-native-community/async-storage"; 13 | import FlatText from "../components/FlatText"; 14 | 15 | import config from '../../config/config.json'; 16 | 17 | class Welcome extends Component { 18 | constructor(props) { 19 | super(props); 20 | this.state = { 21 | isLoading: false, 22 | loading: "Use Current Location", 23 | locationBtnColor: "#C01C27", 24 | buttonDisable: false, 25 | latitude: "", 26 | longitude: "", 27 | city: "", 28 | address: "", 29 | city_id:null, 30 | found_city:true, 31 | error: false 32 | }; 33 | } 34 | 35 | 36 | componentDidMount() 37 | { 38 | AsyncStorage.getItem('location').then((location) => { 39 | if (location !== null) { 40 | this.props.navigation.navigate('Home'); 41 | return true; 42 | } 43 | }) 44 | .catch((err) => { 45 | 46 | }); 47 | } 48 | 49 | currenLocation() { 50 | this.setState({ 51 | isLoading: true, 52 | buttonDisable: true, 53 | loading: "Please Wait....", 54 | locationBtnColor: "#e9636c", 55 | }); 56 | 57 | if (navigator.geolocation) { 58 | navigator.geolocation.getCurrentPosition( 59 | ({ coords: { latitude, longitude } }) => 60 | this.setState({ latitude, longitude }, this.storePosition), 61 | (error) => console.log("Error:", error) 62 | ); 63 | } else { 64 | alert("Geolocation is not supported by this phone."); 65 | this.setState({ 66 | loading: "Use Current Location", 67 | locationBtnColor: "#C01C27", 68 | buttonDisable: false, 69 | }); 70 | } 71 | } 72 | 73 | storePosition() { 74 | return fetch( 75 | "https://maps.googleapis.com/maps/api/geocode/json?latlng=" + 76 | this.state.latitude + 77 | "," + 78 | this.state.longitude + 79 | "&key="+ config.GOOGLE_MAP_API_KEY +"" 80 | ) 81 | .then((response) => response.json()) 82 | .then((json) => { 83 | if (json.status == "OK") { 84 | if (json.results[1]) { 85 | var country = null, 86 | countryCode = null, 87 | city = null, 88 | cityAlt = null; 89 | var c, lc, component; 90 | for (var r = 0, rl = json.results.length; r < rl; r += 1) { 91 | var result = json.results[r]; 92 | 93 | if (!city && result.types[0] === "locality") { 94 | for ( 95 | c = 0, lc = result.address_components.length; 96 | c < lc; 97 | c += 1 98 | ) { 99 | component = result.address_components[c]; 100 | 101 | if (component.types[0] === "locality") { 102 | city = component.long_name; 103 | break; 104 | } 105 | } 106 | } else if ( 107 | !city && 108 | !cityAlt && 109 | result.types[0] === "administrative_area_level_1" 110 | ) { 111 | for ( 112 | c = 0, lc = result.address_components.length; 113 | c < lc; 114 | c += 1 115 | ) { 116 | component = result.address_components[c]; 117 | 118 | if (component.types[0] === "administrative_area_level_1") { 119 | cityAlt = component.long_name; 120 | break; 121 | } 122 | } 123 | } else if (!country && result.types[0] === "country") { 124 | country = result.address_components[0].long_name; 125 | countryCode = result.address_components[0].short_name; 126 | } 127 | 128 | if (city && country) { 129 | break; 130 | } 131 | } 132 | 133 | this.setState({ 134 | city: city, 135 | address: json.results[1].formatted_address, 136 | loading: "Use Current Location" 137 | }); 138 | 139 | let url =config.APP_URL+'/api/area/'+city; 140 | 141 | fetch(url) 142 | .then((response) => response.json()) 143 | .then((json) => { 144 | if (json.data != null) { 145 | var id = json.data.id; 146 | this.setState({ 147 | city_id:id, 148 | found_city:true 149 | }); 150 | } 151 | else{ 152 | this.setState({ 153 | city_id: null, 154 | found_city:true 155 | }); 156 | } 157 | 158 | 159 | }) 160 | .catch((error) => console.error(error)); 161 | 162 | 163 | if (this.state.found_city == true) { 164 | 165 | const location = { 166 | latitude: this.state.latitude, 167 | longitude: this.state.longitude, 168 | city: this.state.city, 169 | city_id:this.state.city_id, 170 | address: this.state.address, 171 | city_change:true 172 | }; 173 | 174 | AsyncStorage.setItem("location", JSON.stringify(location)); 175 | this.props.navigation.navigate("Home"); 176 | } 177 | 178 | 179 | } 180 | } 181 | 182 | if(json.error_message) 183 | { 184 | Toast.showWithGravity( 185 | json.error_message, 186 | Toast.SHORT, 187 | Toast.CENTER 188 | ); 189 | this.setState({ 190 | loading: "Use Current Location" 191 | }) 192 | return true; 193 | } 194 | }) 195 | .catch((error) => { 196 | this.setState({ 197 | error: true 198 | }) 199 | }); 200 | } 201 | 202 | 203 | 204 | 205 | render() { 206 | if(this.state.error) 207 | { 208 | return ( 209 | 210 | 211 | 212 | ) 213 | }else{ 214 | return ( 215 | 216 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | this.currenLocation()} 229 | > 230 | 231 | 232 | 233 | 234 | this.props.navigation.navigate("Search")} 237 | > 238 | 239 | 240 | 241 | 242 | ); 243 | } 244 | } 245 | } 246 | 247 | export default Welcome; 248 | 249 | const styles = StyleSheet.create({ 250 | container: { 251 | flex: 1, 252 | justifyContent: "center", 253 | alignItems: "center", 254 | paddingHorizontal: 30, 255 | backgroundColor: "#fff", 256 | }, 257 | bannerImage: { 258 | width: width, 259 | height: height / 2, 260 | }, 261 | selectButton: { 262 | marginTop: 20, 263 | }, 264 | marginBottom: { 265 | marginBottom: 25 266 | }, 267 | mainContainer: { 268 | flex: 1, 269 | justifyContent: 'center', 270 | alignItems: 'center' 271 | }, 272 | currenLocationBtn: { 273 | backgroundColor: '#C01C27', 274 | paddingVertical: 15, 275 | paddingHorizontal: 20, 276 | width: width - 50, 277 | flexDirection: "row", 278 | justifyContent: "center", 279 | borderRadius: 5, 280 | } 281 | }); 282 | -------------------------------------------------------------------------------- /src/screens/section/Header.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | import { View, StyleSheet, Image } from "react-native"; 3 | import { SimpleLineIcons } from "@expo/vector-icons"; 4 | 5 | import FlatText from "../../components/FlatText"; 6 | import HeadText from "../../components/HeadText"; 7 | import AsyncStorage from "@react-native-community/async-storage"; 8 | import config from '../../../config/config.json'; 9 | 10 | 11 | export default class Header extends Component { 12 | 13 | constructor(props) { 14 | super(props); 15 | this.state = { 16 | city: "", 17 | address: "", 18 | isLoggedIn: false, 19 | name: 'test', 20 | authorization_key: "" 21 | }; 22 | } 23 | 24 | componentWillReceiveProps(props) 25 | { 26 | if(this.props.reload == 'no') 27 | { 28 | this.componentDidMount(); 29 | } 30 | } 31 | 32 | componentDidMount() { 33 | 34 | AsyncStorage.getItem("location").then((location) => { 35 | if (location !== null) { 36 | const locationdata = JSON.parse(location); 37 | this.setState({ 38 | city: locationdata.city, 39 | address: locationdata.address, 40 | }); 41 | } 42 | }); 43 | 44 | AsyncStorage.getItem('login').then((login) => { 45 | if (login !== null) { 46 | const logininfo = JSON.parse(login) 47 | this.setState({ authorization_key: logininfo.token }); 48 | fetch(config.APP_URL+'/api/info', { 49 | method: 'POST', 50 | headers: { 51 | Accept: 'application/json', 52 | 'Content-Type': 'application/json', 53 | Authorization: this.state.authorization_key 54 | } 55 | }) 56 | .then((response) => response.json()) 57 | .then((json) => { 58 | if (json.message != 'Unauthenticated.') { 59 | this.setState({ 60 | name: json.name, 61 | isLoggedIn: true 62 | }) 63 | } 64 | 65 | 66 | }) 67 | .catch((error) => { 68 | 69 | }); 70 | } 71 | 72 | 73 | 74 | }) 75 | .catch((err) => { 76 | 77 | }); 78 | 79 | 80 | 81 | 82 | } 83 | 84 | render() { 85 | 86 | 87 | 88 | return ( 89 | 90 | 91 | 98 | 99 | 105 | 112 | 113 | 114 | {(() => { 115 | if (this.state.isLoggedIn == true) { 116 | return ( 117 | 118 | 122 | 123 | ) 124 | } 125 | return null; 126 | })()} 127 | 128 | 129 | ); 130 | } 131 | } 132 | 133 | 134 | const styles = StyleSheet.create({ 135 | headerContainer: { 136 | paddingTop: 40, 137 | paddingHorizontal: 20, 138 | backgroundColor: "#fff", 139 | paddingBottom: 15, 140 | flexDirection: 'row', 141 | justifyContent: 'space-between' 142 | }, 143 | profileImg: { 144 | width: 45, 145 | height: 45, 146 | borderRadius: 60, 147 | flexDirection: "row", 148 | justifyContent: "center", 149 | alignItems: "center" 150 | }, 151 | location: { 152 | fontSize: 14, 153 | color: "#666", 154 | }, 155 | dFlex: { 156 | flexDirection: "row", 157 | }, 158 | arrowIcon: { 159 | paddingLeft: 5, 160 | paddingTop: 1, 161 | }, 162 | locationIcon: { 163 | marginTop: 4, 164 | marginRight: 5 165 | } 166 | }); 167 | -------------------------------------------------------------------------------- /web-build/register-service-worker.js: -------------------------------------------------------------------------------- 1 | /* eslint-env browser */ 2 | 3 | if ('serviceWorker' in navigator) { 4 | window.addEventListener('load', function () { 5 | navigator.serviceWorker 6 | .register('/expo-service-worker.js', { scope: '/' }) 7 | .then(function (info) { 8 | // console.info('Registered service-worker', info); 9 | }) 10 | .catch(function (error) { 11 | console.info('Failed to register service-worker', error); 12 | }); 13 | }); 14 | } 15 | --------------------------------------------------------------------------------