index.jsx 30 KB

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