API tools faq
paste
Guest User

Untitled

a guest
Jun 18th, 2018
100
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 43.43 KB | None | 0 0
raw download clone embed print report
  1. import React, { Component } from 'react';
  2. import {Platform, ToastAndroid, View, Text, ImageBackground, ScrollView, FlatList, Image,NetInfo, TouchableOpacity,AsyncStorage, Alert, BackHandler } from 'react-native';
  3. import { Button, Input, Icon, CheckBox } from 'react-native-elements';
  4. import { Dropdown } from 'react-native-material-dropdown';
  5. import Modal from 'react-native-modal';
  6. import Picker from 'react-native-wheel-picker';
  7. import DatePicker from 'react-native-datepicker';
  8. import {strings, JobData, Baseurl,LoginApiHeader, RequestTimeout} from '../components/Locals.js';
  9. import fetch from 'react-native-fetch-polyfill';
  10. import Spinner from 'react-native-loading-spinner-overlay';
  11.  
  12. let TRADE_CATEGORY = []
  13. let TRADE = []
  14. let Skill_Level_Items = [];
  15. let Means_Of_Application = [];
  16. let Salary_Type = [];
  17. let salaryrange = [];
  18. let PostDuration = [];
  19. let isFromCopy = false;
  20.  
  21. export default class CreateJob extends Component {
  22.  
  23. constructor(props) {
  24. super(props);
  25. this.loaddata();
  26. this.handleBackButtonClick = this.handleBackButtonClick.bind(this);
  27. }
  28.  
  29. componentDidMount() {
  30. NetInfo.isConnected.addEventListener(
  31. 'connectionChange',
  32. this._handleConnectivityChange
  33. );
  34. NetInfo.isConnected.fetch().done(
  35. (isConnected) => { this.setState({isConnected}); }
  36. );
  37. }
  38.  
  39. _handleConnectivityChange = (isConnected) => {
  40. this.setState({
  41. isConnected,
  42. });
  43. };
  44.  
  45. componentWillMount() {
  46. BackHandler.addEventListener('hardwareBackPress', this.handleBackButtonClick);
  47. }
  48.  
  49. componentWillUnmount() {
  50. NetInfo.isConnected.removeEventListener(
  51. 'connectionChange',
  52. this._handleConnectivityChange
  53. );
  54. BackHandler.removeEventListener('hardwareBackPress', this.handleBackButtonClick);
  55. }
  56.  
  57. handleBackButtonClick() {
  58. this.props.navigation.navigate('homeStack',{},{
  59. type: "Navigate",
  60. routeName: "home",
  61. params: {name:""}
  62. });
  63. return true;
  64. }
  65.  
  66. state = {
  67. visible: false,
  68. work_district: strings.selectworkdistricttitle,
  69. salary_type: "",
  70. salary_type_value: "",
  71. salary_range: [],
  72. salary_range_value:"",
  73. post_date: "",
  74. commencement_date: "",
  75. completion_date: "",
  76. checked: [],
  77. skillchecked:[],
  78. preferredmeanschecked:[],
  79. isLoading: true,
  80. isLoading1: false,
  81. checkedDistrict:[],
  82. selectedTradecategory: 0,
  83. selectedTrade: 0,
  84. tradecategory:[],
  85. trade:[],
  86. faxNo:"",
  87. vacancyNo:"",
  88. contactPerson:"",
  89. contactNo:"",
  90. whatsappNo:"",
  91. remarkEN:"",
  92. remarkCH:"",
  93. tradecategoryvalue:strings.tradepopuptitle1,
  94. tradevalue:strings.tradepopuptitle2,
  95.  
  96. s_skills:[],
  97.  
  98.  
  99. VacancyIcon:false,
  100. ContactNoIcon:false,
  101. WhatsAppIcon:false,
  102. FaxNumberIcon:false,
  103. RemarkIcon:false,
  104. Remark1Icon:false,
  105. TradeCategoryIcon:false,
  106. TradeIcon:false,
  107. SkillLevelIcon:false,
  108. WorkDistrictIcon:false,
  109. TypeofSalaryIcon:false,
  110. RangeodSalaryIcon:false,
  111. PostDurationIcon:false,
  112. StartDateIcon:false,
  113. EndDateIcon:false,
  114. PreferredMeansIcon:false,
  115.  
  116. }
  117.  
  118. static navigationOptions = ({ navigation }) => ({
  119. headerTitle: strings.createjobtitle,
  120. drawerLabel: strings.createjoblbl,
  121. drawerIcon: <Image resizeMode="contain" style={{width: 25, height: 25}} source={require('../assets/edit_white.png')} />,
  122. headerLeft: <TouchableOpacity onPress={() => navigation.navigate('DrawerOpen')}>
  123. <Image source={require('../assets/menu.png')}/>
  124. </TouchableOpacity>,
  125. headerTitleStyle: { color: "#fff" },
  126. headerStyle: { backgroundColor: "#7fb539", paddingHorizontal: 15 },
  127. })
  128.  
  129. async loaddata(){
  130. const Skill_Level_Items1 = await AsyncStorage.getItem('@Skill_Level_Items');
  131. if (Skill_Level_Items1 !== null){
  132. Skill_Level_Items = JSON.parse(Skill_Level_Items1);
  133. }
  134.  
  135. const Means_Of_Application1 = await AsyncStorage.getItem('@Means_Of_Application');
  136. if (Means_Of_Application1 !== null){
  137. Means_Of_Application = JSON.parse(Means_Of_Application1);
  138. }
  139.  
  140. const Salary_Type1 = await AsyncStorage.getItem('@Salary_Type');
  141. if (Salary_Type1 !== null){
  142. Salary_Type = JSON.parse(Salary_Type1);
  143. }
  144.  
  145. const salaryrange1 = await AsyncStorage.getItem('@salaryrange');
  146. if (salaryrange1 !== null){
  147. salaryrange = JSON.parse(salaryrange1);
  148. }
  149.  
  150. const TRADE_CATEGORY1 = await AsyncStorage.getItem('@TRADE_CATEGORY');
  151. if (TRADE_CATEGORY1 !== null){
  152. TRADE_CATEGORY = JSON.parse(TRADE_CATEGORY1);
  153. }
  154.  
  155. const TRADE1 = await AsyncStorage.getItem('@TRADE');
  156. if (TRADE1 !== null){
  157. TRADE = JSON.parse(TRADE1);
  158. }
  159.  
  160. const PostDuration1 = await AsyncStorage.getItem('@PostDuration');
  161. if (PostDuration1 !== null){
  162. PostDuration = JSON.parse(PostDuration1);
  163. }
  164.  
  165. this.setState({post_date:PostDuration[0].value});
  166. this.setState({tradecategory:TRADE_CATEGORY});
  167. this.setState({trade:TRADE[0]});
  168. this.setState({salary_type:Salary_Type[0].value});
  169. this.setState({salary_type_value:Salary_Type[0].value});
  170. this.setState({salary_range_value:salaryrange[0][0].value});
  171. this.setState({salary_range:salaryrange[0]});
  172. this.setState({isLoading: false});
  173.  
  174.  
  175. if(JobData.Id != 0){
  176. //console.warn(JobData.data);
  177. var data = JobData.data;
  178. isFromCopy = true;
  179. this.setState({skillchecked:data.SkillLevels});
  180. this.setState({preferredmeanschecked:data.PreferredContactId});
  181. this.setState({tradecategoryvalue:data.TradeCategoryId});
  182. this.setState({tradevalue:data.TradeId});
  183. this.setState({work_district:data.DistrictId});
  184. this.setState({salary_type_value:data.PaymentTypeId});
  185. this.onchangeslarytype(data.PaymentTypeId);
  186. this.setState({salary_range_value:data.PaymentRangeId});
  187. this.setState({commencement_date:data.CommencementFrom});
  188. this.setState({completion_date:data.CommencementTo});
  189. this.setState({post_date:data.PostDuration});
  190. this.setState({vacancyNo:""+data.VacancyNo});
  191. if(strings.getLanguage() != "zh")
  192. this.setState({contactPerson:data.ContactNameEn});
  193. else
  194. this.setState({contactPerson:data.ContactNameCht});
  195. this.setState({contactNo:data.ContactPhone});
  196. this.setState({whatsappNo:data.ContactWtsapp});
  197. this.setState({faxNo:data.ContactFax});
  198. this.setState({remarkEN:data.RemarkEn});
  199. this.setState({remarkCH:data.RemarkCht});
  200. JobData.Id = 0;
  201.  
  202. }
  203.  
  204. }
  205.  
  206. returnData(checked) {
  207. var districs = "";
  208.  
  209. if(checked.length==0)
  210. return
  211. this.setState({workdistrictchecked:checked});
  212. for(let j=0; j<checked.length; j++){
  213. if(j+1==checked.length)
  214. districs += checked[j]
  215. else
  216. districs += checked[j] + ", ";
  217. }
  218. this.setState({work_district:districs});
  219. this.setState({WorkDistrictIcon:false});
  220. }
  221.  
  222.  
  223. onchangeslarytype(value){
  224.  
  225. this.setState({salary_type:value});
  226. for(let i=0; i<Salary_Type.length; i++){
  227.  
  228. if(Salary_Type[i].value == value){
  229.  
  230. this.setState({ salary_range: salaryrange[i] })
  231. this.setState({salary_range_value:salaryrange[i][0].value})
  232. }
  233. }
  234. }
  235.  
  236. closemodal(){
  237. this.setState({ visible: false });
  238. if(TRADE_CATEGORY.length>0 && TRADE_CATEGORY[this.state.selectedTradecategory] != null)
  239. this.setState({tradecategoryvalue:TRADE_CATEGORY[this.state.selectedTradecategory]});
  240. else
  241. this.setState({tradecategoryvalue:""});
  242. if(TRADE[this.state.selectedTradecategory].length>0 && TRADE[this.state.selectedTradecategory][this.state.selectedTrade] != null)
  243. this.setState({tradevalue:TRADE[this.state.selectedTradecategory][this.state.selectedTrade]});
  244. else
  245. this.setState({tradevalue:""});
  246. }
  247.  
  248. onPickerSelect(index) {
  249. this.setState({
  250. selectedTradecategory: index,
  251. })
  252. if(TRADE[index].length > 0){
  253. this.setState({TradeCategoryIcon:false});
  254. this.setState({TradeIcon:false});
  255. this.setState({trade:TRADE[index]})
  256. }
  257. else
  258. this.setState({trade:[""]})
  259. }
  260.  
  261. onPickerSelect1(index) {
  262. this.setState({
  263. selectedTrade: index,
  264. })
  265. }
  266.  
  267. onSubmitPress(){
  268. var isAllvalid = true;
  269. if(this.state.tradecategoryvalue == strings.tradepopuptitle1){
  270. this.setState({TradeCategoryIcon:<Icon onPress={()=>this.showError(strings.selectcategoryerr)} style={{width: "10%",}} name="alert-circle" type="material-community" color="red" />});
  271. isAllvalid = false;
  272. }else{
  273. this.setState({TradeCategoryIcon:false});
  274. }
  275.  
  276. if(this.state.tradevalue == strings.tradepopuptitle2){
  277. this.setState({TradeIcon:<Icon onPress={()=>this.showError(strings.selecttradeerr)} style={{width: "10%",}} name="alert-circle" type="material-community" color="red" />});
  278. isAllvalid = false;
  279. }else{
  280. this.setState({TradeIcon:false});
  281. }
  282.  
  283. if(this.state.work_district == strings.selectworkdistricttitle || this.state.work_district == ""){
  284. this.setState({WorkDistrictIcon:<Icon onPress={()=>this.showError(strings.selectworkdistricterr)} style={{width: "10%",}} name="alert-circle" type="material-community" color="red" />});
  285. isAllvalid = false;
  286. }else{
  287. this.setState({WorkDistrictIcon:false});
  288. }
  289.  
  290. if(this.state.salary_type.length==0){
  291. this.setState({TypeofSalaryIcon:<Icon onPress={()=>this.showError(strings.selectsalrytypeerr)} style={{width: "10%",}} name="alert-circle" type="material-community" color="red" />});
  292. isAllvalid = false;
  293. }else{
  294. this.setState({TypeofSalaryIcon:false});
  295. }
  296.  
  297. if(this.state.salary_range_value.length==0){
  298. this.setState({RangeodSalaryIcon:<Icon onPress={()=>this.showError(strings.selectrangeerr)} style={{width: "10%",}} name="alert-circle" type="material-community" color="red" />});
  299. isAllvalid = false;
  300. }else{
  301. this.setState({RangeodSalaryIcon:false});
  302. }
  303.  
  304. if(this.state.post_date.length==0){
  305. this.setState({PostDurationIcon:<Icon onPress={()=>this.showError(strings.selectstartdateerr)} style={{width: "10%",}} name="alert-circle" type="material-community" color="red" />});
  306. isAllvalid = false;
  307. }else{
  308. this.setState({PostDurationIcon:false});
  309. }
  310.  
  311. if(this.state.commencement_date.length==0){
  312. this.setState({StartDateIcon:<Icon onPress={()=>this.showError(strings.selectstartdateerr)} style={{width: "10%",}} name="alert-circle" type="material-community" color="red" />});
  313. isAllvalid = false;
  314. }else{
  315. this.setState({StartDateIcon:false});
  316. }
  317.  
  318. if(this.state.vacancyNo.length==0){
  319. this.setState({VacancyIcon:<Icon onPress={()=>this.showError(strings.vacancynoerr)} name="alert-circle" type="material-community" color="red" />});
  320. isAllvalid = false;
  321. }
  322.  
  323. if(this.state.contactPerson.length==0){
  324. this.setState({ContactPersonIcon:<Icon onPress={()=>this.showError(strings.contactpersonerr)} name="alert-circle" type="material-community" color="red" />});
  325. isAllvalid = false;
  326. }
  327.  
  328. if(this.state.contactNo.length==0){
  329. this.setState({ContactNoIcon:<Icon onPress={()=>this.showError(strings.contactnoerr)} name="alert-circle" type="material-community" color="red" />});
  330. isAllvalid = false;
  331. }
  332.  
  333. if(!isAllvalid)
  334. return
  335.  
  336. if(this.state.VacancyIcon != false || this.state.ContactNoIcon != false || this.state.WhatsAppIcon != false || this.state.FaxNumberIcon != false || this.state.RemarkIcon != false || this.state.Remark1Icon != false || this.state.TradeCategoryIcon != false || this.state.TradeIcon != false || this.state.SkillLevelIcon != false || this.state.WorkDistrictIcon != false || this.state.TypeofSalaryIcon != false || this.state.RangeodSalaryIcon != false || this.state.PostDurationIcon != false || this.state.StartDateIcon != false || this.state.EndDateIcon != false || this.state.PreferredMeansIcon != false){
  337. return
  338. }else{
  339. var json = [{
  340. TradeId: this.state.tradevalue,
  341. tradecategory:this.state.tradecategoryvalue,
  342. SkillLevelId: this.state.skillchecked,
  343. DistrictId: this.state.work_district,
  344. PaymentTypeId: this.state.salary_type,
  345. PaymentRangeId: this.state.salary_range_value,
  346. PreferredContactId: this.state.preferredmeanschecked,
  347. ContactPersonEn: this.state.contactPerson,
  348. ContactPersonCht: this.state.contactPerson,
  349. ContactNo: this.state.contactNo,
  350. Wtsapp: this.state.whatsappNo,
  351. FaxNo:this.state.faxNo,
  352. PostDuration: this.state.post_date,
  353. VacancyNo: this.state.vacancyNo,
  354. RemarkEn: this.state.remarkEN,
  355. RemarkCht: this.state.remarkCH,
  356. CommencementFrom: this.state.commencement_date,
  357. CommencementTo: this.state.completion_date,
  358. }];
  359. this.props.navigation.navigate('createJobPreview',{jobdata:json});
  360. }
  361.  
  362.  
  363. }
  364.  
  365. showError(msg){
  366. ToastAndroid.showWithGravityAndOffset(
  367. msg,
  368. ToastAndroid.LONG,
  369. ToastAndroid.BOTTOM,
  370. 25,
  371. 50
  372. );
  373. }
  374.  
  375. validate(text, name){
  376.  
  377. alph = /^[a-zA-Z]+$/;
  378. num = /^[0-9]+$/;
  379. mail = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
  380. alphnum = /^([a-zA-Z0-9 _-]+)$/
  381. if(name=="vacancyno"){
  382.  
  383. if(num.test(text) && text>0 && text<99){
  384. this.setState({VacancyIcon:false})
  385. }else{
  386. this.setState({VacancyIcon: <Icon onPress={()=>this.showError(strings.vacancynoerr1)} name="alert-circle" type="material-community" color="red" />})
  387.  
  388. }
  389. this.setState({vacancyNo:text});
  390. }
  391. else if(name=="contactPerson"){
  392. this.setState({ContactPersonIcon:false})
  393. this.setState({contactPerson:text});
  394. }
  395. else if(name=="contactNo"){
  396.  
  397. if(num.test(text) && text.length==8){
  398. this.setState({ContactNoIcon:false})
  399. }else{
  400. this.setState({ContactNoIcon: <Icon onPress={()=>this.showError(strings.phoneerr)} name="alert-circle" type="material-community" color="red" />})
  401.  
  402. }
  403. this.setState({contactNo:text});
  404. }
  405. else if(name=="whatsappNo"){
  406.  
  407. if(num.test(text) && text.length==8){
  408. this.setState({WhatsAppIcon:false})
  409. }else{
  410. this.setState({WhatsAppIcon: <Icon onPress={()=>this.showError(strings.repwhatsapperr)} name="alert-circle" type="material-community" color="red" />})
  411.  
  412. }
  413. this.setState({whatsappNo:text});
  414. }
  415. else if(name=="faxNo"){
  416.  
  417. if(num.test(text) && text.length==8){
  418. this.setState({FaxNumberIcon:false})
  419. }else{
  420. this.setState({FaxNumberIcon: <Icon onPress={()=>this.showError(strings.repfaxerr)} name="alert-circle" type="material-community" color="red" />})
  421.  
  422. }
  423. this.setState({faxNo:text});
  424. }
  425. else if(name=="remarkEN"){
  426.  
  427. this.setState({RemarkIcon:false});
  428. this.setState({remarkEN:text});
  429. }
  430. else if(name=="remarkCH"){
  431.  
  432. this.setState({Remark1Icon:false});
  433. this.setState({remarkCH:text});
  434. }
  435. }
  436.  
  437. checkItem = item => {
  438. const { skillchecked } = this.state;
  439.  
  440. if (!skillchecked.includes(item)) {
  441. this.setState({ skillchecked: [...skillchecked, item] });
  442. } else {
  443. this.setState({ skillchecked: skillchecked.filter(a => a !== item) });
  444. }
  445. };
  446.  
  447. checkItem1 = item => {
  448. const { preferredmeanschecked } = this.state;
  449.  
  450. if (!preferredmeanschecked.includes(item)) {
  451. this.setState({ preferredmeanschecked: [...preferredmeanschecked, item] });
  452. } else {
  453. this.setState({ preferredmeanschecked: preferredmeanschecked.filter(a => a !== item) });
  454. }
  455. };
  456.  
  457. dateselected(date){
  458. this.setState({ commencement_date: date })
  459. if(date != "")
  460. this.setState({StartDateIcon:false});
  461. }
  462.  
  463. translate1(){
  464. if(!this.state.isConnected){
  465. ToastAndroid.showWithGravityAndOffset(strings.connectionerr,ToastAndroid.LONG,ToastAndroid.BOTTOM,25,50);
  466. return
  467. }
  468. if(this.state.remarkEN == "")
  469. return
  470. this.setState({isLoading1:true})
  471. fetch(Baseurl+'System/TranslateEngToCht', {
  472. method: 'POST',
  473. timeout: RequestTimeout,
  474. headers: LoginApiHeader,
  475. body: JSON.stringify({
  476. Translate: this.state.remarkEN,
  477. })
  478. })
  479. .then((response) => {
  480. return response.json()
  481. })
  482. .then(async (responseJson) => {
  483.  
  484. if(responseJson.Translate != null){
  485. this.setState({remarkCH:responseJson.Translate});
  486. }
  487. else if(responseJson.Message != null){
  488. ToastAndroid.showWithGravityAndOffset(
  489. responseJson.Message,
  490. ToastAndroid.LONG,
  491. ToastAndroid.BOTTOM,
  492. 25,
  493. 50
  494. );
  495. }else{
  496. ToastAndroid.showWithGravityAndOffset(
  497. "Failed to Translate",
  498. ToastAndroid.LONG,
  499. ToastAndroid.BOTTOM,
  500. 25,
  501. 50
  502. );
  503. }
  504. this.setState({isLoading1:false});
  505. })
  506. .catch((error) => {
  507. if(error=="TypeError: Network request failed"){
  508. ToastAndroid.showWithGravityAndOffset(strings.timeouterr,ToastAndroid.LONG,ToastAndroid.BOTTOM,25,50);
  509. }
  510. this.setState({isLoading1:false});
  511. });
  512. }
  513.  
  514. translate2(){
  515. if(!this.state.isConnected){
  516. ToastAndroid.showWithGravityAndOffset(strings.connectionerr,ToastAndroid.LONG,ToastAndroid.BOTTOM,25,50);
  517. return
  518. }
  519. if(this.state.remarkCH == "")
  520. return
  521. this.setState({isLoading1:true})
  522. fetch(Baseurl+'System/TranslateChtToEng', {
  523. method: 'POST',
  524. timeout: RequestTimeout,
  525. headers: LoginApiHeader,
  526. body: JSON.stringify({
  527. Translate: this.state.remarkCH,
  528. })
  529. })
  530. .then((response) => {
  531. return response.json()
  532. })
  533. .then(async (responseJson) => {
  534.  
  535. if(responseJson.Translate != null){
  536. this.setState({remarkEN:responseJson.Translate});
  537. }
  538. else if(responseJson.Message != null){
  539. ToastAndroid.showWithGravityAndOffset(
  540. responseJson.Message,
  541. ToastAndroid.LONG,
  542. ToastAndroid.BOTTOM,
  543. 25,
  544. 50
  545. );
  546. }else{
  547. ToastAndroid.showWithGravityAndOffset(
  548. "Failed to Translate",
  549. ToastAndroid.LONG,
  550. ToastAndroid.BOTTOM,
  551. 25,
  552. 50
  553. );
  554. }
  555. this.setState({isLoading1:false});
  556. })
  557. .catch((error) => {
  558. if(error=="TypeError: Network request failed"){
  559. ToastAndroid.showWithGravityAndOffset(strings.timeouterr,ToastAndroid.LONG,ToastAndroid.BOTTOM,25,50);
  560. }
  561. this.setState({isLoading1:false});
  562. });
  563. }
  564.  
  565. renderPicker() {
  566. if (Platform.OS === "android") {
  567. return (
  568. <View>
  569. <Picker
  570. style={{ width:"95%", height: 100, alignSelf: "center" }}
  571. selectedValue={this.state.selectedTradecategory}
  572. itemStyle={{ color: "#000", fontSize: 14, }}
  573. itemSpace={25}
  574. multiline={true}
  575. onValueChange={(index) => this.onPickerSelect(index)}>
  576. {
  577. this.state.tradecategory.map((value, i) => (
  578. <Picker.Item label={value} value={i} key={value} />
  579. ))
  580. }
  581. </Picker>
  582. <View style={{ height: 1, width: '100%', backgroundColor: '#000', marginTop: 10, marginBottom: 10 }} />
  583. <Picker
  584. style={{ width:"95%", height: 100, alignSelf: "center" }}
  585. selectedValue={this.state.selectedTrade}
  586. itemStyle={{ color: "#000", fontSize: 14, multiline:true}}
  587. itemSpace={25}
  588. multiline={true}
  589. onValueChange={(index) => this.onPickerSelect1(index)}>
  590. {
  591. this.state.trade.map((value, i) => (
  592. <Picker.Item label={value} value={i} key={value} />
  593. ))
  594. }
  595. </Picker>
  596. </View>
  597. )
  598. }
  599.  
  600. return (
  601. <View style={styles.row}>
  602. <Picker
  603. style={{ height: 120, width: 100 }}
  604. >
  605. </Picker>
  606. </View>
  607. )
  608. }
  609.  
  610. render() {
  611. const { navigate } = this.props.navigation;
  612. if (this.state.isLoading) {
  613. return <View><Text></Text></View>;
  614. }
  615. return (
  616. <ImageBackground resizeMode="cover" source={require('../assets/gradient_bg.png')} style={{ flex: 1 }}>
  617. <ScrollView style={{ marginBottom: 50 }}>
  618.  
  619.  
  620. <View style={styles.row}>
  621. <Text style={styles.label}>{strings.tradecategorylbl}</Text>
  622. <View style={styles.row1}>
  623. <Text style={styles.label1}
  624. onPress={() => this.setState({ visible: true })}
  625. >{this.state.tradecategoryvalue}</Text>
  626. {this.state.TradeCategoryIcon}
  627. </View>
  628. </View>
  629.  
  630. <View style={styles.row}>
  631. <Text style={styles.label}>{strings.tradelbl}</Text>
  632. <View style={styles.row1}>
  633. <Text style={styles.label1}
  634. onPress={() => this.setState({ visible: true })}
  635. >{this.state.tradevalue}</Text>
  636. {this.state.TradeIcon}
  637. </View>
  638. </View>
  639.  
  640. <View style={[styles.row, { justifyContent: "flex-start", alignItems: "flex-start" }]}>
  641. <Text style={styles.label}>{strings.skilllevellbl}</Text>
  642. <View style={styles.row1}>
  643. <View style={{ marginLeft: 0, width:"97%" }}>
  644. <FlatList
  645. data={Skill_Level_Items}
  646. extraData={this.state}
  647. renderItem={({ item }) => (
  648. <CheckBox
  649. iconType="material-community"
  650. uncheckedIcon="checkbox-blank-outline"
  651. checkedIcon="checkbox-marked"
  652. uncheckedColor="#417505"
  653. checkedColor="#417505"
  654. containerStyle={styles.checkBoxContainer}
  655. textStyle={{ fontSize: 14, fontWeight: "200" }}
  656. title={item}
  657. onPress={() => this.checkItem(item)}
  658. checked={this.state.skillchecked.includes(item)}
  659. />
  660. )}
  661. />
  662. </View>
  663. {this.state.SkillLevelIcon}
  664. </View>
  665. </View>
  666.  
  667. <View style={styles.row}>
  668. <Text style={styles.label}>{strings.wprkdistrictlbl}</Text>
  669. <View style={styles.row1}>
  670. <Text style={styles.label1}
  671. onPress={() => navigate('select_work_district',{returnData: this.returnData.bind(this)})}
  672. >{this.state.work_district}</Text>
  673. {this.state.WorkDistrictIcon}
  674. </View>
  675. </View>
  676.  
  677. <View style={styles.row}>
  678. <Text style={styles.label}>{strings.typeosalarylbl}</Text>
  679. <View style={styles.row1}>
  680. <Dropdown
  681. label=""
  682. fontSize={14}
  683. value={this.state.salary_type_value}
  684. onChangeText={(value) => this.onchangeslarytype(value)}
  685. containerStyle={styles.dropdownContainer}
  686. inputContainerStyle={{ borderBottomWidth: 1 }}
  687. data={Salary_Type}
  688. />
  689. {this.state.TypeofSalaryIcon}
  690. </View>
  691. </View>
  692.  
  693. <View style={styles.row}>
  694. <Text style={styles.label}>{strings.rangofsalarylbl}</Text>
  695. <View style={styles.row1}>
  696. <Dropdown
  697. fontSize={14}
  698. label=""
  699. value={this.state.salary_range_value}
  700. onChangeText={(value) => this.setState({ salary_range_value: value })}
  701. containerStyle={styles.dropdownContainer}
  702. inputContainerStyle={{ borderBottomWidth: 1 }}
  703. data={this.state.salary_range}
  704. />
  705. {this.state.RangeodSalaryIcon}
  706. </View>
  707. </View>
  708.  
  709. <View style={styles.row}>
  710. <Text style={styles.label}>{strings.postofficelbl}</Text>
  711. <View style={styles.row1}>
  712. <Dropdown
  713. fontSize={14}
  714. label=""
  715. value={this.state.post_date}
  716. onChangeText={(value) => this.setState({ post_date: value })}
  717. containerStyle={styles.dropdownContainer}
  718. inputContainerStyle={{ borderBottomWidth: 1 }}
  719. data={PostDuration}
  720. />
  721. {this.state.PostDurationIcon}
  722. </View>
  723. </View>
  724.  
  725. <View style={styles.row}>
  726. <Text style={styles.label}>{strings.jobcommendatelbl}</Text>
  727. <View style={styles.row1}>
  728. <DatePicker
  729. iconComponent={<Image style={{ width: 20, height: 20 }} resizeMode="contain" source={require('../assets/calendar.png')} />}
  730. style={styles.datePickerContainer}
  731. date={this.state.commencement_date}
  732. mode="date"
  733. placeholder={strings.selectdatelbl}
  734. format="DD/MM/YY"
  735. minDate={new Date()}
  736. confirmBtnText={strings.confirmbtnlbl}
  737. cancelBtnText={strings.canclebtn}
  738. customStyles={{
  739. dateIcon: {
  740. position: 'absolute',
  741. right: 0,
  742. top: 4,
  743. marginLeft: 0
  744. },
  745. dateInput: {
  746. borderWidth: 0,
  747. alignItems: "flex-start"
  748. }
  749. }}
  750. onDateChange={(date) => { this.dateselected(date) }}
  751. />
  752. {this.state.StartDateIcon}
  753. </View>
  754. </View>
  755.  
  756. <View style={styles.row}>
  757. <Text style={styles.label}>{strings.jobcompdatelbl}</Text>
  758. <View style={styles.row1}>
  759. <DatePicker
  760. iconComponent={<Image style={{ width: 20, height: 20 }} resizeMode="contain" source={require('../assets/calendar.png')} />}
  761. style={styles.datePickerContainer}
  762. date={this.state.completion_date}
  763. mode="date"
  764. placeholder={strings.selectdatelbl}
  765. format="DD/MM/YY"
  766. minDate={this.state.commencement_date==""?new Date():this.state.commencement_date}
  767. confirmBtnText={strings.canclebtn}
  768. cancelBtnText={strings.canclebtn}
  769. customStyles={{
  770. dateIcon: {
  771. position: 'absolute',
  772. right: 0,
  773. top: 4,
  774. marginLeft: 0
  775. },
  776. dateInput: {
  777. borderWidth: 0,
  778. alignItems: "flex-start"
  779. }
  780. }}
  781. onDateChange={(date) => { this.setState({ completion_date: date }) }}
  782. />
  783. {this.state.EndDateIcon}
  784. </View>
  785. </View>
  786.  
  787.  
  788. <View style={styles.row}>
  789. <Text style={styles.label}>{strings.noofvacancylbl}</Text>
  790. <Input
  791. keyboardType="numeric"
  792. containerStyle={{ width: "60%" }}
  793. underlineColorAndroid="transparent"
  794. inputContainerStyle={styles.input}
  795. value={this.state.vacancyNo}
  796. onChangeText={(text)=>this.validate(text,"vacancyno")}
  797. inputStyle={{ fontSize: 14, marginLeft: 0 }}
  798. rightIcon={this.state.VacancyIcon}
  799. />
  800. </View>
  801.  
  802. <View style={styles.row}>
  803. <Text style={styles.label}>{strings.contactpersonlbl}</Text>
  804. <Input
  805. containerStyle={{ width: "60%" }}
  806. underlineColorAndroid="transparent"
  807. inputContainerStyle={styles.input}
  808. value={this.state.contactPerson}
  809. onChangeText={(text)=>this.validate(text,"contactPerson")}
  810. inputStyle={{ fontSize: 14, marginLeft: 0 }}
  811. rightIcon={this.state.ContactPersonIcon}
  812. />
  813. </View>
  814.  
  815. <View style={styles.row}>
  816. <Text style={styles.label}>{strings.contactnolbl}</Text>
  817. <Input
  818. keyboardType="numeric"
  819. containerStyle={{ width: "60%" }}
  820. underlineColorAndroid="transparent"
  821. inputContainerStyle={styles.input}
  822. value={this.state.contactNo}
  823. onChangeText={(text)=>this.validate(text,"contactNo")}
  824. inputStyle={{ fontSize: 14, marginLeft: 0 }}
  825. rightIcon={this.state.ContactNoIcon}
  826. />
  827. </View>
  828.  
  829. <View style={styles.row}>
  830. <Text style={styles.label}>{strings.whatsappnumberlbl}</Text>
  831. <Input
  832. keyboardType="numeric"
  833. containerStyle={{ width: "60%" }}
  834. underlineColorAndroid="transparent"
  835. inputContainerStyle={styles.input}
  836. value={this.state.whatsappNo}
  837. onChangeText={(text)=>this.validate(text,"whatsappNo")}
  838. inputStyle={{ fontSize: 14, marginLeft: 0 }}
  839. rightIcon={this.state.WhatsAppIcon}
  840. />
  841. </View>
  842.  
  843.  
  844. <View style={styles.row}>
  845. <Text style={styles.label}>{strings.faxnumberlbl}</Text>
  846. <Input
  847. keyboardType="numeric"
  848. containerStyle={{ width: "60%" }}
  849. underlineColorAndroid="transparent"
  850. inputContainerStyle={styles.input}
  851. value={this.state.faxNo}
  852. onChangeText={(text)=>this.validate(text,"faxNo")}
  853. inputStyle={{ fontSize: 14, marginLeft: 0 }}
  854. rightIcon={this.state.FaxNumberIcon}
  855. />
  856. </View>
  857.  
  858.  
  859. <View style={[styles.row, { justifyContent: "flex-start", alignItems: "flex-start" }]}>
  860. <Text style={styles.label}>{strings.preferredmeanslbl}</Text>
  861. <View style={styles.row1}>
  862. <View style={{ width:"97%" }}>
  863. <FlatList
  864. data={Means_Of_Application}
  865. extraData={this.state}
  866. renderItem={({ item }) => (
  867. <CheckBox
  868. iconType="material-community"
  869. uncheckedIcon="checkbox-blank-outline"
  870. checkedIcon="checkbox-marked"
  871. uncheckedColor="#417505"
  872. checkedColor="#417505"
  873. containerStyle={styles.checkBoxContainer}
  874. textStyle={{ fontSize: 14, fontWeight: "200" }}
  875. title={item}
  876. onPress={() => this.checkItem1(item)}
  877. checked={this.state.preferredmeanschecked.includes(item)}
  878. />
  879. )}
  880. />
  881. </View>
  882. {this.state.PreferredMeansIcon}
  883. </View>
  884. </View>
  885.  
  886. <View style={styles.row}>
  887. <Text style={styles.label}>{strings.remarkElbl}</Text>
  888. <View style={styles.row1}>
  889. <Input
  890. containerStyle={{ width: "85%", }}
  891. underlineColorAndroid="transparent"
  892. inputContainerStyle={styles.input}
  893. value={this.state.remarkEN}
  894. onChangeText={(text)=>this.validate(text,"remarkEN")}
  895. inputStyle={{ fontSize: 14, marginLeft: 0 }}
  896. rightIcon={this.state.RemarkIcon}/>
  897. <View style={{width:"15%", marginLeft:5}}>
  898. <TouchableOpacity onPress={()=>this.translate1()}>
  899. <Image style={{width:20,height:20}} source={require('../assets/ec.png')}/>
  900. </TouchableOpacity>
  901. </View>
  902. </View>
  903. </View>
  904.  
  905. <View style={styles.row}>
  906. <Text style={styles.label}>{strings.remarkClbl}</Text>
  907. <View style={styles.row1}>
  908. <Input
  909. containerStyle={{ width: "85%" }}
  910. underlineColorAndroid="transparent"
  911. inputContainerStyle={styles.input}
  912. inputStyle={{ fontSize: 14 }}
  913. value={this.state.remarkCH}
  914. onChangeText={(text)=>this.validate(text,"remarkCH")}
  915. inputStyle={{ fontSize: 14, marginLeft: 0 }}
  916. rightIcon={this.state.Remark1Icon}/>
  917. <View style={{width:"15%",marginLeft:5}}>
  918. <TouchableOpacity onPress={()=>this.translate2()}>
  919. <Image style={{width:20,height:20}} source={require('../assets/ce.png')}/>
  920. </TouchableOpacity>
  921. </View>
  922. </View>
  923. </View>
  924.  
  925. </ScrollView>
  926.  
  927. <View style={styles.footerWrap}>
  928. <Button
  929. onPress={() => this.onSubmitPress()}
  930. title={strings.priviewandsubmitbtn}
  931. icon={<Image resizeMode="contain" style={{ width: 20, height: 20 }} source={require('../assets/check.png')} />}
  932. iconLeft
  933. containerStyle={styles.btnContainer}
  934. buttonStyle={styles.btn}
  935. />
  936. </View>
  937.  
  938. <Modal
  939. isVisible={this.state.visible}
  940. onBackdropPress={() => this.setState({ visible: false })}
  941. onBackButtonPress={() => this.setState({ visible: false })} >
  942.  
  943. <View style={styles.modalContentWrapper}>
  944. <View style={styles.modalHeader}>
  945. <Text style={{ color: "#fff" }}>{strings.tradepopuptitle}</Text>
  946. </View>
  947.  
  948. {this.renderPicker()}
  949. <View style={styles.footerWrap1}>
  950.  
  951. <Button
  952. onPress={() => this.closemodal()}
  953. icon={<Image resizeMode="contain" style={{ width: 20, height: 20 }} source={require('../assets/check.png')} />}
  954. iconLeft
  955. title={strings.okbtn}
  956. containerStyle={styles.btnContainer}
  957. buttonStyle={styles.btn}
  958. />
  959. </View>
  960. </View>
  961. </Modal>
  962. <Spinner visible={this.state.isLoading1} overlayColor={"rgba(0, 0, 0, 0.65)"} textContent={"Please wait..."} textStyle={{color: '#FFF'}} />
  963. </ImageBackground>
  964. )
  965. }
  966. }
  967.  
  968. const styles = {
  969. row: {
  970. flexDirection: "row",
  971. alignItems: "center",
  972. justifyContent: "space-between",
  973. paddingVertical: 2,
  974. marginVertical: 5,
  975. paddingHorizontal: 15,
  976. },
  977. row1: {
  978. width: "60%",
  979. flexDirection: "row",
  980. },
  981. label: {
  982. width: "35%",
  983. fontSize: 12
  984. },
  985. label1: {
  986. width: "90%",
  987. fontSize: 16,
  988. marginBottom:5,
  989. },
  990. header: {
  991. padding: 12,
  992. backgroundColor: "#3a5e0a"
  993. },
  994. headerText: {
  995. color: "#fff",
  996. },
  997. input: {
  998. height: 30
  999. },
  1000. footerWrap: {
  1001. position: "absolute",
  1002. width: "100%",
  1003. bottom: 0,
  1004. flexDirection: "row",
  1005. backgroundColor: "#fff"
  1006. },
  1007. footerWrap1: {
  1008. width: "100%",
  1009. bottom: 0,
  1010. flexDirection: "row",
  1011. backgroundColor: "#fff",
  1012. marginTop: 10,
  1013. },
  1014. btnContainer: {
  1015. width: "100%",
  1016. marginLeft: .5,
  1017. marginRight: .5,
  1018. },
  1019. btn: {
  1020. borderRadius: 0,
  1021. backgroundColor: "#7fb539",
  1022. paddingVertical: 6,
  1023. },
  1024. camBtnWrap: {
  1025. borderColor: "#7fb539",
  1026. borderWidth: 1,
  1027. width: 130,
  1028. height: 80,
  1029. borderRadius: 3,
  1030. justifyContent: "center",
  1031. marginLeft: "15%",
  1032. marginBottom: 10
  1033. },
  1034. dropdownContainer: {
  1035. width: "90%",
  1036. marginTop: -25,
  1037. },
  1038. datePickerContainer: {
  1039. width: "90%",
  1040. borderBottomWidth: .8,
  1041. paddingRight: 5
  1042. },
  1043. checkBoxContainer: {
  1044. backgroundColor: "transparent",
  1045. margin: 0,
  1046. borderWidth: 0,
  1047. paddingVertical: 2
  1048. },
  1049. modalContentWrapper: {
  1050. backgroundColor: "#fff",
  1051. },
  1052. modalHeader: {
  1053. padding: 12,
  1054. backgroundColor: "#3a5e0a"
  1055. }
  1056. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!