invoiceApplyList.jsx 30 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039
  1. import React from "react";
  2. import $ from "jquery/src/ajax";
  3. import "./public.less";
  4. import {
  5. Form,
  6. Button,
  7. Input,
  8. Select,
  9. Spin,
  10. Table,
  11. message,
  12. Modal,
  13. Upload,
  14. Tabs
  15. } from "antd";
  16. import {
  17. getProjectStatus,
  18. getProvinceA,
  19. getInvoiceStatus,
  20. getprovince,
  21. getStatus,
  22. getPeople,
  23. splitUrl,
  24. ShowModal
  25. } from "@/tools";
  26. import { ChooseList } from "../../../../component/manageCenter/order/orderNew/chooseList";
  27. import ShowModalDiv from "@/showModal.jsx";
  28. import OrderDesc from "../orderDetail/orderDesc";
  29. const FormItem = Form.Item;
  30. const { TabPane } = Tabs
  31. const invoiceApplyList = React.createClass({
  32. departmentList() {
  33. this.setState({
  34. loading: true
  35. });
  36. $.ajax({
  37. method: "get",
  38. dataType: "json",
  39. crossDomain: false,
  40. url: globalConfig.context + "/api/admin/organization/selectSuperId",
  41. data: {},
  42. success: function (data) {
  43. let thedata = data.data;
  44. let theArr = [];
  45. if (!thedata) {
  46. if (data.error && data.error.length) {
  47. message.warning(data.error[0].message);
  48. }
  49. } else {
  50. thedata.map(function (item, index) {
  51. theArr.push({
  52. key: index,
  53. name: item.name,
  54. id: item.id
  55. });
  56. });
  57. }
  58. this.setState({
  59. departmentArr: theArr
  60. });
  61. }.bind(this)
  62. }).always(
  63. function () {
  64. this.setState({
  65. loading: false
  66. });
  67. }.bind(this)
  68. );
  69. },
  70. loadData(pageNo) {
  71. this.state.data = [];
  72. this.setState({
  73. loading: true
  74. });
  75. $.ajax({
  76. method: "get",
  77. dataType: "json",
  78. crossDomain: false,
  79. url:
  80. globalConfig.context +
  81. "/api/admin/orderInvoice/financeOrderInvoiceList",
  82. data: {
  83. pageNo: pageNo || 1,
  84. pageSize: this.state.pagination.pageSize,
  85. name: this.state.nameSearch, //客户名称
  86. orderNo: this.state.orderNoSearch,
  87. orderDep: this.state.departmenttList,
  88. status: this.state.statusSearch,
  89. type: 0,
  90. approval: this.state.processStatus
  91. },
  92. success: function (data) {
  93. ShowModal(this);
  94. let theArr = [];
  95. if (!data.data || !data.data.list) {
  96. if (data.error && data.error.length) {
  97. message.warning(data.error[0].message);
  98. }
  99. } else {
  100. for (let i = 0; i < data.data.list.length; i++) {
  101. let thisdata = data.data.list[i];
  102. theArr.push({
  103. key: i,
  104. id: thisdata.id,
  105. status: thisdata.status,
  106. unitName: thisdata.unitName,
  107. orderNo: thisdata.orderno,
  108. name: thisdata.name,
  109. processStatus: thisdata.processStatus,
  110. projectStatus: thisdata.projectStatus,
  111. amount: thisdata.amount,
  112. sumAmount: thisdata.sumAmount,
  113. createTime: thisdata.createTime
  114. ? new Date(thisdata.createTime).toLocaleString()
  115. : "",
  116. settlementAmount: thisdata.settlementAmount,
  117. notAmount: thisdata.notAmount
  118. });
  119. }
  120. }
  121. this.state.pagination.current = data.data.pageNo;
  122. this.state.pagination.total = data.data.totalCount;
  123. if (data.data && data.data.list && !data.data.list.length) {
  124. this.state.pagination.current = 0;
  125. this.state.pagination.total = 0;
  126. }
  127. this.setState({
  128. totalPage: data.data.totalPage,
  129. dataSource: theArr,
  130. pagination: this.state.pagination
  131. });
  132. }.bind(this)
  133. }).always(
  134. function () {
  135. this.setState({
  136. loading: false
  137. });
  138. }.bind(this)
  139. );
  140. },
  141. invoiceData() {
  142. this.setState({
  143. loading: true
  144. });
  145. $.ajax({
  146. method: "get",
  147. dataType: "json",
  148. crossDomain: false,
  149. url:
  150. globalConfig.context + "/api/admin/orderInvoice/selectByIdOrderInvoice",
  151. data: {
  152. id: this.state.id
  153. },
  154. success: function (data) {
  155. let thisdata = data.data;
  156. this.setState({
  157. contractNo: thisdata.contractNo,
  158. orderNo: thisdata.orderNo,
  159. approval: thisdata.approval,
  160. type: thisdata.type,
  161. status: thisdata.status,
  162. remarks: thisdata.remarks,
  163. invoiceType: thisdata.invoiceType,
  164. unitName: thisdata.unitName,
  165. taxNumber: thisdata.taxNumber,
  166. amount: thisdata.amount,
  167. banks: thisdata.banks,
  168. content: thisdata.content,
  169. unitAddress: thisdata.unitAddress,
  170. invoiceRemarks: thisdata.invoiceRemarks,
  171. unitMobile: thisdata.unitMobile,
  172. post: thisdata.post,
  173. addressee: thisdata.addressee,
  174. addresseeMobile: thisdata.addresseeMobile,
  175. addresseeProvince: thisdata.addresseeProvince,
  176. addresseeCity: thisdata.addresseeCity,
  177. addresseeArea: thisdata.addresseeArea,
  178. alreadyAmount: thisdata.alreadyAmount,
  179. recipientAddress: thisdata.recipientAddress,
  180. orgCodeUrl: thisdata.voucherUrl
  181. ? splitUrl(
  182. thisdata.voucherUrl,
  183. ",",
  184. globalConfig.avatarHost + "/upload"
  185. )
  186. : []
  187. });
  188. }.bind(this)
  189. }).done(
  190. function () {
  191. this.setState({
  192. loading: false
  193. });
  194. }.bind(this)
  195. );
  196. },
  197. getInitialState() {
  198. return {
  199. searchMore: true,
  200. assignVisible: false,
  201. releaseDate: [],
  202. totalPage: 0,
  203. boHuivisible: false,
  204. selectedRowKeys: [],
  205. // 子组件改变的表格title数组
  206. changeList: undefined,
  207. selectedRows: [],
  208. loading: false,
  209. reason: "",
  210. foo: 0,
  211. pagination: {
  212. defaultCurrent: 1,
  213. defaultPageSize: 10,
  214. showQuickJumper: true,
  215. pageSize: 10,
  216. onChange: function (page) {
  217. this.loadData(page);
  218. }.bind(this),
  219. showTotal: function (total) {
  220. return "共" + total + "条数据";
  221. }
  222. },
  223. columns: [
  224. {
  225. title: "编号",
  226. dataIndex: "id",
  227. key: "id"
  228. // fixed: "left"
  229. },
  230. {
  231. title: "客户",
  232. dataIndex: "unitName",
  233. key: "unitName"
  234. },
  235. {
  236. title: "跟单人/签单人",
  237. dataIndex: "name",
  238. key: "name"
  239. },
  240. {
  241. title: "开票状态",
  242. dataIndex: "status",
  243. key: "status",
  244. render: text => {
  245. return getStatus(text);
  246. }
  247. },
  248. {
  249. title: "流程状态",
  250. dataIndex: "processStatus",
  251. key: "processStatus",
  252. render: text => {
  253. return getPeople(text);
  254. }
  255. },
  256. {
  257. title: "项目状态",
  258. dataIndex: "projectStatus",
  259. key: "projectStatus",
  260. render: text => {
  261. return getProjectStatus(text);
  262. }
  263. },
  264. {
  265. title: "申请开票(万)",
  266. dataIndex: "amount",
  267. key: "amount"
  268. },
  269. {
  270. title: "已开票(万)",
  271. dataIndex: "sumAmount",
  272. key: "sumAmount"
  273. },
  274. {
  275. title: "已收款",
  276. dataIndex: "settlementAmount",
  277. key: "settlementAmount"
  278. },
  279. {
  280. title: "未收款",
  281. dataIndex: "notAmount",
  282. key: "notAmount"
  283. },
  284. {
  285. title: "申请时间",
  286. dataIndex: "createTime",
  287. key: "createTime"
  288. },
  289. {
  290. title: "操作",
  291. dataIndex: "caozuo",
  292. key: "caouzo",
  293. render: (text, record, index) => {
  294. return (
  295. <div>
  296. {
  297. <Button
  298. type="primary"
  299. onClick={e => {
  300. e.stopPropagation(), this.visit(index);
  301. }}
  302. style={{ background: "deepskyblue", border: "none" }}
  303. >
  304. 申请内容
  305. </Button>
  306. }
  307. {record.status !== 2 ? (
  308. <Button
  309. type="primary"
  310. style={{ marginLeft: "10px" }}
  311. onClick={e => {
  312. e.stopPropagation(),
  313. this.setState({ examine: 2 }, () => {
  314. this.sende(record);
  315. });
  316. }}
  317. >
  318. 通过
  319. </Button>
  320. ) : (
  321. ""
  322. )}
  323. {record.status !== 2 ? (
  324. <Button
  325. type="danger"
  326. onClick={e => {
  327. e.stopPropagation(),
  328. this.setState({ examine: 3 }, () => {
  329. this.reject(record);
  330. });
  331. }}
  332. style={{ marginLeft: "10px" }}
  333. >
  334. 拒绝
  335. </Button>
  336. ) : (
  337. ""
  338. )}
  339. {record.status === 2 ? (
  340. <Button
  341. style={{ marginLeft: "10px", color: "black" }}
  342. disabled={true}
  343. >
  344. 已通过
  345. </Button>
  346. ) : (
  347. ""
  348. )}
  349. {
  350. <Button
  351. type="primary"
  352. style={{
  353. marginLeft: "10px",
  354. background: "orangered",
  355. border: "none"
  356. }}
  357. onClick={e => {
  358. e.stopPropagation(), this.inRecord(record, index);
  359. }}
  360. >
  361. 开票记录
  362. </Button>
  363. }
  364. </div>
  365. );
  366. }
  367. }
  368. ],
  369. columnsDate: [
  370. {
  371. title: "编号",
  372. dataIndex: "id",
  373. key: "id"
  374. },
  375. {
  376. title: "订单编号",
  377. dataIndex: "orderno",
  378. key: "orderno"
  379. },
  380. {
  381. title: "开票金额(万元)",
  382. dataIndex: "amount",
  383. key: "amount"
  384. },
  385. {
  386. title: "申请时间",
  387. dataIndex: "createTime",
  388. key: "createTime"
  389. },
  390. {
  391. title: "开票状态",
  392. dataIndex: "status",
  393. key: "status",
  394. render: text => {
  395. return getInvoiceStatus(text);
  396. }
  397. }
  398. ],
  399. dataSource: [],
  400. searchTime: [,]
  401. };
  402. },
  403. loadSend(record) {
  404. this.setState({
  405. loading: true
  406. });
  407. if (this.state.examine === 3 && this.state.reason === "") {
  408. message.warning("拒绝理由不能为空!");
  409. return;
  410. }
  411. $.ajax({
  412. method: "post",
  413. dataType: "json",
  414. crossDomain: false,
  415. url: globalConfig.context + "/api/admin/orderInvoice/financeExamine",
  416. data: {
  417. id: this.state.examine === 2 ? record.id : this.state.id,
  418. examine: this.state.examine,
  419. reason: this.state.reason
  420. },
  421. success: function () { }.bind(this)
  422. }).done(
  423. function () {
  424. this.setState({
  425. loading: false
  426. });
  427. if (this.state.examine === 2) {
  428. message.success("通过成功!");
  429. this.loadData();
  430. } else {
  431. message.success("拒绝成功!");
  432. this.resetReason();
  433. this.rejectCancels();
  434. this.loadData();
  435. }
  436. }.bind(this)
  437. );
  438. },
  439. //重置拒绝理由
  440. resetReason() {
  441. this.setState({
  442. reason: ""
  443. });
  444. },
  445. sende(record) {
  446. this.loadSend(record);
  447. },
  448. commit() {
  449. this.loadSend();
  450. this.setState({
  451. avisible: false
  452. });
  453. },
  454. visit(index) {
  455. this.setState(
  456. {
  457. id: this.state.dataSource[index].id,
  458. avisible: true
  459. },
  460. () => {
  461. this.invoiceData();
  462. }
  463. );
  464. },
  465. visitCancels() {
  466. this.setState({
  467. avisible: false
  468. });
  469. },
  470. reject(record) {
  471. this.setState({
  472. visibleR: true,
  473. id: record.id
  474. });
  475. },
  476. rejectCancels() {
  477. this.setState({
  478. visibleR: false
  479. });
  480. },
  481. inRecordData() {
  482. this.setState({
  483. loading: true
  484. });
  485. $.ajax({
  486. method: "get",
  487. dataType: "json",
  488. crossDomain: false,
  489. url:
  490. globalConfig.context +
  491. "/api/admin/orderInvoice/salesmanOrderInvoiceList",
  492. data: {
  493. orderNo: this.state.orderNo2
  494. },
  495. success: function (data) {
  496. let theArr = [];
  497. let sum = 0;
  498. if (!data.data) {
  499. if (data.error && data.error.length) {
  500. message.warning(data.error[0].message);
  501. }
  502. } else {
  503. for (let i = 0; i < data.data.list.length; i++) {
  504. let thisdata = data.data.list[i];
  505. sum += parseFloat(thisdata.amount);
  506. theArr.push({
  507. id: thisdata.id,
  508. orderno: thisdata.orderno, //订单编号
  509. amount: thisdata.amount, //签单金额
  510. createTime: thisdata.createTime, //流程状态
  511. status: thisdata.status, //结算状态
  512. rejectReason: thisdata.rejectReason
  513. });
  514. }
  515. }
  516. this.setState({
  517. recordData: theArr,
  518. sum: sum.toFixed(4)
  519. });
  520. }.bind(this)
  521. }).done(
  522. function () {
  523. this.setState({
  524. loading: false
  525. });
  526. }.bind(this)
  527. );
  528. },
  529. inRecord(record) {
  530. this.setState(
  531. {
  532. bvisible: true,
  533. orderNo2: record.orderNo
  534. },
  535. () => {
  536. this.inRecordData();
  537. }
  538. );
  539. },
  540. inRecordCanl() {
  541. this.setState({
  542. bvisible: false
  543. });
  544. },
  545. search() {
  546. this.loadData();
  547. },
  548. componentWillMount() {
  549. this.departmentList();
  550. this.loadData();
  551. },
  552. reset() {
  553. this.state.nameSearch = "";
  554. this.state.releaseDate = [];
  555. this.state.orderNoSearch = "";
  556. this.state.processStatus = [];
  557. this.state.departmenttList = [];
  558. this.state.statusSearch = [];
  559. this.loadData();
  560. },
  561. changeList(arr) {
  562. const newArr = [];
  563. this.state.columns.forEach(item => {
  564. arr.forEach(val => {
  565. if (val === item.title) {
  566. newArr.push(item);
  567. }
  568. });
  569. });
  570. this.setState({
  571. changeList: newArr
  572. });
  573. },
  574. tableRowClick(record) {
  575. console.log(record);
  576. this.state.RowData = record;
  577. this.setState({
  578. showDesc: true
  579. });
  580. },
  581. closeDesc(e, s) {
  582. this.state.showDesc = e;
  583. if (s) {
  584. this.loadData(this.state.page);
  585. }
  586. },
  587. render() {
  588. const formItemLayout = {
  589. labelCol: { span: 8 },
  590. wrapperCol: { span: 14 }
  591. };
  592. var departmentArr = this.state.departmentArr || [];
  593. return (
  594. <div className="user-content">
  595. <ShowModalDiv ShowModal={this.state.showModal} />
  596. <div className="content-title" style={{ marginBottom: 10 }}>
  597. <span style={{ fontWeight: 900, fontSize: 16 }}>省内开票审核</span>
  598. </div>
  599. <Tabs
  600. defaultActiveKey="1"
  601. onChange={this.callback}
  602. className="test">
  603. <TabPane tab="搜索" key="1">
  604. <div className="user-search">
  605. <Input
  606. placeholder="营销员名称"
  607. value={this.state.nameSearch}
  608. style={{ marginLeft: 10 }}
  609. onChange={e => {
  610. this.setState({ nameSearch: e.target.value });
  611. }}
  612. />
  613. <Input
  614. placeholder="订单编号"
  615. value={this.state.orderNoSearch}
  616. onChange={e => {
  617. this.setState({ orderNoSearch: e.target.value });
  618. }}
  619. />
  620. <Select
  621. placeholder="订单部门"
  622. style={{ width: 150, marginRight: 10 }}
  623. value={this.state.departmenttList}
  624. onChange={e => {
  625. this.setState({ departmenttList: e });
  626. }}
  627. >
  628. {departmentArr.map(function (item) {
  629. return <Select.Option key={item.id}>{item.name}</Select.Option>;
  630. })}
  631. </Select>
  632. <Button
  633. type="primary"
  634. onClick={this.search}
  635. style={{ marginLeft: 10 }}
  636. >
  637. 搜索
  638. </Button>
  639. <Button onClick={this.reset}>重置</Button>
  640. </div>
  641. </TabPane>
  642. <TabPane tab="更改表格数据" key="2">
  643. <div style={{ marginTop: 10, marginLeft: 10 }}>
  644. <ChooseList
  645. columns={this.state.columns}
  646. changeFn={this.changeList}
  647. changeList={this.state.changeList}
  648. top={55}
  649. />
  650. </div>
  651. </TabPane>
  652. </Tabs>
  653. <div className="patent-table">
  654. <Spin spinning={this.state.loading}>
  655. <Table
  656. columns={
  657. this.state.changeList == undefined
  658. ? this.state.columns
  659. : this.state.changeList
  660. }
  661. scroll={{ x: 1500, y: 0 }}
  662. onRowClick={this.tableRowClick}
  663. dataSource={this.state.dataSource}
  664. pagination={this.state.pagination}
  665. bordered
  666. size="small"
  667. />
  668. </Spin>
  669. </div>
  670. <Modal
  671. visible={this.state.visibleR}
  672. className="admin-desc-content"
  673. footer=""
  674. title="拒绝理由"
  675. width="400px"
  676. onCancel={this.rejectCancels}
  677. >
  678. <Input.TextArea
  679. placeholder="请输入拒绝理由"
  680. rows={4}
  681. value={this.state.reason}
  682. onChange={e => {
  683. this.setState({ reason: e.target.value });
  684. }}
  685. ></Input.TextArea>
  686. <div className="clearfix" style={{ marginTop: "20px" }}>
  687. <Button
  688. type="primary"
  689. onClick={e => {
  690. e.stopPropagation(), this.commit();
  691. }}
  692. style={{ float: "right" }}
  693. >
  694. 提交
  695. </Button>
  696. </div>
  697. </Modal>
  698. <Modal
  699. className="admin-desc-content"
  700. footer=""
  701. title="开具发票申请单"
  702. width="900px"
  703. visible={this.state.avisible}
  704. onOk={this.visitOks}
  705. onCancel={this.visitCancels}
  706. >
  707. <Form
  708. layout="horizontal"
  709. id="demand-form"
  710. style={{ paddingBottom: "40px" }}
  711. >
  712. <Spin spinning={this.state.loading}>
  713. <div className="clearfix">
  714. <div className="clearfix">
  715. <FormItem
  716. className="half-item"
  717. {...formItemLayout}
  718. label="合同编号"
  719. >
  720. <span>{this.state.contractNo}</span>
  721. </FormItem>
  722. <FormItem
  723. className="half-item"
  724. {...formItemLayout}
  725. label="备注"
  726. >
  727. <span>{this.state.remarks}</span>
  728. </FormItem>
  729. </div>
  730. <div className="clearfix">
  731. <FormItem
  732. className="half-item"
  733. {...formItemLayout}
  734. label={
  735. <span>
  736. <strong style={{ color: "#f00" }}>*</strong>省内/外
  737. </span>
  738. }
  739. >
  740. <span>{getProvinceA(this.state.type)}</span>
  741. </FormItem>
  742. <FormItem
  743. className="half-item"
  744. {...formItemLayout}
  745. label={
  746. <span>
  747. <strong style={{ color: "#f00" }}>*</strong>特批
  748. </span>
  749. }
  750. >
  751. <span>{this.state.approval === 0 ? "否" : "是"}</span>
  752. </FormItem>
  753. </div>
  754. <hr
  755. style={{
  756. border: "1px dashed #aaa",
  757. width: "90%",
  758. margin: "auto"
  759. }}
  760. />
  761. <div style={{ marginTop: "13px", marginLeft: "16px" }}>
  762. <span style={{ fontSize: "14px" }}>发票内容</span>
  763. </div>
  764. <div className="clearfix">
  765. <FormItem
  766. className="half-item"
  767. {...formItemLayout}
  768. label={
  769. <span>
  770. <strong style={{ color: "#f00" }}>*</strong>发票类型
  771. </span>
  772. }
  773. >
  774. <span>
  775. {this.state.invoiceType === 0
  776. ? "增值税专用发票"
  777. : this.state.invoiceType === 1
  778. ? "增值税普通发票"
  779. : "其他"}
  780. </span>
  781. </FormItem>
  782. </div>
  783. <div className="clearfix">
  784. <FormItem
  785. className="half-item"
  786. {...formItemLayout}
  787. label={
  788. <span>
  789. <strong style={{ color: "#f00" }}>*</strong>单位名称
  790. </span>
  791. }
  792. >
  793. <span>{this.state.unitName}</span>
  794. </FormItem>
  795. <FormItem
  796. className="half-item"
  797. {...formItemLayout}
  798. label={
  799. <span>
  800. <strong style={{ color: "#f00" }}>*</strong>税号
  801. </span>
  802. }
  803. >
  804. <span>{this.state.taxNumber}</span>
  805. </FormItem>
  806. <FormItem
  807. className="half-item"
  808. {...formItemLayout}
  809. label={
  810. <span>
  811. <strong style={{ color: "#f00" }}>*</strong>
  812. 开票金额(万元)
  813. </span>
  814. }
  815. >
  816. <span>{this.state.amount}</span>
  817. </FormItem>
  818. <FormItem
  819. className="half-item"
  820. {...formItemLayout}
  821. label={
  822. <span>
  823. <strong style={{ color: "#f00" }}>*</strong>
  824. 开户行银行账号
  825. </span>
  826. }
  827. >
  828. <span>{this.state.banks}</span>
  829. </FormItem>
  830. <FormItem
  831. className="half-item"
  832. {...formItemLayout}
  833. label={
  834. <span>
  835. <strong style={{ color: "#f00" }}>*</strong>
  836. 开票内容及说明
  837. </span>
  838. }
  839. >
  840. <span>{this.state.content}</span>
  841. </FormItem>
  842. <FormItem
  843. className="half-item"
  844. {...formItemLayout}
  845. label={
  846. <span>
  847. <strong style={{ color: "#f00" }}>*</strong>单位地址
  848. </span>
  849. }
  850. >
  851. <span>{this.state.unitAddress}</span>
  852. </FormItem>
  853. <FormItem
  854. className="half-item"
  855. {...formItemLayout}
  856. label="备注"
  857. >
  858. <span>{this.state.invoiceRemarks}</span>
  859. </FormItem>
  860. <FormItem
  861. className="half-item"
  862. {...formItemLayout}
  863. label={
  864. <span>
  865. <strong style={{ color: "#f00" }}>*</strong>单位电话
  866. </span>
  867. }
  868. >
  869. <span>{this.state.unitMobile}</span>
  870. </FormItem>
  871. </div>
  872. <div className="clearfix">
  873. <FormItem
  874. labelCol={{ span: 4 }}
  875. wrapperCol={{ span: 18 }}
  876. label={
  877. <span>
  878. <strong style={{ color: "#f00" }}>*</strong>附件
  879. </span>
  880. }
  881. >
  882. <Upload
  883. className="demandDetailShow-upload"
  884. listType="picture-card"
  885. fileList={this.state.orgCodeUrl}
  886. onPreview={file => {
  887. this.setState({
  888. previewImage: file.url || file.thumbUrl,
  889. previewVisible: true
  890. });
  891. }}
  892. ></Upload>
  893. <Modal
  894. maskClosable={false}
  895. footer={null}
  896. visible={this.state.previewVisible}
  897. onCancel={() => {
  898. this.setState({ previewVisible: false });
  899. }}
  900. >
  901. <img
  902. alt=""
  903. style={{ width: "100%" }}
  904. src={this.state.previewImage || ""}
  905. />
  906. </Modal>
  907. </FormItem>
  908. </div>
  909. <hr
  910. style={{
  911. border: "1px dashed #aaa",
  912. width: "90%",
  913. margin: "auto"
  914. }}
  915. />
  916. <div className="clearfix" style={{ marginTop: "10px" }}>
  917. <FormItem
  918. className="half-item"
  919. {...formItemLayout}
  920. label="发票是否邮寄:"
  921. >
  922. <span>{this.state.post === 0 ? "是" : "否"}</span>
  923. </FormItem>
  924. </div>
  925. {this.state.post === 0 ? (
  926. <div>
  927. <div className="clearfix">
  928. <FormItem
  929. className="half-item"
  930. {...formItemLayout}
  931. label="收信人姓名"
  932. >
  933. <span>{this.state.addressee}</span>
  934. </FormItem>
  935. <FormItem
  936. className="half-item"
  937. {...formItemLayout}
  938. label="电话"
  939. >
  940. <span>{this.state.addresseeMobile}</span>
  941. </FormItem>
  942. </div>
  943. <div className="clearfix">
  944. <FormItem
  945. className="half-item"
  946. {...formItemLayout}
  947. label="省-市-区"
  948. >
  949. <span>
  950. {getprovince(this.state.addresseeProvince)}/
  951. {getprovince(this.state.addresseeCity)}/
  952. {getprovince(this.state.addresseeArea)}
  953. </span>
  954. </FormItem>
  955. </div>
  956. <div className="clearfix">
  957. <FormItem
  958. className="half-item"
  959. {...formItemLayout}
  960. label="详细地址"
  961. >
  962. <span>{this.state.recipientAddress}</span>
  963. </FormItem>
  964. </div>
  965. </div>
  966. ) : (
  967. ""
  968. )}
  969. <FormItem
  970. className="half-item"
  971. {...formItemLayout}
  972. label={
  973. <span>
  974. <strong style={{ color: "#f00" }}>*</strong>开票金额总计
  975. </span>
  976. }
  977. >
  978. <span>{this.state.alreadyAmount}万元</span>
  979. </FormItem>
  980. </div>
  981. </Spin>
  982. </Form>
  983. </Modal>
  984. <Modal
  985. visible={this.state.bvisible}
  986. footer=""
  987. title="开票历史记录"
  988. className="admin-desc-content"
  989. width="900px"
  990. onCancel={this.inRecordCanl}
  991. >
  992. <Spin spinning={this.state.loading}>
  993. <div className="patent-table">
  994. <Table
  995. columns={this.state.columnsDate}
  996. dataSource={this.state.recordData}
  997. pagination={false}
  998. bordered
  999. size="small"
  1000. />
  1001. <div className="clearfix" style={{ marginTop: "20px" }}>
  1002. <FormItem
  1003. className="half-item"
  1004. {...formItemLayout}
  1005. label={<span style={{ fontSize: "14px" }}>开票总计</span>}
  1006. >
  1007. <span>{this.state.sum + "(万元)"}</span>
  1008. </FormItem>
  1009. </div>
  1010. </div>
  1011. </Spin>
  1012. </Modal>
  1013. <OrderDesc
  1014. data={this.state.RowData}
  1015. showDesc={this.state.showDesc}
  1016. closeDesc={this.closeDesc.bind(this)}
  1017. />
  1018. </div>
  1019. );
  1020. }
  1021. });
  1022. export default invoiceApplyList;