index.jsx 28 KB

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