invoice_head.js 45 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291
  1. import React, {Component} from 'react';
  2. import {
  3. View,
  4. Text,
  5. TouchableOpacity,
  6. StyleSheet,
  7. Dimensions,
  8. FlatList,
  9. PixelRatio,
  10. DeviceEventEmitter,
  11. Image,
  12. TextInput,
  13. SafeAreaView,
  14. ScrollView,
  15. Alert,
  16. } from 'react-native';
  17. import {
  18. List,
  19. SwipeAction,
  20. Radio,
  21. Picker,
  22. Provider,
  23. InputItem,
  24. WhiteSpace,
  25. WingBlank,
  26. } from '@ant-design/react-native';
  27. import public_css from '../../source/css/public_css';
  28. import {NumberTwoDecimal, RoundingData} from '../../source/inspect/inspect';
  29. import invoice_head_css from './invoice_head_css';
  30. import {SvgXml} from 'react-native-svg';
  31. import {ToastShow} from '../../components/toast/toast';
  32. import {
  33. downArrowIcon,
  34. plusIcon,
  35. enterpriseIcon,
  36. upArrowIcon,
  37. } from '../../source/icon/icon';
  38. import {RetrieveData} from '../../data/storage';
  39. import {RequestNetwork} from '../../data/encryption';
  40. import { CleanAll } from "../../components/abnormalMessage/abnormal_message";
  41. import invoice_css from "../invoice/invoice_css";
  42. export default class invoice extends Component {
  43. constructor(props) {
  44. super(props);
  45. this.props.navigation.dangerouslyGetParent().setOptions({
  46. tabBarVisible: false,
  47. });
  48. this.state = {
  49. listData: [],
  50. productNumberTotal: 0,
  51. amountTotal: 0.0,
  52. taxAmount: 0.0,
  53. taxRateTotal: 0.0,
  54. productAmountTotal: 0.0,
  55. companyTypes: [
  56. {
  57. label: '个人',
  58. value: '1',
  59. },
  60. {
  61. label: '企业',
  62. value: '2',
  63. },
  64. ],
  65. companyType: '1',
  66. invoiceTypes: [
  67. {
  68. label: '增值税普通电子发票',
  69. value: '1',
  70. },
  71. {
  72. label: '增值税电子专用发票',
  73. value: '2',
  74. },
  75. ],
  76. invoiceType: '1',
  77. customerName: '',
  78. taxNumber: '',
  79. contactNumber: '',
  80. address: '',
  81. bank: '',
  82. bankAccount: '',
  83. payee: '',
  84. reviewer: '',
  85. drawer: '',
  86. remark: '',
  87. hideStatusText: '更多',
  88. hideStatus: false,
  89. email: '',
  90. interactType: 1,
  91. categoryBack: 'rgba(42,103,254, 1)',
  92. categoryBackFont: '#ffffff',
  93. categoryBackCompany: 'rgba(42,103,254, 0.07)',
  94. categoryBackCompanyFont: '#2A67FE',
  95. typeBack: 'rgba(42,103,254, 1)',
  96. typeBackFont: '#ffffff',
  97. typeBackMajor: 'rgba(42,103,254, 0.07)',
  98. typeBackMajorFont: '#2A67FE',
  99. receiveType: 1,
  100. receiveAddress: '',
  101. receiveBack: 'rgba(42,103,254, 1)',
  102. receiveBackFont: '#ffffff',
  103. receiveBackCompany: 'rgba(42,103,254, 0.07)',
  104. receiveBackCompanyFont: '#2A67FE',
  105. };
  106. }
  107. render() {
  108. return (
  109. <Provider>
  110. <SafeAreaView style={public_css.body}>
  111. <ScrollView>
  112. <View>
  113. <View style={{flexDirection: 'row', justifyContent: 'flex-start'}}>
  114. <View>
  115. <TouchableOpacity
  116. onPress={() => {
  117. this.getInvoiceCategory('1');
  118. }}
  119. style={{
  120. alignItems: 'center',
  121. justifyContent: 'center',
  122. backgroundColor: this.state.categoryBack,
  123. width: 90,
  124. height: 40,
  125. borderRadius: 39,
  126. margin: 10,
  127. }}>
  128. <Text
  129. style={{
  130. color: this.state.categoryBackFont,
  131. fontWeight: 'bold',
  132. fontSize: 16,
  133. }}>
  134. 个人
  135. </Text>
  136. </TouchableOpacity>
  137. </View>
  138. <View>
  139. <TouchableOpacity
  140. onPress={() => {
  141. this.getInvoiceCategory('2');
  142. }}
  143. style={{
  144. alignItems: 'center',
  145. justifyContent: 'center',
  146. backgroundColor: this.state.categoryBackCompany,
  147. width: 90,
  148. height: 40,
  149. borderRadius: 39,
  150. margin: 10,
  151. }}>
  152. <Text
  153. style={{
  154. color: this.state.categoryBackCompanyFont,
  155. fontWeight: 'bold',
  156. fontSize: 16,
  157. }}>
  158. 企业
  159. </Text>
  160. </TouchableOpacity>
  161. </View>
  162. </View>
  163. <View
  164. style={{
  165. backgroundColor: '#F7F7F7',
  166. height: 40,
  167. justifyContent: 'center',
  168. marginLeft: 10,
  169. }}>
  170. <Text style={{color: '#888888', fontSize: 18}}>发票类型</Text>
  171. </View>
  172. <View style={{flexDirection: 'row', justifyContent: 'center'}}>
  173. <View>
  174. <TouchableOpacity
  175. onPress={() => {
  176. this.getInvoiceType('1');
  177. }}
  178. style={{
  179. alignItems: 'center',
  180. justifyContent: 'center',
  181. backgroundColor: this.state.typeBack,
  182. width: 160,
  183. height: 40,
  184. borderRadius: 39,
  185. margin: 10,
  186. }}>
  187. <Text
  188. style={{
  189. color: this.state.typeBackFont,
  190. fontWeight: 'bold',
  191. fontSize: 16,
  192. }}>
  193. 增值税电子普通发票
  194. </Text>
  195. </TouchableOpacity>
  196. </View>
  197. <View>
  198. <TouchableOpacity
  199. onPress={() => {
  200. this.getInvoiceType('2');
  201. }}
  202. style={{
  203. alignItems: 'center',
  204. justifyContent: 'center',
  205. backgroundColor: this.state.typeBackMajor,
  206. width: 160,
  207. height: 40,
  208. borderRadius: 39,
  209. margin: 10,
  210. }}>
  211. <Text
  212. style={{
  213. color: this.state.typeBackMajorFont,
  214. fontWeight: 'bold',
  215. fontSize: 16,
  216. }}>
  217. 增值税电子专用发票
  218. </Text>
  219. </TouchableOpacity>
  220. </View>
  221. </View>
  222. <View
  223. style={{
  224. backgroundColor: '#F7F7F7',
  225. height: 40,
  226. justifyContent: 'center',
  227. marginLeft: 10,
  228. }}>
  229. <Text style={{color: '#888888', fontSize: 18}}>发票信息</Text>
  230. </View>
  231. {/*<Picker*/}
  232. {/* data={this.state.companyTypes}*/}
  233. {/* cols={1}*/}
  234. {/* value={[this.state.companyType]}*/}
  235. {/* onChange={(value) => {*/}
  236. {/* this.companyTypeChange(value);*/}
  237. {/* }}>*/}
  238. {/* <List.Item arrow="horizontal" onPress={this.onPress}>*/}
  239. {/* <View style={{flexDirection: 'row', alignItems: 'center'}}>*/}
  240. {/* <Text style={{color: 'red', marginRight: 5}}>*</Text>*/}
  241. {/* <Text style={{fontSize: 16}}>客户抬头类型:</Text>*/}
  242. {/* </View>*/}
  243. {/* </List.Item>*/}
  244. {/*</Picker>*/}
  245. {/*<Picker*/}
  246. {/* data={this.state.invoiceTypes}*/}
  247. {/* cols={1}*/}
  248. {/* value={[this.state.invoiceType]}*/}
  249. {/* onChange={(value) => {*/}
  250. {/* this.invoiceTypeChange(value);*/}
  251. {/* }}>*/}
  252. {/* <List.Item arrow="horizontal" onPress={this.onPress}>*/}
  253. {/* <View style={{flexDirection: 'row', alignItems: 'center'}}>*/}
  254. {/* <Text style={{color: 'red', marginRight: 5}}>*</Text>*/}
  255. {/* <Text style={{fontSize: 16}}>发票类型:</Text>*/}
  256. {/* </View>*/}
  257. {/* </List.Item>*/}
  258. {/*</Picker>*/}
  259. <List>
  260. <WingBlank>
  261. <View style={[public_css.view, {position: 'relative'}]}>
  262. <View style={[public_css.view, {flex: 1}]}>
  263. <View
  264. style={{flexDirection: 'row', alignItems: 'center'}}>
  265. <Text style={{color: 'red', marginRight: 5}}>*</Text>
  266. <Text style={{fontSize: 16}}>企业名称:</Text>
  267. </View>
  268. <TextInput
  269. style={public_css.textInputStyle}
  270. placeholder="请输入客户名称"
  271. clearButtonMode="while-editing"
  272. secureTextEntry={false}
  273. onChangeText={(text) => {
  274. this.setState({
  275. customerName: text,
  276. });
  277. }}
  278. value={this.state.customerName}
  279. editable={false}
  280. />
  281. </View>
  282. </View>
  283. </WingBlank>
  284. {this.state.companyType === '2' ? (
  285. <WingBlank>
  286. <View style={[public_css.view, public_css.lineTopBottom]}>
  287. <View
  288. style={{flexDirection: 'row', alignItems: 'center'}}>
  289. <Text style={{color: 'red', marginRight: 5}}>*</Text>
  290. <Text style={{fontSize: 16}}>企业税号:</Text>
  291. </View>
  292. <TextInput
  293. style={public_css.textInputStyle}
  294. placeholder="请输入客户企业税号"
  295. clearButtonMode="while-editing"
  296. secureTextEntry={false}
  297. onChangeText={(text) => {
  298. this.setState({
  299. taxNumber: text,
  300. });
  301. }}
  302. value={this.state.taxNumber}
  303. editable={false}
  304. />
  305. </View>
  306. </WingBlank>
  307. ) : (
  308. <WingBlank>
  309. <View style={[public_css.view, public_css.lineTopBottom]}>
  310. <View
  311. style={{flexDirection: 'row', alignItems: 'center'}}>
  312. <Text style={{color: 'red', marginRight: 10}} />
  313. <Text style={{fontSize: 16}}>企业税号:</Text>
  314. </View>
  315. <TextInput
  316. style={public_css.textInputStyle}
  317. placeholder="请输入客户企业税号"
  318. clearButtonMode="while-editing"
  319. secureTextEntry={false}
  320. onChangeText={(text) => {
  321. this.setState({
  322. taxNumber: text,
  323. });
  324. }}
  325. value={this.state.taxNumber}
  326. editable={false}
  327. />
  328. </View>
  329. </WingBlank>
  330. )}
  331. <WingBlank>
  332. {this.state.hideStatus === true ? (
  333. <View style={[public_css.view, public_css.lineTopBottom]}>
  334. <View
  335. style={{flexDirection: 'row', alignItems: 'center'}}>
  336. <Text style={{fontSize: 16}}>地址:</Text>
  337. </View>
  338. <TextInput
  339. style={public_css.textInputStyle}
  340. placeholder="请输入地址"
  341. clearButtonMode="while-editing"
  342. secureTextEntry={false}
  343. onChangeText={(text) => {
  344. this.setState({
  345. address: text,
  346. });
  347. }}
  348. value={this.state.address}
  349. />
  350. </View>
  351. ) : (
  352. <View />
  353. )}
  354. </WingBlank>
  355. <WingBlank>
  356. {this.state.hideStatus === true ? (
  357. <View style={[public_css.view, public_css.lineTopBottom]}>
  358. <View
  359. style={{flexDirection: 'row', alignItems: 'center'}}>
  360. <Text style={{fontSize: 16}}>联系电话:</Text>
  361. </View>
  362. <TextInput
  363. style={public_css.textInputStyle}
  364. placeholder="请输入联系电话"
  365. clearButtonMode="while-editing"
  366. secureTextEntry={false}
  367. onChangeText={(text) => {
  368. this.setState({
  369. contactNumber: text,
  370. });
  371. }}
  372. value={this.state.contactNumber}
  373. />
  374. </View>
  375. ) : (
  376. <View />
  377. )}
  378. </WingBlank>
  379. <WingBlank>
  380. {this.state.hideStatus === true ? (
  381. <View style={[public_css.view, public_css.lineTopBottom]}>
  382. <View
  383. style={{flexDirection: 'row', alignItems: 'center'}}>
  384. <Text style={{fontSize: 16}}>开户银行:</Text>
  385. </View>
  386. <TextInput
  387. style={public_css.textInputStyle}
  388. placeholder="请输入开户银行"
  389. clearButtonMode="while-editing"
  390. secureTextEntry={false}
  391. onChangeText={(text) => {
  392. this.setState({
  393. bank: text,
  394. });
  395. }}
  396. value={this.state.bank}
  397. />
  398. </View>
  399. ) : (
  400. <View />
  401. )}
  402. </WingBlank>
  403. <WingBlank>
  404. {this.state.hideStatus === true ? (
  405. <View style={[public_css.view, public_css.lineTopBottom]}>
  406. <View
  407. style={{flexDirection: 'row', alignItems: 'center'}}>
  408. <Text style={{fontSize: 16}}>银行账号:</Text>
  409. </View>
  410. <TextInput
  411. style={public_css.textInputStyle}
  412. placeholder="请输入银行账号"
  413. clearButtonMode="while-editing"
  414. secureTextEntry={false}
  415. onChangeText={(text) => {
  416. this.setState({
  417. bankAccount: text,
  418. });
  419. }}
  420. value={this.state.bankAccount}
  421. />
  422. </View>
  423. ) : (
  424. <View />
  425. )}
  426. </WingBlank>
  427. <WingBlank>
  428. <View
  429. style={[
  430. public_css.view,
  431. public_css.lineTopBottom,
  432. {alignItems: 'center'},
  433. ]}>
  434. <View style={{flexDirection: 'row', alignItems: 'center'}}>
  435. <Text style={{color: 'red', marginRight: 5}}>*</Text>
  436. <Text style={{fontSize: 16}}>收款人:</Text>
  437. </View>
  438. <TextInput
  439. style={public_css.textInputStyle}
  440. placeholder="请输入收款人"
  441. clearButtonMode="while-editing"
  442. secureTextEntry={false}
  443. value={this.state.payee}
  444. editable={false}
  445. />
  446. <View style={{marginRight: 20}}>
  447. <TouchableOpacity
  448. style={{
  449. width: 30,
  450. height: 30,
  451. justifyContent: 'center',
  452. alignItems: 'center',
  453. }}
  454. onPress={() => {
  455. this.props.navigation.navigate('select_user', {
  456. type: 1,
  457. getUserInfo: (type, name) => {
  458. this.getUserInfo(type, name);
  459. },
  460. });
  461. }}>
  462. <Image
  463. source={require('../../source/img/productImg/addIcon.png')}
  464. style={{height: 16, width: 16}}
  465. />
  466. </TouchableOpacity>
  467. </View>
  468. </View>
  469. </WingBlank>
  470. <WingBlank>
  471. <View
  472. style={[
  473. public_css.view,
  474. public_css.lineTopBottom,
  475. {alignItems: 'center'},
  476. ]}>
  477. <View style={{flexDirection: 'row', alignItems: 'center'}}>
  478. <Text style={{color: 'red', marginRight: 5}}>*</Text>
  479. <Text style={{fontSize: 16}}>审核人:</Text>
  480. </View>
  481. <TextInput
  482. style={public_css.textInputStyle}
  483. placeholder="请输入审核人"
  484. clearButtonMode="while-editing"
  485. secureTextEntry={false}
  486. value={this.state.reviewer}
  487. editable={false}
  488. />
  489. <View style={{marginRight: 20}}>
  490. <TouchableOpacity
  491. style={{
  492. width: 30,
  493. height: 30,
  494. justifyContent: 'center',
  495. alignItems: 'center',
  496. }}
  497. onPress={() => {
  498. this.props.navigation.navigate('select_user', {
  499. type: 2,
  500. getUserInfo: (type, name) => {
  501. this.getUserInfo(type, name);
  502. },
  503. });
  504. }}>
  505. <Image
  506. source={require('../../source/img/productImg/addIcon.png')}
  507. style={{height: 16, width: 16}}
  508. />
  509. </TouchableOpacity>
  510. </View>
  511. </View>
  512. </WingBlank>
  513. <WingBlank>
  514. <View
  515. style={[
  516. public_css.view,
  517. public_css.lineTopBottom,
  518. {alignItems: 'center'},
  519. ]}>
  520. <View style={{flexDirection: 'row', alignItems: 'center'}}>
  521. <Text style={{color: 'red', marginRight: 5}}>*</Text>
  522. <Text style={{fontSize: 16}}>开票人:</Text>
  523. </View>
  524. <TextInput
  525. style={public_css.textInputStyle}
  526. placeholder="请输入开票人"
  527. clearButtonMode="while-editing"
  528. secureTextEntry={false}
  529. value={this.state.drawer}
  530. editable={false}
  531. />
  532. <View style={{marginRight: 20}}>
  533. <TouchableOpacity
  534. style={{
  535. width: 30,
  536. height: 30,
  537. justifyContent: 'center',
  538. alignItems: 'center',
  539. }}
  540. onPress={() => {
  541. this.props.navigation.navigate('select_user', {
  542. type: 3,
  543. getUserInfo: (type, name) => {
  544. this.getUserInfo(type, name);
  545. },
  546. });
  547. }}>
  548. <Image
  549. source={require('../../source/img/productImg/addIcon.png')}
  550. style={{height: 16, width: 16}}
  551. />
  552. </TouchableOpacity>
  553. </View>
  554. </View>
  555. </WingBlank>
  556. <WingBlank>
  557. {this.state.hideStatus === true ? (
  558. <View style={[public_css.view, public_css.lineTopBottom]}>
  559. <View
  560. style={{flexDirection: 'row', alignItems: 'center'}}>
  561. <Text style={{fontSize: 16}}>备注:</Text>
  562. </View>
  563. <TextInput
  564. style={public_css.textInputStyle}
  565. placeholder="请输入备注信息"
  566. clearButtonMode="while-editing"
  567. secureTextEntry={false}
  568. onChangeText={(text) => {
  569. this.setState({
  570. remark: text,
  571. });
  572. }}
  573. />
  574. </View>
  575. ) : (
  576. <View />
  577. )}
  578. <View style={[public_css.view, {justifyContent: 'center'}]}>
  579. <TouchableOpacity
  580. style={{
  581. width: 120,
  582. height: 30,
  583. backgroundColor: '#F8F8F8',
  584. opacity: 1,
  585. borderRadius: 99,
  586. flexDirection: 'row',
  587. justifyContent: 'center',
  588. alignItems: 'center',
  589. }}
  590. onPress={() => this.hideChange()}>
  591. <View style={{flexDirection: 'row', alignItems: 'center'}}>
  592. <Text style={{color: '#B6B6BA', fontSize: 16}}>
  593. {this.state.hideStatusText}
  594. </Text>
  595. <SvgXml xml={downArrowIcon()} />
  596. </View>
  597. </TouchableOpacity>
  598. </View>
  599. </WingBlank>
  600. <View
  601. style={{
  602. backgroundColor: '#F7F7F7',
  603. height: 40,
  604. justifyContent: 'center',
  605. marginLeft: 10,
  606. }}>
  607. <Text style={{color: '#888888', fontSize: 18}}>接收方式</Text>
  608. </View>
  609. <WingBlank>
  610. <View style={{flexDirection: 'row', justifyContent: 'flex-start', borderBottomWidth: 1, borderColor: 'rgb(208,208,208)'}}>
  611. <View>
  612. <TouchableOpacity
  613. onPress={() => {
  614. this.getReceive(1);
  615. }}
  616. style={{
  617. alignItems: 'center',
  618. justifyContent: 'center',
  619. backgroundColor: this.state.receiveBack,
  620. width: 90,
  621. height: 40,
  622. borderRadius: 39,
  623. margin: 10,
  624. }}>
  625. <Text
  626. style={{
  627. color: this.state.receiveBackFont,
  628. fontWeight: 'bold',
  629. fontSize: 16,
  630. }}>
  631. 邮箱
  632. </Text>
  633. </TouchableOpacity>
  634. </View>
  635. <View>
  636. <TouchableOpacity
  637. onPress={() => {
  638. this.getReceive(2);
  639. }}
  640. style={{
  641. alignItems: 'center',
  642. justifyContent: 'center',
  643. backgroundColor: this.state.receiveBackCompany,
  644. width: 90,
  645. height: 40,
  646. borderRadius: 39,
  647. margin: 10,
  648. }}>
  649. <Text
  650. style={{
  651. color: this.state.receiveBackCompanyFont,
  652. fontWeight: 'bold',
  653. fontSize: 16,
  654. }}>
  655. 短信
  656. </Text>
  657. </TouchableOpacity>
  658. </View>
  659. </View>
  660. </WingBlank>
  661. <WingBlank>
  662. {this.state.receiveType === 1 ? (
  663. <View
  664. style={[
  665. public_css.view,
  666. public_css.lineTopBottom,
  667. {alignItems: 'center'},
  668. ]}>
  669. <View style={{flexDirection: 'row', alignItems: 'center'}}>
  670. <Text style={{color: 'red', marginRight: 5}}>*</Text>
  671. <Text style={{fontSize: 16}}>邮箱:</Text>
  672. </View>
  673. <TextInput
  674. style={public_css.textInputStyle}
  675. placeholder="请输入邮箱"
  676. clearButtonMode="while-editing"
  677. secureTextEntry={false}
  678. value={this.state.receiveAddress}
  679. onChangeText={(text) => {
  680. this.setState({
  681. receiveAddress: text,
  682. });
  683. }}
  684. />
  685. </View>
  686. ) : (
  687. <View
  688. style={[
  689. public_css.view,
  690. public_css.lineTopBottom,
  691. {alignItems: 'center'},
  692. ]}>
  693. <View style={{flexDirection: 'row', alignItems: 'center'}}>
  694. <Text style={{color: 'red', marginRight: 5}}>*</Text>
  695. <Text style={{fontSize: 16}}>手机号:</Text>
  696. </View>
  697. <TextInput
  698. style={public_css.textInputStyle}
  699. placeholder="请输入手机号码"
  700. clearButtonMode="while-editing"
  701. secureTextEntry={false}
  702. value={this.state.receiveAddress}
  703. onChangeText={(text) => {
  704. this.setState({
  705. receiveAddress: text,
  706. });
  707. }}
  708. />
  709. </View>
  710. )}
  711. </WingBlank>
  712. </List>
  713. <View
  714. style={{
  715. backgroundColor: '#F7F7F7',
  716. height: 40,
  717. justifyContent: 'center',
  718. marginLeft: 10,
  719. }}>
  720. <Text style={{color: '#888888', fontSize: 18}}>商品信息</Text>
  721. </View>
  722. <View style={invoice_css.list_view}>
  723. <Text style={invoice_css.list_title_text}>名称</Text>
  724. <Text style={invoice_css.list_title_text}>单价</Text>
  725. {/*<Text style={invoice_css.list_title_text}>数量</Text>*/}
  726. <Text style={invoice_css.list_title_text}>税率(%)</Text>
  727. <Text style={invoice_css.list_title_text}>税额</Text>
  728. </View>
  729. <FlatList
  730. data={this.state.listData}
  731. renderItem={(item) => this.renderItem(item)}
  732. />
  733. <View>
  734. <WhiteSpace />
  735. <WingBlank>
  736. <TouchableOpacity
  737. style={{
  738. // width: Dimensions.get('window').width,
  739. height: 52,
  740. flexDirection: 'row',
  741. justifyContent: 'center',
  742. alignItems: 'center',
  743. border: 2,
  744. borderStyle: 'dotted',
  745. borderColor: '#2A67FE',
  746. borderWidth: 2,
  747. borderRadius: 8,
  748. opacity: 1,
  749. }}
  750. onPress={() => {
  751. this.props.navigation.navigate('product_list_info', {
  752. status: 3,
  753. });
  754. }}>
  755. <SvgXml xml={plusIcon()} />
  756. <Text style={{}}>添加商品信息</Text>
  757. </TouchableOpacity>
  758. </WingBlank>
  759. <WhiteSpace />
  760. </View>
  761. </View>
  762. </ScrollView>
  763. <View>
  764. <WhiteSpace />
  765. <View
  766. style={{
  767. flexDirection: 'row',
  768. justifyContent: 'space-around',
  769. alignItems: 'center',
  770. }}>
  771. <Text>共{this.state.productNumberTotal}个产品</Text>
  772. <Text>
  773. 开票金额:
  774. {RoundingData(parseFloat(this.state.amountTotal)).replace(
  775. /(\d)(?=(\d{3})+(?:\.\d+)?$)/g,
  776. '$1,',
  777. )}
  778. </Text>
  779. <Text>税额:{RoundingData(parseFloat(this.state.taxAmount))}</Text>
  780. </View>
  781. <WhiteSpace />
  782. <WingBlank>
  783. <View style={[public_css.bottomStatus]}>
  784. <TouchableOpacity
  785. style={[public_css.statusBtn, public_css.statusRBtn]}
  786. onPress={() => this.submitData()}>
  787. {/*<Image*/}
  788. {/* source={require('../../source/img/productImg/confirm.png')}*/}
  789. {/* style={{width: 32, height: 32}}*/}
  790. {/*/>*/}
  791. <Text style={{color: '#fff'}}>开具发票</Text>
  792. </TouchableOpacity>
  793. </View>
  794. </WingBlank>
  795. <WhiteSpace />
  796. </View>
  797. </SafeAreaView>
  798. </Provider>
  799. );
  800. }
  801. async componentDidMount(): void {
  802. let data = this.props.route.params.invoiceData;
  803. this.getReceive(data.item.interactType);
  804. // this.getInvoiceType();
  805. this.getInvoiceCategory(data.item.customerType.toString());
  806. this.setState({
  807. companyType: data.item.customerType.toString(),
  808. customerName: data.item.customerName,
  809. taxNumber: data.item.customerEntTaxId,
  810. contactNumber: data.item.contactPhone,
  811. address: data.item.address,
  812. bank: data.item.bankName,
  813. bankAccount: data.item.bankAccountNo,
  814. remark: data.item.remark,
  815. receiveAddress: data.item.interactTypeDetail,
  816. receiveType: data.item.interactType,
  817. });
  818. let company = JSON.parse(await RetrieveData('company'));
  819. let userName = await RetrieveData('userName');
  820. let payee = '';
  821. let reviewer = '';
  822. if (company.payees.length > 0) {
  823. payee = company.payees.split(',')[0];
  824. }
  825. if (company.reviewers.length > 0) {
  826. reviewer = company.reviewers.split(',')[0];
  827. }
  828. this.setState({
  829. company: company,
  830. payee: payee,
  831. reviewer: reviewer,
  832. drawer: userName,
  833. });
  834. //收到监听
  835. this.listener = DeviceEventEmitter.addListener('headInvoice', (data) => {
  836. //收到监听后想做的事情
  837. this.setList(data);
  838. });
  839. }
  840. componentWillUnmount() {
  841. //移除监听
  842. if (this.listener) {
  843. this.listener.remove();
  844. }
  845. }
  846. // 获取收款人、审核人、开票人信息
  847. getUserInfo = (type, name) => {
  848. if (type === 1) {
  849. this.setState({
  850. payee: name,
  851. });
  852. }
  853. if (type === 2) {
  854. this.setState({
  855. reviewer: name,
  856. });
  857. }
  858. if (type === 3) {
  859. this.setState({
  860. drawer: name,
  861. });
  862. }
  863. };
  864. selectProduct = () => {
  865. this.setState({
  866. productVisible: !this.state.productVisible,
  867. });
  868. };
  869. // 开票企业类型选择
  870. companyTypeChange = (value) => {
  871. let companyType = '';
  872. if (value.length > 0) {
  873. companyType = value[0];
  874. }
  875. this.setState({
  876. companyType: companyType,
  877. });
  878. };
  879. // 开票类型选择
  880. invoiceTypeChange = (value) => {
  881. let invoiceType = '';
  882. if (value.length > 0) {
  883. invoiceType = value[0];
  884. }
  885. this.setState({
  886. invoiceType: invoiceType,
  887. });
  888. };
  889. //提交开票信息
  890. submitData = async () => {
  891. if (this.state.customerName === '') {
  892. ToastShow(1, '企业名称不能为空!');
  893. return;
  894. }
  895. if (this.state.companyType === '2') {
  896. if (this.state.taxNumber === '') {
  897. ToastShow(1, '企业税号不能为空!');
  898. return;
  899. }
  900. }
  901. if (this.state.payee === '') {
  902. ToastShow(1, '收款人不能为空!');
  903. return;
  904. }
  905. if (this.state.reviewer === '') {
  906. ToastShow(1, '审核人不能为空!');
  907. return;
  908. }
  909. if (this.state.drawer === '') {
  910. ToastShow(1, '开票人不能为空!');
  911. return;
  912. }
  913. if (this.state.receiveType === 1) {
  914. if (this.state.receiveAddress === '') {
  915. ToastShow(1, '邮箱地址不能为空!');
  916. return;
  917. }
  918. } else {
  919. if (this.state.receiveAddress === '') {
  920. ToastShow(1, '邮箱地址不能为空!');
  921. return;
  922. }
  923. }
  924. if (this.state.listData <= 0) {
  925. ToastShow(1, '商品信息不能为空!');
  926. return;
  927. }
  928. const account = await RetrieveData('account');
  929. let token = await RetrieveData('token');
  930. if (token) {
  931. const url = '/sys/invoice/save';
  932. let response = await RequestNetwork(
  933. url,
  934. token,
  935. {
  936. interactType: this.state.receiveType,
  937. interactTypeDetail: this.state.receiveAddress,
  938. invoiceWay: 3,
  939. invoiceCategory: this.state.invoiceType,
  940. cmdParam: {
  941. REQUEST_COMMON_FPKJ: {
  942. SBLX: this.state.company.defaultDeviceInfo.deviceType, //设备类型
  943. SBBH: this.state.company.defaultDeviceInfo.taxDiscId, //设备编号
  944. KPLX: 0, //开票类型 0-蓝字发票;1-红字发票
  945. FPZL: this.state.invoiceType, //发票种类 1.增值税普通电子发票 2.增值税电子专用发票 3.增值税普通纸质发票 4 增值税专用纸质发票
  946. TTLX: this.state.companyType, //收票客户抬头类型 1:个人 2:企业
  947. KPF_NSRSBH: this.state.company.entTaxId, //开票方纳税人识别号
  948. KPF_MC: this.state.company.entName, //开票方名称
  949. KPF_DZ: this.state.company.entAddress, //开票方地址
  950. KPF_DH: this.state.company.entPhone, //开票方电话
  951. KPF_YHZH: this.state.company.bankAccountNumber, //开票方银行账号
  952. KPF_KHHMC: this.state.company.bankName, //开票方开户行名称
  953. SPF_NSRSBH: this.state.taxNumber, //收票方纳税人识别号
  954. SPF_MC: this.state.customerName, //收票方名称
  955. SPF_DH: this.state.contactNumber, //收票方电话
  956. SPF_DZ: this.state.address, //收票方地址
  957. SPF_YHZH: this.state.bankAccount, //收票方银行账号
  958. SPF_KHHMC: this.state.bank, //收票方开户行名称
  959. KPR: this.state.drawer, //开票人
  960. SKR: this.state.payee, //收款人
  961. FHR: this.state.reviewer, //复核人
  962. YFP_DM: '', //原发票代码
  963. YFP_HM: '', //原发票号码
  964. JSHJ: NumberTwoDecimal(parseFloat(this.state.amountTotal)), //价税合计
  965. HJJE: NumberTwoDecimal(parseFloat(this.state.productAmountTotal)), //合计金额
  966. HJSE: NumberTwoDecimal(this.state.taxRateTotal), //合计税额
  967. BZ: this.state.remark, //备注
  968. HYLX: 0, //发票行性质 0 正常行、1 折扣行、2 被折扣行
  969. TSPZ: '00', //特殊票种标识 “00”不是 “01”农产品销售“02”农产品收购“06”抵扣通行费“07”其它通行费“08”成品油销售说明:如果非特殊票种此节点可以没有。
  970. COMMON_FPKJ_XMXXS: {
  971. COMMON_FPKJ_XMXX: this.state.listData,
  972. }, // 产品列表
  973. },
  974. },
  975. mobile: account,
  976. reqChannel: 3,
  977. },
  978. false,
  979. 1,
  980. );
  981. if (response) {
  982. if (response.code === 0) {
  983. Alert.alert(
  984. '开具',
  985. '开票成功!',
  986. [
  987. {
  988. text: '确定',
  989. onPress: () => {
  990. DeviceEventEmitter.emit('updateStatistics');
  991. this.props.navigation.goBack();
  992. },
  993. },
  994. ],
  995. {cancelable: false},
  996. );
  997. } else {
  998. await this.abnormalMessage(response);
  999. }
  1000. } else {
  1001. ToastShow(1, response.msg);
  1002. }
  1003. }
  1004. };
  1005. //加载list列表
  1006. setList = (data) => {
  1007. let numberTotal = '';
  1008. if (data.XMSL === '') {
  1009. numberTotal = parseInt(this.state.productNumberTotal) + 1;
  1010. } else {
  1011. numberTotal =
  1012. parseInt(this.state.productNumberTotal) + parseInt(data.XMSL);
  1013. }
  1014. let taxRateTotal =
  1015. parseFloat(this.state.taxRateTotal) + parseFloat(data.SE);
  1016. let taxAmount =
  1017. parseFloat(this.state.taxAmount) + parseFloat(data.taxAmount);
  1018. let amountTotal =
  1019. parseFloat(this.state.amountTotal) + parseFloat(data.amount);
  1020. let productAmountTotal =
  1021. parseFloat(this.state.productAmountTotal) + parseFloat(data.XMJE);
  1022. let list = this.state.listData.concat(data);
  1023. this.setState({
  1024. listData: list,
  1025. amountTotal: amountTotal,
  1026. taxRateTotal: taxRateTotal,
  1027. taxAmount: taxAmount,
  1028. productNumberTotal: numberTotal,
  1029. productAmountTotal: productAmountTotal,
  1030. });
  1031. };
  1032. //加载items
  1033. renderItem = (data) => (
  1034. <SwipeAction
  1035. autoClose
  1036. style={{backgroundColor: 'transparent'}}
  1037. right={this.right(data)}>
  1038. <List.Item>
  1039. <View style={{flexDirection: 'row', justifyContent: 'space-around'}}>
  1040. <View style={{width: 70, alignItems: 'center'}}>
  1041. <Text>{data.item.XMMC} </Text>
  1042. </View>
  1043. <View style={{width: 70, alignItems: 'center'}}>
  1044. <Text>{data.item.price}</Text>
  1045. </View>
  1046. {/*<View>*/}
  1047. {/* <Text>{data.item.XMSL} </Text>*/}
  1048. {/*</View>*/}
  1049. <View style={{width: 70, alignItems: 'center'}}>
  1050. <Text>{data.item.SL * 100}</Text>
  1051. </View>
  1052. <View style={{width: 70, alignItems: 'center'}}>
  1053. <Text>{data.item.taxAmount}</Text>
  1054. </View>
  1055. </View>
  1056. </List.Item>
  1057. </SwipeAction>
  1058. );
  1059. //左滑删除
  1060. right = (data) => [
  1061. {
  1062. text: '删除',
  1063. onPress: () => {
  1064. this.deleteData(data.item);
  1065. },
  1066. style: {backgroundColor: 'red', color: 'white'},
  1067. },
  1068. ];
  1069. //删除产品信息
  1070. deleteData = (data) => {
  1071. let listData = this.state.listData;
  1072. let numberTotal = '';
  1073. if (data.XMSL === '') {
  1074. numberTotal = parseInt(this.state.productNumberTotal) - 1;
  1075. } else {
  1076. numberTotal =
  1077. parseInt(this.state.productNumberTotal) - parseInt(data.XMSL);
  1078. }
  1079. let taxRateTotal =
  1080. parseFloat(this.state.taxRateTotal) - parseFloat(data.SE);
  1081. let taxAmount =
  1082. parseFloat(this.state.taxAmount) - parseFloat(data.taxAmount);
  1083. let amountTotal =
  1084. parseFloat(this.state.amountTotal) - parseFloat(data.amount);
  1085. let productAmountTotal =
  1086. parseFloat(this.state.productAmountTotal) - parseFloat(data.XMJE);
  1087. const prevIndex = listData.findIndex((item) => item.key === data.SPBM);
  1088. listData.splice(prevIndex, 1);
  1089. this.setState({
  1090. listData: listData,
  1091. amountTotal: amountTotal,
  1092. taxRateTotal: taxRateTotal,
  1093. taxAmount: taxAmount,
  1094. productNumberTotal: numberTotal,
  1095. productAmountTotal: productAmountTotal,
  1096. });
  1097. };
  1098. // 字段隐藏切换
  1099. hideChange = () => {
  1100. this.setState({
  1101. hideStatus: !this.state.hideStatus,
  1102. hideStatusText: '收起',
  1103. });
  1104. };
  1105. // 获取选择企业信息
  1106. selectCustomer = (data) => {
  1107. this.setState({
  1108. customerName: data.customerName,
  1109. taxNumber: data.entTaxId,
  1110. contactNumber: data.contactPhone,
  1111. address: data.address,
  1112. bank: data.bankName,
  1113. bankAccount: data.bankAccount,
  1114. });
  1115. };
  1116. // 获取开票类型
  1117. getInvoiceCategory = (invoiceCategory) => {
  1118. if (invoiceCategory === '1') {
  1119. this.setState({
  1120. categoryBack: 'rgba(42,103,254, 1)',
  1121. categoryBackCompany: 'rgba(42,103,254, 0.07)',
  1122. categoryBackFont: '#ffffff',
  1123. categoryBackCompanyFont: '#2A67FE',
  1124. companyType: invoiceCategory,
  1125. });
  1126. } else {
  1127. this.setState({
  1128. categoryBack: 'rgba(42,103,254, 0.07)',
  1129. categoryBackCompany: 'rgba(42,103,254, 1)',
  1130. categoryBackFont: '#2A67FE',
  1131. categoryBackCompanyFont: '#ffffff',
  1132. companyType: invoiceCategory,
  1133. });
  1134. }
  1135. };
  1136. //获取发票类型
  1137. getInvoiceType = (invoiceType) => {
  1138. if (invoiceType === '1') {
  1139. this.setState({
  1140. typeBack: 'rgba(42,103,254, 1)',
  1141. typeBackMajor: 'rgba(42,103,254, 0.07)',
  1142. typeBackFont: '#ffffff',
  1143. typeBackMajorFont: '#2A67FE',
  1144. invoiceType: invoiceType,
  1145. });
  1146. } else {
  1147. this.setState({
  1148. typeBack: 'rgba(42,103,254, 0.07)',
  1149. typeBackMajor: 'rgba(42,103,254, 1)',
  1150. typeBackFont: '#2A67FE',
  1151. typeBackMajorFont: '#ffffff',
  1152. invoiceType: invoiceType,
  1153. });
  1154. }
  1155. };
  1156. //获取接收方式类型
  1157. getReceive = (type) => {
  1158. if (type === 1) {
  1159. this.setState({
  1160. receiveType: type,
  1161. receiveBack: 'rgba(42,103,254, 1)',
  1162. receiveBackFont: '#ffffff',
  1163. receiveBackCompany: 'rgba(42,103,254, 0.07)',
  1164. receiveBackCompanyFont: '#2A67FE',
  1165. receiveAddress: '',
  1166. });
  1167. } else {
  1168. this.setState({
  1169. receiveType: type,
  1170. receiveBack: 'rgba(42,103,254, 0.07)',
  1171. receiveBackFont: '#2A67FE',
  1172. receiveBackCompany: 'rgba(42,103,254, 1)',
  1173. receiveBackCompanyFont: '#ffffff',
  1174. receiveAddress: '',
  1175. });
  1176. }
  1177. };
  1178. // 处理网络请求数据
  1179. abnormalMessage = async (jason) => {
  1180. if (jason.code === 401) {
  1181. await Alert.alert(
  1182. '登录失效',
  1183. '登录状态已失效,请重新登录!',
  1184. [
  1185. {
  1186. text: '确定',
  1187. onPress: () => {
  1188. CleanAll();
  1189. this.props.navigation.popToTop();
  1190. },
  1191. },
  1192. ],
  1193. {cancelable: false},
  1194. );
  1195. }
  1196. if (jason.code === 403) {
  1197. Alert.alert(
  1198. '权限',
  1199. '暂无权限操作此模块!',
  1200. [
  1201. {
  1202. text: '确定',
  1203. onPress: () => {
  1204. this.props.navigation.goBack();
  1205. },
  1206. },
  1207. ],
  1208. {cancelable: false},
  1209. );
  1210. }
  1211. if (jason.code !== 401 && jason.code !== 403) {
  1212. ToastShow(1, jason.msg);
  1213. }
  1214. };
  1215. }
  1216. const styles = StyleSheet.create({
  1217. buttonView: {
  1218. alignItems: 'center',
  1219. backgroundColor: '#ffffff',
  1220. },
  1221. //通用按钮样式
  1222. button: {
  1223. marginTop: 5,
  1224. width: Dimensions.get('window').width * 0.8,
  1225. height: 34,
  1226. borderRadius: 10,
  1227. backgroundColor: '#1874CD',
  1228. justifyContent: 'center',
  1229. alignItems: 'center',
  1230. },
  1231. //通用按钮样式
  1232. buttonText: {
  1233. textAlign: 'center',
  1234. color: 'white',
  1235. },
  1236. inputView: {
  1237. padding: 5,
  1238. backgroundColor: '#fff',
  1239. alignItems: 'center',
  1240. justifyContent: 'center',
  1241. display: 'flex',
  1242. },
  1243. view: {
  1244. flexDirection: 'row',
  1245. height: 34,
  1246. width: Dimensions.get('window').width * 0.8,
  1247. },
  1248. //通用textInput样式
  1249. text: {
  1250. lineHeight: 34,
  1251. fontSize: 14,
  1252. },
  1253. //通用textInput样式
  1254. lineTopBottom: {
  1255. borderBottomWidth: 3 / PixelRatio.get(),
  1256. borderColor: 'rgb(208,208,208)',
  1257. },
  1258. textInputStyle: {
  1259. marginRight: 10,
  1260. marginLeft: 20,
  1261. fontSize: 14,
  1262. marginTop: 4,
  1263. },
  1264. });