Untitled
unknown
plain_text
4 years ago
44 kB
6
Indexable
import React, { Component } from 'react'; import { StyleSheet, Text, View, Dimensions, ScrollView, Image, FlatList, TouchableOpacity, SafeAreaView, Alert, TextInput } from 'react-native'; // import Constants from 'expo-constants'; import { SearchBar } from 'react-native-elements'; import DeviceInfo from 'react-native-device-info'; import { ProgressDialog } from 'react-native-simple-dialogs'; import moment from 'moment'; import Database from '../Database/Database'; import { Header, Left, Right, Body, Footer, Container, Tabs, Tab, TabHeading, Item } from 'native-base'; import Icon1 from 'react-native-vector-icons/FontAwesome'; import Icon from 'react-native-vector-icons/MaterialIcons'; import IconM from 'react-native-vector-icons/MaterialIcons'; import Service from '../Service/Service'; import { AsyncStorage } from 'react-native'; import { Grid, Row, Col } from 'react-native-easy-grid'; import { Autocomplete, withKeyboardAwareScrollView } from "react-native-dropdown-autocomplete"; import { createStyles, maxWidth } from 'react-native-media-queries'; import { lan_en, lan_ch } from '../Component/Language'; import SelectMultiple from 'react-native-select-multiple' import PageFooter from './PageFooter'; import Toast from 'react-native-simple-toast' const sv = new Service(); const deviceWidth = Dimensions.get('screen').width; const deviceHeight = Dimensions.get('screen').height; var userdata = []; var comboArray = [] var eqparray = [] var ratearray = [] var statusarray = [] var itemarray = [] var norarray=[] var date = '' var epq = { eqptype: [], rateno: [] } const colors1 = ['#8c4648', '#E2C471', '#79964B', '#304E60', '#6E4D9B', '#4CB5F5', '#1F3F49', '#D32D41', '#6AB187', '#B3C100', '#CED2CC', '#23282D' ] const colors = ['#fa8484', '#87bdc9', '#bbbbbb', '#e4adff', '#69dbfd'] const db = new Database(); class Ratereferencesearch extends React.Component { constructor(props) { super(props); this.state = { visible: false, tableData: [], item: '', customercode: '', customername: '', pla: '', pld: '', progressVisible: true, itemno: '', autorate: [], search: "", language: '', Placeholder_Rateno: '', eqparray: [], etdvalue: '' } } componentDidMount() { AsyncStorage.getItem('lang').then((value) => { console.log("----language---", value) if (value == 'lang_ch') { this.setState({ language: "lang_ch" }) this.setState({ Placeholder_Rateno: lan_ch[0].Placeholder_Rateno }) } else { this.setState({ language: "lang_en" }) this.setState({ Placeholder_Rateno: lan_en[0].Placeholder_Rateno }) } }) this.setState({ version: DeviceInfo.getVersion() }) AsyncStorage.getItem('customercode').then(value => { // console.log("inside the code>>>>",value); this.setState({ "customercode": value }) }) AsyncStorage.getItem('customername').then(value => { this.setState({ "customername": value }) }) AsyncStorage.getItem('pla').then(value => { // console.log("isnide the code ...",value); this.setState({ "pla": value }) }) AsyncStorage.getItem('pld').then(value => { this.setState({ "pld": value }) }) AsyncStorage.getItem('etd').then(value => { console.log("etd Value...", value) this.setState({ "etdvalue": value }) }) // AsyncStorage.getItem('autorate').then(value => { // console.log("inside autorate...",value); // this.setState({"autorate":value}) // }) // {this.state.tableData.map((item, index) => // this.state.autorate.push(item.srrno) // )} for (let i = 0; i < this.props.navigation.state.params.tableData.length; i++) { console.log("inside the com ... ", this.props.navigation.state.params.tableData); this.state.autorate.push(this.props.navigation.state.params.tableData[i].srrno); console.log("autorate book", this.state.autorate); } if (this.props.navigation.state.params.tableData.length != 0) { this.setState({ tableData: this.props.navigation.state.params.tableData, progressVisible: false, }) if (this.state.customername != null && this.state.customercode != null) { AsyncStorage.setItem('customer', this.state.customername + "(" + this.state.customercode + ")"); } else { AsyncStorage.setItem('customer', ''); } } else { Alert.alert( '', 'No Rates for the selected customercode', [ { text: 'Ok', onPress: () => { if (this.state.customername != null && this.state.customercode != null) { AsyncStorage.setItem('customer', ''); AsyncStorage.setItem('eqptype', 'Type') AsyncStorage.setItem('mycust_rate', 'S'); this.setState({ progressVisible: false }) // AsyncStorage.setItem('customer', this.state.customername + "(" + this.state.customercode + ")" ); } else { AsyncStorage.setItem('customer', ''); AsyncStorage.setItem('mycust_rate', 'S'); this.setState({ progressVisible: false }) } this.props.navigation.navigate('Booking', { parent: 'Ratereferencesearch' }); }, }, ], { cancelable: false }, ) } AsyncStorage.setItem('mycust_rate', 'S'); } onautocom() { console.log("INSIDE THE METHOD>>>", this.state.tableData.length) } renderHeader = () => { const { search } = this.state; return ( <View style={{ padding: 20 }}> <SearchBar placeholder={this.state.Placeholder_Rateno} lightTheme inputStyle={styles.searchstyle} inputContainerStyle={styles.searchstyle1} containerStyle={styles.searchstyle2} onChangeText={text => this.searchAction(text)} autoCorrect={false} value={search} /> </View> ) } searchAction = (text) => { console.log("inside the search option >>>", text, text.length, this.state.tableData); if (this.state.tableData.length != 0) { if (text != '') { const newData = this.state.tableData.filter(item => { const itemData = `${item.srrno.toUpperCase()}`; const textData = text.toUpperCase(); return itemData.indexOf(textData) > -1; }); console.log("inside the newData option >>>", newData); if (newData.length > 0) { this.setState({ tableData: newData, search: text }); } else { Toast.show("No rates found"); this.setState({ tableData: this.props.navigation.state.params.tableData, search: '' }); // Alert.alert( // '', // 'No rates found', // [ // { // text: 'Ok', // onPress: () => { // this.setState({ // tableData:this.props.navigation.state.params.tableData, // search:'' // }); // }, // }, // ], // { cancelable: false }, // ); } } else { Toast.show("Enter the rates to be Searched") this.setState({ tableData: this.props.navigation.state.params.tableData, search: '' }); } } else { Toast.show("No rates found"); this.setState({ tableData: this.props.navigation.state.params.tableData, search: '' }); // Alert.alert( // '', // 'No rates found', // [ // { // text: 'Ok', // onPress: () => { // this.setState({ // tableData:this.props.navigation.state.params.tableData, // search:'' // }); // }, // }, // ], // { cancelable: false }, // ); } } renderRow = (item, index) => { return ( < View key={item.key}> {/* {this.state.search == "N" */} {/* {item.quotstatus == "S" || item.quotstatus == "A"? */} {item.quotstatus == "S" || item.quotstatus == "A" || item.quotstatus == "C" ? <TouchableOpacity style={[styles.list, item.selectedClass]} onPress={() => this.selectItem(item, item.quotstatus)} > <View style={styles.assetview1}> <View style={styles.assetview2}> <View style={styles.assetview3} > <Image resizeMode="contain" source={require('../Images/Asset.png')} style={styles.assetpng} /> </View> </View> <View style={styles.ratenoview1}> {this.state.language != "lang_ch" ? (<Text style={styles.ratenotxt}>{lan_en[0].rateno}</Text>) : (<Text style={styles.ratenotxt}>{lan_ch[0].rateno}</Text>)} <Text style={styles.ratenoval}>{item.srrno}</Text> </View> <View style={styles.containerimg} > <Image resizeMode="contain" source={require('../Images/container.png')} style={{ height: 30, width: 25, left: 7, tintColor: 'black' }} /> </View> <View style={styles.eqpview}> {this.state.language != "lang_ch" ? (<Text style={styles.eqptxt}>{lan_en[0].eqptype}</Text>) : (<Text style={styles.eqptxt}>{lan_ch[0].eqptype}</Text>)} <Text style={styles.eqpval}>{item.eqptype}</Text> </View> <View style={styles.dollarview} > <Image resizeMode="contain" source={require('../Images/doller.png')} style={{ height: 30, width: 25, left: 7, tintColor: 'black' }} /> </View> <View style={styles.amountview}> {this.state.language != "lang_ch" ? (<Text style={styles.amounttxt}>{lan_en[0].amount}</Text>) : (<Text style={styles.amounttxt}>{lan_ch[0].amount}</Text>)} <Text style={styles.amountval}>{Math.abs(item.frieght)}</Text> </View> </View> <View style={styles.midgap}> </View> <View style={styles.calview1}> <View style={styles.calview2}> <Image resizeMode="contain" source={require('../Images/calender.png')} style={{ height: 30, width: 25, left: 7, tintColor: 'black' }} /> </View> <View style={styles.validfromview}> {this.state.language != "lang_ch" ? (<Text style={styles.validfromtxt}>{lan_en[0].validfrom}</Text>) : (<Text style={styles.validfromtxt}>{lan_ch[0].validfrom}</Text>)} <Text style={styles.validfromval}>{moment([item.validfrom], 'YYYY/MM/DD mm:ss').format('DD-MMM-YYYY ')} </Text> </View> {/* <View > <Image resizeMode="contain" source={require('../Images/calender.png')} style={{color:'black', height: 30, width: 25, left: 7, tintColor: 'black' }} /> </View> */} <View style={styles.validtoview}> {this.state.language != "lang_ch" ? (<Text style={styles.validtotxt}>{lan_en[0].validto}</Text>) : (<Text style={styles.validtotxt}>{lan_ch[0].validto}</Text>)} <Text style={styles.validtoval}>{moment([item.validto], 'YYYY/MM/DD mm:ss').format('DD-MMM-YYYY ')} </Text> </View> <View style={styles.currencyview}> {this.state.language != "lang_ch" ? (<Text style={styles.currencytxt}>{lan_en[0].currency}</Text>) : (<Text style={styles.currencytxt}>{lan_ch[0].currency}</Text>)} <Text style={styles.currencyval}>{item.currency} </Text> </View> <View style={styles.statusview}> {this.state.language != "lang_ch" ? (<Text style={styles.statustxt}>Status</Text>) : (<Text style={styles.statustxt}>Status</Text>)} {item.quotstatus == "A" ? <Text style={styles.statusval}>APPROVED </Text> : null} {item.quotstatus == "S" ? <Text style={styles.statusval}>SUBMITTED </Text> : null} {item.quotstatus == "C" ? <Text style={styles.statusval}>COUNTER </Text> : null} </View> <View style={styles.colimg}> {/* <Image resizeMode="contain" source={require('../Images/menu_img/orange.png')} style={styles.orangeimg} /> */} </View> </View> <View style={{ flex: 0.5, flexDirection: 'row', marginVertical: 10, marginHorizontal: 10 }}> </View> </TouchableOpacity> : null} </View> ); } onLogin() { this.props.navigation.navigate('Booking', { parent: 'Booking' }); if (this.state.customername != null && this.state.customercode != null) { AsyncStorage.setItem('customer', this.state.customername + "(" + this.state.customercode + ")"); } else { AsyncStorage.setItem('customer', ''); } // AsyncStorage.setItem('eqptype','Type','eqptype1','Type','eqptype2','Type' ); // AsyncStorage.setItem('rateno',''); // AsyncStorage.setItem('rateno1',''); // AsyncStorage.setItem('rateno2',''); } onaddbutton(item, index) { console.log("inside the rates onaddbutton ....", item, index); this.setState({ visible: true }) } onremovebutton(item, index) { this.setState({ visible: false }) } submitrates(item, s1) { AsyncStorage.setItem('eqptype', 'Type'); AsyncStorage.setItem('eqptype1', 'Type'); AsyncStorage.setItem('eqptype2', 'Type'); AsyncStorage.setItem('rateno', ''); AsyncStorage.setItem('rateno1', ''); AsyncStorage.setItem('rateno2', ''); console.log("inside the rates....", s1, item); if (s1.length != 0) { if (s1[0] == "A" || s1[1] == "A" || s1[2] == "A") { console.log("on submit ...", this.state.customername, this.state.customercode, eqparray, ratearray) epq = { eqptype: eqparray, rateno: ratearray, itemno:itemarray, nor:norarray } console.log("inside the array ...epq.eqptype", epq.eqptype[0], epq.eqptype[1] ,epq.eqptype[2], epq.rateno); if (epq.eqptype[0] != '' && epq.eqptype[0]!=undefined) { AsyncStorage.setItem('eqptype', epq.eqptype[0]); } else { AsyncStorage.setItem('eqptype', 'Type'); } if (epq.eqptype[1] != '' && epq.eqptype[1]!=undefined) { AsyncStorage.setItem('eqptype1', epq.eqptype[1]); } else { AsyncStorage.setItem('eqptype1', 'Type'); } if (epq.eqptype[2] != '' && epq.eqptype[2]!=undefined) { AsyncStorage.setItem('eqptype2', epq.eqptype[2]); } else { AsyncStorage.setItem('eqptype2', 'Type'); } if (epq.rateno[0] != ''&&epq.rateno[0]!=undefined) { AsyncStorage.setItem('rateno', epq.rateno[0]); } if (epq.rateno[1] != ''&&epq.rateno[1]!=undefined) { AsyncStorage.setItem('rateno1', epq.rateno[1]); } if (epq.rateno[2] != ''&&epq.rateno[2]!=undefined) { AsyncStorage.setItem('rateno2', epq.rateno[2]); } if (epq.itemno != ''&&epq.itemno!=undefined) { AsyncStorage.setItem('itemno', epq.itemno[0]); } console.log("inside the log rates ...", epq.nor[0]); if (epq.nor[0] != ''&& epq.nor[0]!=undefined) { AsyncStorage.setItem('nor', epq.nor[0]); } if (epq.nor[1] != ''&& epq.nor[1]!=undefined) { AsyncStorage.setItem('nor1', epq.nor[1]); } if (epq.nor[2] != ''&& epq.nor[2]!=undefined) { AsyncStorage.setItem('nor2', epq.nor[2]); } // AsyncStorage.setItem('itemno', item.itemno); AsyncStorage.setItem('mycust_rate', 'S'); AsyncStorage.setItem('agrcust', item.custname + "(" + item.custcode + ")"); if (this.state.customername != null && this.state.customercode != null) { AsyncStorage.setItem('customer', this.state.customername + "(" + this.state.customercode + ")"); } else { AsyncStorage.setItem('customer', ''); } eqparray = [], ratearray = [], statusarray = [],itemarray=[],norarray=[] this.props.navigation.navigate('Booking', { parent: 'Booking' }); } else if (s1 == "S") { Toast.show("Submitted Rates cannot be attached"); } else if (s1 == "C") { Toast.show("Counter Rates cannot be attached"); } else { Toast.show("Attached Rates not approved"); } } else { Toast.show("Select the Rate(s)"); } } onfromLocation(item) { this.setState({ isLoading: true }); console.log("inside the container rates...", this.state.autorate); this.setState({ autorate: item }) { this.state.autorate == Item.srrno ? this.setState({ search: 'S' }) : null } } FlatListItemSeparator = () => <View style={styles.line} />; selectItem = item => { console.log("inside the items...", item, item.quotstatus); var dateetd = this.state.etdvalue.split(" "); console.log("dateetd >>>>", dateetd[0]); const date = new Date(dateetd[0]); var datefrom = item.validfrom.split(" "); console.log("Datefrom >>>>", datefrom[0]); const start = new Date(datefrom[0]); var dateto = item.validto.split(" "); console.log("Dateto >>>>", dateto[0]); const end = new Date(dateto[0]); if (item.quotstatus == "A") { if (date >= start && date <= end) { console.log("In >>>>>", this.state.tableData.filter(item => item.isSelect).length); if (this.state.tableData.filter(item => item.isSelect).length < 3) { item.isSelect = !item.isSelect; item.selectedClass = item.isSelect ? styles.selected : styles.list; const index = this.state.tableData.findIndex( item => item.id === item.id ); // console.log("inside selected item ...",index); // this.state.tableData[index] = item; this.setState({ tableData: this.state.tableData, }); console.log("inside the rates srrno...", item.srrno, item.eqptype,item.nor) // sv.getetdvalidation(this.func1.bind(this,item),item.srrno,item.eqptype); eqparray.push(item.eqptype); ratearray.push(item.srrno); statusarray.push(item.quotstatus); itemarray.push(item.itemno); norarray.push(item.nor); console.log("inside the array >>>>>>>>", eqparray, ratearray,itemarray); // Toast.show("Valid ETD & ETA Terminal"); } else { Toast.show("Maximum of 3 Rates can be Attached") // this.submitrates(item,item.quotstatus); // eqparray =[],ratearray =[],statusarray= [] } } else { Toast.show("Invalid ETD & ETA Terminal"); } } else { Toast.show("Submitted Rates cannot be attached") } }; // func1(response,item) // { // console.log("inside the func1 ...",response,item[0].validfrom,item[0].validto); // const date = new Date('2020-10-12'); // var datefrom =item[0].validfrom.split(" "); // console.log("Datefrom >>>>",datefrom[0]); // const start = new Date(datefrom[0]); // var dateto =item[0].validto.split(" "); // console.log("Dateto >>>>",dateto[0]); // const end = new Date(dateto[0]); // if (date >= start && date <= end) { // Toast.show("Valid ETD & ETA Terminal"); // } else { // Toast.show("Invalid ETD & ETA Terminal"); // } // } goToStore = () => this.props.navigation.navigate("Expenses", { selected: this.state.selected, }); renderItem = data => <TouchableOpacity style={[styles.list, data.item.selectedClass]} onPress={() => this.selectItem(data)} > {/* <Image source={{ uri: data.item.thumbnailUrl }} style={{ width: 40, height: 40, margin: 6 }} /> */} {/* <Text style={styles.lightText}> {data.item.title + data.item.title} </Text> */} </TouchableOpacity> render() { // const itemNumber = this.state.tableData.filter(item => item.isSelect).length; // if (this.state.loading) { // return ( // <View style={styles.loader}> // <ActivityIndicator size="large" color="purple" /> // </View> // ); // } return ( <View style={{ flex: 1 }}> {/* <Header androidStatusBarColor="#000" style={{ backgroundColor: '#112d51',height:60 }}> <Left> <IconM style={{ fontSize: 26, color: '#fff' }} name="arrow-back" onPress={this.onLogin.bind(this)} /> </Left> <Body> <Text style={{ fontSize: 20, color: '#fff', width: '200%',fontWeight:'bold'}}>Rate Search</Text> </Body> <Right></Right> </Header> */} <Header androidStatusBarColor="#112d51" style={{ marginHorizontal: -2, marginTop: -2, backgroundColor: '#112d51', height: 60, bottom: 25 }}> <Left> <TouchableOpacity onPress={this.onLogin.bind(this)} style={{ position: 'relative', width: "100%", height: "100%", right: "5%", }} > <Icon style={{ fontSize: 30, top: "20%", color: '#ffffff' }} name="arrow-back" /> </TouchableOpacity> </Left> <Body > {this.state.language != "lang_ch" ? (<Text style={{ fontSize: 15, color: '#ffffff', fontFamily: 'Montserrat-Bold', alignItems: "center", width: '120%', right: Platform.OS == 'ios' ? "30%" : "20%", width: "100%" }}>{lan_en[0].rates}</Text>) : (<Text style={{ fontSize: 15, color: '#ffffff', fontFamily: 'Montserrat-Bold', alignItems: "center", width: '120%', right: Platform.OS == 'ios' ? "30%" : "20%", width: "100%" }}>{lan_ch[0].rates}</Text>)} {/* <Text style={{ fontSize: 15, color: '#ffffff', fontFamily: 'Montserrat-Bold', alignItems: "center", width: '120%' ,right:15}}>RATES</Text> */} </Body> <Right> </Right> </Header> <ProgressDialog visible={this.state.progressVisible} title="Loading" message="Please, wait..." titleStyle={{ fontFamily: 'Montserrat-Medium' }} /> <View style={styles.container1}> <View style={styles.iconview1}> <View style={styles.iconview2}> <View style={styles.iconview3}> <Icon1 name="user-o" style={{ color: "#ffff", fontSize: 15 }} /> </View> </View> <View style={styles.custnameview}> <Text style={styles.custnametxt}>{this.state.customername} </Text> </View> </View> <View style={styles.pinview1}> <View style={styles.pinview2}> <View style={styles.pinview3}> <View style={{ flexDirection: 'column', }}> <Image resizeMode="contain" source={require('../Images/menu_img/pin.png')} style={{ height: 30, width: 25, bottom: 5, tintColor: 'white' }} /> </View> <View style={styles.plaview}> <Text style={styles.platxt}>{this.state.pla}</Text> </View> </View> </View> <View style={{ flex: 0.5, left: 10 }}> <Image resizeMode="contain" source={require('../Images/arrow11.png')} style={styles.arrow} /> </View> {/* <View style={styles.pldview1}> <View style={styles.pldview2}> */} <View style={styles.pldview3}> <Text style={styles.pldtxt}>{this.state.pld}</Text> </View> {/* </View> </View> */} </View> </View> {/* <View style={{flexDirection:'column',flex:0.9,alignItems:'center',justifyContent:'center',zIndex:1}} > */} {/* <Autocomplete data={this.state.autorate} valueExtractor={item => item} minimumCharactersCount={0} inputContainerStyle={{ zIndex: -1, flexDirection: "row", flexWrap: "wrap", alignItems: "center", fontFamily: 'Montserrat-Medium', fontSize: 15, // paddingHorizontal: 10, // paddingBottom: 10, width: "100%", borderColor: '#000000', justifyContent: "center", }} containerStyle={{ position: 'absolute', top:250,alignItems:'center',justifyContent:'center',right:"5%"}} placeholder= "Rate No." placeholderColor='#000000' handleSelectItem={(item, id) => this.onfromLocation(item)} inputStyle={{ fontFamily: 'Montserrat-Medium', fontSize: 13 ,borderColor:'#ffff',right:10}} initialValue={this.state.fromLocation} /> */} {/* </View> */} <View style={styles.container}> <ScrollView> <SafeAreaView> <FlatList data={this.state.tableData} ItemSeparatorComponent={this.FlatListItemSeparator} renderItem={({ item }) => this.renderRow(item)} keyExtractor={item => item.Key} extraData={this.state} ListHeaderComponent={this.renderHeader} /> {/* <SelectMultiple // items={this.state.screenmap} items={this.state.tableData} // renderLabel={renderLabel} renderItem={({item})=>this.renderRow(item)} keyExtractor={item=>item.key} ListHeaderComponent={this.renderHeader} maxSelect={4} selectedItems={this.state.selectedFooters} onSelectionsChange={this.onSelectionsChange} /> */} {/* <View style={styles.numberBox}> <Text style={styles.number}>{itemNumber}</Text> </View> <TouchableOpacity style={styles.icon}> <View> <Icon raised name="shopping-cart" type="font-awesome" color="#e3e3e3" size={30} onPress={() => this.goToStore()} containerStyle={{ backgroundColor: "#FA7B5F" }} /> </View> </TouchableOpacity> */} </SafeAreaView> </ScrollView> </View> <View style={{ flex: 0.1, flexDirection: 'column' }}> <TouchableOpacity onPress={this.submitrates.bind(this, itemarray, statusarray)} style={{ flex: 0.5, flexDirection: 'column', width: '50%', backgroundColor: '#112d51', height: '100%', // marginHorizontal:30, // marginVertical:5, left: '27%', top: '10%', borderRadius: 0, alignItems: 'center', justifyContent: 'center' }}> <Text style={{ fontSize: 15, color: '#ffff', backgroundColor: 'transparent', fontFamily: 'Montserrat-Bold' }}>OK</Text> </TouchableOpacity> </View> <View style={{ flex: 0.1, flexDirection: 'column' }}> <PageFooter navigation={this.props.navigation} page={'schedule'}> </PageFooter> </View> </View > ) } } export default Ratereferencesearch const ratereference = { container: { flex: 1, backgroundColor: "#fff", position: "relative" }, title: { fontSize: 20, color: "#fff", textAlign: "center", marginBottom: 10 }, loader: { flex: 1, justifyContent: "center", alignItems: "center", backgroundColor: "#fff" }, list: { flex: 0.85, marginHorizontal: '2%', // width: '90%', marginVertical: '2%', elevation: 5, height: "100%", paddingVertical: 10, // backgroundColor: colors[index % colors.length], backgroundColor: '#ffff', borderRadius: 5, // left:"2%" }, lightText: { color: "#f7f7f7", width: 200, paddingLeft: 15, fontSize: 12 }, line: { height: 0.5, width: "100%", backgroundColor: "rgba(255,255,255,0.5)" }, icon: { position: "absolute", bottom: 20, width: "100%", left: 290, zIndex: 1 }, numberBox: { position: "absolute", bottom: 75, width: 30, height: 30, borderRadius: 15, left: 330, zIndex: 3, backgroundColor: "#e3e3e3", justifyContent: "center", alignItems: "center" }, number: { fontSize: 14, color: "#000" }, selected: { backgroundColor: "#A9A9A9" }, searchstyle: { borderWidth: 1, borderRadius: 5, borderColor: "#ffff", backgroundColor: "#ffff", borderBottomWidth: 0, borderTopWidth: 0, fontFamily: 'Montserrat-Medium', fontSize: 13 }, item: { borderWidth: 1, borderRadius: 5, borderColor: "black", backgroundColor: "white", marginBottom: 10 }, container1: { // alignItems: 'center', // justifyContent: 'center', elevation: 5, height: "10%", backgroundColor: "#16356a" }, iconview1: { flex: 0.3, flexDirection: 'row', paddingHorizontal: 10, top: 5 }, iconview2: { flex: 0.1, alignItems: 'center', justifyContent: 'flex-start', }, iconview3: { width: 'auto', paddingVertical: 10 }, custnameview: { flex: 0.75, flexDirection: 'column', paddingVertical: 7 }, custnametxt: { fontSize: 15, fontFamily: 'Montserrat-Bold', color: 'white', marginHorizontal: -8 }, pinview1: { flex: 0.3, flexDirection: 'row', marginVertical: 10, marginHorizontal: 15 }, pinview2: { flex: 0.75, flexDirection: 'column', paddingHorizontal: 10 }, pinview3: { flexDirection: 'row', paddingVertical: 13 }, plaview: { flexDirection: 'column', marginHorizontal: 10 }, platxt: { fontSize: 15, fontFamily: 'Montserrat-Bold', color: 'white', marginBottom: 10 }, arrow: { height: 30, width: 50, top: 13, tintColor: 'white' }, pldview1: { flex: 3, flexDirection: 'column' }, pldview2: { flexDirection: 'row', paddingVertical: 13 }, pldview3: { flexDirection: 'column', marginHorizontal: 10 }, pldtxt: { fontSize: 15, fontFamily: 'Montserrat-Bold', color: 'white', marginBottom: 10 }, assetview1: { flex: 2, flexDirection: 'row', marginVertical: 1 }, assetview2: { flex: 0.5, alignItems: 'center', justifyContent: 'flex-start' }, assetview3: { width: 'auto', marginHorizontal: 10, paddingHorizontal: 5, left: 7, paddingVertical: 4, justifyContent: 'center', alignItems: 'center', backgroundColor: '#012536', borderRadius: 80 / 2, width: 40, height: 40 }, assetpng: { height: 30, width: 25, left: 1, tintColor: 'white' }, ratenoview1: { flex: 1.75, flexDirection: 'column', paddingHorizontal: 12, }, ratenotxt: { fontSize: 14, color: '#112d51', fontFamily: 'Montserrat', }, ratenoval: { fontSize: 15, color: '#112d51', fontFamily: 'Montserrat-Bold', }, containerimg: { flexDirection: 'column', paddingHorizontal: 10 }, eqpview: { flex: 0.75, flexDirection: 'column', paddingHorizontal: 10 }, eqptxt: { fontSize: 14, color: '#112d51', fontFamily: 'Montserrat', }, eqpval: { fontSize: 15, color: '#112d51', fontFamily: 'Montserrat-Bold', }, dollarview: { flexDirection: 'column', paddingHorizontal: 10, }, amountview: { flex: 0.75, flexDirection: 'column', paddingHorizontal: 10, }, amounttxt: { fontSize: 14, color: '#112d51', fontFamily: 'Montserrat', }, amountval: { fontSize: 15, color: 'red', fontFamily: 'Montserrat-Bold', }, midgap: { flex: 0.5, flexDirection: 'row', marginVertical: 1, marginHorizontal: 10 }, calview1: { flex: 1, flexDirection: 'row' }, calview2: { flexDirection: 'column', paddingHorizontal: 15 }, validfromview: { flex: 1, flexDirection: 'column', paddingHorizontal: 5 }, validfromtxt: { fontSize: 14, fontFamily: 'Montserrat', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 5 }, validfromval: { fontSize: 15, fontFamily: 'Montserrat-Bold', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 5 }, validtoview: { flex: 1, flexDirection: 'column', paddingHorizontal: 5 }, validtotxt: { fontSize: 14, fontFamily: 'Montserrat', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 7 }, validtoval: { fontSize: 15, fontFamily: 'Montserrat-Bold', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 7 }, currencyview: { flex: 1, flexDirection: 'column', paddingHorizontal: 5 }, currencytxt: { fontSize: 14, fontFamily: 'Montserrat', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 40 }, currencyval: { fontSize: 13, fontFamily: 'Montserrat-Bold', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 40 }, statusview: { flex: 1, flexDirection: 'column', paddingHorizontal: 5 }, statustxt: { fontSize: 14, fontFamily: 'Montserrat', color: '#112d51', alignItems: 'center', paddingHorizontal: 20 }, statusval: { fontSize: 15, fontFamily: 'Montserrat-Bold', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 20 }, colimg: { flex: 0.5, flexDirection: 'column', paddingHorizontal: 10 }, modal_container: { flex: 0.85, marginHorizontal: '2%', // width: '90%', marginVertical: '2%', elevation: 5, height: "100%", paddingVertical: 10, // backgroundColor: colors[index % colors.length], backgroundColor: '#ffff', borderRadius: 5, // left:"2%" }, orangeimg: { height: '100%', right: 25, top: 15, width: '150%', tintColor: "#bfd1dd", position: 'relative' }, searchstyle1: { borderWidth: 1, borderRadius: 5, borderColor: "#ffff", backgroundColor: "#ffff", borderBottomWidth: 0, borderTopWidth: 0, elevation: 5, marginHorizontal: 0, padding: 0, }, searchstyle2: { borderWidth: 1, borderRadius: 5, borderColor: "#ffff", backgroundColor: "#ffff", borderBottomWidth: 0, borderTopWidth: 0, padding: 0, }, } const styles = createStyles( ratereference, maxWidth(500, { container1: { // alignItems: 'center', // justifyContent: 'center', elevation: 5, height: "15%", backgroundColor: "#16356a", marginBottom: "1%" }, title: { fontSize: 20, color: "#fff", textAlign: "center", marginBottom: 10 }, loader: { flex: 1, justifyContent: "center", alignItems: "center", backgroundColor: "#fff" }, list: { flex: 0.85, marginHorizontal: '2%', // width: '90%', marginVertical: '2%', elevation: 5, height: "100%", paddingVertical: 10, // backgroundColor: colors[index % colors.length], backgroundColor: '#ffff', borderRadius: 5, shadowColor: '#000', shadowOffset: { width: 1, height: 1 }, shadowOpacity: 0.4, shadowRadius: 3, elevation: 10, // left:"2%" }, lightText: { color: "#f7f7f7", width: 200, paddingLeft: 15, fontSize: 12 }, line: { height: 0.5, width: "100%", backgroundColor: "rgba(255,255,255,0.5)" }, icon: { position: "absolute", bottom: 20, width: "100%", left: 290, zIndex: 1 }, numberBox: { position: "absolute", bottom: 75, width: 30, height: 30, borderRadius: 15, left: 330, zIndex: 3, backgroundColor: "#e3e3e3", justifyContent: "center", alignItems: "center" }, number: { fontSize: 14, color: "#000" }, selected: { backgroundColor: "#A9A9A9" }, searchstyle: { borderWidth: 1, borderRadius: 5, borderColor: "#ffff", backgroundColor: "#ffff", borderBottomWidth: 0, borderTopWidth: 0, fontFamily: 'Montserrat-Medium', fontSize: 13 }, iconview1: { flex: 0.5, flexDirection: 'row', paddingHorizontal: 25 }, iconview2: { flex: 0.5, alignItems: 'center', justifyContent: 'flex-start', }, iconview3: { width: 'auto', paddingVertical: 10 }, custnameview: { flex: 10, flexDirection: 'column', paddingVertical: 7, }, custnametxt: { fontSize: 13, fontFamily: 'Montserrat-Bold', color: 'white', marginHorizontal: Platform.OS === 'ios' ? 10 : 15 }, pinview1: { flex: 0.3, flexDirection: 'row', marginVertical: Platform.OS === 'ios' ? 5 : 1, marginHorizontal: 10 }, pinview2: { flex: 0.5, flexDirection: 'column', paddingHorizontal: 10, paddingHorizontal: 10 }, pinview3: { flexDirection: 'row', paddingVertical: 13 }, plaview: { flex: 1, flexDirection: 'column', marginHorizontal: Platform.OS === 'ios' ? 5 : 7, width: "150%" }, platxt: { fontSize: 13, fontFamily: 'Montserrat-Bold', color: 'white', marginBottom: 1, width: "150%" }, arrow: { height: 30, width: 50, top: 5, tintColor: 'white',right:"30%" }, pldview1: { flex: 1, flexDirection: 'column' }, pldview2: { flexDirection: 'row', paddingVertical: Platform.OS === 'ios' ? 15 : 13 }, pldview3: { flexDirection: 'column', marginHorizontal: 1,right:"350%",top:"3%" }, pldtxt: { fontSize: 13, fontFamily: 'Montserrat-Bold', color: 'white', marginBottom: Platform.OS === 'ios' ? 1 : 5 }, assetview1: { flex: 2, flexDirection: 'row', marginVertical: 5 }, assetview2: { flex: 2, alignItems: 'center', justifyContent: 'flex-start' }, assetview3: { width: 'auto', marginHorizontal: 10, paddingHorizontal: 10, left: 7, paddingVertical: 4, justifyContent: 'center', alignItems: 'center', backgroundColor: '#012536', borderRadius: 60 / 2, width: 30, height: 30 }, assetpng: { height: 30, width: 25, left: 1, tintColor: 'white' }, ratenoview1: { flex: 12, flexDirection: 'column', paddingHorizontal: 12, left: 5 }, ratenotxt: { fontSize: 10, color: '#112d51', fontFamily: 'Montserrat', paddingHorizontal: 1, left: 5 }, ratenoval: { fontSize: 10, color: '#112d51', fontFamily: 'Montserrat-Bold', paddingHorizontal: 1, left: 4 }, containerimg: { flexDirection: 'column', paddingHorizontal: 5 }, eqpview: { flex: 9, flexDirection: 'column', paddingHorizontal: 1 }, eqptxt: { fontSize: 10, color: '#112d51', fontFamily: 'Montserrat', paddingHorizontal: 10 }, eqpval: { fontSize: 10, color: '#112d51', fontFamily: 'Montserrat-Bold', paddingHorizontal: 10 }, dollarview: { flexDirection: 'column', paddingHorizontal: 5, }, amountview: { flex: 6, flexDirection: 'column', paddingHorizontal: 5, }, amounttxt: { fontSize: 10, color: '#112d51', fontFamily: 'Montserrat' }, amountval: { fontSize: 10, color: 'red', fontFamily: 'Montserrat-Bold', color: 'red' }, midgap: { flex: 0.5, flexDirection: 'row', marginVertical: 3, marginHorizontal: 10 }, calview1: { flex: 0.5, flexDirection: 'row' }, calview2: { flexDirection: 'column', paddingHorizontal: 1 }, validfromview: { flex: 1, flexDirection: 'column', paddingHorizontal: 5 }, validfromtxt: { fontSize: 10, fontFamily: 'Montserrat', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 5 }, validfromval: { flex: 1, fontSize: 10, fontFamily: 'Montserrat-Bold', width: '300%', color: '#112d51', alignItems: 'center', paddingHorizontal: 5 }, validtoview: { flex: 1, flexDirection: 'column', paddingHorizontal: 10 }, validtotxt: { fontSize: 10, fontFamily: 'Montserrat', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 10 }, validtoval: { flex: 1, fontSize: 10, fontFamily: 'Montserrat-Bold', width: '300%', color: '#112d51', alignItems: 'center', paddingHorizontal: 10 }, currencyview: { flex: 1, flexDirection: 'column', paddingHorizontal: 15 }, currencytxt: { fontSize: 10, fontFamily: 'Montserrat', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 15 }, currencyval: { fontSize: 10, fontFamily: 'Montserrat-Bold', width: '180%', color: '#112d51', alignItems: 'center', paddingHorizontal: 15 }, statusview: { flex: 1, flexDirection: 'column', paddingHorizontal: 5 }, statustxt: { fontSize: 10, fontFamily: 'Montserrat', width: '180%', color: '#112d51', alignItems: 'center' }, statusval: { fontSize: 10, fontFamily: 'Montserrat-Bold', width: '500%', color: '#112d51', alignItems: 'center' }, colimg: { flex: 0.5, flexDirection: 'column', paddingHorizontal: 10 }, modal_container: { flex: 1, marginHorizontal: '2%', width: '96%', marginVertical: '3%', elevation: 5, height: "100%", paddingVertical: 10, // backgroundColor: colors[index % colors.length], backgroundColor: '#ffff', borderRadius: 1, borderColor: "black" }, container: { flex: 1, backgroundColor: "#fff", position: "relative" }, searchstyle1: { borderWidth: 1, borderRadius: 5, borderColor: "#ffff", backgroundColor: "#ffff", borderBottomWidth: 0, borderTopWidth: 0, elevation: 5, marginHorizontal: 0, padding: 0, }, searchstyle2: { borderWidth: 1, borderRadius: 5, borderColor: "#ffff", backgroundColor: "#ffff", borderBottomWidth: 0, borderTopWidth: 0, padding: 0, }, item: { padding: 10, borderWidth: 1, borderRadius: 5, borderColor: "#c1dec5", marginBottom: 10 }, orangeimg: { height: '215%', right: 1, width: '270%', tintColor: '#bfd1dd', position: 'absolute' } }) );
Editor is loading...