approvedvipproject.jsx 24 KB

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