import React, {useState} from 'react'; import {DeviceEventEmitter, Platform, View} from 'react-native'; import {getFontXD} from '../../Config/Functions'; import DueDate from './DueDate/DueDate'; import Escrow from './Escrow/Escrow'; import PriceList from './PriceList/PriceList'; import TimeTransaction from './TimeTransaction/TimeTransaction'; import I18n from '../../helper/i18/i18n'; import {connect} from 'react-redux'; import {createMaterialTopTabNavigator} from '@react-navigation/material-top-tabs'; import HeaderDrawer from '../../components/Header/HeaderDrawer'; import SearchProductCodeModal from './SearchProductCodeModal'; import {getListCategoryProduct} from '../../apis/Functions/Transaction'; import {showAlert, TYPE} from '../../components/DropdownAlert'; import _ from 'lodash'; const Tab = createMaterialTopTabNavigator(); const NewFeed = (props) => { const [showSearchPopup, setShowSearchPopup] = useState(false); const [dataCategory, setDataCategory] = useState([]); const onSearchPress = () => { setShowSearchPopup(true); DeviceEventEmitter.emit('PressSearchTransaction') if (_.isEmpty(dataCategory)) { getCategoryData(); } }; const getCategoryData = async () => { // setIsRefresh(true); const res = await getListCategoryProduct({ keyword: '', platform: Platform.OS, page_size: 20, page_index: 1, type: 'PRODUCT', }); if ((res.data.code = 200 && res.data.data)) { let data = []; data.push({id: -1, name: I18n.t('All')}); setDataCategory(data.concat([...res.data.data])); } else { showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message); } }; const onSearch = (industryGroup, product, period) => { setShowSearchPopup(false); DeviceEventEmitter.emit('SearchTransaction', {industryGroup: industryGroup, product: product, period: period}); }; return ( <View style={{flex: 1}}> <HeaderDrawer title={'Tradding'} isWhite={true} isShowSearch={true} onSearchPress={onSearchPress}/> <View style={{flex: 1, backgroundColor: 'white'}}> <Tab.Navigator initialRouteName="PriceList" swipeEnabled={false} tabBarOptions={{ scrollEnabled: true, inactiveTintColor: '#929292', activeTintColor: '#1473E6', labelStyle: {fontSize: getFontXD(36)}, style: {backgroundColor: 'white'}, }}> <Tab.Screen name="PriceList" component={PriceList} options={{ tabBarLabel: props.language.language == 'vi' ? 'Bảng phí' : 'PriceList', }} /> <Tab.Screen name="TimeTransaction" component={TimeTransaction} options={{ tabBarLabel: props.language.language == 'vi' ? 'Thời gian GD' : 'Time transace', }} /> <Tab.Screen name="Escrow" component={Escrow} options={{ tabBarLabel: props.language.language == 'vi' ? 'Ký quỹ' : 'Escrow', }} /> <Tab.Screen name="DueDate" component={DueDate} options={{ tabBarLabel: props.language.language == 'vi' ? 'Lịch đáo hạn' : 'Due date', }} /> </Tab.Navigator> </View> <SearchProductCodeModal hidePopup={() => { setShowSearchPopup(false); }} isModalVisible={showSearchPopup} data={[]} dataCategory={dataCategory} onSearchPress={onSearch} /> </View> ); }; const mapStateToProps = (state) => { return { language: state.languageReducer, }; }; export default connect(mapStateToProps, {})(NewFeed);