/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from "react";
import { AppRegistry, StyleSheet, Text, View, Image } from "react-native";
import { StackNavigator, TabNavigator } from "react-navigation";

import Home from "./src/pages/Home/index";
import InsuranceCircle from "./src/pages/InsuranceCircle/index";
import InsuranceChurch from "./src/pages/InsuranceChurch/index";
import Mine from "./src/pages/Mine/index";
import Login from "./src/pages/Login";
import AllProduct from "./src/pages/Home/allProduct";
import ProductTemplate from "./src/Components/ProductTemplate";
import ArticleTemplate from "./src/Components/articleTemplate";
import Details from "./src/pages/InsuranceCircle/details";
import Release from "./src/pages/InsuranceCircle/release";
import Discover from "./src/pages/Discover/index";
import AIBegin from "./src/pages/Home/AISolution/Begin";
import AIQuestion from "./src/pages/Home/AISolution/Question";
import AISolution from "./src/pages/Home/AISolution/Solution";
import HealthQuestionnaire from "./src/pages/Home/healthQuestionnaire";

// 底部导航栏配置，但也只是作为一个页面，加载到StackNavigator成为第一个页面
const MainTabBar = TabNavigator(
  {
    Home: {
      screen: Home,
      navigationOptions: {
        title: "首页",
        tabBarIcon: ({ focused }) =>
          focused ? (
            <Image source={require("./src/assets/tabbar/ic_home_s.png")} />
          ) : (
              <Image source={require("./src/assets/tabbar/ic_home_n.png")} />
            )
      }
    },
    InsuranceCircle: {
      screen: InsuranceCircle,
      navigationOptions: {
        title: "保圈",
        tabBarIcon: ({ focused }) =>
          focused ? (
            <Image source={require("./src/assets/tabbar/ic_circle_s.png")} />
          ) : (
              <Image source={require("./src/assets/tabbar/ic_circle_n.png")} />
            )
      }
    },
    Discover: {
      screen: Discover,
      navigationOptions: {
        title: "发现",
        // header: null,
        // tabBarVisible: false,
        tabBarIcon: ({ focused }) =>
          focused ? (
            <Image source={require("./src/assets/tabbar/ic_discover_s.png")} />
          ) : (
              <Image source={require("./src/assets/tabbar/ic_discover_n.png")} />
            )
      }
    },
    InsuranceChurch: {
      screen: InsuranceChurch,
      navigationOptions: {
        title: "保堂",
        tabBarIcon: ({ focused }) =>
          focused ? (
            <Image source={require("./src/assets/tabbar/ic_umbrella_s.png")} />
          ) : (
              <Image source={require("./src/assets/tabbar/ic_umbrella_n.png")} />
            )
      }
    },
    Mine: {
      screen: Mine,
      navigationOptions: {
        title: "我的",
        tabBarIcon: ({ focused }) =>
          focused ? (
            <Image source={require("./src/assets/tabbar/ic_mine_s.png")} />
          ) : (
              <Image source={require("./src/assets/tabbar/ic_mine_n.png")} />
            )
      }
    }
  },
  {
    swipeEnabled: true,
    tabBarOptions: {
      activeTintColor: "#1B9341"
    }
  }
);

const ProtectGod = StackNavigator(
  {
    MainTabBar: { screen: MainTabBar },
    Home: { screen: Home },
    InsuranceCircle: { screen: InsuranceCircle },
    InsuranceChurch: { screen: InsuranceChurch },
    Mine: { screen: Mine },
    Login: { screen: Login },
    AllProduct: {
      screen: AllProduct,
      navigationOptions: { headerTitle: "全部产品" }
    },
    ProductTemplate: { screen: ProductTemplate },
    ArticleTemplate: { screen: ArticleTemplate },
    Details: { screen: Details },
    Release: {
      screen: Release,
      navigationOptions: { headerTitle: "发布" }
    },
    Discover: { screen: Discover },
    AIBegin: {
      screen: AIBegin,
      navigationOptions: { headerTitle: "智能方案" }
    },
    AIQuestion: {
      screen: AIQuestion,
      navigationOptions: { headerTitle: "智能方案" }
    },
    AISolution: {
      screen: AISolution,
      navigationOptions: { headerTitle: "智能方案" }
    },
    HealthQuestionnaire: {
      screen: HealthQuestionnaire,
      navigationOptions: { headerTitle: "健康问卷" }
    }
  },
  {
    navigationOptions: {
      // headerTintColor: "blue",
      headerBackTitle: "返回",
      headerStyle: {
        backgroundColor: "white"
      }
    }
  }
);

const styles = StyleSheet.create();

AppRegistry.registerComponent("ProtectGod", () => ProtectGod);