myprojectvip.jsx 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885
  1. import React from "react";
  2. import $ from "jquery/src/ajax";
  3. import { AutoComplete, Button, Input, Spin, Table, Select, message, Tabs, Tag, Tooltip, Modal } from "antd";
  4. import OrderDesc from "../../financialManage/orderDetail/orderDesc"
  5. import ResolutionDetail from "@/resolutionDetail";
  6. import { ChooseList } from "../../order/orderNew/chooseList"
  7. import ReactToPrint from "react-to-print";
  8. import OrderItemStatus from "../../../common/orderItemStatus";
  9. import { salesList } from "@/dataDic.js";
  10. import ProjectOperationVip from ".././../../common/projectOperation/vip";
  11. import ShowModalDiv from "@/showModal.jsx";
  12. import VipLogs from "../../../common/logPopup/viplogs";//会员日志
  13. import { splitUrl } from "@/tools";
  14. import ImgList from "../../../common/imgList";
  15. import Cascaders from "../../../common/cascaders";
  16. const { TabPane } = Tabs;
  17. //我的会员项目列表
  18. const MyProjectVip = React.createClass({
  19. //
  20. getInitialState() {
  21. return {
  22. dvisible: false,
  23. pageNo: 1,
  24. totalPage: 0,
  25. searchValues: {},//查询条件
  26. loading: false,
  27. changeList: undefined,// 子组件改变的表格title数组
  28. pagination: {
  29. defaultCurrent: 1,
  30. defaultPageSize: 10,
  31. showQuickJumper: true,
  32. pageSize: 10,
  33. onChange: function (page) {
  34. this.setState({
  35. pageNo: page,
  36. });
  37. this.loadData(page);
  38. }.bind(this),
  39. showTotal: function (total) {
  40. return "共" + total + "条数据";
  41. },
  42. },
  43. columns: [
  44. {
  45. title: "销售类型",
  46. dataIndex: "salesType",
  47. key: "salesType",
  48. render: (text, record) => {
  49. return (
  50. <Tooltip
  51. title={salesList[text] + ((text == 3 || text == 4 || text == 5) ? (!record.other ? "" : "," + record.other) : "")}
  52. >
  53. <span>
  54. {salesList[text]}
  55. </span>
  56. </Tooltip>
  57. );
  58. },
  59. },
  60. {
  61. title: "合同编号",
  62. dataIndex: "contractNo",
  63. key: "contractNo",
  64. width: 160,
  65. render: (text, record) => {
  66. return (
  67. <Tooltip
  68. title={
  69. <Button
  70. type="primary"
  71. onClick={(e) => {
  72. e.stopPropagation();
  73. let input = document.getElementById("copyText");
  74. input.value = text;
  75. input.select();
  76. document.execCommand("copy");
  77. message.success("复制成功");
  78. }}
  79. >
  80. 复制
  81. </Button>
  82. }
  83. >
  84. <div>
  85. {text}
  86. <div style={{ display: "flex" }}>
  87. <OrderItemStatus deleteSign={record.deleteSign} />
  88. {
  89. record.approval == 1
  90. ? <Tag color="#faa755">特批待审</Tag> :
  91. record.approval == 2 && <Tag color="#ff0000">特批通过</Tag>
  92. }
  93. </div>
  94. </div>
  95. </Tooltip>
  96. );
  97. },
  98. },
  99. {
  100. title: "客户名称",
  101. dataIndex: "userName",
  102. key: "userName",
  103. width: 160,
  104. render: text => {
  105. return (
  106. <Tooltip title={text}>
  107. <div>{text}</div>
  108. </Tooltip>
  109. )
  110. }
  111. },
  112. {
  113. title: "订单编号",
  114. dataIndex: "orderNo",
  115. key: "orderNo",
  116. width: 140,
  117. render: (text, record) => {
  118. return (
  119. <Tooltip
  120. title={
  121. <Button
  122. type="primary"
  123. onClick={(e) => {
  124. e.stopPropagation();
  125. let input = document.getElementById("copyText");
  126. input.value = text;
  127. input.select();
  128. document.execCommand("copy");
  129. message.success("复制成功");
  130. }}
  131. >
  132. 复制
  133. </Button>
  134. }
  135. >
  136. <div>
  137. {text}
  138. <div>
  139. {record.totalAmount >= 10 && <Tag color="#ef7207">大客户</Tag>}
  140. {record.projectType == 1 && <Tag color="rgb(22, 155, 213)">会员</Tag>}
  141. </div>
  142. </div>
  143. </Tooltip>
  144. );
  145. },
  146. },
  147. {
  148. title: "订单部门",
  149. dataIndex: "depName",
  150. key: "depName",
  151. },
  152. {
  153. title: "订单负责人",
  154. dataIndex: "salesmanName",
  155. key: "salesmanName",
  156. },
  157. {
  158. title: "财务负责人",
  159. dataIndex: "financeName",
  160. key: "financeName",
  161. },
  162. {
  163. title: "会员项目",
  164. dataIndex: "projectName",
  165. key: "projectName",
  166. render: (text, record) => {
  167. return (
  168. <div>
  169. {text}
  170. {(record.memberType == 1 || record.memberType == 2) && <Tag color="#ff0000">特批项目</Tag>}
  171. </div>
  172. )
  173. }
  174. },
  175. {
  176. title: "数量",
  177. dataIndex: "commodityQuantity",
  178. key: "commodityQuantity",
  179. },
  180. {
  181. title: "总年限",
  182. dataIndex: "yearSum",
  183. key: "yearSum",
  184. render: (text, record) => {
  185. return (
  186. <div>{["", "一年", "二年", "三年", "四年", "五年"][text]}</div>
  187. );
  188. }
  189. },
  190. {
  191. title: "年限",
  192. dataIndex: "serviceLife",
  193. key: "serviceLife",
  194. width: 60,
  195. render: (text, record) => {
  196. return (
  197. <div>{!!text && JSON.parse(text).toString()}</div>
  198. );
  199. }
  200. },
  201. {
  202. title: "本次派单",
  203. dataIndex: "serviceYear",
  204. key: "serviceYear",
  205. render: (text, record) => {
  206. return (
  207. <div>{!text ? "" : text}</div>
  208. );
  209. }
  210. },
  211. {
  212. title: "项目说明",
  213. dataIndex: "taskComment",
  214. key: "taskComment",
  215. render: (text, record) => {
  216. return (
  217. <div style={{ maxWidth: 220 }}>{text}</div>
  218. );
  219. }
  220. },
  221. {
  222. title: "状态",
  223. dataIndex: "status",
  224. key: "status", render: (text) => {
  225. return (
  226. <div style={{ maxWidth: 115, color: text == 4 && "red" }}>
  227. {["", "财务审核", "特批审核", "通过", "驳回"][text]}
  228. </div>
  229. );
  230. }
  231. },
  232. {
  233. title: "操作",
  234. dataIndex: "pictureUrl",
  235. key: "pictureUrl",
  236. width: 110,
  237. render: (text, recard) => {
  238. return (
  239. <div>
  240. {
  241. recard.status == 4 &&
  242. <Button
  243. style={{ margin: 5 }}
  244. type="primary"
  245. onClick={() => {
  246. this.setState({
  247. vipVisible: true,
  248. dataInfor: recard,
  249. })
  250. }}
  251. >
  252. 重新提交
  253. </Button>
  254. }
  255. <Button
  256. type="primary"
  257. style={{ margin: 5 }}
  258. onClick={(e) => {
  259. e.stopPropagation();
  260. let arr = text || [];
  261. this.setState({
  262. pictureUrlArr: splitUrl(arr, ",", globalConfig.avatarHost + "/upload"),
  263. }, () => {
  264. this.setState({
  265. imgListVisible: true,
  266. })
  267. })
  268. }}
  269. >
  270. 查看附件
  271. </Button>
  272. <VipLogs id={recard.id} />
  273. </div>
  274. );
  275. },
  276. },
  277. ],
  278. dataSource: [],
  279. fjlist: [],// 营销员列表
  280. checkOrderNo: "",//操作订单编号
  281. checkData: "",//操作描述
  282. checkVisible: "",//审核弹窗开关
  283. checkId: "",//会员项目编号
  284. result: -1,//1同意 0驳回
  285. vipVisible: false,//编辑弹窗
  286. dataInfor: {},//编辑的数据
  287. imgListVisible: false,//附件弹窗
  288. pictureUrlArr: [],//附件
  289. };
  290. },
  291. componentWillMount() {
  292. this.loadData();
  293. // this.departmentList();
  294. },
  295. // 关闭编辑弹窗
  296. vipClose() {
  297. this.setState({
  298. vipVisible: false
  299. }, () => {
  300. this.loadData(this.state.pageNo);
  301. })
  302. },
  303. // 获取订单部门
  304. departmentList() {
  305. $.ajax({
  306. method: "get",
  307. dataType: "json",
  308. crossDomain: false,
  309. url: globalConfig.context + "/api/admin/organization/selectSuperId",
  310. data: {},
  311. success: function (data) {
  312. let thedata = data.data;
  313. let theArr = [];
  314. if (!thedata) {
  315. if (data.error && data.error.length) {
  316. message.warning(data.error[0].message);
  317. }
  318. } else {
  319. thedata.map(function (item, index) {
  320. theArr.push({
  321. key: index,
  322. name: item.name,
  323. id: item.id,
  324. });
  325. });
  326. }
  327. this.setState({
  328. departmentArr: theArr,
  329. });
  330. }.bind(this),
  331. }).always(
  332. function () {
  333. }.bind(this)
  334. );
  335. },
  336. // 列表数据
  337. loadData(pageNo, pageSize) {
  338. const { searchValues, pagination } = this.state
  339. this.setState({
  340. loading: true,
  341. });
  342. let datas = Object.assign(searchValues, {
  343. pageNo: pageNo || 1,
  344. pageSize: pageSize || 10,
  345. shiroType: 1, //营销员
  346. });
  347. $.ajax({
  348. method: "get",
  349. dataType: "json",
  350. crossDomain: false,
  351. url: globalConfig.context + "/api/admin/orderProject/memberList",
  352. data: datas,
  353. success: function (data) {
  354. this.setState({
  355. loading: false,
  356. });
  357. if (data.error && data.error.length === 0) {
  358. if (data.data.list) {
  359. pagination.current = data.data.pageNo;
  360. pagination.total = data.data.totalCount;
  361. if (data.data && data.data.list && !data.data.list.length) {
  362. pagination.current = 0;
  363. pagination.total = 0;
  364. }
  365. this.setState({
  366. dataSource: data.data.list,
  367. pagination: this.state.pagination,
  368. pageNo: data.data.pageNo,
  369. totalPage: data.data.totalPage,
  370. });
  371. } else {
  372. this.setState({
  373. dataSource: data.data,
  374. pagination: false,
  375. });
  376. }
  377. } else {
  378. message.warning(data.error[0].message);
  379. }
  380. }.bind(this),
  381. }).always(
  382. function () {
  383. this.setState({
  384. loading: false,
  385. });
  386. }.bind(this)
  387. );
  388. },
  389. // 点击行
  390. tableRowClick(record) {
  391. this.state.RowData = record;
  392. this.setState({
  393. showDesc: true,
  394. });
  395. },
  396. // 关闭
  397. closeDesc(e, s) {
  398. this.state.showDesc = e;
  399. if (s) {
  400. this.loadData(this.state.pageNo);
  401. }
  402. },
  403. // 搜索
  404. search() {
  405. this.setState({
  406. selectedRowKeys: []
  407. })
  408. this.loadData();
  409. },
  410. // 重置
  411. reset() {
  412. this.setState({
  413. searchValues: JSON.parse(JSON.stringify({})),
  414. }, () => {
  415. this.Cascaders.empty();
  416. this.loadData();
  417. })
  418. },
  419. // 更改表格显示数据
  420. changeList(arr) {
  421. const newArr = [];
  422. this.state.columns.forEach((item) => {
  423. arr.forEach((val) => {
  424. if (val === item.title) {
  425. newArr.push(item);
  426. }
  427. });
  428. });
  429. this.setState({
  430. changeList: newArr,
  431. });
  432. },
  433. // 导出当前列表
  434. exportAll() {
  435. message.config({
  436. duration: 20,
  437. });
  438. let loading = message.loading("下载中...");
  439. this.setState({
  440. exportPendingLoading: true,
  441. });
  442. let data = {
  443. shiroType: 1, //我的
  444. };
  445. let obj1 = JSON.parse(JSON.stringify(this.state.searchValues));
  446. data = Object.assign(data, obj1);
  447. $.ajax({
  448. method: "get",
  449. dataType: "json",
  450. crossDomain: false,
  451. url: "/api/admin/orderProject/memberList/export",
  452. data,
  453. success: function (data) {
  454. if (data.error.length === 0) {
  455. this.download(data.data);
  456. } else {
  457. message.warning(data.error[0].message);
  458. }
  459. }.bind(this),
  460. }).always(
  461. function () {
  462. loading();
  463. this.setState({
  464. exportPendingLoading: false,
  465. });
  466. }.bind(this)
  467. );
  468. },
  469. // 打印
  470. printAll() {
  471. this.setState({
  472. dvisible: true,
  473. });
  474. this.loadData(1, 9999999);
  475. },
  476. // 下载
  477. download(fileName) {
  478. window.location.href =
  479. globalConfig.context + "/open/download?fileName=" + fileName;
  480. },
  481. // 查询订单负责人列表
  482. followUp(e) {
  483. const { searchValues } = this.state;
  484. this.setState({
  485. searchValues: Object.assign(searchValues, {
  486. aname: e,
  487. }),
  488. });
  489. $.ajax({
  490. method: "get",
  491. dataType: "json",
  492. crossDomain: false,
  493. url: globalConfig.context + "/api/admin/customer/listAdminByName",
  494. data: {
  495. adminName: e,
  496. },
  497. success: function (data) {
  498. let thedata = data.data;
  499. if (!thedata) {
  500. if (data.error && data.error.length) {
  501. message.warning(data.error[0].message);
  502. }
  503. thedata = {};
  504. }
  505. this.setState({
  506. fjlist: thedata,
  507. });
  508. }.bind(this),
  509. }).always(
  510. function () {
  511. this.setState({
  512. loading: false,
  513. });
  514. }.bind(this)
  515. );
  516. },
  517. // 选中订单负责人
  518. selectF(value) {
  519. const { searchValues, fjlist } = this.state;
  520. const newdataSources = JSON.stringify(fjlist) == "{}" ? [] : fjlist;
  521. this.setState({
  522. searchValues: Object.assign(searchValues, {
  523. salesmanId: newdataSources.find((item) => item.name == value).id,
  524. }),
  525. });
  526. },
  527. // 失去焦点
  528. blurChange(e) {
  529. let theType = "";
  530. let contactLists = this.state.customerArr || [];
  531. if (e) {
  532. contactLists.map(function (item) {
  533. if (item.name == e.toString()) {
  534. theType = item.id;
  535. }
  536. });
  537. }
  538. this.setState({
  539. theTypes: theType,
  540. });
  541. },
  542. // 删除数组最后一项(删除操作列)
  543. truncate(arr) {
  544. return arr.filter(function (v, i, ar) {
  545. return i !== ar.length - 1
  546. })
  547. },
  548. render() {
  549. const { TextArea } = Input
  550. const { searchValues, departmentArr = [] } = this.state
  551. const dataSources = this.state.fjlist || [];
  552. const options = dataSources.map((group) => (
  553. <Select.Option key={group.id} value={group.name}>
  554. {group.name}
  555. </Select.Option>
  556. ));
  557. return (
  558. <div className="user-content">
  559. <ShowModalDiv ShowModal={this.state.showModal} />
  560. <div className="content-title" style={{ marginBottom: 10 }}>
  561. <span style={{ fontWeight: 900, fontSize: 16 }}>我的会员项目</span>
  562. </div>
  563. <Tabs defaultActiveKey="2" onChange={this.callback} className="test">
  564. <TabPane tab="更改表格显示数据" key="1">
  565. <div style={{ marginLeft: 10 }}>
  566. <ChooseList
  567. columns={this.state.columns}
  568. changeFn={this.changeList}
  569. changeList={this.state.changeList}
  570. top={55}
  571. margin={11}
  572. />
  573. </div>
  574. </TabPane>
  575. <TabPane tab="搜索" key="2">
  576. <div className="user-search" style={{ marginLeft: 10 }}>
  577. <Input
  578. placeholder="订单编号"
  579. value={searchValues["orderNo"]
  580. ? searchValues["orderNo"]
  581. : ""}
  582. onChange={(e) => {
  583. searchValues["orderNo"] = e.target.value;
  584. this.setState({
  585. searchValues: searchValues,
  586. });
  587. }}
  588. />
  589. <Input
  590. placeholder="客户名称"
  591. value={searchValues["userName"]
  592. ? searchValues["userName"]
  593. : ""}
  594. onChange={(e) => {
  595. searchValues["userName"] = e.target.value;
  596. this.setState({
  597. searchValues: searchValues,
  598. });
  599. }}
  600. />
  601. <Cascaders
  602. ref={node => this.Cascaders = node}
  603. placeholder="订单部门"
  604. id="id"
  605. name="name"
  606. children="list"
  607. height={28}
  608. onSel={(e) => {
  609. searchValues["deps"] = JSON.stringify(e);
  610. this.setState({
  611. searchValues: searchValues,
  612. });
  613. }}
  614. />
  615. {/* <Select
  616. placeholder="订单部门"
  617. style={{ width: 200, marginRight: 10 }}
  618. value={searchValues["depId"]
  619. ? searchValues["depId"]
  620. : undefined}
  621. onChange={(e) => {
  622. searchValues["depId"] = e;
  623. this.setState({
  624. searchValues: searchValues,
  625. });
  626. }}
  627. >
  628. {departmentArr.map(function (item) {
  629. return (
  630. <Select.Option key={item.id}>{item.name}</Select.Option>
  631. );
  632. })}
  633. </Select> */}
  634. <Input
  635. placeholder="合同编号"
  636. value={searchValues["contractNo"]
  637. ? searchValues["contractNo"]
  638. : ""}
  639. onChange={(e) => {
  640. searchValues["contractNo"] = e.target.value;
  641. this.setState({
  642. searchValues: searchValues,
  643. });
  644. }}
  645. />
  646. <AutoComplete
  647. className="certain-category-search"
  648. dropdownClassName="certain-category-search-dropdown"
  649. dropdownMatchSelectWidth={false}
  650. style={{ width: "120px" }}
  651. dataSource={options}
  652. placeholder="订单负责人"
  653. value={searchValues.aname || undefined}
  654. onChange={this.followUp.bind(this)}
  655. filterOption={true}
  656. onSelect={this.selectF.bind(this)}
  657. >
  658. <Input />
  659. </AutoComplete>
  660. <Input
  661. placeholder="项目名称"
  662. value={searchValues["projectName"]
  663. ? searchValues["projectName"]
  664. : ""}
  665. onChange={(e) => {
  666. searchValues["projectName"] = e.target.value;
  667. this.setState({
  668. searchValues: searchValues,
  669. });
  670. }}
  671. />
  672. <Select
  673. style={{ width: 120 }}
  674. placeholder="签单金额"
  675. value={searchValues["amountStatus"]
  676. ? searchValues["amountStatus"]
  677. : undefined}
  678. onChange={(e) => {
  679. searchValues["amountStatus"] = e;
  680. this.setState({
  681. searchValues: searchValues,
  682. });
  683. }}
  684. >
  685. <Option value="0">10万元以下</Option>
  686. <Option value="1">10~20万元</Option>
  687. <Option value="2">20~30万元</Option>
  688. <Option value="3">30~40万元</Option>
  689. <Option value="4">40万元以上</Option>
  690. </Select>
  691. <Select
  692. style={{ width: 120 }}
  693. placeholder="特批状态"
  694. value={searchValues["approval"]
  695. ? searchValues["approval"]
  696. : undefined}
  697. onChange={(e) => {
  698. searchValues["approval"] = e;
  699. this.setState({
  700. searchValues: searchValues,
  701. });
  702. }}
  703. >
  704. <Option value="0">非特批</Option>
  705. <Option value="1">特批待审</Option>
  706. <Option value="2">特批通过</Option>
  707. <Option value="4">全部特批</Option>
  708. </Select>
  709. <Select
  710. style={{ width: 120 }}
  711. placeholder="审核状态"
  712. value={searchValues["status"]
  713. ? searchValues["status"]
  714. : undefined}
  715. onChange={(e) => {
  716. searchValues["status"] = e;
  717. this.setState({
  718. searchValues: searchValues,
  719. });
  720. }}
  721. >
  722. <Option value="1">财务审核</Option>
  723. <Option value="2">特批审核</Option>
  724. <Option value="3">通过</Option>
  725. <Option value="4">驳回</Option>
  726. <Option value="5">全部</Option>
  727. </Select>
  728. <Button
  729. type="primary"
  730. onClick={this.search}
  731. style={{ marginLeft: 10 }}
  732. disabled={this.state.loading ? true : false}
  733. >
  734. 搜索
  735. </Button>
  736. <Button onClick={this.reset}>重置</Button>
  737. </div>
  738. </TabPane>
  739. <TabPane tab="打印" key="3">
  740. <Button
  741. type="primary"
  742. style={{ margin: "11px 0px 10px 10px" }}
  743. onClick={this.printAll}
  744. >
  745. 打印当前列表
  746. </Button>
  747. </TabPane>
  748. <TabPane tab="导出Excel" key="4">
  749. <Button
  750. type="primary"
  751. style={{ margin: "11px 0px 10px 10px" }}
  752. onClick={this.exportAll}
  753. >
  754. 导出当前列表
  755. </Button>
  756. </TabPane>
  757. </Tabs>
  758. <div className="patent-table">
  759. <Spin spinning={this.state.loading}>
  760. <Table
  761. bordered
  762. columns={
  763. this.state.changeList == undefined
  764. ? this.state.columns
  765. : this.state.changeList
  766. }
  767. dataSource={this.state.dataSource}
  768. pagination={this.state.pagination}
  769. onRowDoubleClick={this.tableRowClick.bind(this)}
  770. size="small"
  771. />
  772. </Spin>
  773. </div>
  774. <textarea id="copyText" style={{ opacity: 0 }} />
  775. {/* 订单详情 */}
  776. <OrderDesc
  777. data={this.state.RowData}
  778. showDesc={this.state.showDesc}
  779. closeDesc={this.closeDesc.bind(this)}
  780. />
  781. {
  782. //打印预览
  783. this.state.dvisible &&
  784. <Modal
  785. visible={this.state.dvisible}
  786. footer=""
  787. title="所有列表信息"
  788. className="admin-desc-content"
  789. width="1300px"
  790. onCancel={() => {
  791. this.loadData();
  792. this.setState({
  793. dvisible: false,
  794. });
  795. }}
  796. >
  797. <Spin spinning={this.state.loading}>
  798. <div
  799. className="patent-table"
  800. style={{
  801. padding: "25px 0 30px 30px",
  802. }}
  803. ref={(e) => {
  804. this.refs.all = e;
  805. }}
  806. >
  807. <Table
  808. columns={this.truncate(this.state.columns)}
  809. dataSource={this.state.dataSource}
  810. pagination={false}
  811. bordered
  812. size="small"
  813. />
  814. </div>
  815. </Spin>
  816. <ReactToPrint
  817. trigger={() => (
  818. <Button
  819. type="primary"
  820. style={{
  821. float: "right",
  822. marginTop: 10,
  823. position: "absolute",
  824. top: 0,
  825. right: 30,
  826. }}
  827. >
  828. 打印
  829. </Button>
  830. )}
  831. content={() => this.refs.all}
  832. />
  833. </Modal>
  834. }
  835. {
  836. // 会员项目添加编辑
  837. this.state.vipVisible &&
  838. <ProjectOperationVip
  839. readOnly={false}
  840. orderNo={this.state.dataInfor.orderNo}
  841. visible={this.state.vipVisible}
  842. dataInfor={this.state.dataInfor}
  843. onCancel={this.vipClose}
  844. />
  845. }
  846. {
  847. //查看附件
  848. this.state.imgListVisible &&
  849. <Modal
  850. maskClosable={false}
  851. visible={this.state.imgListVisible}
  852. onOk={() => {
  853. this.setState({
  854. imgListVisible: false,
  855. });
  856. }}
  857. onCancel={() => {
  858. this.setState({
  859. imgListVisible: false,
  860. });
  861. }}
  862. width="600px"
  863. title="附件"
  864. footer=""
  865. >
  866. <div>
  867. <ImgList
  868. fileList={this.state.pictureUrlArr}
  869. domId="publicStatistics"
  870. />
  871. </div>
  872. </Modal>
  873. }
  874. </div>
  875. );
  876. },
  877. });
  878. export default MyProjectVip;