highTech.jsx 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799
  1. import React, { Component } from "react";
  2. import {
  3. Button,
  4. DatePicker,
  5. Input,
  6. message,
  7. Select,
  8. Spin,
  9. Table,
  10. Tabs,
  11. } from "antd";
  12. import { ShowModal } from "@/tools";
  13. import { ChooseList } from "../../order/orderNew/chooseList";
  14. import $ from "jquery/src/ajax";
  15. import moment from "moment";
  16. import {
  17. highTechColumns,
  18. doubleSoft,
  19. softWriting,
  20. patent,
  21. currency,
  22. } from "./highTechConfig";
  23. import ProjectDetails from "./projectDetails";
  24. const { TabPane } = Tabs;
  25. const { RangePicker } = DatePicker;
  26. const { Option } = Select;
  27. class HighTech extends Component {
  28. constructor(props) {
  29. super(props);
  30. this.state = {
  31. loading: false,
  32. changeList: [],
  33. columns: currency,
  34. status: 0,
  35. page: 1,
  36. pagination: {
  37. defaultCurrent: 1,
  38. defaultPageSize: 10,
  39. showQuickJumper: true,
  40. pageSize: 10,
  41. onChange: function (page) {
  42. this.loadData(page);
  43. }.bind(this),
  44. showTotal: function (total) {
  45. return "共" + total + "条数据";
  46. },
  47. },
  48. dataSource: [],
  49. releaseDate: [],
  50. searchOrderNo: "",
  51. searchContractNo: "",
  52. searchEnterpriseName: "",
  53. declarationBatch: "",
  54. projectSituation: "",
  55. projectAmount: "",
  56. depId: "",
  57. thchDepId: "",
  58. projectType: "",
  59. projectStatus: "",
  60. departmentArr: [],
  61. contactsOption: [],
  62. contactsOptionData: [],
  63. visible: false,
  64. };
  65. this.resetAll = this.resetAll.bind(this);
  66. this.changeList = this.changeList.bind(this);
  67. this.departmentList = this.departmentList.bind(this);
  68. this.exportPending = this.exportPending.bind(this);
  69. this.loadData = this.loadData.bind(this);
  70. this.selectSuperId = this.selectSuperId.bind(this);
  71. }
  72. changeList(arr) {
  73. const newArr = [];
  74. this.state.columns.forEach((item) => {
  75. arr.forEach((val) => {
  76. if (val === item.title) {
  77. newArr.push(item);
  78. }
  79. });
  80. });
  81. this.setState({
  82. changeList: newArr,
  83. });
  84. }
  85. loadData(pageNo = "") {
  86. this.setState({
  87. loading: true,
  88. });
  89. $.ajax({
  90. method: "get",
  91. dataType: "json",
  92. crossDomain: false,
  93. url: globalConfig.context + "/api/admin/statistis/selectTaskList",
  94. data: this.props.searchData
  95. ? Object.assign(
  96. {
  97. pageNo: pageNo || 1,
  98. pageSize: this.state.pagination.pageSize || 10,
  99. },
  100. this.props.searchData
  101. )
  102. : {
  103. pageNo: pageNo || 1,
  104. pageSize: this.state.pagination.pageSize || 10,
  105. startDate:
  106. this.state.releaseDate.length > 0
  107. ? this.state.releaseDate[0]
  108. : undefined, //开始时间
  109. endDate:
  110. this.state.releaseDate.length > 0
  111. ? this.state.releaseDate[1]
  112. : undefined, //结束时间
  113. depId: this.state.depId || undefined, //部门ID
  114. thchDepId: this.state.thchDepId || undefined, //责任部门ID
  115. projectStatus: this.state.projectStatus || undefined, //项目类别
  116. projectType:
  117. typeof this.state.projectType === "number"
  118. ? this.state.projectType
  119. : undefined, //项目分类
  120. orderNo: this.state.searchOrderNo || undefined, //订单编号
  121. contractNo: this.state.searchContractNo || undefined, //合同编号
  122. userName: this.state.searchEnterpriseName || undefined, //企业名称
  123. declarationBatch: this.state.declarationBatch || undefined, //申报批次
  124. projectSituation:
  125. typeof this.state.projectSituation === "number"
  126. ? this.state.projectSituation
  127. : undefined, //项目分类
  128. projectAmount: this.state.projectAmount || undefined, //项目金额
  129. status: this.state.status,
  130. },
  131. success: function (data) {
  132. ShowModal(this);
  133. let theArr = [];
  134. if (!data.data || !data.data.list) {
  135. if (data.error && data.error.length) {
  136. message.warning(data.error[0].message);
  137. }
  138. } else {
  139. for (let i = 0; i < data.data.list.length; i++) {
  140. let thisdata = data.data.list[i];
  141. thisdata.key = (data.data.pageNo - 1) * data.data.pageSize + i + 1;
  142. theArr.push(thisdata);
  143. }
  144. this.state.pagination.current = data.data.pageNo;
  145. this.state.pagination.total = data.data.totalCount;
  146. if (data.data && data.data.list && !data.data.list.length) {
  147. this.state.pagination.current = 0;
  148. this.state.pagination.total = 0;
  149. }
  150. this.setState({
  151. pagination: this.state.pagination,
  152. page: pageNo,
  153. dataSource: theArr,
  154. });
  155. }
  156. }.bind(this),
  157. }).always(
  158. function () {
  159. this.setState({
  160. loading: false,
  161. });
  162. }.bind(this)
  163. );
  164. }
  165. resetAll() {
  166. this.setState(
  167. {
  168. releaseDate: [],
  169. searchOrderNo: "",
  170. searchContractNo: "",
  171. searchEnterpriseName: "",
  172. declarationBatch: "",
  173. projectSituation: "",
  174. projectAmount: "",
  175. projectType: "",
  176. depId: "",
  177. thchDepId: "",
  178. projectStatus: "",
  179. columns: currency,
  180. status: 0,
  181. },
  182. () => {
  183. this.loadData();
  184. }
  185. );
  186. }
  187. //部门
  188. departmentList() {
  189. $.ajax({
  190. method: "get",
  191. dataType: "json",
  192. crossDomain: false,
  193. url: globalConfig.context + "/api/admin/organization/selectSuperId",
  194. data: {},
  195. success: function (data) {
  196. let thedata = data.data;
  197. let theArr = [];
  198. if (!thedata) {
  199. if (data.error && data.error.length) {
  200. message.warning(data.error[0].message);
  201. }
  202. } else {
  203. thedata.map(function (item, index) {
  204. theArr.push({
  205. key: index,
  206. name: item.name,
  207. id: item.id,
  208. });
  209. });
  210. }
  211. this.setState({
  212. departmentArr: theArr,
  213. });
  214. }.bind(this),
  215. });
  216. }
  217. //项目类别
  218. selectSuperId() {
  219. $.ajax({
  220. method: "get",
  221. dataType: "json",
  222. crossDomain: false,
  223. url: globalConfig.context + "/api/admin/ProjectSize/getAllCname",
  224. data: {
  225. flag: 0,
  226. },
  227. success: function (data) {
  228. let theArr = [];
  229. let thedata = data.data;
  230. if (!thedata) {
  231. if (data.error && data.error.length) {
  232. message.warning(data.error[0].message);
  233. }
  234. }
  235. for (let i = 0; i < data.data.length; i++) {
  236. let theData = data.data[i];
  237. theArr.push(
  238. <Select.Option value={theData.id} key={theData.cname}>
  239. {theData.cname}
  240. </Select.Option>
  241. );
  242. }
  243. this.setState({
  244. contactsOption: theArr,
  245. contactsOptionData: data.data,
  246. });
  247. }.bind(this),
  248. }).always();
  249. }
  250. exportPending() {
  251. let url = `/api/admin/statistis/exporTaskList?status=${this.state.status}`;
  252. let dep = this.state.departmentArr.filter((e) => e.id === this.state.depId); //订单部门名称
  253. let thchDep = this.state.departmentArr.filter(
  254. (e) => e.id === this.state.thchDepId
  255. ); //责任部门名称
  256. let option = this.state.contactsOptionData.filter(
  257. (e) => e.id === this.state.projectStatus
  258. ); //项目类别名称
  259. if (dep.length > 0) {
  260. url = url + `&depName=${dep[0].name}`;
  261. }
  262. if (thchDep.length > 0) {
  263. url = url + `&thchDepName=${thchDep[0].name}`;
  264. }
  265. if (option.length > 0) {
  266. url = url + `&projectStatusName=${option[0].cname}`;
  267. }
  268. if (typeof this.state.projectType === "number") {
  269. url =
  270. url +
  271. `&projectTypeName=${
  272. this.state.projectType === 0
  273. ? "通用"
  274. : this.state.projectType === 1
  275. ? "专利"
  276. : this.state.projectType === 2
  277. ? "软著"
  278. : this.state.projectType === 3
  279. ? "审计"
  280. : this.state.projectType === 4
  281. ? "双软"
  282. : this.state.projectType === 5
  283. ? "高新"
  284. : ""
  285. }`;
  286. }
  287. let data = {
  288. startDate:
  289. this.state.releaseDate.length > 0
  290. ? this.state.releaseDate[0]
  291. : undefined, //开始时间
  292. endDate:
  293. this.state.releaseDate.length > 0
  294. ? this.state.releaseDate[1]
  295. : undefined, //结束时间
  296. depId: this.state.depId || undefined, //部门ID
  297. thchDepId: this.state.thchDepId || undefined, //责任部门ID
  298. projectStatus: this.state.projectStatus || undefined, //项目类别
  299. projectType:
  300. typeof this.state.projectType === "number"
  301. ? this.state.projectType
  302. : undefined, //项目分类
  303. orderNo: this.state.searchOrderNo || undefined, //订单编号
  304. contractNo: this.state.searchContractNo || undefined, //合同编号
  305. userName: this.state.searchEnterpriseName || undefined, //企业名称
  306. declarationBatch: this.state.declarationBatch || undefined, //申报批次
  307. projectSituation:
  308. typeof this.state.projectSituation === "number"
  309. ? this.state.projectSituation
  310. : undefined, //项目情况
  311. projectAmount: this.state.projectAmount || undefined, //项目金额
  312. };
  313. for (let key in data) {
  314. if (data[key]) {
  315. url = url + `&${key}=${data[key]}`;
  316. }
  317. }
  318. window.location.href = globalConfig.context + url;
  319. }
  320. componentWillMount() {
  321. this.loadData();
  322. if (!this.props.introduce) {
  323. this.departmentList();
  324. this.selectSuperId();
  325. }
  326. if (this.props.searchData) {
  327. let e = this.props.searchData.projectType;
  328. this.setState({
  329. columns:
  330. e === 0
  331. ? currency
  332. : e === 1
  333. ? patent
  334. : e === 2
  335. ? softWriting
  336. : e === 3
  337. ? currency
  338. : e === 4
  339. ? doubleSoft
  340. : e === 5
  341. ? highTechColumns
  342. : e === 6
  343. ? currency
  344. : currency,
  345. });
  346. }
  347. }
  348. render() {
  349. return (
  350. <div className="user-content">
  351. {this.props.introduce ? (
  352. this.props.introduce()
  353. ) : (
  354. <div>
  355. <div className="content-title" style={{ marginBottom: 10 }}>
  356. <span style={{ fontWeight: 900, fontSize: 16 }}>
  357. 项目汇总表 (
  358. {this.state.status === 1
  359. ? "高新"
  360. : this.state.status === 2
  361. ? "双软"
  362. : this.state.status === 3
  363. ? "软著"
  364. : this.state.status === 4
  365. ? "专利"
  366. : "通用"}
  367. )
  368. </span>
  369. </div>
  370. <Tabs defaultActiveKey="1" className="test">
  371. <TabPane tab="搜索" key="1">
  372. <div
  373. className="user-search"
  374. style={{
  375. marginTop: "10px",
  376. marginLeft: "10px",
  377. marginRight: "10px",
  378. }}
  379. >
  380. <Input
  381. placeholder="订单编号"
  382. style={{
  383. width: 100,
  384. marginRight: "10px",
  385. marginBottom: "10px",
  386. }}
  387. value={this.state.searchOrderNo}
  388. onChange={(e) => {
  389. this.setState({ searchOrderNo: e.target.value });
  390. }}
  391. />
  392. <Input
  393. placeholder="合同编号"
  394. style={{
  395. width: 100,
  396. marginRight: "10px",
  397. marginBottom: "10px",
  398. }}
  399. value={this.state.searchContractNo}
  400. onChange={(e) => {
  401. this.setState({ searchContractNo: e.target.value });
  402. }}
  403. />
  404. <Input
  405. placeholder="企业名称"
  406. style={{
  407. width: 100,
  408. marginRight: "10px",
  409. marginBottom: "10px",
  410. }}
  411. value={this.state.searchEnterpriseName}
  412. onChange={(e) => {
  413. this.setState({ searchEnterpriseName: e.target.value });
  414. }}
  415. />
  416. <span style={{ display: "inline-block" }}>
  417. <span style={{ marginRight: "10px", marginBottom: "10px" }}>
  418. 项目类别 :
  419. </span>
  420. <Select
  421. value={this.state.projectStatus || undefined}
  422. placeholder="请选择项目类别"
  423. notFoundContent="未获取到上级品类列表"
  424. style={{
  425. width: 100,
  426. marginRight: "10px",
  427. marginBottom: "10px",
  428. }}
  429. onChange={(e) => {
  430. let infor = this.state.contactsOptionData.filter(
  431. (v) => v.id === e
  432. );
  433. this.setState(
  434. {
  435. projectStatus: e,
  436. }
  437. // ()=>{
  438. // if(infor[0].cname === '高新' && typeof this.state.projectType !== 'number'){
  439. // this.setState({
  440. // columns: highTechColumns,
  441. // dataSource:[],
  442. // changeList: [],
  443. // status: 1,
  444. // },()=>{
  445. // this.loadData();
  446. // })
  447. // }else if (typeof this.state.projectType !== 'number'){
  448. // this.setState({
  449. // columns: currency,
  450. // dataSource:[],
  451. // changeList: [],
  452. // status: 0,
  453. // },()=>{
  454. // this.loadData();
  455. // })
  456. // }else{
  457. // this.loadData();
  458. // }
  459. // }
  460. );
  461. }}
  462. >
  463. {this.state.contactsOption}
  464. </Select>
  465. </span>
  466. <span style={{ display: "inline-block" }}>
  467. <span style={{ marginRight: "10px", marginBottom: "10px" }}>
  468. 项目分类 :
  469. </span>
  470. <Select
  471. value={
  472. typeof this.state.projectType === "number"
  473. ? this.state.projectType
  474. : undefined
  475. }
  476. placeholder="请选择项目分类"
  477. style={{
  478. width: 100,
  479. marginRight: "10px",
  480. marginBottom: "10px",
  481. }}
  482. onChange={(e) => {
  483. this.setState(
  484. {
  485. columns:
  486. e === 0
  487. ? currency
  488. : e === 1
  489. ? patent
  490. : e === 2
  491. ? softWriting
  492. : e === 3
  493. ? currency
  494. : e === 4
  495. ? doubleSoft
  496. : e === 5
  497. ? highTechColumns
  498. : e === 6
  499. ? currency
  500. : currency,
  501. changeList: [],
  502. projectType: e,
  503. status:
  504. e === 4
  505. ? 2
  506. : e === 2
  507. ? 3
  508. : e === 1
  509. ? 4
  510. : e === 5
  511. ? 1
  512. : 0,
  513. dataSource: [],
  514. }
  515. // () => {
  516. // this.loadData();
  517. // }
  518. );
  519. }}
  520. >
  521. {/*0通用 1专利 2软著 3审计 4双软 5高新*/}
  522. <Option value={0}>通用</Option>
  523. <Option value={1}>专利</Option>
  524. <Option value={2}>软著</Option>
  525. <Option value={3}>审计</Option>
  526. <Option value={4}>双软</Option>
  527. <Option value={5}>高新</Option>
  528. <Option value={6}>商标</Option>
  529. </Select>
  530. </span>
  531. <span
  532. style={{
  533. display: "inline-block",
  534. marginRight: "10px",
  535. marginBottom: "10px",
  536. }}
  537. >
  538. <span>订单部门:</span>
  539. <Select
  540. placeholder="请选择部门"
  541. style={{
  542. width: 200,
  543. marginRight: "10px",
  544. marginLeft: "10px",
  545. marginBottom: "10px",
  546. }}
  547. value={this.state.depId || undefined}
  548. onChange={(e) => {
  549. this.setState({ depId: e });
  550. }}
  551. >
  552. {this.state.departmentArr.map(function (item) {
  553. return (
  554. <Select.Option key={item.id} value={item.id}>
  555. {item.name}
  556. </Select.Option>
  557. );
  558. })}
  559. </Select>
  560. </span>
  561. <span
  562. style={{
  563. display: "inline-block",
  564. marginRight: "10px",
  565. marginBottom: "10px",
  566. }}
  567. >
  568. <span>负责部门:</span>
  569. <Select
  570. placeholder="请选择部门"
  571. style={{
  572. width: 200,
  573. marginRight: "10px",
  574. marginLeft: "10px",
  575. marginBottom: "10px",
  576. }}
  577. value={this.state.thchDepId || undefined}
  578. onChange={(e) => {
  579. this.setState({ thchDepId: e });
  580. }}
  581. >
  582. {this.state.departmentArr.map(function (item) {
  583. return (
  584. <Select.Option key={item.id} value={item.id}>
  585. {item.name}
  586. </Select.Option>
  587. );
  588. })}
  589. </Select>
  590. </span>
  591. <span style={{ display: "inline-block" }}>
  592. <span style={{ marginRight: "10px", marginBottom: "10px" }}>
  593. 申报批次 :
  594. </span>
  595. <Select
  596. value={this.state.declarationBatch || undefined}
  597. placeholder="请选择批次"
  598. style={{
  599. width: 100,
  600. marginRight: "10px",
  601. marginBottom: "10px",
  602. }}
  603. onChange={(e) => {
  604. this.setState({
  605. declarationBatch: e,
  606. });
  607. }}
  608. >
  609. <Option value={1}>第一批</Option>
  610. <Option value={2}>第二批</Option>
  611. <Option value={3}>第三批</Option>
  612. <Option value={4}>第四批</Option>
  613. </Select>
  614. </span>
  615. <span style={{ display: "inline-block" }}>
  616. <span style={{ marginRight: "10px", marginBottom: "10px" }}>
  617. 项目金额 :
  618. </span>
  619. <Select
  620. value={this.state.projectAmount || undefined}
  621. placeholder="请选择项目金额"
  622. style={{
  623. width: 100,
  624. marginRight: "10px",
  625. marginBottom: "10px",
  626. }}
  627. onChange={(e) => {
  628. this.setState({
  629. projectAmount: e,
  630. });
  631. }}
  632. >
  633. <Option value={1}>0~0.5万</Option>
  634. <Option value={2}>0.5~1万</Option>
  635. <Option value={3}>1~2万</Option>
  636. <Option value={4}>2~5万</Option>
  637. <Option value={5}>5~10万</Option>
  638. <Option value={6}>10~30万</Option>
  639. <Option value={7}>30~50万</Option>
  640. <Option value={8}>50~80万</Option>
  641. <Option value={9}>80万上</Option>
  642. </Select>
  643. </span>
  644. {/* <span style={{display:"inline-block"}}>*/}
  645. {/* <span style={{marginRight:'10px',marginBottom:'10px'}}>项目情况 :</span>*/}
  646. {/* <Select*/}
  647. {/* value={typeof this.state.projectSituation === 'number' ? this.state.projectSituation : undefined}*/}
  648. {/* placeholder="请选择项目情况"*/}
  649. {/* style={{ width: 200,marginRight:'10px',marginBottom:'10px' }}*/}
  650. {/* onChange={(e) => {*/}
  651. {/* this.setState({*/}
  652. {/* projectSituation: e,*/}
  653. {/* });*/}
  654. {/* }}*/}
  655. {/* >*/}
  656. {/* <Option value={0}>未开始</Option>*/}
  657. {/* <Option value={1}>进行中</Option>*/}
  658. {/* <Option value={2}>已暂停</Option>*/}
  659. {/* <Option value={3}>已驳回(专利、软著项目编写)</Option>*/}
  660. {/* <Option value={4}>已完成</Option>*/}
  661. {/* <Option value={5}>项目已完成 已退单</Option>*/}
  662. {/* <Option value={6}>项目未完成 已退单</Option>*/}
  663. {/* </Select>*/}
  664. {/*</span>*/}
  665. <span style={{ display: "inline-block" }}>
  666. <span style={{ marginRight: "10px", marginBottom: "10px" }}>
  667. 派单时间 :
  668. </span>
  669. <RangePicker
  670. style={{ marginRight: "10px", marginBottom: "10px" }}
  671. value={[
  672. this.state.releaseDate[0]
  673. ? moment(this.state.releaseDate[0])
  674. : null,
  675. this.state.releaseDate[1]
  676. ? moment(this.state.releaseDate[1])
  677. : null,
  678. ]}
  679. onChange={(data, dataString) => {
  680. this.setState({ releaseDate: dataString });
  681. }}
  682. />
  683. </span>
  684. <Button
  685. type="primary"
  686. onClick={() => {
  687. this.loadData();
  688. }}
  689. style={{ marginRight: "10px", marginBottom: "10px" }}
  690. >
  691. 搜索
  692. </Button>
  693. <Button
  694. onClick={this.resetAll}
  695. style={{ marginRight: "10px", marginBottom: "10px" }}
  696. >
  697. 重置
  698. </Button>
  699. </div>
  700. </TabPane>
  701. <TabPane tab="更改表格显示数据" key="2">
  702. <div style={{ marginLeft: 10 }}>
  703. <ChooseList
  704. columns={this.state.columns}
  705. changeFn={this.changeList}
  706. changeList={this.state.changeList}
  707. top={55}
  708. margin={11}
  709. />
  710. </div>
  711. </TabPane>
  712. <TabPane tab="导出EXCEL" key="3">
  713. <Button
  714. type="primary"
  715. style={{ margin: "10px" }}
  716. onClick={this.exportPending}
  717. >
  718. 导出
  719. </Button>
  720. </TabPane>
  721. </Tabs>
  722. </div>
  723. )}
  724. <div className="patent-table">
  725. <Spin spinning={this.state.loading}>
  726. <Table
  727. bordered
  728. size="middle"
  729. scroll={{
  730. x:
  731. this.state.status === 4 || this.state.status === 3
  732. ? 1800
  733. : 1000,
  734. y: 0,
  735. }}
  736. columns={
  737. this.state.changeList.length > 0
  738. ? this.state.changeList
  739. : this.state.columns
  740. }
  741. dataSource={this.state.dataSource}
  742. pagination={this.state.pagination}
  743. style={{
  744. cursor: "pointer",
  745. }}
  746. onRowClick={(record) => {
  747. this.setState({
  748. projectdetailsId: record.id,
  749. projectdetailsOrderNo: record.orderNo,
  750. pname: record.pname,
  751. visible: true,
  752. });
  753. }}
  754. />
  755. </Spin>
  756. </div>
  757. {this.state.visible ? (
  758. <ProjectDetails
  759. visible={this.state.visible}
  760. id={this.state.projectdetailsId}
  761. orderNo={this.state.projectdetailsOrderNo}
  762. taskName={this.state.pname}
  763. visitOk={() => {
  764. this.setState({
  765. visible: false,
  766. });
  767. }}
  768. visitCancel={() => {
  769. this.setState({
  770. visible: false,
  771. });
  772. }}
  773. />
  774. ) : null}
  775. </div>
  776. );
  777. }
  778. }
  779. export default HighTech;