patentPayment.jsx 38 KB

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