patentPayment.jsx 37 KB

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