patentPayment.jsx 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320
  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(isNaN(parseInt(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. if (!this.state.patentNo) {
  426. message.warning('专利号不能为空')
  427. return
  428. }
  429. if (!this.state.patentName) {
  430. message.warning('专利名称不能为空')
  431. return
  432. }
  433. if (!this.state.appDate) {
  434. message.warning('申请时间不能为空')
  435. return
  436. }
  437. if(isNaN(parseInt(this.state.patentType))){
  438. message.warning('专利类型不能为空');
  439. return
  440. }
  441. if (!this.state.authDate) {
  442. message.warning('授权日期不能为空')
  443. return
  444. }
  445. if (!this.state.customerUid) {
  446. message.warning('客户名称不能为空')
  447. return
  448. }
  449. 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}$/;
  450. if(this.state.contactPhone && !(mobile.test(this.state.contactPhone) || phone.test(this.state.contactPhone) || phone1.test(this.state.contactPhone))){
  451. message.warning('电话格式不正确');
  452. return
  453. }
  454. let emailReg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); //正则表达式
  455. if(this.state.email === ''){
  456. message.warning('电子邮箱不能为空');
  457. return
  458. }
  459. if(!emailReg.test(this.state.email)){
  460. message.warning('电子邮箱格式不正确');
  461. return
  462. }
  463. this.setState({
  464. loading: true
  465. })
  466. $.ajax({
  467. method: "POST",
  468. dataType: "json",
  469. crossDomain: false,
  470. url: globalConfig.context +'/api/admin/patentNew/updatePatentNew' ,
  471. data: {
  472. id:record.id,
  473. patentNo:this.state.patentNo,
  474. name:this.state.patentName,
  475. type:this.state.patentType,
  476. applyDates:this.state.appDate,
  477. authorizationDates:this.state.authDate,
  478. // applicant:this.state.proposer,
  479. province:this.state.province,
  480. contactMobile:this.state.contactPhone,
  481. email:this.state.email,
  482. status:this.state.status,
  483. certificateUrl:theorgCodeUrl.length?theorgCodeUrl:'',
  484. uid:this.state.customerUid,
  485. },
  486. success: function (data) {
  487. }.bind(this),
  488. }).done(function(data) {
  489. this.setState({
  490. loading: false
  491. });
  492. if(!data.error.length) {
  493. message.success('修改成功!');
  494. this.avisitCancel()
  495. this.loadData(this.state.pageNo)
  496. } else {
  497. message.warning(data.error[0].message);
  498. }
  499. }.bind(this));
  500. },
  501. baocunxiugai(){
  502. this.xiugai(this.state.RowData)
  503. },
  504. avisitCancel(){
  505. this.setState({
  506. avisible:false,
  507. customerServiceList:[]
  508. })
  509. },
  510. reset(){
  511. this.setState({
  512. patentNo:'',
  513. patentName:'',
  514. patentType:undefined,
  515. appDate:undefined,
  516. authDate:undefined,
  517. orgCodeUrl:[],
  518. proposer:'',
  519. province:undefined,
  520. contactPhone:'',
  521. email:'',
  522. customerUid:undefined,
  523. customerName:undefined,
  524. customerServiceList:[],
  525. })
  526. },
  527. searchReset(){
  528. this.setState({
  529. statusSearch:undefined,
  530. nameSearch:undefined,
  531. anameSearch:undefined,
  532. patentNoSearch:undefined,
  533. departmentSearch:undefined,
  534. typeSearch:undefined,
  535. timesArr:[],
  536. },()=>{
  537. this.loadData()
  538. })
  539. },
  540. search(){
  541. this.loadData()
  542. },
  543. onCal(){
  544. this.setState({
  545. visible:false
  546. })
  547. },
  548. getOrgCodeUrl(e) {
  549. this.setState({ orgCodeUrl: e });
  550. },
  551. changeList(arr) {
  552. const newArr = [];
  553. this.state.columns.forEach(item => {
  554. arr.forEach(val => {
  555. if (val === item.title) {
  556. newArr.push(item);
  557. }
  558. });
  559. });
  560. this.setState({
  561. changeList: newArr
  562. });
  563. },
  564. //获取渠道专员列表
  565. getAdminList(value = '') {
  566. if(value.length < 4){return}
  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={
  922. this.state.customerServiceList.length === 0 ?
  923. (this.state.customerName || undefined) :
  924. (
  925. this.state.customerServiceList.filter(v=>v.value === this.state.customerUid).length === 0 ?
  926. this.state.customerName : this.state.customerUid
  927. )
  928. }
  929. style={{ width: 150,marginLeft:'10px' }}
  930. onSearch={this.getAdminList}
  931. onSelect={(v)=>{
  932. this.setState({
  933. customerUid:v
  934. })
  935. }}
  936. filterOption={false}
  937. placeholder="请输入客户名称"
  938. >
  939. {this.state.customerServiceList.map((v,k)=>(
  940. <Option title={v.label} key={k} value={v.value}>{v.label}</Option>
  941. ))}
  942. </Select> : <div>{this.state.customerName}</div>
  943. }
  944. </FormItem>
  945. </div>
  946. {this.state.proposer ? <FormItem
  947. className="half-item"
  948. {...formItemLayout}
  949. label="申请人"
  950. >
  951. <div>{this.state.proposer}</div>
  952. </FormItem> : null}
  953. <FormItem className="half-item" {...formItemLayout} label="省份">
  954. {
  955. !this.props.isOnlyRead ?
  956. <Select
  957. placeholder="请选择省份"
  958. style={{ width: "240px" }}
  959. value={this.state.province ? String(this.state.province) : ''}
  960. onChange={e => {
  961. this.setState({ province: e });
  962. }}
  963. >
  964. {cityArr.map(function(item) {
  965. return (
  966. <Select.Option key={item.value}>{item.key}</Select.Option>
  967. );
  968. })}
  969. </Select> : <div>{getcityArr(this.state.province)}</div> }
  970. </FormItem>
  971. <FormItem
  972. className="half-item"
  973. {...formItemLayout}
  974. label="联系电话"
  975. >
  976. {
  977. !this.props.isOnlyRead ?
  978. <Input
  979. placeholder="请输入联系手机"
  980. value={this.state.contactPhone}
  981. onChange={e => {
  982. this.setState({ contactPhone: e.target.value });
  983. }}
  984. style={{ width: "240px" }}
  985. /> : <div>{this.state.contactPhone}</div>
  986. }
  987. </FormItem>
  988. <FormItem
  989. className="half-item"
  990. {...formItemLayout}
  991. label={
  992. <span>
  993. <strong style={{ color: "#f00" }}>*</strong>电子邮箱
  994. </span>
  995. }
  996. >
  997. {
  998. !this.props.isOnlyRead ?
  999. <Input
  1000. placeholder="请输入电子邮箱"
  1001. value={this.state.email}
  1002. onChange={e => {
  1003. this.setState({ email: e.target.value });
  1004. }}
  1005. style={{ width: "240px" }}
  1006. /> : <div>{this.state.email}</div>
  1007. }
  1008. </FormItem>
  1009. <FormItem
  1010. className="half-item"
  1011. {...formItemLayout}
  1012. label="状态"
  1013. >
  1014. <span>
  1015. {/*状态 0 未提醒 1 剩余90天 2剩余30天 3剩余20天 4剩余10天 5剩余3天 6剩余2天 7剩余1天*/}
  1016. {
  1017. getMessageReminderStart(this.state.status,true)
  1018. }
  1019. </span>
  1020. </FormItem>
  1021. </div>
  1022. {!this.props.isOnlyRead ? <div style={{ overflow: "hidden" }}>
  1023. <Button style={{ float: "right" }} onClick={this.avisitCancel}>
  1024. 取消
  1025. </Button>
  1026. <Button
  1027. type="primary"
  1028. style={{ float: "right", marginRight: "10px" }}
  1029. loading={this.state.loading}
  1030. onClick={this.baocunxiugai}
  1031. >
  1032. 保存
  1033. </Button>
  1034. </div> : <div/>}
  1035. </Modal> : <div/>}
  1036. {this.state.visible ?<Modal
  1037. maskClosable={false}
  1038. visible={this.state.visible}
  1039. onOk={this.visitOk}
  1040. onCancel={this.visitCancel}
  1041. width="1000px"
  1042. title="专利资料"
  1043. footer=""
  1044. className="admin-desc-content"
  1045. >
  1046. <div className="clearfix">
  1047. <FormItem
  1048. className="half-item"
  1049. {...formItemLayout}
  1050. label={
  1051. <span>
  1052. <strong style={{ color: "#f00" }}>*</strong>专利号
  1053. </span>
  1054. }
  1055. >
  1056. {
  1057. <Input
  1058. placeholder="请输入专利号"
  1059. value={this.state.patentNo}
  1060. onChange={e => {
  1061. this.setState({ patentNo: e.target.value });
  1062. }}
  1063. style={{ width: "240px" }}
  1064. />
  1065. }
  1066. </FormItem>
  1067. <FormItem
  1068. className="half-item"
  1069. {...formItemLayout}
  1070. label={
  1071. <span>
  1072. <strong style={{ color: "#f00" }}>*</strong>专利名称
  1073. </span>
  1074. }
  1075. >
  1076. {
  1077. <Input
  1078. placeholder="请输入专利名称"
  1079. value={this.state.patentName}
  1080. onChange={e => {
  1081. this.setState({ patentName: e.target.value });
  1082. }}
  1083. style={{ width: "240px" }}
  1084. />
  1085. }
  1086. </FormItem>
  1087. <FormItem
  1088. className="half-item"
  1089. {...formItemLayout}
  1090. label={
  1091. <span>
  1092. <strong style={{ color: "#f00" }}>*</strong>申请日期
  1093. </span>
  1094. }
  1095. >
  1096. <DatePicker
  1097. style={{ marginTop: "2px", width: "240px", height: "32px" }}
  1098. showTime
  1099. format="YYYY-MM-DD"
  1100. onOk={e => {}}
  1101. value={this.state.appDate ? moment(this.state.appDate) : null}
  1102. onChange={(data, dataString) => {
  1103. this.setState({ appDate: dataString });
  1104. }}
  1105. />
  1106. </FormItem>
  1107. <FormItem
  1108. className="half-item"
  1109. {...formItemLayout}
  1110. label={
  1111. <span>
  1112. <strong style={{ color: "#f00" }}>*</strong>专利类型
  1113. </span>
  1114. }
  1115. >
  1116. {
  1117. <Select
  1118. placeholder="请选择专利类型"
  1119. style={{ width: "240px" }}
  1120. value={this.state.patentType}
  1121. onChange={e => {
  1122. this.setState({ patentType: e });
  1123. }}
  1124. >
  1125. {patentTypeList.map(function(item) {
  1126. return (
  1127. <Select.Option key={item.value}>
  1128. {item.key}
  1129. </Select.Option>
  1130. );
  1131. })}
  1132. </Select>
  1133. }
  1134. </FormItem>
  1135. <FormItem
  1136. className="half-item"
  1137. {...formItemLayout}
  1138. label={
  1139. <span>
  1140. <strong style={{ color: "#f00" }}>*</strong>授权日期
  1141. </span>
  1142. }
  1143. >
  1144. <DatePicker
  1145. style={{ marginTop: "2px", width: "240px", height: "32px" }}
  1146. showTime
  1147. format="YYYY-MM-DD"
  1148. onOk={e => {}}
  1149. value={
  1150. this.state.authDate ? moment(this.state.authDate) : null
  1151. }
  1152. onChange={(data, dataString) => {
  1153. this.setState({ authDate: dataString });
  1154. }}
  1155. />
  1156. </FormItem>
  1157. <div className="clearfix">
  1158. <FormItem
  1159. labelCol={{ span: 4 }}
  1160. wrapperCol={{ span: 18 }}
  1161. label="合同扫描件"
  1162. >
  1163. <PicturesWall
  1164. domId={'patentPayment2'}
  1165. fileList={this.getOrgCodeUrl}
  1166. pictureUrl={this.state.orgCodeUrl}
  1167. />
  1168. <p>图片建议:要清晰。</p>
  1169. </FormItem>
  1170. </div>
  1171. <div className="clearfix">
  1172. <FormItem
  1173. className="half-item"
  1174. {...formItemLayout}
  1175. label={
  1176. <span>
  1177. <strong style={{ color: "#f00" }}>*</strong>客户名称
  1178. </span>
  1179. }
  1180. >
  1181. <Select
  1182. showSearch
  1183. value={this.state.customerServiceList.filter(v=>v.value === this.state.customerUid).length === 0 ?
  1184. this.state.customerName : this.state.customerUid}
  1185. style={{ width: 150,marginLeft:'10px' }}
  1186. onSearch={this.getAdminList}
  1187. onSelect={(v)=>{
  1188. let arr = this.state.customerServiceList.filter(d=>d.value === v)
  1189. this.setState({
  1190. customerUid:v,
  1191. customerName:arr[0].label
  1192. })
  1193. }}
  1194. filterOption={false}
  1195. placeholder="请输入客户名称"
  1196. >
  1197. {this.state.customerServiceList.map((v,k)=>(
  1198. <Option key={k} value={v.value}>{v.label}</Option>
  1199. ))}
  1200. </Select>
  1201. </FormItem>
  1202. </div>
  1203. <div>
  1204. <span style={{ marginLeft: "50px", fontSize: "20px" }}>
  1205. 申请人资料
  1206. </span>
  1207. </div>
  1208. {/*<FormItem*/}
  1209. {/* className="half-item"*/}
  1210. {/* {...formItemLayout}*/}
  1211. {/* label="申请人/公司"*/}
  1212. {/*>*/}
  1213. {/* {*/}
  1214. {/* <Input*/}
  1215. {/* placeholder="请输入申请人/公司"*/}
  1216. {/* value={this.state.proposer}*/}
  1217. {/* onChange={e => {*/}
  1218. {/* this.setState({ proposer: e.target.value });*/}
  1219. {/* }}*/}
  1220. {/* style={{ width: "240px" }}*/}
  1221. {/* />*/}
  1222. {/* }*/}
  1223. {/*</FormItem>*/}
  1224. <FormItem className="half-item" {...formItemLayout} label="省份">
  1225. <Select
  1226. placeholder="请选择省份"
  1227. style={{ width: "240px" }}
  1228. value={this.state.province}
  1229. onChange={e => {
  1230. this.setState({ province: e });
  1231. }}
  1232. >
  1233. {cityArr.map(function(item) {
  1234. return (
  1235. <Select.Option key={item.value}>{item.key}</Select.Option>
  1236. );
  1237. })}
  1238. </Select>
  1239. </FormItem>
  1240. <FormItem
  1241. className="half-item"
  1242. {...formItemLayout}
  1243. label="联系手机"
  1244. >
  1245. {
  1246. <Input
  1247. placeholder="请输入联系手机"
  1248. value={this.state.contactPhone}
  1249. onChange={e => {
  1250. this.setState({ contactPhone: e.target.value });
  1251. }}
  1252. style={{ width: "240px" }}
  1253. />
  1254. }
  1255. </FormItem>
  1256. <FormItem
  1257. className="half-item"
  1258. {...formItemLayout}
  1259. label={
  1260. <span>
  1261. <strong style={{ color: "#f00" }}>*</strong>电子邮箱
  1262. </span>
  1263. }
  1264. >
  1265. {
  1266. <Input
  1267. placeholder="请输入电子邮箱"
  1268. value={this.state.email}
  1269. onChange={e => {
  1270. this.setState({ email: e.target.value });
  1271. }}
  1272. style={{ width: "240px" }}
  1273. />
  1274. }
  1275. </FormItem>
  1276. </div>
  1277. <div style={{ overflow: "hidden" }}>
  1278. <Button style={{ float: "right" }} onClick={this.onCal}>
  1279. 取消
  1280. </Button>
  1281. <Button
  1282. type="primary"
  1283. style={{ float: "right", marginRight: "10px" }}
  1284. loading={this.state.loading}
  1285. onClick={this.onSure}
  1286. >
  1287. 保存
  1288. </Button>
  1289. </div>
  1290. </Modal> : <div/>}
  1291. </div>
  1292. {this.state.reminderLogVisible ? <ReminderLog
  1293. id={this.state.reminderLogId}
  1294. visible={this.state.reminderLogVisible}
  1295. cancel={()=>{
  1296. this.setState({
  1297. reminderLogVisible:false,
  1298. reminderLogId:''
  1299. })
  1300. }}
  1301. /> : null}
  1302. </div>
  1303. );
  1304. }
  1305. }))
  1306. export default PatentPayment;