import React, {Component} from 'react';
import {View, Image, TouchableOpacity} from 'react-native';

import {createStackNavigator} from '@react-navigation/stack';
import personal_center_page from '../../page/personalCenter/personal_center_page';
import login from '../../page/login/login';
import home_page from '../../page/homePage/home_page';
import StackNavigator from '@react-navigation/stack/src/navigators/createStackNavigator';
import product_add from '../../page/productInfo/product_add';
import product_edit from '../../page/productInfo/product_edit';
import tax_category_codes from '../../page/productInfo/tax_category_codes';
import tax_category_detail from '../../page/productInfo/tax_category_detail';
import login_head from '../../page/login/login_head';
import forget_password from '../../page/login/forget_password';
import invoice_customer_information from '../../page/invoice/invoice_customer_information';
import invoice_product_number from '../../page/invoice/invoice_product_number';
import invoice_product_list from '../../page/invoice/invoice_product_list';
import invoice_product_list_add from '../../page/invoice/invoice_product_list_add';
import invoice_user from '../../page/invoice/invoice_user';
import customer_information from '../../page/customerInformation/customer_information';
import customer_add from '../../page/customerInformation/customer_add';
import customer_edit from '../../page/customerInformation/customer_edit';
import customer_see from '../../page/customerInformation/customer_see';
import product_infos from '../../page/productInfo/product_infos';
import enterprise_list from '../../page/enterpriseInfo/enterpriseList';
import invoice_select_customer from '../../page/invoice/invoice_select_customer';

const HomeStack = createStackNavigator();

export default class home_navigation extends Component {
  constructor(props) {
    super(props);
    this.state = {
      language: '',
    };
  }

  render() {
    return (
      <HomeStack.Navigator initialRouteName="home_page">
        <HomeStack.Screen
          name="home_page"
          component={home_page}
          options={{
            title: '首页',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name="product_infos"
          component={product_infos}
          options={{
            headerTitle: '商品信息',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
            headerRight: () => (
              <View style={{marginRight: 20}}>
                <TouchableOpacity
                  onPress={() => {
                    this.props.navigation.navigate('product_add');
                  }}>
                  <Image
                    source={require('../../source/img/productImg/newAddIcon.png')}
                    style={{height: 16, width: 16}}
                  />
                </TouchableOpacity>
                {/*<Text style={{fontSize: 16, color: 'red'}}>新增</Text>*/}
              </View>
            ),
          }}
        />
        <HomeStack.Screen
          name="product_add"
          component={product_add}
          options={{
            title: '新增商品',
            headerTintColor: 'white',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
              borderBottomWidth: 0,
            },
          }}
        />
        <HomeStack.Screen
          name="product_edit"
          component={product_edit}
          options={{
            title: '修改商品信息',
            headerTintColor: 'white',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
              borderBottomWidth: 0,
            },
          }}
        />
        <HomeStack.Screen
          name="tax_category_codes"
          component={tax_category_codes}
          options={{
            title: '税收分类编码',
            headerTintColor: 'white',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
              borderBottomWidth: 0,
            },
          }}
        />
        <HomeStack.Screen
          name="tax_category_detail"
          component={tax_category_detail}
          options={{
            title: '税收分类编码详情',
            headerTintColor: 'white',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
              borderBottomWidth: 0,
            },
          }}
        />
        <HomeStack.Screen
          name="login_head"
          component={login_head}
          options={{
            title: '登录',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name="forget_password"
          component={forget_password}
          options={{
            title: '密码修改',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        {/*开票*/}
        <HomeStack.Screen
          name={'invoice_customer_information'}
          component={invoice_customer_information}
          options={{
            title: '开票确认',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name={'invoice_product_number'}
          component={invoice_product_number}
          options={{
            title: '产品确认',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name={'invoice_product_list'}
          component={invoice_product_list}
          options={{
            headerTitle: '产品列表',
            headerTitleAlign: 'center',
            headerRight: () => (
              <View style={{marginRight: 20}}>
                <TouchableOpacity
                  onPress={() => {
                    this.props.navigation.navigate('invoice_product_list_add');
                  }}>
                  <Image
                    source={require('../../source/img/add.png')}
                    style={{height: 16, width: 16}}
                  />
                </TouchableOpacity>
              </View>
            ),
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name={'invoice_product_list_add'}
          component={invoice_product_list_add}
          options={{
            title: '添加开票产品',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name="invoice_user"
          component={invoice_user}
          options={{
            title: '人员信息编辑',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name={'invoice_select_customer'}
          component={invoice_select_customer}
          options={{
            title: '客户信息选择',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        {/*客户信息*/}
        <HomeStack.Screen
          name="customer_information"
          component={customer_information}
          options={{
            headerTitle: '客户信息',
            headerTitleAlign: 'center',
            headerRight: () => (
              <View style={{marginRight: 20}}>
                <TouchableOpacity
                  onPress={() => {
                    this.props.navigation.navigate('customer_add');
                  }}>
                  <Image
                    source={require('../../source/img/productImg/addIcon.png')}
                    style={{height: 16, width: 16}}
                  />
                </TouchableOpacity>
              </View>
            ),
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name="customer_add"
          component={customer_add}
          options={{
            title: '新增客户信息',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name="customer_edit"
          component={customer_edit}
          options={{
            title: '编辑客户信息',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name="customer_see"
          component={customer_see}
          options={{
            title: '客户信息',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
        <HomeStack.Screen
          name="enterprise_list"
          component={enterprise_list}
          options={{
            title: '企业信息',
            headerTitleAlign: 'center',
            headerStyle: {
              backgroundColor: '#1199EA',
            },
            headerTintColor: '#fff',
          }}
        />
      </HomeStack.Navigator>
    );
  }

  shouldComponentUpdate(
    nextProps: Readonly<P>,
    nextState: Readonly<S>,
    nextContext: any,
  ): boolean {
    //console.log("state: "+ JSON.stringify(nextProps.route));
    if (nextProps.route.name === 'home_navigation') {
      if (nextProps.route.state !== null && nextProps.route.state.index === 0) {
        this.props.navigation.setOptions({
          tabBarVisible: true,
        });
      }
    }
    return true;
  }
}