detailedList.jsx 28 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964
  1. import React, { Component } from "react";
  2. import {
  3. AutoComplete,
  4. Button,
  5. DatePicker,
  6. Input,
  7. message,
  8. Modal,
  9. Select,
  10. Spin,
  11. Table,
  12. Tabs,
  13. Tag,
  14. Form,
  15. Upload,
  16. Tooltip,
  17. } from "antd";
  18. import { ShowModal, splitUrl, getClockState } from "@/tools";
  19. import { clockState } from "@/dataDic";
  20. import { ChooseList } from "../../order/orderNew/chooseList";
  21. import $ from "jquery/src/ajax";
  22. import "./index.less";
  23. import moment from "moment";
  24. import ImgList from "../../../common/imgList";
  25. const { TabPane } = Tabs;
  26. const { RangePicker } = DatePicker;
  27. class DetailedList extends Component {
  28. constructor(props) {
  29. super(props);
  30. this.state = {
  31. pageNo: 1,
  32. loading: false,
  33. changeList: [],
  34. annexUrlArr: [],
  35. photoUrlArr: [],
  36. imgListVisible: false,
  37. columns: [
  38. {
  39. title: "编号",
  40. dataIndex: "key",
  41. key: "key",
  42. width: 45,
  43. fixed: "left",
  44. },
  45. {
  46. title: "客户名称",
  47. dataIndex: "nickname",
  48. key: "nickname",
  49. width: 120,
  50. fixed: "left",
  51. render: (text) => {
  52. return (
  53. <div>{text}</div>
  54. );
  55. },
  56. },
  57. {
  58. title: "公出地点",
  59. dataIndex: "userName",
  60. key: "userName",
  61. width: 120,
  62. render: (text) => {
  63. return (
  64. <div>{text}</div>
  65. );
  66. },
  67. },
  68. {
  69. title: "跟单人",
  70. dataIndex: "sname",
  71. key: "sname",
  72. width: 80,
  73. render: (text) => {
  74. return (
  75. <div>{text}</div>
  76. );
  77. },
  78. },
  79. {
  80. title: "公出打卡人",
  81. dataIndex: "aname",
  82. key: "aname",
  83. width: 130,
  84. render: (text, record) => {
  85. return (
  86. <Tooltip title={text}>
  87. <div>
  88. {text}
  89. {record.assist !== 0 && <span>(协单人:{record.assistAidName})</span>}
  90. </div>
  91. </Tooltip>
  92. );
  93. },
  94. },
  95. {
  96. title: "申请时间",
  97. dataIndex: "createTimes",
  98. key: "createTimes",
  99. width: 80,
  100. },
  101. {
  102. title: "公出时间",
  103. dataIndex: "releaseStarts",
  104. key: "releaseStarts",
  105. width: 130,
  106. render: (text, record) => (
  107. <div>
  108. <div>{text}</div>
  109. <div style={{ paddingLeft: "44px" }}>至</div>
  110. <div>{record.releaseEnds}</div>
  111. </div>
  112. ),
  113. },
  114. {
  115. title: "公出时长(时)",
  116. dataIndex: "duration",
  117. key: "duration",
  118. width: 50,
  119. },
  120. {
  121. title: "打卡时间",
  122. dataIndex: "clockInTimes",
  123. key: "clockInTimes",
  124. width: 80,
  125. render: (text, record) => (
  126. <div>
  127. {text}
  128. <Tag color={["#F21212", "#34DE38", "#ffd400"][record.clockIn]}>{["未打卡", "已打卡", "异常打卡"][record.clockIn]}</Tag>
  129. </div>
  130. )
  131. },
  132. {
  133. title: "标签",
  134. dataIndex: "status",
  135. key: "status",
  136. width: 200,
  137. render: (text, record) => (
  138. <div style={{ display: "flex", flexDirection: "row" }}>
  139. <Tag
  140. color={["#45b97c", "#69541b", "#f47920", "#8552a1"][record.type]}
  141. >
  142. {
  143. record.type === 0
  144. ? "业务公出" : record.type === 1
  145. ? "技术公出" : record.type === 2
  146. ? "行政公出" : record.type === 3
  147. ? "技术协单" : ""
  148. }
  149. </Tag>
  150. <Tag color={getClockState(text).color}>
  151. {getClockState(text).title}
  152. </Tag>
  153. {record.updateStatus == 1 && <Tag color="#1E90FF">改</Tag>}
  154. </div>
  155. ),
  156. },
  157. {
  158. title: "公出目标",
  159. dataIndex: "remarks",
  160. key: "remarks",
  161. width: 200,
  162. render: (text) => {
  163. return (
  164. <div>{text}</div>
  165. );
  166. },
  167. },
  168. {
  169. title: "公出计划",
  170. dataIndex: "plan",
  171. key: "plan",
  172. width: 200,
  173. render: (text) => {
  174. return (
  175. <div>{text}</div>
  176. );
  177. },
  178. },
  179. {
  180. title: "预计效果",
  181. dataIndex: "expectedEffect",
  182. key: "expectedEffect",
  183. width: 200,
  184. render: (text) => {
  185. return (
  186. <div>{text}</div>
  187. );
  188. },
  189. },
  190. {
  191. title: "本次公出目标总结",
  192. dataIndex: "supplement",
  193. key: "supplement",
  194. width: 200,
  195. render: (text) => {
  196. return (
  197. <div>{text}</div>
  198. );
  199. },
  200. },
  201. {
  202. title: "下一次公出计划",
  203. dataIndex: "nextPlan",
  204. key: "nextPlan",
  205. width: 200,
  206. render: (text) => {
  207. return (
  208. <div>{text}</div>
  209. );
  210. },
  211. },
  212. // {
  213. // title: "补充",
  214. // dataIndex: "supplement",
  215. // key: "supplement",
  216. // width: 60,
  217. // render: (text) => {
  218. // return (
  219. // <Tooltip title={text}>
  220. // <div style={{
  221. // width:50,
  222. // overflow:'hidden',
  223. // textOverflow: "ellipsis",
  224. // whiteSpace:'nowrap',
  225. // }}>{text}</div>
  226. // </Tooltip>
  227. // )
  228. // },
  229. // },
  230. {
  231. title: "审核/指导",
  232. dataIndex: "auditInfo",
  233. key: "auditInfo",
  234. width: 200,
  235. render: (text) => {
  236. return (
  237. <div>{text}</div>
  238. );
  239. },
  240. },
  241. {
  242. title: "操作",
  243. dataIndex: "annexUrl",
  244. key: "annexUrl",
  245. width: 100,
  246. render: (text, record) => (
  247. <div>
  248. <Button
  249. type={"primary"}
  250. onClick={(e) => {
  251. e.stopPropagation();
  252. let arr1 = text || [];
  253. let arr2 = record.photoUrl || [];
  254. this.setState(
  255. {
  256. annexUrlArr: splitUrl(
  257. arr1,
  258. ",",
  259. globalConfig.avatarHost + "/upload"
  260. ),
  261. photoUrlArr: splitUrl(
  262. arr2,
  263. ",",
  264. globalConfig.avatarHost + "/upload"
  265. ),
  266. },
  267. () => {
  268. this.setState({
  269. imgListVisible: true,
  270. });
  271. }
  272. );
  273. }}
  274. >
  275. 查看附件
  276. </Button>
  277. </div>
  278. ),
  279. },
  280. ],
  281. pagination: {
  282. defaultCurrent: 1,
  283. defaultPageSize: 10,
  284. showQuickJumper: true,
  285. pageSize: 10,
  286. onChange: function (page) {
  287. this.loadData(page);
  288. }.bind(this),
  289. showTotal: function (total) {
  290. return "共" + total + "条数据";
  291. },
  292. },
  293. dataSource: [],
  294. releaseDate: [],
  295. status: props.status,
  296. clockIn: props.clockIn,
  297. theTypes: props.aid,
  298. theTypes1: undefined,
  299. theCustomerTypes: undefined,
  300. };
  301. this.loadData = this.loadData.bind(this);
  302. this.resetAll = this.resetAll.bind(this);
  303. this.changeList = this.changeList.bind(this);
  304. this.selectSuperId = this.selectSuperId.bind(this);
  305. this.supervisor = this.supervisor.bind(this);
  306. this.supervisor1 = this.supervisor1.bind(this);
  307. this.httpChange = this.httpChange.bind(this);
  308. this.blurChange = this.blurChange.bind(this);
  309. this.selectAuto = this.selectAuto.bind(this);
  310. this.httpChange1 = this.httpChange1.bind(this);
  311. this.blurChange1 = this.blurChange1.bind(this);
  312. this.selectAuto1 = this.selectAuto1.bind(this);
  313. this.getCustomer = this.getCustomer.bind(this);
  314. this.selectCustomerAuto = this.selectCustomerAuto.bind(this);
  315. this.httpCustomerChange = this.httpCustomerChange.bind(this);
  316. this.blurCustomerChange = this.blurCustomerChange.bind(this);
  317. this.exportExec = this.exportExec.bind(this);
  318. }
  319. //获取上级组织
  320. selectSuperId() {
  321. $.ajax({
  322. method: "get",
  323. dataType: "json",
  324. crossDomain: false,
  325. url: globalConfig.context + "/api/admin/organization/selectSuperId",
  326. data: {},
  327. success: function (data) {
  328. let theArr = [];
  329. if (data.error && data.error.length === 0) {
  330. for (let i = 0; i < data.data.length; i++) {
  331. let theData = data.data[i];
  332. theArr.push(
  333. <Select.Option value={theData.id} key={theData.id}>
  334. {theData.name}
  335. </Select.Option>
  336. );
  337. }
  338. this.setState({
  339. contactsOption: theArr,
  340. });
  341. } else {
  342. message.warning(data.error[0].message);
  343. }
  344. }.bind(this),
  345. }).always(
  346. function () {
  347. this.setState({
  348. loading: false,
  349. });
  350. }.bind(this)
  351. );
  352. }
  353. changeList(arr) {
  354. //debugger;
  355. const newArr = [];
  356. this.state.columns.forEach((item) => {
  357. arr.forEach((val) => {
  358. if (val === item.title) {
  359. newArr.push(item);
  360. }
  361. });
  362. });
  363. this.setState({
  364. changeList: newArr,
  365. });
  366. }
  367. componentWillMount() {
  368. let _this = this
  369. this.setState({
  370. loading: true,
  371. aid: this.props.aid,
  372. depId: this.props.depId,
  373. releaseDate: this.props.releaseDate,
  374. createReleaseDate: this.props.createReleaseDate,
  375. })
  376. setTimeout(function () {
  377. _this.loadData();
  378. _this.setState({
  379. loading: false
  380. })
  381. }, 300)
  382. this.selectSuperId();
  383. }
  384. loadData(pageNo) {
  385. this.setState({
  386. loading: true,
  387. });
  388. $.ajax({
  389. method: "get",
  390. dataType: "json",
  391. crossDomain: false,
  392. url: globalConfig.context + "/api/admin/release/publicReleaseDtails",
  393. data: {
  394. pageNo: pageNo || 1,
  395. pageSize: this.state.pagination.pageSize,
  396. releaseStart: this.state.releaseDate[0] || undefined,
  397. releaseEnd: this.state.releaseDate[1] || undefined,
  398. createStart: this.state.createReleaseDate[0] || undefined,
  399. createEnd: this.state.createReleaseDate[1] || undefined,
  400. aid: this.state.theTypes,
  401. sid: this.state.theTypes1 || undefined,
  402. uid: this.state.theCustomerTypes,
  403. status: this.state.status,
  404. clockIn: this.state.clockIn,
  405. publicType: this.state.type,
  406. },
  407. success: function (data) {
  408. ShowModal(this);
  409. let theArr = [];
  410. this.setState({
  411. loading: false,
  412. });
  413. if (data.error && data.error.length === 0) {
  414. for (let i = 0; i < data.data.list.length; i++) {
  415. let thisdata = data.data.list[i];
  416. thisdata.key = (data.data.pageNo - 1) * data.data.pageSize + i + 1;
  417. theArr.push(thisdata);
  418. }
  419. this.state.pagination.current = data.data.pageNo;
  420. this.state.pagination.total = data.data.totalCount;
  421. if (data.data && data.data.list && !data.data.list.length) {
  422. this.state.pagination.current = 0;
  423. this.state.pagination.total = 0;
  424. }
  425. this.setState({
  426. dataSource: theArr,
  427. pagination: this.state.pagination,
  428. pageNo: data.data.pageNo,
  429. });
  430. } else {
  431. message.warning(data.error[0].message);
  432. }
  433. }.bind(this),
  434. }).always(
  435. function () {
  436. this.setState({
  437. loading: false,
  438. });
  439. }.bind(this)
  440. );
  441. }
  442. resetAll() {
  443. this.setState(
  444. {
  445. releaseDate: [],
  446. theCustomerTypes: undefined,
  447. status: this.props.status,
  448. clockIn: this.props.clockIn,
  449. auto: "",
  450. auto1: "",
  451. customer: "",
  452. theTypes: undefined,
  453. theTypes1: undefined,
  454. type: undefined,
  455. },
  456. () => {
  457. this.loadData();
  458. }
  459. );
  460. }
  461. supervisor(e) {
  462. $.ajax({
  463. method: "get",
  464. dataType: "json",
  465. crossDomain: false,
  466. url: globalConfig.context + "/api/admin/customer/listAdminByName",
  467. data: {
  468. adminName: e,
  469. },
  470. success: function (data) {
  471. if (data.error && data.error.length === 0) {
  472. this.setState({
  473. customerArr: data.data,
  474. });
  475. } else {
  476. message.warning(data.error[0].message);
  477. }
  478. }.bind(this),
  479. }).always(function () { }.bind(this));
  480. }
  481. supervisor1(e) {
  482. $.ajax({
  483. method: "get",
  484. dataType: "json",
  485. crossDomain: false,
  486. url: globalConfig.context + "/api/admin/customer/listAdminByName",
  487. data: {
  488. adminName: e,
  489. },
  490. success: function (data) {
  491. if (data.error && data.error.length === 0) {
  492. this.setState({
  493. customerArr1: data.data,
  494. });
  495. } else {
  496. message.warning(data.error[0].message);
  497. }
  498. }.bind(this),
  499. }).always(function () { }.bind(this));
  500. }
  501. httpChange(e) {
  502. if (e.length >= 1) {
  503. this.supervisor(e);
  504. }
  505. this.setState({
  506. auto: e,
  507. });
  508. }
  509. httpChange1(e) {
  510. if (e.length >= 1) {
  511. this.supervisor1(e);
  512. }
  513. this.setState({
  514. auto1: e,
  515. });
  516. }
  517. blurChange1(e) {
  518. let theType = "";
  519. let contactLists = this.state.customerArr1 || [];
  520. if (e) {
  521. contactLists.map(function (item) {
  522. if (item.name == e.toString()) {
  523. theType = item.id;
  524. }
  525. });
  526. }
  527. this.setState({
  528. theTypes1: theType,
  529. });
  530. }
  531. selectAuto1(value, options) {
  532. this.setState({
  533. auto1: value,
  534. });
  535. }
  536. selectAuto(value, options) {
  537. this.setState({
  538. auto: value,
  539. });
  540. }
  541. httpCustomerChange(e) {
  542. if (e.length >= 1) {
  543. this.getCustomer(e);
  544. }
  545. this.setState({
  546. customer: e,
  547. });
  548. }
  549. selectCustomerAuto(value, options) {
  550. this.setState({
  551. customer: value,
  552. });
  553. }
  554. getCustomer(e) {
  555. $.ajax({
  556. method: "get",
  557. dataType: "json",
  558. crossDomain: false,
  559. url: globalConfig.context + "/api/admin/customer/getUserByName",
  560. data: {
  561. name: e,
  562. },
  563. success: function (data) {
  564. if (data.error && data.error.length === 0) {
  565. this.setState({
  566. customerList: data.data,
  567. });
  568. } else {
  569. message.warning(data.error[0].message);
  570. }
  571. }.bind(this),
  572. }).always(function () { }.bind(this));
  573. }
  574. blurCustomerChange(e) {
  575. let theType = "";
  576. let contactLists = this.state.customerList || [];
  577. if (e) {
  578. contactLists.map(function (item) {
  579. if (item.name == e.toString()) {
  580. theType = item.id;
  581. }
  582. });
  583. }
  584. this.setState({
  585. theCustomerTypes: theType,
  586. });
  587. }
  588. blurChange(e) {
  589. let theType = "";
  590. let contactLists = this.state.customerArr || [];
  591. if (e) {
  592. customerArr1;
  593. contactLists.map(function (item) {
  594. if (item.name == e.toString()) {
  595. theType = item.id;
  596. }
  597. });
  598. }
  599. this.setState({
  600. theTypes: theType,
  601. });
  602. }
  603. exportExec() {
  604. message.config({
  605. duration: 20,
  606. });
  607. let loading = message.loading("下载中...");
  608. this.setState({
  609. exportPendingLoading: true,
  610. });
  611. let data = {
  612. releaseStart: this.state.releaseDate[0],
  613. releaseEnd: this.state.releaseDate[1],
  614. createStart: this.state.createReleaseDate[0] || undefined,
  615. createEnd: this.state.createReleaseDate[1] || undefined,
  616. aid: this.state.theTypes,
  617. sid: this.state.theTypes1,
  618. uid: this.state.theCustomerTypes,
  619. status: this.state.status,
  620. clockIn: this.state.clockIn,
  621. publicType: this.state.type,
  622. };
  623. for (let i of Object.keys(data)) {
  624. if (i === "status" || i === "clockIn") {
  625. if (isNaN(parseInt(data[i]))) {
  626. delete data[i];
  627. }
  628. } else if (!data[i]) {
  629. delete data[i];
  630. }
  631. }
  632. console.log(data);
  633. $.ajax({
  634. method: "get",
  635. dataType: "json",
  636. crossDomain: false,
  637. url:
  638. globalConfig.context + "/api/admin/release/publicReleaseDtails/export?",
  639. data,
  640. success: function (data) {
  641. if (data.error.length === 0) {
  642. this.download(data.data);
  643. } else {
  644. message.warning(data.error[0].message);
  645. }
  646. }.bind(this),
  647. }).always(
  648. function () {
  649. loading();
  650. this.setState({
  651. exportPendingLoading: false,
  652. });
  653. }.bind(this)
  654. );
  655. // window.location.href =
  656. // globalConfig.context +
  657. // "/api/admin/release/publicReleaseDtails/export?" +
  658. // $.param(data);
  659. }
  660. download(fileName) {
  661. window.location.href =
  662. globalConfig.context + "/open/download?fileName=" + fileName;
  663. }
  664. render() {
  665. const dataSources = this.state.customerArr || [];
  666. const dataSources1 = this.state.customerArr1 || [];
  667. const options = dataSources.map((group) => (
  668. <Select.Option key={group.id} value={group.name}>
  669. {group.name}
  670. </Select.Option>
  671. ));
  672. const options1 = dataSources1.map((group) => (
  673. <Select.Option key={group.id} value={group.name}>
  674. {group.name}
  675. </Select.Option>
  676. ));
  677. const customerList = this.state.customerList || [];
  678. const customerOptions = customerList.map((group) => (
  679. <Select.Option key={group.id} value={group.name}>
  680. {group.name}
  681. </Select.Option>
  682. ));
  683. return (
  684. <div>
  685. <Modal
  686. maskClosable={false}
  687. visible={this.props.visible}
  688. onOk={this.props.onCancel}
  689. onCancel={this.props.onCancel}
  690. width="1600px"
  691. title={
  692. <span>
  693. <span style={{ marginRight: "15px" }}>公出详细列表</span>
  694. <Tag color="#f50">{this.props.aName}</Tag>
  695. <Tag color="#108ee9">{this.props.title}</Tag>
  696. </span>
  697. }
  698. footer=""
  699. className="admin-desc-content"
  700. >
  701. <div className="user-content">
  702. <Tabs defaultActiveKey="1" className="test">
  703. <TabPane tab="搜索" key="1">
  704. <div
  705. className="user-search"
  706. style={{
  707. marginTop: "10px",
  708. marginLeft: "10px",
  709. marginRight: "10px",
  710. }}
  711. >
  712. <span style={{ marginRight: "10px" }}>
  713. <AutoComplete
  714. className="certain-category-search"
  715. dropdownClassName="certain-category-search-dropdown"
  716. dropdownMatchSelectWidth={false}
  717. style={{ width: "120px" }}
  718. dataSource={customerOptions}
  719. placeholder="输入客户名称"
  720. value={this.state.customer}
  721. onChange={this.httpCustomerChange}
  722. filterOption={true}
  723. onBlur={this.blurCustomerChange}
  724. onSelect={this.selectCustomerAuto}
  725. >
  726. <Input />
  727. </AutoComplete>
  728. </span>
  729. <span style={{ marginRight: "10px" }}>
  730. <Select
  731. placeholder="请选择审核状态"
  732. style={{ width: 120, marginLeft: 10 }}
  733. value={this.state.status}
  734. onChange={(e) => {
  735. this.setState({ status: e });
  736. }}
  737. >
  738. {clockState.map((v, k) => (
  739. <Select.Option key={k} value={v.id}>
  740. {v.title}
  741. </Select.Option>
  742. ))}
  743. </Select>
  744. </span>
  745. <span style={{ marginRight: "10px" }}>
  746. <Select
  747. placeholder="请选择打卡状态"
  748. style={{ width: 120, marginLeft: 10 }}
  749. value={this.state.clockIn}
  750. onChange={(e) => {
  751. this.setState({ clockIn: e });
  752. }}
  753. >
  754. <Select.Option value={0}>未打卡</Select.Option>
  755. <Select.Option value={1}>已打卡</Select.Option>
  756. <Select.Option value={3}>异常打卡</Select.Option>
  757. </Select>
  758. </span>
  759. <span style={{ marginRight: "10px" }}>
  760. <Select
  761. placeholder="请选择公出类型"
  762. style={{ width: 120, marginLeft: 10 }}
  763. value={this.state.type}
  764. onChange={(e) => {
  765. this.setState({ type: e });
  766. }}
  767. >
  768. <Select.Option value={0}>业务打卡</Select.Option>
  769. <Select.Option value={1}>技术打卡</Select.Option>
  770. <Select.Option value={2}>行政打卡</Select.Option>
  771. <Select.Option value={3}>技术协单</Select.Option>
  772. </Select>
  773. </span>
  774. {/* <span style={{ marginRight: "10px" }}>
  775. <AutoComplete
  776. className="certain-category-search"
  777. dropdownClassName="certain-category-search-dropdown"
  778. dropdownMatchSelectWidth={false}
  779. style={{ width: "120px" }}
  780. dataSource={options}
  781. placeholder="输入公出申请人"
  782. value={this.state.auto}
  783. onChange={this.httpChange}
  784. filterOption={true}
  785. onBlur={this.blurChange}
  786. onSelect={this.selectAuto}
  787. >
  788. <Input />
  789. </AutoComplete>
  790. </span> */}
  791. <span style={{ marginRight: "10px" }}>
  792. <AutoComplete
  793. className="certain-category-search"
  794. dropdownClassName="certain-category-search-dropdown"
  795. dropdownMatchSelectWidth={false}
  796. style={{ width: "120px" }}
  797. dataSource={options1}
  798. placeholder="输入跟单人"
  799. value={this.state.auto1}
  800. onChange={this.httpChange1}
  801. filterOption={true}
  802. onBlur={this.blurChange1}
  803. onSelect={this.selectAuto1}
  804. >
  805. <Input />
  806. </AutoComplete>
  807. </span>
  808. <span style={{ marginRight: "10px" }}>
  809. <span style={{ marginRight: "5px", marginBottom: "10px" }}>
  810. 创建时间 :
  811. </span>
  812. <RangePicker
  813. style={{ marginRight: "10px", marginBottom: "10px" }}
  814. value={[
  815. this.state.createReleaseDate[0]
  816. ? moment(this.state.createReleaseDate[0])
  817. : null,
  818. this.state.createReleaseDate[1]
  819. ? moment(this.state.createReleaseDate[1])
  820. : null,
  821. ]}
  822. onChange={(data, dataString) => {
  823. this.setState({ createReleaseDate: dataString });
  824. }}
  825. />
  826. </span>
  827. <span style={{ marginRight: "10px" }}>
  828. <span style={{ marginRight: "5px", marginBottom: "10px" }}>
  829. 公出时间 :
  830. </span>
  831. <RangePicker
  832. style={{ marginRight: "10px", marginBottom: "10px" }}
  833. value={[
  834. this.state.releaseDate[0]
  835. ? moment(this.state.releaseDate[0])
  836. : null,
  837. this.state.releaseDate[1]
  838. ? moment(this.state.releaseDate[1])
  839. : null,
  840. ]}
  841. onChange={(data, dataString) => {
  842. this.setState({ releaseDate: dataString });
  843. }}
  844. />
  845. </span>
  846. <Button
  847. type="primary"
  848. onClick={() => {
  849. this.loadData();
  850. }}
  851. style={{ marginRight: "10px", marginBottom: "10px" }}
  852. >
  853. 搜索
  854. </Button>
  855. <Button
  856. onClick={this.resetAll}
  857. style={{ marginRight: "10px", marginBottom: "10px" }}
  858. >
  859. 重置
  860. </Button>
  861. </div>
  862. </TabPane>
  863. <TabPane tab="更改表格显示数据" key="2">
  864. <div style={{ marginLeft: 10 }}>
  865. <Spin spinning={this.state.loading}>
  866. <ChooseList
  867. columns={this.state.columns}
  868. changeFn={this.changeList}
  869. changeList={this.state.changeList}
  870. top={55}
  871. margin={11}
  872. />
  873. </Spin>
  874. </div>
  875. </TabPane>
  876. <TabPane tab="导出" key="3">
  877. <div style={{ float: "left" }}>
  878. <Button onClick={this.exportExec} style={{ margin: 10 }}>
  879. 导出excel
  880. </Button>
  881. </div>
  882. </TabPane>
  883. </Tabs>
  884. <div className="patent-table">
  885. <Spin spinning={this.state.loading}>
  886. <Table
  887. bordered
  888. size="middle"
  889. scroll={{ x: "max-content", y: "100%" }}
  890. columns={
  891. this.state.changeList.length > 0
  892. ? this.state.changeList
  893. : this.state.columns
  894. }
  895. dataSource={this.state.dataSource}
  896. pagination={this.state.pagination}
  897. />
  898. </Spin>
  899. </div>
  900. </div>
  901. </Modal>
  902. {this.state.imgListVisible ? (
  903. <Modal
  904. maskClosable={false}
  905. visible={this.state.imgListVisible}
  906. onOk={() => {
  907. this.setState({
  908. imgListVisible: false,
  909. });
  910. }}
  911. onCancel={() => {
  912. this.setState({
  913. imgListVisible: false,
  914. });
  915. }}
  916. width="500px"
  917. title="图片"
  918. footer=""
  919. >
  920. <div>
  921. <div>申请附件</div>
  922. <ImgList
  923. fileList={this.state.annexUrlArr}
  924. domId="publicStatistics"
  925. />
  926. <div style={{ paddingTop: "35px" }}>打卡照片</div>
  927. <ImgList
  928. fileList={this.state.photoUrlArr}
  929. domId="publicStatistics1"
  930. />
  931. </div>
  932. </Modal>
  933. ) : null}
  934. </div>
  935. );
  936. }
  937. }
  938. export default DetailedList;