occ-mobile/app/router.js

import React, { PureComponent } from 'react'
import { BackHandler, Animated, Easing } from 'react-native'
import {
  StackNavigator,
  TabNavigator,
  TabBarBottom,
  addNavigationHelpers,
  NavigationActions,
} from 'react-navigation'
import {
  initializeListeners,
  createReduxBoundAddListener,
  createReactNavigationReduxMiddleware,
} from 'react-navigation-redux-helpers'
import { connect } from 'react-redux'

import Testaa from './testaaa'

import { isIphoneX } from './containers/common/theme/config'
import { SETHEADER } from './containers/Global'
//首页Tab里的内容
import Home from './containers/home/Home'
import CommodityHome from './containers/commodity/CommodityHome'
import MineHome from './containers/mine/MineHome'
import OrderHome from './containers/order/OrderHome'
import ShoppingCartHome from './containers/shoppingcart/ShoppingCartHome'
//最近浏览更多
import RecentViewMore from './containers/home/RecentView'
// 商家公告
import Announcement from './containers/home/AnnouncementTab'
import AnnounceDetail from './containers/home/announcement/AnnounceDetail'
//待审核
import Pending from './containers/home/pending/Pending'
// 待发货
import Unshipped from './containers/home/unshipped/Unshipped'
// 待收货
import Dispatched from './containers/home/dispatched/Dispatched'
// 补货
import Replenishment from './containers/home/replenishment/Replenishment'
// 商品展示
import CommodityShowbase from './containers/commodity/CommodityShowbase'
// 商品详情

/**
 * info:订单
 *
 **/
// 订单编辑
import OrderEdit from './containers/order/OrderEdit'
// 订单支付
import OrderPay from './containers/order/orderamanage/OrderPay'
// 订单详情
import OrderDetail from './containers/order/OrderDetail'
// 订单日志
import OrderLog from './containers/order/OrderLog'
// 退货申请
import ReturnApplication from './containers/order/ordertoptab/returnsign/ReturnApplication'
// 退货编辑
import ReturnEdit from './containers/order/ordertoptab/returnsign/ReturnEdit'
// 促销选商品
import OrderGifts from './containers/order/orderamanage/OrderGifts'
// 退货详情
import ReturnDetail from './containers/order/ordertoptab/returnsign/ReturnDetail'
// 选择发票
import SelectInvoice from './containers/common/SelectInvoice'
// 选择地址
import SelectAdress from './containers/common/SelectAdress'

import CommodityTab from './containers/commodity/commoditydetail/Tab'
import DeliveryDetail from './containers/order/ordertoptab/deliverysign/DeliveryDetail'
import Loading from './containers/Loading'
import Login from './containers/Login'
import LogForget from './containers/LogForget'

/**
 * info:我的
 *
 **/
// 账户
import Account from './containers/mine/header/Account'
// 费用
import Cost from './containers/mine/header/Cost'
import CostDetail from './containers/mine/header/CostDetail'
// 信用
import Credit from './containers/mine/header/Credit'
// 应付对账
import PayReconciliation from './containers/mine/viewlist/PayReconciliation'
// 费用对账
import CostReconciliation from './containers/mine/viewlist/CostReconciliation'
import ReconciliationDetail from './containers/mine/viewlist/ReconciliationDetail'
// 基本信息
import BasicInfo from './containers/mine/viewlist/BasicInfo'
// 客户收货地址
import CustomerAddress from './containers/mine/viewlist/CustomerAddress'
// 客户联系人
import CustomerContact from './containers/mine/viewlist/CustomerContact'
// 我的供应商
import Supplier from './containers/mine/viewlist/Supplier'
// 付款单登记
import PaymentRegister from './containers/mine/viewlist/paymentregister/PaymentRegister'
// 付款单新增
import PaymentAdd from './containers/mine/viewlist/paymentregister/PaymentAdd'
// 付款单关联订单界面
import PaymentAssociate from './containers/mine/viewlist/paymentregister/PaymentAssociate'
// 支付单
import RechargeHome from './containers/mine/viewlist/recharge/RechargeHome'
// 支付单新增
import RechargeAdd from './containers/mine/viewlist/recharge/RechargeAdd'

import Setting from './containers/mine/Setting'

const HomeNavigator = TabNavigator(
  {
    Home: {
      getScreen: () => Home,
      path: 'tab/Home',
    },
    CommodityHome: {
      getScreen: () => CommodityHome,
      path: 'tab/CommodityHome',
    },
    OrderHome: {
      getScreen: () => OrderHome,
      path: 'tab/OrderHome',
    },
    ShoppingCartHomeTab: {
      getScreen: () => ShoppingCartHome,
      path: 'tab/ShoppingCartHomeTab',
    },
    MineHome: {
      getScreen: () => MineHome,
      path: 'tab/MineHome',
    },
  },
  {
    initialRouteName: 'Home',
    lazy: true,
    tabBarComponent: TabBarBottom,
    tabBarPosition: 'bottom',
    swipeEnabled: false,
    animationEnabled: false,
    tabStyle: { backgroundColor: 'red' },
    tabBarOptions: {
      activeTintColor: '#E70013', // 文字和图片选中颜色
      inactiveTintColor: '#333', // 文字和图片未选中颜色
      showIcon: true, // android 默认不显示 icon, 需要设置为 true 才会显示
    },

    // lazy: false
  }
)

const MainNavigator = StackNavigator(
  {
    Home: {
      getScreen: () => HomeNavigator,
      path: 'tab/Home',
      navigationOptions: {
        header: null,
      },
    },
    CommodityHome: {
      getScreen: () => HomeNavigator,
      path: 'tab/CommodityHome',
      navigationOptions: {
        header: null,
      },
    },
    OrderHome: {
      getScreen: () => HomeNavigator,
      path: 'tab/OrderHome',
      navigationOptions: {
        header: null,
      },
    },
    ShoppingCartHomeTab: {
      getScreen: () => HomeNavigator,
      path: 'tab/ShoppingCartHome',
      navigationOptions: {
        header: null,
      },
    },
    MineHome: {
      getScreen: () => HomeNavigator,
      path: 'tab/MineHome',
      navigationOptions: {
        header: null,
      },
    },
    // HomeNavigator: {
    //   screen: () => <HomeNavigator />,
    //   navigationOptions: {
    //     header: null
    //   }
    // },
    //最近浏览更多
    RecentViewMore: {
      screen: RecentViewMore,
      navigationOptions: {
        // header: null
      },
    },
    // RecentViewMore: () => RecentViewMore,
    // 商家公告
    Announcement: {
      screen: Announcement,
      navigationOptions: {
        header: null,
      },
    },
    // 公告详情
    AnnounceDetail: {
      screen: AnnounceDetail,
      navigationOptions: {
        header: null,
      },
    },
    //待审核
    Pending: {
      screen: Pending,
      navigationOptions: {
        header: null,
      },
    },
    // 补货
    Replenishment: {
      screen: Replenishment,
      navigationOptions: {
        header: null,
      },
    },
    // 待收货
    Dispatched: {
      screen: Dispatched,
      navigationOptions: {
        header: null,
      },
    },
    // 待发货
    Unshipped: {
      screen: Unshipped,
      navigationOptions: {
        header: null,
      },
    },
    // 商品展示
    CommodityShowbase: {
      screen: CommodityShowbase,
      navigationOptions: {
        header: null,
      },
    },
    // 商品详情
    CommodityTab: {
      screen: CommodityTab,
      navigationOptions: {
        header: null,
      },
    },
    // Detail: {
    //   screen: Detail,
    //   navigationOptions: {
    //     header: null
    //   }
    // },
    ShoppingCartHome: {
      screen: ShoppingCartHome,
      navigationOptions: {
        header: null,
      },
    },
    // 订单发货详情
    DeliveryDetail: {
      screen: DeliveryDetail,
      navigationOptions: {
        header: null,
      },
    },
    // 订单发货详情
    OrderEdit: {
      screen: OrderEdit,
      navigationOptions: {
        header: null,
      },
    },
    // 订单支付
    OrderPay: {
      screen: OrderPay,
      navigationOptions: {
        header: null,
      },
    },
    // 订单详情
    OrderDetail: {
      screen: OrderDetail,
      navigationOptions: {
        header: null,
      },
    },
    // 订单日志
    OrderLog: {
      screen: OrderLog,
      navigationOptions: {
        header: null,
      },
    },
    // 退货申请
    ReturnApplication: {
      screen: ReturnApplication,
      navigationOptions: {
        header: null,
      },
    },
    // 促销选商品
    OrderGifts: {
      screen: OrderGifts,
      navigationOptions: {
        header: null,
      },
    },
    // 选择发票
    SelectInvoice: {
      screen: SelectInvoice,
      navigationOptions: {
        header: null,
      },
    },
    // 选择地址
    SelectAdress: {
      screen: SelectAdress,
      navigationOptions: {
        header: null,
      },
    },
    // 退货详情
    ReturnDetail: {
      screen: ReturnDetail,
      navigationOptions: {
        header: null,
      },
    },
    // 退货编辑
    ReturnEdit: {
      screen: ReturnEdit,
      navigationOptions: {
        header: null,
      },
    },
    // 我的
    // 账户-我的
    Account: {
      screen: Account,
      navigationOptions: {
        header: null,
      },
    },
    // 费用-我的
    Cost: {
      screen: Cost,
      navigationOptions: {
        header: null,
      },
    },
    // 费用详情-我的
    CostDetail: {
      screen: CostDetail,
      navigationOptions: {
        header: null,
      },
    },
    // 信用-我的
    Credit: {
      screen: Credit,
      navigationOptions: {
        header: null,
      },
    },
    // 应付对账-我的
    PayReconciliation: {
      screen: PayReconciliation,
      navigationOptions: {
        header: null,
      },
    },
    // 费用对账-我的
    CostReconciliation: {
      screen: CostReconciliation,
      navigationOptions: {
        header: null,
      },
    },
    // 对账详情-我的
    ReconciliationDetail: {
      screen: ReconciliationDetail,
      navigationOptions: {
        header: null,
      },
    },
    // 基本信息-我的
    BasicInfo: {
      screen: BasicInfo,
      navigationOptions: {
        header: null,
      },
    },
    // 客户收货地址-我的
    CustomerAddress: {
      screen: CustomerAddress,
      navigationOptions: {
        header: null,
      },
    },
    // 客户联系人-我的
    CustomerContact: {
      screen: CustomerContact,
      navigationOptions: {
        header: null,
      },
    },
    // 付款单登记-我的
    PaymentRegister: {
      screen: PaymentRegister,
      navigationOptions: {
        header: null,
      },
    },
    // 付款单登记-关联订单界面
    PaymentAssociate: {
      screen: PaymentAssociate,
      navigationOptions: {
        header: null,
      },
    },
    // 付款单新增-我的
    PaymentAdd: {
      screen: PaymentAdd,
      navigationOptions: {
        header: null,
      },
    },
    // 支付单-我的
    RechargeHome: {
      screen: RechargeHome,
      navigationOptions: {
        header: null,
      },
    },
    // 支付单新增-我的
    RechargeAdd: {
      screen: RechargeAdd,
      navigationOptions: {
        header: null,
      },
    },
    // 供应商-我的
    Supplier: {
      screen: Supplier,
      navigationOptions: {
        header: null,
      },
    },
  },
  {
    initialRouteName: 'Home',
    // initialRouteName: "HomeNavigator",
    headerMode: 'float',
  }
)

const AppNavigator = StackNavigator(
  {
    Main: {
      screen: MainNavigator,
    },
    Login: {
      screen: Login,
      navigationOptions: {
        header: null,
      },
    },
    Testaa: {
      screen: Testaa,
      navigationOptions: {
        header: null,
      },
    },
    LogForget: {
      screen: LogForget,
      navigationOptions: {
        header: null,
      },
    },
    Setting: {
      screen: Setting,
      navigationOptions: {
        header: null,
      },
    },
  },
  {
    initialRouteName: 'Login',
    // initialRouteName: "Testaa",
    lazy: true,
    headerMode: 'none',
    mode: 'modal',
    navigationOptions: {
      gesturesEnabled: false,
    },
    transitionConfig: () => ({
      transitionSpec: {
        duration: 300,
        easing: Easing.out(Easing.poly(4)),
        timing: Animated.timing,
      },
      screenInterpolator: sceneProps => {
        const { layout, position, scene } = sceneProps
        const { index } = scene

        const height = layout.initHeight
        const translateY = position.interpolate({
          inputRange: [index - 1, index, index + 1],
          outputRange: [height, 0, 0],
        })

        const opacity = position.interpolate({
          inputRange: [index - 1, index - 0.99, index],
          outputRange: [0, 1, 1],
        })

        return { opacity, transform: [{ translateY }] }
      },
    }),
  }
)

const defaultGetStateForAction = MainNavigator.router.getStateForAction
MainNavigator.router.getStateForAction = (action, state) => {
  // goBack返回指定页面
  if (state && action.type === 'Navigation/BACK' && action.key) {
    const backRoute = state.routes.find(route => route.routeName === action.key)
    if (backRoute) {
      const backRouteIndex = state.routes.indexOf(backRoute)
      const purposeState = {
        ...state,
        routes: state.routes.slice(0, backRouteIndex + 1),
        index: backRouteIndex,
      }
      return purposeState
    }
  }
  return defaultGetStateForAction(action, state)
}

function getCurrentScreen(navigationState) {
  if (!navigationState) {
    return null
  }
  const route = navigationState.routes[navigationState.index]
  if (route.routes) {
    return getCurrentScreen(route)
  }
  return route.routeName
}

export const routerMiddleware = createReactNavigationReduxMiddleware(
  'root',
  state => state.router
)
const addListener = createReduxBoundAddListener('root')

@connect(({ app, router }) => ({ app, router }))
class Router extends PureComponent {
  componentWillMount() {
    BackHandler.addEventListener('hardwareBackPress', this.backHandle)
    let hederStyle = {
      height: 60,
      paddingTop: 10,
      paddingBottom: 0,
    }
    if (isIphoneX()) {
      hederStyle.height = 77
      hederStyle.paddingTop = 17
      hederStyle.paddingBottom = 34
    }
    SETHEADER(hederStyle)
  }

  componentDidMount() {
    initializeListeners('root', this.props.router)
  }

  componentWillUnmount() {
    BackHandler.removeEventListener('hardwareBackPress', this.backHandle)
  }

  backHandle = () => {
    const currentScreen = getCurrentScreen(this.props.router)
    if (currentScreen === 'Login') {
      return true
    }
    if (currentScreen !== 'Home') {
      this.props.dispatch(NavigationActions.back())
      return true
    }
    return false
  }
  render() {
    const { dispatch, app, router } = this.props
    if (app.loading) return <Loading />

    const navigation = addNavigationHelpers({
      dispatch,
      state: router,
      addListener,
    })
    return <AppNavigator navigation={navigation} />
  }
}

export function routerReducer(state, action = {}) {
  return AppNavigator.router.getStateForAction(action, state)
}

export default Router