patentPayment.jsx 35 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370
  1. import React from 'react';
  2. import {
  3. Icon,
  4. Button,
  5. AutoComplete,
  6. Input,
  7. Select,
  8. Spin,
  9. Table,
  10. Switch,
  11. message,
  12. DatePicker,
  13. Form,
  14. Modal,
  15. Tabs,
  16. Tooltip
  17. } from 'antd';
  18. import $ from 'jquery/src/ajax';
  19. import moment from 'moment';
  20. import { cityArr, patentTypeList } from '@/dataDic.js';
  21. import {
  22. beforeUploadFile,
  23. splitUrl,
  24. getPatentType,
  25. getcityArr,
  26. ShowModal,
  27. getMessageReminderStart,
  28. onReplace,
  29. } from "@/tools.js";
  30. import './customer.less';
  31. import ShowModalDiv from "@/showModal.jsx";
  32. import ImgList from "../../../../common/imgList";
  33. import { ChooseList } from "../../../order/orderNew/chooseList";
  34. import ReminderLog from "./reminderLog";
  35. const Option = AutoComplete.Option;
  36. const { TabPane } = Tabs;
  37. //图片组件
  38. const PicturesWall = React.createClass({
  39. getInitialState() {
  40. return {
  41. previewVisible: false,
  42. previewImage: '',
  43. fileList: this.props.pictureUrl,
  44. }
  45. },
  46. getDefaultProps() {
  47. return {
  48. changeClick: this.modifyChange
  49. }
  50. },
  51. handleCancel() {
  52. this.setState({ previewVisible: false })
  53. },
  54. handlePreview(file) {
  55. this.setState({
  56. previewImage: file.url || file.thumbUrl,
  57. previewVisible: true,
  58. });
  59. },
  60. handleChange(info) {
  61. let fileList = info.fileList;
  62. this.setState({ fileList });
  63. this.props.fileList(fileList);
  64. },
  65. componentWillReceiveProps(nextProps) {
  66. this.state.fileList = nextProps.pictureUrl;
  67. },
  68. render() {
  69. const { previewVisible, previewImage, fileList } = this.state;
  70. const uploadButton = (
  71. <div>
  72. <Icon type="plus" />
  73. <div className="ant-upload-text">点击上传</div>
  74. </div>
  75. );
  76. return (
  77. <div style={{ display: "inline-block" }}>
  78. <ImgList
  79. domId={this.props.domId}
  80. uploadConfig={{
  81. action: globalConfig.context + "/api/admin/patentNew/uploadFile",
  82. data: { 'sign': '' },
  83. multiple: true,
  84. listType: "picture-card",
  85. beforeUpload: (infor) => { beforeUploadFile(infor) }
  86. }}
  87. onChange={(infor) => {
  88. this.handleChange(infor)
  89. }}
  90. fileList={fileList}
  91. />
  92. </div>
  93. );
  94. }
  95. });
  96. const PatentPayment = Form.create()(React.createClass({
  97. departmentList() {
  98. this.setState({
  99. loading: true
  100. });
  101. $.ajax({
  102. method: "get",
  103. dataType: "json",
  104. crossDomain: false,
  105. url: globalConfig.context + "/api/admin/organization/selectSuperId",
  106. data: {},
  107. success: function (data) {
  108. let thedata = data.data;
  109. let theArr = [];
  110. if (!thedata) {
  111. if (data.error && data.error.length) {
  112. message.warning(data.error[0].message);
  113. };
  114. } else {
  115. thedata.map(function (item, index) {
  116. theArr.push({
  117. key: index,
  118. name: item.name,
  119. id: item.id,
  120. })
  121. })
  122. }
  123. this.setState({
  124. departmentArr: theArr,
  125. })
  126. }.bind(this),
  127. }).always(function () {
  128. this.setState({
  129. loading: false
  130. });
  131. }.bind(this));
  132. },
  133. loadData(pageNo) {
  134. this.setState({
  135. loading: true
  136. }),
  137. $.ajax({
  138. method: "get",
  139. dataType: "json",
  140. crossDomain: false,
  141. url: globalConfig.context + '/api/admin/patentNew/selectPatentNew',
  142. data: {
  143. pageNo: pageNo || 1,
  144. pageSize: this.state.pagination.pageSize,
  145. status: this.state.statusSearch,
  146. name: this.state.nameSearch,
  147. aname: this.state.anameSearch,
  148. patentNo: this.state.patentNoSearch,
  149. departmentId: this.state.departmentSearch,
  150. startDate: this.state.timesArr[0],
  151. endDate: this.state.timesArr[1],
  152. type: this.state.typeSearch,
  153. createStart: this.state.releaseDate[0],
  154. createEnd: this.state.releaseDate[1],
  155. },
  156. success: function (data) {
  157. ShowModal(this);
  158. let theArr = [];
  159. if (!data.data) {
  160. if (data.error && data.error.length) {
  161. message.warning(data.error[0].message);
  162. };
  163. } else {
  164. for (let i = 0; i < data.data.list.length; i++) {
  165. let thisdata = data.data.list[i];
  166. theArr.push({
  167. id: thisdata.id,
  168. province: thisdata.province,
  169. status: thisdata.status,
  170. patentNo: thisdata.patentNo,
  171. name: thisdata.name,
  172. type: thisdata.type,
  173. applyDates: thisdata.applyDates,
  174. authorizationDates: thisdata.authorizationDates,
  175. patentAmount: thisdata.patentAmount,
  176. applicant: thisdata.applicant,
  177. contactMobile: thisdata.contactMobile,
  178. email: thisdata.email,
  179. certificateUrl: thisdata.certificateUrl,
  180. aname: thisdata.aname,
  181. depName: thisdata.depName,
  182. userName: thisdata.userName,
  183. uid: thisdata.uid,
  184. createTimes: thisdata.createTimes
  185. });
  186. };
  187. this.state.pagination.current = data.data.pageNo;
  188. this.state.pagination.total = data.data.totalCount;
  189. };
  190. if (!data.data.list.length) {
  191. this.state.pagination.current = 0
  192. this.state.pagination.total = 0
  193. }
  194. this.setState({
  195. pageNo: pageNo,
  196. dataSource: theArr,
  197. pagination: this.state.pagination,
  198. });
  199. }.bind(this)
  200. }).always(function () {
  201. this.setState({
  202. loading: false
  203. });
  204. }.bind(this));
  205. },
  206. getInitialState() {
  207. return {
  208. loading: false,
  209. visible: false,
  210. orgCodeUrl: [],
  211. fileList: [],
  212. departmentArr: [],
  213. timesArr: [],
  214. pagination: {
  215. defaultCurrent: 1,
  216. defaultPageSize: 10,
  217. showQuickJumper: true,
  218. pageSize: 10,
  219. onChange: function (page) {
  220. this.loadData(page);
  221. }.bind(this),
  222. showTotal: function (total) {
  223. return '共' + total + '条数据';
  224. }
  225. },
  226. releaseDate: [],
  227. dataSource: [],
  228. columns: [{
  229. title: '专利号',
  230. dataIndex: 'patentNo',
  231. key: 'patentNo'
  232. }, {
  233. title: '专利名称',
  234. dataIndex: 'name',
  235. key: 'name'
  236. }, {
  237. title: '专利类型',
  238. dataIndex: 'type',
  239. key: 'type',
  240. render: text => {
  241. return getPatentType(text)
  242. }
  243. }, {
  244. title: '申请日期',
  245. dataIndex: 'applyDates',
  246. key: 'applyDates'
  247. }, {
  248. title: '授权日期',
  249. dataIndex: 'authorizationDates',
  250. key: 'authorizationDates'
  251. }, {
  252. title: '费用',
  253. dataIndex: 'patentAmount',
  254. key: 'patentAmount'
  255. }, {
  256. title: '客户名称',
  257. dataIndex: 'userName',
  258. key: 'userName',
  259. width: 100,
  260. render: (text, record) => {
  261. return (
  262. <Tooltip title={record.uid ? onReplace(text) : onReplace(record.applicant)}>
  263. <div style={{
  264. maxWidth: '100px',
  265. overflow: 'hidden',
  266. textOverflow: "ellipsis",
  267. whiteSpace: 'nowrap',
  268. }}>{record.uid ? onReplace(text) : onReplace(record.applicant)}</div>
  269. </Tooltip>
  270. )
  271. }
  272. }, {
  273. title: '录入人',
  274. dataIndex: 'aname',
  275. key: 'aname'
  276. }, {
  277. title: '录入日期',
  278. dataIndex: 'createTimes',
  279. key: 'createTimes'
  280. }, {
  281. title: '录入公司',
  282. dataIndex: 'depName',
  283. key: 'depName'
  284. }, {
  285. title: '联系电话',
  286. dataIndex: 'contactMobile',
  287. key: 'contactMobile'
  288. }, {
  289. title: '电子邮箱',
  290. dataIndex: 'email',
  291. key: 'email'
  292. }, {
  293. title: '状态',
  294. dataIndex: 'status',
  295. key: 'status',
  296. //状态 0 未提醒 1 剩余90天 2剩余30天 3剩余20天 4剩余10天 5剩余3天 6剩余2天 7剩余1天
  297. render: text => {
  298. return (getMessageReminderStart(text, true))
  299. }
  300. }, {
  301. title: '操作',
  302. dataIndex: 'id',
  303. key: 'id',
  304. render: (text) => (
  305. <Button
  306. type={"primary"}
  307. onClick={(e) => {
  308. e.stopPropagation();
  309. this.setState({
  310. reminderLogVisible: true,
  311. reminderLogId: text
  312. })
  313. }}
  314. >
  315. 查看日志
  316. </Button>
  317. )
  318. }
  319. ],
  320. customerServiceList: []
  321. }
  322. },
  323. componentWillMount() {
  324. this.loadData()
  325. this.departmentList()
  326. let data = localStorage.getItem('newData');
  327. if (data != '{}' && data) {
  328. var newData = JSON.parse(data);
  329. this.tableRowClick(newData);
  330. };
  331. },
  332. new() {
  333. this.reset();
  334. this.setState({
  335. visible: true
  336. })
  337. },
  338. visitCancel() {
  339. this.state.fileList = [];
  340. this.setState({
  341. visible: false
  342. })
  343. },
  344. onSure() {
  345. let theorgCodeUrl = [];
  346. if (this.state.orgCodeUrl.length) {
  347. let picArr = [];
  348. this.state.orgCodeUrl.map(function (item) {
  349. if (item.response && item.response.data && item.response.data.length) {
  350. picArr.push(item.response.data);
  351. }
  352. });
  353. theorgCodeUrl = picArr.join(",");
  354. };
  355. if (!this.state.patentNo) {
  356. message.warning('专利号不能为空')
  357. return
  358. }
  359. if (!this.state.patentName) {
  360. message.warning('专利名称不能为空')
  361. return
  362. }
  363. if (!this.state.appDate) {
  364. message.warning('申请日期不能为空')
  365. return
  366. }
  367. if (isNaN(parseInt(this.state.patentType))) {
  368. message.warning('专利类型不能为空');
  369. return
  370. }
  371. if (!this.state.authDate) {
  372. message.warning('授权日期不能为空')
  373. return
  374. }
  375. if (!this.state.customerUid) {
  376. message.warning('客户名称不能为空')
  377. return
  378. }
  379. let mobile = /^1[0-9]{10}$/, phone = /^([0-9]{3,4}-)?[0-9]{7,8}$/, phone1 = /^\d{3,4}-\d{3,4}-\d{3,4}$/;
  380. if (this.state.contactPhone && !(mobile.test(this.state.contactPhone) || phone.test(this.state.contactPhone) || phone1.test(this.state.contactPhone))) {
  381. message.warning('电话格式不正确');
  382. return
  383. }
  384. let emailReg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); //正则表达式
  385. if (this.state.email === '') {
  386. message.warning('电子邮箱不能为空');
  387. return
  388. }
  389. if (!emailReg.test(this.state.email)) {
  390. message.warning('电子邮箱格式不正确');
  391. return
  392. }
  393. this.setState({
  394. loading: true
  395. })
  396. $.ajax({
  397. method: "POST",
  398. dataType: "json",
  399. crossDomain: false,
  400. url: globalConfig.context + '/api/admin/patentNew/addPatentNew',
  401. data: {
  402. patentNo: this.state.patentNo,
  403. name: this.state.patentName,
  404. type: this.state.patentType,
  405. applyDates: this.state.appDate,
  406. authorizationDates: this.state.authDate,
  407. // applicant:this.state.proposer,
  408. province: this.state.province,
  409. contactMobile: this.state.contactPhone,
  410. email: this.state.email,
  411. certificateUrl: theorgCodeUrl.length ? theorgCodeUrl : '',
  412. uid: this.state.customerUid,
  413. }
  414. }).done(function (data) {
  415. this.setState({
  416. loading: false
  417. });
  418. if (!data.error.length) {
  419. message.success('保存成功!');
  420. this.onCal()
  421. this.loadData()
  422. } else {
  423. message.warning(data.error[0].message);
  424. }
  425. }.bind(this));
  426. },
  427. tableRowClick(record, index) {
  428. this.state.RowData = record
  429. this.setState({
  430. avisible: true,
  431. patentNo: record.patentNo,
  432. patentName: record.name,
  433. province: record.province,
  434. status: record.status,
  435. patentType: record.type,
  436. appDate: record.applyDates,
  437. authDate: record.authorizationDates,
  438. proposer: record.applicant,
  439. contactPhone: record.contactMobile,
  440. email: record.email,
  441. certificateUrl: record.certificateUrl,
  442. orgCodeUrl: record.certificateUrl ? splitUrl(record.certificateUrl, ',', globalConfig.avatarHost + '/upload') : [],
  443. customerUid: record.uid,
  444. customerName: record.userName
  445. })
  446. localStorage.setItem('newData', '{}');
  447. },
  448. xiugai(record) {
  449. let theorgCodeUrl = [];
  450. if (this.state.orgCodeUrl.length) {
  451. let picArr = [];
  452. this.state.orgCodeUrl.map(function (item) {
  453. if (item.response && item.response.data && item.response.data.length) {
  454. picArr.push(item.response.data);
  455. }
  456. });
  457. theorgCodeUrl = picArr.join(",");
  458. };
  459. if (!this.state.patentNo) {
  460. message.warning('专利号不能为空')
  461. return
  462. }
  463. if (!this.state.patentName) {
  464. message.warning('专利名称不能为空')
  465. return
  466. }
  467. if (!this.state.appDate) {
  468. message.warning('申请时间不能为空')
  469. return
  470. }
  471. if (isNaN(parseInt(this.state.patentType))) {
  472. message.warning('专利类型不能为空');
  473. return
  474. }
  475. if (!this.state.authDate) {
  476. message.warning('授权日期不能为空')
  477. return
  478. }
  479. if (!this.state.customerUid) {
  480. message.warning('客户名称不能为空')
  481. return
  482. }
  483. let mobile = /^1[0-9]{10}$/, phone = /^([0-9]{3,4}-)?[0-9]{7,8}$/, phone1 = /^\d{3,4}-\d{3,4}-\d{3,4}$/;
  484. if (this.state.contactPhone && !(mobile.test(this.state.contactPhone) || phone.test(this.state.contactPhone) || phone1.test(this.state.contactPhone))) {
  485. message.warning('电话格式不正确');
  486. return
  487. }
  488. let emailReg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); //正则表达式
  489. if (this.state.email === '') {
  490. message.warning('电子邮箱不能为空');
  491. return
  492. }
  493. if (!emailReg.test(this.state.email)) {
  494. message.warning('电子邮箱格式不正确');
  495. return
  496. }
  497. this.setState({
  498. loading: true
  499. })
  500. $.ajax({
  501. method: "POST",
  502. dataType: "json",
  503. crossDomain: false,
  504. url: globalConfig.context + '/api/admin/patentNew/updatePatentNew',
  505. data: {
  506. id: record.id,
  507. patentNo: this.state.patentNo,
  508. name: this.state.patentName,
  509. type: this.state.patentType,
  510. applyDates: this.state.appDate,
  511. authorizationDates: this.state.authDate,
  512. // applicant:this.state.proposer,
  513. province: this.state.province,
  514. contactMobile: this.state.contactPhone,
  515. email: this.state.email,
  516. status: this.state.status,
  517. certificateUrl: theorgCodeUrl.length ? theorgCodeUrl : '',
  518. uid: this.state.customerUid,
  519. },
  520. success: function (data) {
  521. }.bind(this),
  522. }).done(function (data) {
  523. this.setState({
  524. loading: false
  525. });
  526. if (!data.error.length) {
  527. message.success('修改成功!');
  528. this.avisitCancel()
  529. this.loadData(this.state.pageNo)
  530. } else {
  531. message.warning(data.error[0].message);
  532. }
  533. }.bind(this));
  534. },
  535. baocunxiugai() {
  536. this.xiugai(this.state.RowData)
  537. },
  538. avisitCancel() {
  539. this.setState({
  540. avisible: false,
  541. customerServiceList: []
  542. })
  543. },
  544. reset() {
  545. this.setState({
  546. patentNo: '',
  547. patentName: '',
  548. patentType: undefined,
  549. appDate: undefined,
  550. authDate: undefined,
  551. orgCodeUrl: [],
  552. proposer: '',
  553. province: undefined,
  554. contactPhone: '',
  555. email: '',
  556. customerUid: undefined,
  557. customerName: undefined,
  558. customerServiceList: [],
  559. })
  560. },
  561. searchReset() {
  562. this.setState({
  563. statusSearch: undefined,
  564. nameSearch: undefined,
  565. anameSearch: undefined,
  566. patentNoSearch: undefined,
  567. departmentSearch: undefined,
  568. typeSearch: undefined,
  569. timesArr: [],
  570. releaseDate: []
  571. }, () => {
  572. this.loadData()
  573. })
  574. },
  575. search() {
  576. this.loadData()
  577. },
  578. onCal() {
  579. this.setState({
  580. visible: false
  581. })
  582. },
  583. getOrgCodeUrl(e) {
  584. this.setState({ orgCodeUrl: e });
  585. },
  586. changeList(arr) {
  587. const newArr = [];
  588. this.state.columns.forEach(item => {
  589. arr.forEach(val => {
  590. if (val === item.title) {
  591. newArr.push(item);
  592. }
  593. });
  594. });
  595. this.setState({
  596. changeList: newArr
  597. });
  598. },
  599. //获取外联专员列表
  600. getAdminList(value = '') {
  601. if (value.length < 4) { return }
  602. $.ajax({
  603. method: "get",
  604. dataType: "json",
  605. crossDomain: false,
  606. url: globalConfig.context + "/api/admin/customer/getUserByName",
  607. data: {
  608. name: value,
  609. },
  610. success: function (data) {
  611. let theArr = [];
  612. if (data.error && data.error.length) {
  613. message.warning(data.error[0].message);
  614. } else {
  615. if (data.data) {
  616. data.data.map(function (item, _) {
  617. theArr.push({
  618. value: item.id,
  619. label: item.name,
  620. });
  621. });
  622. }
  623. }
  624. this.setState({
  625. customerServiceList: theArr,
  626. });
  627. }.bind(this),
  628. }).always(
  629. function () {
  630. }.bind(this)
  631. );
  632. },
  633. render() {
  634. const theData = this.state.RowData || {};
  635. const FormItem = Form.Item;
  636. const formItemLayout = {
  637. labelCol: { span: 8 },
  638. wrapperCol: { span: 14 },
  639. };
  640. const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
  641. return (
  642. <div className="user-content">
  643. <ShowModalDiv ShowModal={this.state.showModal} />
  644. <div className="content-title">
  645. <span style={{ fontSize: "16px" }}>客户专利提醒</span>
  646. <Tabs
  647. defaultActiveKey="1"
  648. className="test">
  649. <TabPane tab="搜索" key="1">
  650. <div className="user-search">
  651. <Select
  652. value={this.state.typeSearch}
  653. placeholder="请选择专利类型"
  654. onChange={e => {
  655. this.setState({
  656. typeSearch: e
  657. });
  658. }}
  659. style={{ width: "140px" }}
  660. >
  661. <Option value={1}>实用新型</Option>
  662. <Option value={2}>外观设计</Option>
  663. <Option value={3}>发明</Option>
  664. </Select>
  665. <Input
  666. value={this.state.nameSearch}
  667. placeholder="请输入授权公司"
  668. onChange={e => {
  669. this.setState({
  670. nameSearch: e.target.value
  671. });
  672. }}
  673. />
  674. <Select
  675. value={this.state.departmentSearch}
  676. placeholder="请选择录入公司"
  677. onChange={e => {
  678. this.setState({
  679. departmentSearch: e
  680. });
  681. }}
  682. style={{ width: "140px" }}
  683. >
  684. {this.state.departmentArr.map(e => {
  685. return <Option value={e.id}>{e.name}</Option>;
  686. })}
  687. </Select>
  688. <Input
  689. value={this.state.anameSearch}
  690. placeholder="请输入录入人"
  691. onChange={e => {
  692. this.setState({
  693. anameSearch: e.target.value
  694. });
  695. }}
  696. />
  697. <Select
  698. value={this.state.statusSearch}
  699. placeholder="请选择状态"
  700. onChange={e => {
  701. this.setState({
  702. statusSearch: e
  703. });
  704. }}
  705. style={{ width: "140px" }}
  706. >
  707. <Option value={0}>正常</Option>
  708. <Option value={1}>提醒中</Option>
  709. </Select>
  710. <Input
  711. value={this.state.patentNoSearch}
  712. placeholder="请输入专利号"
  713. onChange={e => {
  714. this.setState({
  715. patentNoSearch: e.target.value
  716. });
  717. }}
  718. />
  719. <Button
  720. type="primary"
  721. onClick={this.search}
  722. style={{ marginLeft: "10px" }}
  723. >
  724. 搜索
  725. </Button>
  726. <Button
  727. type="primary"
  728. onClick={this.searchReset}
  729. style={{ marginLeft: "10px" }}
  730. >
  731. 重置
  732. </Button>
  733. <span>
  734. 更多搜索
  735. <Switch
  736. onChange={mark => {
  737. this.setState({ mark: mark });
  738. }}
  739. />
  740. </span>
  741. {!this.props.isOnlyRead ? <Button
  742. type="primary"
  743. onClick={this.new}
  744. style={{ marginRight: "10px", float: "right" }}
  745. >
  746. 新建
  747. </Button> : <div />}
  748. {/*<Button onClick={this.reset}>导出</Button>*/}
  749. </div>
  750. </TabPane>
  751. <TabPane tab="更改表格显示数据" key="2">
  752. <div style={{ marginLeft: 10 }}>
  753. <ChooseList
  754. columns={this.state.columns}
  755. changeFn={this.changeList}
  756. changeList={this.state.changeList}
  757. top={55}
  758. margin={11}
  759. />
  760. </div>
  761. </TabPane>
  762. </Tabs>
  763. {this.state.mark ? (
  764. <div className="user-search" style={{ paddingTop: "10px" }}>
  765. <span style={{ fontSize: "14px" }}>请选择申请时间:</span>
  766. <RangePicker
  767. value={[
  768. this.state.timesArr[0]
  769. ? moment(this.state.timesArr[0])
  770. : null,
  771. this.state.timesArr[1] ? moment(this.state.timesArr[1]) : null
  772. ]}
  773. onChange={(e, f) => {
  774. this.setState({
  775. timesArr: f
  776. });
  777. }}
  778. style={{ marginTop: "0", marginLeft: "10px" }}
  779. />
  780. <span style={{ fontSize: "14px", marginLeft: "15px" }}>请选择录入日期:</span>
  781. <RangePicker
  782. style={{ marginTop: "0", marginLeft: "10px" }}
  783. value={[
  784. this.state.releaseDate[0]
  785. ? moment(this.state.releaseDate[0])
  786. : null,
  787. this.state.releaseDate[1]
  788. ? moment(this.state.releaseDate[1])
  789. : null
  790. ]}
  791. onChange={(data, dataString) => {
  792. this.setState({ releaseDate: dataString });
  793. }}
  794. />
  795. </div>
  796. ) : (
  797. ""
  798. )}
  799. <div className="patent-table">
  800. <Spin spinning={this.state.loading}>
  801. <Table
  802. columns={
  803. this.state.changeList
  804. ? this.state.changeList
  805. : this.state.columns
  806. }
  807. dataSource={this.state.dataSource}
  808. pagination={this.state.pagination}
  809. onRowClick={this.tableRowClick}
  810. size="middle"
  811. bordered
  812. />
  813. </Spin>
  814. </div>
  815. {this.state.avisible ? <Modal
  816. maskClosable={false}
  817. visible={this.state.avisible}
  818. onCancel={this.avisitCancel}
  819. width="800px"
  820. title={!this.props.isOnlyRead ? "修改详情" : "查看详情"}
  821. footer=""
  822. className="admin-desc-content"
  823. >
  824. <div className="clearfix">
  825. <FormItem
  826. className="half-item"
  827. {...formItemLayout}
  828. label={
  829. <span>
  830. <strong style={{ color: "#f00" }}>*</strong>专利号
  831. </span>
  832. }
  833. >
  834. {!this.props.isOnlyRead ?
  835. <Input
  836. placeholder="请输入专利号"
  837. value={this.state.patentNo}
  838. onChange={e => {
  839. this.setState({ patentNo: e.target.value });
  840. }}
  841. style={{ width: "240px" }}
  842. /> : <span>{this.state.patentNo}</span>
  843. }
  844. </FormItem>
  845. <FormItem
  846. className="half-item"
  847. {...formItemLayout}
  848. label={
  849. <span>
  850. <strong style={{ color: "#f00" }}>*</strong>专利名称
  851. </span>
  852. }
  853. >
  854. {!this.props.isOnlyRead ?
  855. <Input
  856. placeholder="请输入专利名称"
  857. value={this.state.patentName}
  858. onChange={e => {
  859. this.setState({ patentName: e.target.value });
  860. }}
  861. style={{ width: "240px" }}
  862. /> : <div>{this.state.patentName}</div>
  863. }
  864. </FormItem>
  865. <FormItem
  866. className="half-item"
  867. {...formItemLayout}
  868. label="专利类型"
  869. >
  870. {!this.props.isOnlyRead ?
  871. <Select
  872. placeholder="请选择专利类型"
  873. style={{ width: "240px" }}
  874. value={getPatentType(this.state.patentType)}
  875. onChange={e => {
  876. this.setState({ patentType: e });
  877. }}
  878. >
  879. {patentTypeList.map(function (item) {
  880. return (
  881. <Select.Option key={item.value}>
  882. {item.key}
  883. </Select.Option>
  884. );
  885. })}
  886. </Select> : <div>{getPatentType(this.state.patentType)}</div>
  887. }
  888. </FormItem>
  889. <FormItem
  890. className="half-item"
  891. {...formItemLayout}
  892. label={
  893. <span>
  894. <strong style={{ color: "#f00" }}>*</strong>申请日期
  895. </span>
  896. }
  897. >
  898. {
  899. !this.props.isOnlyRead ?
  900. <DatePicker
  901. style={{ marginTop: "2px", width: "240px", height: "32px" }}
  902. showTime
  903. format="YYYY-MM-DD"
  904. onOk={e => { }}
  905. value={this.state.appDate ? moment(this.state.appDate) : null}
  906. onChange={(data, dataString) => {
  907. this.setState({ appDate: dataString });
  908. }}
  909. /> : <div>{this.state.appDate ? moment(this.state.appDate).format('YYYY-MM-DD') : ''}</div>
  910. }
  911. </FormItem>
  912. <FormItem
  913. className="half-item"
  914. {...formItemLayout}
  915. label={
  916. <span>
  917. <strong style={{ color: "#f00" }}>*</strong>授权日期
  918. </span>
  919. }
  920. >
  921. {
  922. !this.props.isOnlyRead ?
  923. <DatePicker
  924. style={{ marginTop: "2px", width: "240px", height: "32px" }}
  925. showTime
  926. format="YYYY-MM-DD"
  927. onOk={e => { }}
  928. value={
  929. this.state.authDate ? moment(this.state.authDate) : null
  930. }
  931. onChange={(data, dataString) => {
  932. this.setState({ authDate: dataString });
  933. }}
  934. /> : <div>{this.state.authDate ? moment(this.state.authDate).format('YYYY-MM-DD') : ''}</div>}
  935. </FormItem>
  936. <FormItem className="half-item" {...formItemLayout} label="费用">
  937. <span>{theData.patentAmount}</span>
  938. </FormItem>
  939. <div className="clearfix">
  940. <FormItem
  941. labelCol={{ span: 4 }}
  942. wrapperCol={{ span: 18 }}
  943. label="合同扫描件"
  944. >
  945. {!this.props.isOnlyRead ? <PicturesWall
  946. domId={'patentPayment1'}
  947. fileList={this.getOrgCodeUrl}
  948. pictureUrl={this.state.orgCodeUrl}
  949. /> :
  950. <div style={{ paddingTop: '10px', paddingBottom: '10px' }}>
  951. <ImgList domId={'patentPayment3'} fileList={this.state.orgCodeUrl} />
  952. </div>
  953. }
  954. {!this.props.isOnlyRead ? <p>图片建议:要清晰。</p> : null}
  955. </FormItem>
  956. </div>
  957. <div className="clearfix">
  958. <FormItem
  959. className="half-item"
  960. {...formItemLayout}
  961. label={
  962. <span>
  963. <strong style={{ color: "#f00" }}>*</strong>客户名称
  964. </span>
  965. }
  966. >
  967. {
  968. !this.props.isOnlyRead ?
  969. <Select
  970. showSearch
  971. value={
  972. this.state.customerServiceList.length === 0 ?
  973. (this.state.customerName || undefined) :
  974. (
  975. this.state.customerServiceList.filter(v => v.value === this.state.customerUid).length === 0 ?
  976. this.state.customerName : this.state.customerUid
  977. )
  978. }
  979. style={{ width: 150, marginLeft: '10px' }}
  980. onSearch={this.getAdminList}
  981. onSelect={(v) => {
  982. this.setState({
  983. customerUid: v
  984. })
  985. }}
  986. filterOption={false}
  987. placeholder="请输入客户名称"
  988. >
  989. {this.state.customerServiceList.map((v, k) => (
  990. <Option title={v.label} key={k} value={v.value}>{v.label}</Option>
  991. ))}
  992. </Select> : <div>{this.state.customerName}</div>
  993. }
  994. </FormItem>
  995. </div>
  996. {this.state.proposer ? <FormItem
  997. className="half-item"
  998. {...formItemLayout}
  999. label="申请人"
  1000. >
  1001. <div>{this.state.proposer}</div>
  1002. </FormItem> : null}
  1003. <FormItem className="half-item" {...formItemLayout} label="省份">
  1004. {
  1005. !this.props.isOnlyRead ?
  1006. <Select
  1007. placeholder="请选择省份"
  1008. style={{ width: "240px" }}
  1009. value={this.state.province ? String(this.state.province) : ''}
  1010. onChange={e => {
  1011. this.setState({ province: e });
  1012. }}
  1013. >
  1014. {cityArr.map(function (item) {
  1015. return (
  1016. <Select.Option key={item.value}>{item.key}</Select.Option>
  1017. );
  1018. })}
  1019. </Select> : <div>{getcityArr(this.state.province)}</div>}
  1020. </FormItem>
  1021. <FormItem
  1022. className="half-item"
  1023. {...formItemLayout}
  1024. label="联系电话"
  1025. >
  1026. {
  1027. !this.props.isOnlyRead ?
  1028. <Input
  1029. placeholder="请输入联系手机"
  1030. value={this.state.contactPhone}
  1031. onChange={e => {
  1032. this.setState({ contactPhone: e.target.value });
  1033. }}
  1034. style={{ width: "240px" }}
  1035. /> : <div>{this.state.contactPhone}</div>
  1036. }
  1037. </FormItem>
  1038. <FormItem
  1039. className="half-item"
  1040. {...formItemLayout}
  1041. label={
  1042. <span>
  1043. <strong style={{ color: "#f00" }}>*</strong>电子邮箱
  1044. </span>
  1045. }
  1046. >
  1047. {
  1048. !this.props.isOnlyRead ?
  1049. <Input
  1050. placeholder="请输入电子邮箱"
  1051. value={this.state.email}
  1052. onChange={e => {
  1053. this.setState({ email: e.target.value });
  1054. }}
  1055. style={{ width: "240px" }}
  1056. /> : <div>{this.state.email}</div>
  1057. }
  1058. </FormItem>
  1059. <FormItem
  1060. className="half-item"
  1061. {...formItemLayout}
  1062. label="状态"
  1063. >
  1064. <span>
  1065. {/*状态 0 未提醒 1 剩余90天 2剩余30天 3剩余20天 4剩余10天 5剩余3天 6剩余2天 7剩余1天*/}
  1066. {
  1067. getMessageReminderStart(this.state.status, true)
  1068. }
  1069. </span>
  1070. </FormItem>
  1071. </div>
  1072. {!this.props.isOnlyRead ? <div style={{ overflow: "hidden" }}>
  1073. <Button style={{ float: "right" }} onClick={this.avisitCancel}>
  1074. 取消
  1075. </Button>
  1076. <Button
  1077. type="primary"
  1078. style={{ float: "right", marginRight: "10px" }}
  1079. loading={this.state.loading}
  1080. onClick={this.baocunxiugai}
  1081. >
  1082. 保存
  1083. </Button>
  1084. </div> : <div />}
  1085. </Modal> : <div />}
  1086. {this.state.visible ? <Modal
  1087. maskClosable={false}
  1088. visible={this.state.visible}
  1089. onOk={this.visitOk}
  1090. onCancel={this.visitCancel}
  1091. width="1000px"
  1092. title="专利资料"
  1093. footer=""
  1094. className="admin-desc-content"
  1095. >
  1096. <div className="clearfix">
  1097. <FormItem
  1098. className="half-item"
  1099. {...formItemLayout}
  1100. label={
  1101. <span>
  1102. <strong style={{ color: "#f00" }}>*</strong>专利号
  1103. </span>
  1104. }
  1105. >
  1106. {
  1107. <Input
  1108. placeholder="请输入专利号"
  1109. value={this.state.patentNo}
  1110. onChange={e => {
  1111. this.setState({ patentNo: e.target.value });
  1112. }}
  1113. style={{ width: "240px" }}
  1114. />
  1115. }
  1116. </FormItem>
  1117. <FormItem
  1118. className="half-item"
  1119. {...formItemLayout}
  1120. label={
  1121. <span>
  1122. <strong style={{ color: "#f00" }}>*</strong>专利名称
  1123. </span>
  1124. }
  1125. >
  1126. {
  1127. <Input
  1128. placeholder="请输入专利名称"
  1129. value={this.state.patentName}
  1130. onChange={e => {
  1131. this.setState({ patentName: e.target.value });
  1132. }}
  1133. style={{ width: "240px" }}
  1134. />
  1135. }
  1136. </FormItem>
  1137. <FormItem
  1138. className="half-item"
  1139. {...formItemLayout}
  1140. label={
  1141. <span>
  1142. <strong style={{ color: "#f00" }}>*</strong>申请日期
  1143. </span>
  1144. }
  1145. >
  1146. <DatePicker
  1147. style={{ marginTop: "2px", width: "240px", height: "32px" }}
  1148. showTime
  1149. format="YYYY-MM-DD"
  1150. onOk={e => { }}
  1151. value={this.state.appDate ? moment(this.state.appDate) : null}
  1152. onChange={(data, dataString) => {
  1153. this.setState({ appDate: dataString });
  1154. }}
  1155. />
  1156. </FormItem>
  1157. <FormItem
  1158. className="half-item"
  1159. {...formItemLayout}
  1160. label={
  1161. <span>
  1162. <strong style={{ color: "#f00" }}>*</strong>专利类型
  1163. </span>
  1164. }
  1165. >
  1166. {
  1167. <Select
  1168. placeholder="请选择专利类型"
  1169. style={{ width: "240px" }}
  1170. value={this.state.patentType}
  1171. onChange={e => {
  1172. this.setState({ patentType: e });
  1173. }}
  1174. >
  1175. {patentTypeList.map(function (item) {
  1176. return (
  1177. <Select.Option key={item.value}>
  1178. {item.key}
  1179. </Select.Option>
  1180. );
  1181. })}
  1182. </Select>
  1183. }
  1184. </FormItem>
  1185. <FormItem
  1186. className="half-item"
  1187. {...formItemLayout}
  1188. label={
  1189. <span>
  1190. <strong style={{ color: "#f00" }}>*</strong>授权日期
  1191. </span>
  1192. }
  1193. >
  1194. <DatePicker
  1195. style={{ marginTop: "2px", width: "240px", height: "32px" }}
  1196. showTime
  1197. format="YYYY-MM-DD"
  1198. onOk={e => { }}
  1199. value={
  1200. this.state.authDate ? moment(this.state.authDate) : null
  1201. }
  1202. onChange={(data, dataString) => {
  1203. this.setState({ authDate: dataString });
  1204. }}
  1205. />
  1206. </FormItem>
  1207. <div className="clearfix">
  1208. <FormItem
  1209. labelCol={{ span: 4 }}
  1210. wrapperCol={{ span: 18 }}
  1211. label="合同扫描件"
  1212. >
  1213. <PicturesWall
  1214. domId={'patentPayment2'}
  1215. fileList={this.getOrgCodeUrl}
  1216. pictureUrl={this.state.orgCodeUrl}
  1217. />
  1218. <p>图片建议:要清晰。</p>
  1219. </FormItem>
  1220. </div>
  1221. <div className="clearfix">
  1222. <FormItem
  1223. className="half-item"
  1224. {...formItemLayout}
  1225. label={
  1226. <span>
  1227. <strong style={{ color: "#f00" }}>*</strong>客户名称
  1228. </span>
  1229. }
  1230. >
  1231. <Select
  1232. showSearch
  1233. value={this.state.customerServiceList.filter(v => v.value === this.state.customerUid).length === 0 ?
  1234. this.state.customerName : this.state.customerUid}
  1235. style={{ width: 150, marginLeft: '10px' }}
  1236. onSearch={this.getAdminList}
  1237. onSelect={(v) => {
  1238. let arr = this.state.customerServiceList.filter(d => d.value === v)
  1239. this.setState({
  1240. customerUid: v,
  1241. customerName: arr[0].label
  1242. })
  1243. }}
  1244. filterOption={false}
  1245. placeholder="请输入客户名称"
  1246. >
  1247. {this.state.customerServiceList.map((v, k) => (
  1248. <Option key={k} value={v.value}>{v.label}</Option>
  1249. ))}
  1250. </Select>
  1251. </FormItem>
  1252. </div>
  1253. <div>
  1254. <span style={{ marginLeft: "50px", fontSize: "20px" }}>
  1255. 申请人资料
  1256. </span>
  1257. </div>
  1258. {/*<FormItem*/}
  1259. {/* className="half-item"*/}
  1260. {/* {...formItemLayout}*/}
  1261. {/* label="申请人/公司"*/}
  1262. {/*>*/}
  1263. {/* {*/}
  1264. {/* <Input*/}
  1265. {/* placeholder="请输入申请人/公司"*/}
  1266. {/* value={this.state.proposer}*/}
  1267. {/* onChange={e => {*/}
  1268. {/* this.setState({ proposer: e.target.value });*/}
  1269. {/* }}*/}
  1270. {/* style={{ width: "240px" }}*/}
  1271. {/* />*/}
  1272. {/* }*/}
  1273. {/*</FormItem>*/}
  1274. <FormItem className="half-item" {...formItemLayout} label="省份">
  1275. <Select
  1276. placeholder="请选择省份"
  1277. style={{ width: "240px" }}
  1278. value={this.state.province}
  1279. onChange={e => {
  1280. this.setState({ province: e });
  1281. }}
  1282. >
  1283. {cityArr.map(function (item) {
  1284. return (
  1285. <Select.Option key={item.value}>{item.key}</Select.Option>
  1286. );
  1287. })}
  1288. </Select>
  1289. </FormItem>
  1290. <FormItem
  1291. className="half-item"
  1292. {...formItemLayout}
  1293. label="联系手机"
  1294. >
  1295. {
  1296. <Input
  1297. placeholder="请输入联系手机"
  1298. value={this.state.contactPhone}
  1299. onChange={e => {
  1300. this.setState({ contactPhone: e.target.value });
  1301. }}
  1302. style={{ width: "240px" }}
  1303. />
  1304. }
  1305. </FormItem>
  1306. <FormItem
  1307. className="half-item"
  1308. {...formItemLayout}
  1309. label={
  1310. <span>
  1311. <strong style={{ color: "#f00" }}>*</strong>电子邮箱
  1312. </span>
  1313. }
  1314. >
  1315. {
  1316. <Input
  1317. placeholder="请输入电子邮箱"
  1318. value={this.state.email}
  1319. onChange={e => {
  1320. this.setState({ email: e.target.value });
  1321. }}
  1322. style={{ width: "240px" }}
  1323. />
  1324. }
  1325. </FormItem>
  1326. </div>
  1327. <div style={{ overflow: "hidden" }}>
  1328. <Button style={{ float: "right" }} onClick={this.onCal}>
  1329. 取消
  1330. </Button>
  1331. <Button
  1332. type="primary"
  1333. style={{ float: "right", marginRight: "10px" }}
  1334. loading={this.state.loading}
  1335. onClick={this.onSure}
  1336. >
  1337. 保存
  1338. </Button>
  1339. </div>
  1340. </Modal> : <div />}
  1341. </div>
  1342. {this.state.reminderLogVisible ? <ReminderLog
  1343. id={this.state.reminderLogId}
  1344. visible={this.state.reminderLogVisible}
  1345. cancel={() => {
  1346. this.setState({
  1347. reminderLogVisible: false,
  1348. reminderLogId: ''
  1349. })
  1350. }}
  1351. /> : null}
  1352. </div>
  1353. );
  1354. }
  1355. }))
  1356. export default PatentPayment;