expert.jsx 34 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042
  1. /*
  2. @author:李霆
  3. @update:2018/05/29
  4. */
  5. import React from 'react';
  6. import {
  7. Radio,
  8. Icon,
  9. Button,
  10. Cascader,
  11. Input,
  12. Select,
  13. Spin,
  14. message,
  15. DatePicker,
  16. Modal,
  17. Upload,
  18. Form,
  19. Row,
  20. Col
  21. } from 'antd';
  22. import $ from 'jquery/src/ajax';
  23. import moment from 'moment';
  24. import './unit.less';
  25. import { areaSelect } from '@/NewDicProvinceList';
  26. import { socialAttribute, industry, adviserType, lawType } from '@/dataDic.js';
  27. import { splitUrl, getAuthState, getAdviserType, getSocialAttribute } from '@/tools.js';
  28. const FormItem = Form.Item;
  29. const monthFormat = 'YYYY/MM';
  30. import Crop from '@/crop/cropBlock';
  31. //图片组件
  32. const PicturesWall = React.createClass({
  33. getInitialState() {
  34. return {
  35. previewVisible: false,
  36. previewImage: '',
  37. fileList: []
  38. };
  39. },
  40. handleCancel() {
  41. this.setState({
  42. previewVisible: false
  43. });
  44. },
  45. handlePreview(file) {
  46. this.setState({
  47. previewImage: file.url || file.thumbUrl,
  48. previewVisible: true
  49. });
  50. },
  51. handleChange(info) {
  52. let fileList = info.fileList;
  53. this.setState({
  54. fileList
  55. });
  56. this.props.fileList(fileList);
  57. },
  58. componentWillReceiveProps(nextProps) {
  59. this.state.fileList = nextProps.pictureUrl;
  60. },
  61. render() {
  62. const { previewVisible, previewImage, fileList } = this.state;
  63. const uploadButton = (
  64. <div>
  65. <Icon type="plus" />
  66. <div className="ant-upload-text">点击上传</div>
  67. </div>
  68. );
  69. return (
  70. <div style={{ display: 'inline-block' }}>
  71. <Upload
  72. action={globalConfig.context + '/api/user/uploadPicture'}
  73. data={{ sign: 'user_picture' }}
  74. listType="picture-card"
  75. fileList={fileList}
  76. onPreview={this.handlePreview}
  77. onChange={this.handleChange}
  78. >
  79. {fileList.length >= 1 ? null : uploadButton}
  80. </Upload>
  81. <Modal maskClosable={false} visible={previewVisible} footer={null} onCancel={this.handleCancel}>
  82. <img alt="example" style={{ width: '100%' }} src={previewImage} />
  83. </Modal>
  84. </div>
  85. );
  86. }
  87. });
  88. const Expert = React.createClass({
  89. getInitialState() {
  90. return {
  91. loading: false,
  92. orgCodeUrl: [],
  93. companyLogoUrl: [],
  94. headPortraitUrl:[],
  95. lawState: false,
  96. adviserUrl: [],
  97. positiveIdUrl: [],
  98. lawUrl: [],
  99. oppositeIdUrl: [],
  100. authenticationState: undefined
  101. };
  102. },
  103. loadInformation(record) {
  104. this.setState({
  105. loading: true
  106. });
  107. $.ajax({
  108. method: 'get',
  109. dataType: 'json',
  110. crossDomain: false,
  111. url: globalConfig.context + '/api/user/getUserDetail',
  112. success: function(data) {
  113. let thisData = data.data;
  114. if (!thisData) {
  115. if (data.error && data.error.length) {
  116. message.warning(data.error[0].message);
  117. }
  118. thisData = {};
  119. }
  120. let ProvinceCityArr = [];
  121. let ProvinceS = thisData.province; //getprovince
  122. let citys = thisData.city;
  123. let Areas = thisData.area;
  124. ProvinceCityArr.push(ProvinceS, citys, Areas);
  125. let month = thisData.dateOfBirthYear
  126. ? thisData.dateOfBirthYear + '/' + thisData.dateOfBirthMonth
  127. : undefined;
  128. let authenticationState = '';
  129. if (thisData.auditStatus == '3') {
  130. authenticationState = (thisData.expert - 1).toString();
  131. }
  132. this.setState({
  133. InformationId: thisData.id,
  134. InformationUid: thisData.uid,
  135. authentication: thisData.authentication,
  136. authenticationState: authenticationState,
  137. dateOfBirthYear: thisData.dateOfBirthYear,
  138. dateOfBirthMonth: thisData.dateOfBirthMonth,
  139. type: thisData.type,
  140. expert: thisData.expert, //认证类型 0-未认证专家顾问 1-专家认证 2-顾问认证
  141. authMessage: thisData.auditInfo,
  142. auditStatus: thisData.auditStatus || '0', //认证状态 0-未认证 1-认证审核中 2-已认证 3-认证失败
  143. headPortraitUrl: thisData.headPortraitUrl //专家照片
  144. ? splitUrl(thisData.headPortraitUrl, ',', globalConfig.avatarHost + '/upload')
  145. : [],
  146. companyLogoUrl:thisData.headPortraitUrl?thisData.headPortraitUrl.split(','):[],
  147. adviserUrl: thisData.adviserUrl //顾问照片
  148. ? splitUrl(thisData.adviserUrl, ',', globalConfig.avatarHost + '/upload')
  149. : [],
  150. positiveIdUrl: thisData.positiveIdUrl
  151. ? splitUrl(thisData.positiveIdUrl, ',', globalConfig.avatarHost + '/upload')
  152. : [],
  153. oppositeIdUrl: thisData.oppositeIdUrl
  154. ? splitUrl(thisData.oppositeIdUrl, ',', globalConfig.avatarHost + '/upload')
  155. : [],
  156. lawUrl: thisData.consultantCertificateUrl
  157. ? splitUrl(thisData.consultantCertificateUrl, ',', globalConfig.avatarHost + '/upload')
  158. : [],
  159. data: thisData,
  160. lawState: thisData.consultantType=='4'?true:false,
  161. ProvinceCity: ProvinceCityArr[0] != null ? ProvinceCityArr : undefined,
  162. yearMonth: month,
  163. workUnit: thisData.workUnit || '',
  164. graduateSchool: thisData.graduateSchool || '',
  165. professionalTitle: thisData.professionalTitle || '',
  166. qualification: thisData.qualification || '',
  167. majorCategory: thisData.majorCategory || '',
  168. adviserType: thisData.consultantType || '',
  169. headPortraitUrlCopy: thisData.headPortraitUrl,
  170. adviserUrlCopy: thisData.adviserUrl,
  171. positiveIdUrlCopy: thisData.positiveIdUrl,
  172. oppositeIdUrlCopy: thisData.oppositeIdUrl
  173. });
  174. }.bind(this)
  175. }).always(
  176. function() {
  177. this.setState({
  178. loading: false
  179. });
  180. }.bind(this)
  181. );
  182. },
  183. //图片
  184. getOrgCodeUrl(e) {
  185. this.setState({
  186. orgCodeUrl: e
  187. });
  188. },
  189. getCompanyLogoUrl(e) {
  190. this.setState({
  191. companyLogoUrl: e
  192. });
  193. },
  194. //基本信息提交
  195. newSubmit(values = {}) {
  196. this.state.data = [];
  197. let thecompanyLogoUrl = [];
  198. if (this.state.positiveIdUrl.length) {
  199. let picArr = [];
  200. this.state.positiveIdUrl.map(function(item) {
  201. if (item.response && item.response.data && item.response.data.length) {
  202. picArr.push(item.response.data);
  203. }
  204. });
  205. thecompanyLogoUrl = picArr.join(',');
  206. }
  207. let thecompanyLogoUrls = [];
  208. if (this.state.oppositeIdUrl.length) {
  209. let picArr = [];
  210. this.state.oppositeIdUrl.map(function(item) {
  211. if (item.response && item.response.data && item.response.data.length) {
  212. picArr.push(item.response.data);
  213. }
  214. });
  215. thecompanyLogoUrls = picArr.join(',');
  216. }
  217. //律师证书
  218. let lawUrls = [];
  219. if (this.state.lawUrl.length) {
  220. let picArr = [];
  221. this.state.lawUrl.map(function(item) {
  222. if (item.response && item.response.data && item.response.data.length) {
  223. picArr.push(item.response.data);
  224. }
  225. });
  226. lawUrls = picArr.join(',');
  227. }
  228. let years = [];
  229. years =
  230. this.state.yearList != undefined
  231. ? this.state.yearList.split('/')
  232. : [ this.state.dateOfBirthYear, this.state.dateOfBirthMonth ];
  233. this.setState({
  234. loading: true
  235. });
  236. let dataList = {};
  237. dataList = {
  238. id: this.state.InformationId,
  239. uid: this.state.InformationUid,
  240. type: this.state.type,
  241. societyTag: values.societyTag,
  242. identifyName: values.identifyName,
  243. industry: values.industry,
  244. dateOfBirthYear: years[0] || '', //出生年
  245. dateOfBirthMonth: years[1] || '', //出生月
  246. province: values.ProvinceCity[0], //省-
  247. city: values.ProvinceCity[1], //市
  248. area: values.ProvinceCity[2], //区
  249. sex: values.sex,
  250. expert: '0',
  251. authentication: this.state.authentication,
  252. // mobile: values.mobile,
  253. fixedTel: values.fixedTel,
  254. qq: values.qq,
  255. idNumber: values.idNumber,
  256. email: values.email,
  257. postalAddress: values.postalAddress,
  258. introduction: values.introduction,
  259. auditStatus: this.state.auditStatus || '0'
  260. };
  261. if (this.state.authenticationState == '0') {
  262. dataList.expert = '1';
  263. dataList.workUnit = values.workUnit;
  264. dataList.professionalTitle = values.professionalTitle;
  265. dataList.qualification = values.qualification;
  266. dataList.majorCategory = values.majorCategory;
  267. dataList.graduateSchool = values.graduateSchool;
  268. dataList.headPortraitUrl = this.state.companyLogoUrl.length>0?(this.state.companyLogoUrl).join(','):[];
  269. dataList.positiveIdUrl = thecompanyLogoUrl.length != 0 ? thecompanyLogoUrl : '';
  270. dataList.oppositeIdUrl = thecompanyLogoUrls.length != 0 ? thecompanyLogoUrls : '';
  271. } else if (this.state.authenticationState == '1') {
  272. dataList.expert = '2';
  273. dataList.typicalCase = values.adviserType == '4' ? values.typicalCase : '';
  274. dataList.workUnit1 = values.adviserType == '4' ? values.workUnit1 : '';
  275. dataList.honer = values.adviserType == '4' ? values.honer : '';
  276. dataList.goodAtIndustry = values.adviserType == '4' ? values.goodAtIndustry : '';
  277. dataList.consultantCertificateUrl = values.adviserType == '4' && lawUrls.length != 0 ? lawUrls : ''; //法律职业资格证
  278. dataList.consultantType = values.adviserType; //顾问类型
  279. dataList.headPortraitUrl = this.state.companyLogoUrl.length>0?(this.state.companyLogoUrl).join(','):[];
  280. dataList.positiveIdUrl = thecompanyLogoUrl.length != 0 ? thecompanyLogoUrl : '';
  281. dataList.oppositeIdUrl = thecompanyLogoUrls.length != 0 ? thecompanyLogoUrls : '';
  282. }
  283. $.ajax({
  284. method: 'post',
  285. dataType: 'json',
  286. url: globalConfig.context + '/api/user/updateUserDetail',
  287. data: dataList
  288. }).done(
  289. function(data) {
  290. this.setState({
  291. loading: false
  292. });
  293. if (!data.error.length) {
  294. //认证状态判定说明
  295. message.success(
  296. (this.state.auditStatus == '0' || this.state.auditStatus == '3') &&
  297. this.state.companyLogoUrl.length
  298. ? '认证审核提交成功,请耐心等待。'
  299. : '保存成功'
  300. );
  301. this.loadInformation();
  302. } else {
  303. message.warning(data.error[0].message);
  304. }
  305. }.bind(this)
  306. );
  307. },
  308. subFun(e) {
  309. e.preventDefault();
  310. this.props.form.validateFields((err, values) => {
  311. if (!err) {
  312. if (this.state.authenticationState == '0' || this.state.authenticationState == '1') {
  313. if ((this.state.companyLogoUrl.length)<1) {
  314. message.warning(this.state.authenticationState == '1' ? '请上传顾问照片!' : '请上传专家照片');
  315. return;
  316. }
  317. if(values.adviserType=='4'&&!(this.state.lawUrl.length)){
  318. message.warning('请上传您的律师职业资格证!');
  319. return;
  320. }
  321. if(!(this.state.oppositeIdUrl.length)||!(this.state.positiveIdUrl.length)){
  322. message.warning('请上传您的身份证正反照片!');
  323. return;
  324. }
  325. this.setState({
  326. visible: true,
  327. values: values
  328. });
  329. } else {
  330. this.newSubmit(values);
  331. }
  332. }
  333. });
  334. },
  335. handleOk() {
  336. this.newSubmit(this.state.values);
  337. this.setState({
  338. visible: false
  339. });
  340. },
  341. handleCancel() {
  342. this.setState({
  343. visible: false
  344. });
  345. },
  346. //顾问选择法律顾问
  347. handleSelectChange(value) {
  348. if (value == '4') {
  349. this.setState({
  350. lawState: true
  351. });
  352. } else {
  353. this.setState({
  354. lawState: false
  355. });
  356. }
  357. },
  358. getHeadPortraitUrl(e) {
  359. this.setState({ companyLogoUrl: e });
  360. },
  361. getPositiveIdUrl(e) {
  362. this.setState({ positiveIdUrl: e });
  363. },
  364. getOppositeIdUrl(e) {
  365. this.setState({ oppositeIdUrl: e });
  366. },
  367. componentWillMount() {
  368. this.loadInformation();
  369. },
  370. authenticationChange(e){
  371. this.setState({
  372. authenticationState: e.target.value,
  373. });
  374. if(this.state.auditStatus=='3'){
  375. this.loadInformation();
  376. }
  377. },
  378. //logo图片获取
  379. getAllImg(imgArr){
  380. this.setState({
  381. companyLogoUrl:imgArr
  382. })
  383. },
  384. componentWillReceiveProps(nextProps) {},
  385. render() {
  386. const { getFieldDecorator } = this.props.form;
  387. const { MonthPicker } = DatePicker;
  388. const formItemLayout = {
  389. labelCol: {
  390. span: 6
  391. },
  392. wrapperCol: {
  393. span: 14
  394. }
  395. };
  396. const theData = this.state.data || [];
  397. return (
  398. <div className="unit-wrap">
  399. <Form layout="horizontal" onSubmit={this.subFun} id="demand-form" style={{ width: '80%' }}>
  400. <Spin spinning={this.state.loading}>
  401. <Row style={{ marginBottom: 20 }}>
  402. <Col offset={2} span={4}>
  403. <h4 style={{ fontSize: 20 }}>个人资料</h4>
  404. </Col>
  405. </Row>
  406. <div className="clearfix">
  407. {this.state.auditStatus == '0' ? (
  408. <FormItem className="half-item" {...formItemLayout} label="姓名">
  409. {getFieldDecorator('identifyName', {
  410. rules: [ { required: true, message: '此项为必填项!' } ],
  411. initialValue: theData.identifyName
  412. })(<Input placeholder="输入姓名" maxLength={128} />)}
  413. </FormItem>
  414. ) : (
  415. <FormItem className="half-item" {...formItemLayout} label="姓名">
  416. <span>{theData.identifyName}</span>
  417. </FormItem>
  418. )}
  419. <FormItem className="half-item" {...formItemLayout} label="手机号码">
  420. <span>{theData.mobile}</span>
  421. </FormItem>
  422. {this.state.auditStatus == '0' ? (
  423. <FormItem className="half-item" {...formItemLayout} label="社会属性">
  424. {getFieldDecorator('societyTag', {
  425. rules: [ { required: true, message: '此项为必填项!' } ],
  426. initialValue: theData.societyTag || undefined
  427. })(
  428. <Select placeholder="客户社会属性" placeholder="请选择社会属性">
  429. {socialAttribute.map(function(item) {
  430. return <Select.Option key={item.value}>{item.key}</Select.Option>;
  431. })}
  432. </Select>
  433. )}
  434. </FormItem>
  435. ) : (
  436. <FormItem className="half-item" {...formItemLayout} label="社会属性">
  437. <span>{getSocialAttribute(theData.societyTag)}</span>
  438. </FormItem>
  439. )}
  440. <FormItem className="half-item" {...formItemLayout} label="行业">
  441. {getFieldDecorator('industry', {
  442. rules: [ { required: true, message: '此项为必填项!' } ],
  443. initialValue: theData.industry ? theData.industry.toString() : undefined
  444. })(
  445. <Select placeholder="选择行业">
  446. {industry.map(function(item) {
  447. return <Select.Option key={item.value}>{item.key}</Select.Option>;
  448. })}
  449. </Select>
  450. )}
  451. </FormItem>
  452. <FormItem className="half-item" {...formItemLayout} label="性别">
  453. {getFieldDecorator('sex', {
  454. initialValue: theData.sex
  455. })(
  456. <Radio.Group>
  457. <Radio value={'男'}>男</Radio>
  458. <Radio value={'女'}>女</Radio>
  459. </Radio.Group>
  460. )}
  461. </FormItem>
  462. <FormItem className="half-item" {...formItemLayout} label="出生日期">
  463. <MonthPicker
  464. value={this.state.yearMonth ? moment(this.state.yearMonth, monthFormat) : undefined}
  465. format={monthFormat}
  466. onChange={(time, times) => {
  467. this.setState({ yearMonth: time, yearList: times });
  468. }}
  469. />
  470. </FormItem>
  471. <FormItem className="half-item" {...formItemLayout} label="身份证号码">
  472. {getFieldDecorator('idNumber', {
  473. initialValue: theData.idNumber
  474. })(<Input placeholder="身份证号码" maxLength={20} />)}
  475. </FormItem>
  476. </div>
  477. <div className="clearfix">
  478. <FormItem className="half-item" {...formItemLayout} label="省-市-区">
  479. {getFieldDecorator('ProvinceCity', {
  480. rules: [ { required: true, message: '此项为必填项!' } ],
  481. initialValue: this.state.ProvinceCity
  482. })(<Cascader options={areaSelect()} placeholder="选择城市" />)}
  483. </FormItem>
  484. <FormItem className="half-item" {...formItemLayout} label="通信地址">
  485. {getFieldDecorator('postalAddress', {
  486. initialValue: theData.postalAddress
  487. })(<Input placeholder="输入通信地址" maxLength={255} />)}
  488. </FormItem>
  489. <FormItem className="half-item" {...formItemLayout} label="固定电话">
  490. {getFieldDecorator('fixedTel', {
  491. initialValue: theData.fixedTel
  492. })(<Input placeholder="输入固定电话" maxLength={13} />)}
  493. </FormItem>
  494. <FormItem className="half-item" {...formItemLayout} label="QQ">
  495. {getFieldDecorator('qq', {
  496. initialValue: theData.qq
  497. })(<Input placeholder="输入qq" maxLength={16} />)}
  498. </FormItem>
  499. <FormItem className="half-item" {...formItemLayout} label="电子邮箱">
  500. {getFieldDecorator('email', {
  501. initialValue: theData.email
  502. })(<Input placeholder="输入电子邮箱" maxLength={128} />)}
  503. </FormItem>
  504. </div>
  505. <div className="clearfix">
  506. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 10 }} label="个人简介">
  507. {getFieldDecorator('introduction', {
  508. initialValue: theData.introduction,
  509. rules: [ { required: true, message: '此项为必填项!' } ]
  510. })(
  511. <Input
  512. type="textarea"
  513. rows={4}
  514. maxLength={512}
  515. placeholder="输入个人简介,比如案例、简介、从业时间、服务企业等"
  516. />
  517. )}
  518. </FormItem>
  519. </div>
  520. {(this.state.expert == '0' ||
  521. this.state.auditStatus == '0' ||
  522. this.state.expert == null ||
  523. this.state.auditStatus == '3') &&
  524. this.state.type != null ? (
  525. <div>
  526. <div className="clearfix btnGrounp">
  527. <Radio.Group
  528. value={this.state.authenticationState}
  529. onChange={this.authenticationChange}
  530. >
  531. {/* <Radio.Button value="0">专家认证</Radio.Button> */}
  532. <Radio.Button value="1">顾问认证</Radio.Button>
  533. </Radio.Group>
  534. <Button
  535. type="dashed"
  536. style={{ marginLeft: 20 }}
  537. onClick={(e) => {
  538. this.setState({ authenticationState: undefined });
  539. }}
  540. >
  541. 暂不认证
  542. </Button>
  543. <span style={{ marginLeft: 10, color: '#f00' }}>
  544. {this.state.auditStatus == '3' ? '(认证失败:' + this.state.authMessage + ')' : ''}
  545. </span>
  546. </div>
  547. {this.state.authenticationState == '0' &&
  548. (this.state.auditStatus == '0' || this.state.auditStatus == '3') ? (
  549. <div className="patentBody">
  550. <FormItem className="half-item" {...formItemLayout} label="毕业院校">
  551. {getFieldDecorator('graduateSchool', {
  552. initialValue: theData.graduateSchool,
  553. rules: [ { required: true, message: '此项为必填项!' } ]
  554. })(<Input placeholder="输入毕业院校全称" maxLength={32} />)}
  555. </FormItem>
  556. <FormItem className="half-item" {...formItemLayout} label="专业类别">
  557. {getFieldDecorator('majorCategory', {
  558. initialValue: theData.majorCategory,
  559. rules: [ { required: true, message: '此项为必填项!' } ]
  560. })(<Input placeholder="输入专业" maxLength={16} />)}
  561. </FormItem>
  562. <FormItem className="half-item" {...formItemLayout} label="职业资格">
  563. {getFieldDecorator('qualification', {
  564. initialValue: theData.qualification,
  565. rules: [ { required: true, message: '此项为必填项!' } ]
  566. })(<Input placeholder="输入职业资格" maxLength={32} />)}
  567. </FormItem>
  568. <FormItem className="half-item" {...formItemLayout} label="就职单位">
  569. {getFieldDecorator('workUnit', {
  570. initialValue: theData.workUnit,
  571. rules: [ { required: true, message: '此项为必填项!' } ]
  572. })(<Input placeholder="输入就职单位全称" maxLength={64} />)}
  573. </FormItem>
  574. <FormItem className="half-item" {...formItemLayout} label="职称">
  575. {getFieldDecorator('professionalTitle', {
  576. initialValue: theData.professionalTitle,
  577. rules: [ { required: true, message: '此项为必填项!' } ]
  578. })(<Input placeholder="输入职称" maxLength={32} />)}
  579. </FormItem>
  580. </div>
  581. ) : this.state.authenticationState == '1' ? (
  582. <div>
  583. <FormItem className="half-item" {...formItemLayout} label="顾问类型">
  584. {getFieldDecorator('adviserType', {
  585. rules: [ { required: true, message: '此项为必填项!' } ],
  586. initialValue:
  587. theData.consultantType || theData.consultantType == '0'
  588. ? theData.consultantType.toString()
  589. : undefined
  590. })(
  591. <Select
  592. placeholder="选择类型"
  593. onChange={this.handleSelectChange.bind(this)}
  594. >
  595. {adviserType.map(function(item) {
  596. return (
  597. <Select.Option key={item.value}>{item.key}</Select.Option>
  598. );
  599. })}
  600. </Select>
  601. )}
  602. </FormItem>
  603. </div>
  604. ) : (
  605. ''
  606. )}
  607. {this.state.lawState && this.state.authenticationState == '1' ? (
  608. <div className="clearfix">
  609. <div className="clearfix">
  610. <FormItem className="half-item" {...formItemLayout} label="律师事务所">
  611. {getFieldDecorator('workUnit1', {
  612. rules: [ { required: true, message: '此项为必填项!' } ],
  613. initialValue: theData.workUnit1
  614. })(<Input placeholder="请填写所在律师事务所全称" />)}
  615. </FormItem>
  616. </div>
  617. <div className="clearfix">
  618. <FormItem className="half-item" {...formItemLayout} label="职称">
  619. {getFieldDecorator('honer', {
  620. initialValue: theData.honer
  621. })(<Input placeholder="请填写您的职称" />)}
  622. </FormItem>
  623. </div>
  624. <div className="clearfix">
  625. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 10 }} label="擅长行业">
  626. {getFieldDecorator('goodAtIndustry', {
  627. initialValue: theData.goodAtIndustry,
  628. })(
  629. <Input
  630. type="textarea"
  631. rows={4}
  632. maxLength={10000}
  633. placeholder="填写您擅长的行业"
  634. />
  635. )}
  636. </FormItem>
  637. </div>
  638. <div className="clearfix">
  639. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 10 }} label="典型案例">
  640. {getFieldDecorator('typicalCase', {
  641. initialValue: theData.typicalCase,
  642. rules: [ { required: true, message: '此项为必填项!' } ]
  643. })(
  644. <Input
  645. type="textarea"
  646. rows={4}
  647. maxLength={10000}
  648. placeholder="输入典型案例"
  649. />
  650. )}
  651. </FormItem>
  652. </div>
  653. </div>
  654. ) : (
  655. ''
  656. )}
  657. {this.state.authenticationState == '1' || this.state.authenticationState == '0' ? (
  658. <div className="clearfix pictures">
  659. <div className="clearfix">
  660. <FormItem
  661. className="half-item"
  662. className="picWidth"
  663. labelCol={{ span: 9 }}
  664. wrapperCol={{ span: 10 }}
  665. label={
  666. <span>
  667. <strong style={{ color: '#f00' }}> * </strong>
  668. <span>
  669. {this.state.authenticationState == '0' ? '专家照片' : '顾问照片'}
  670. </span>
  671. </span>
  672. }
  673. >
  674. <Crop
  675. getAllImg={this.getAllImg}
  676. number = {1}
  677. aspectRatio = {1/1}
  678. url ={globalConfig.context + '/api/user/uploadPicture64'}
  679. uploadData = {{sign:'user_picture'}}
  680. urlArr = {this.state.companyLogoUrl}
  681. />
  682. <p>建议:图片要清晰。</p>
  683. </FormItem>
  684. {this.state.lawState && this.state.authenticationState == '1' ? (
  685. <FormItem
  686. className="half-item"
  687. className="picWidth"
  688. labelCol={{ span: 9 }}
  689. wrapperCol={{ span: 10 }}
  690. label={
  691. <span>
  692. <strong style={{ color: '#f00' }}> * </strong>
  693. <span>律师职业资格证</span>
  694. </span>
  695. }
  696. >
  697. <PicturesWall
  698. fileList={(e) => {
  699. this.setState({ lawUrl: e });
  700. }}
  701. pictureUrl={this.state.lawUrl}
  702. />
  703. <p>建议:图片要清晰。</p>
  704. </FormItem>
  705. ) : (
  706. ''
  707. )}
  708. </div>
  709. <FormItem
  710. className="picWidth"
  711. labelCol={{ span: 9 }}
  712. wrapperCol={{ span: 10 }}
  713. label={
  714. <span>
  715. <strong style={{ color: '#f00' }}>*</strong>
  716. <span>身份证正面</span>
  717. </span>
  718. }
  719. >
  720. <PicturesWall
  721. fileList={this.getPositiveIdUrl}
  722. pictureUrl={this.state.positiveIdUrl}
  723. />
  724. <p>建议:图片要清晰。</p>
  725. </FormItem>
  726. <FormItem
  727. className="picWidth"
  728. labelCol={{ span: 9 }}
  729. wrapperCol={{ span: 10 }}
  730. label={
  731. <span>
  732. <strong style={{ color: '#f00' }}>*</strong>
  733. <span>身份证反面</span>
  734. </span>
  735. }
  736. >
  737. <PicturesWall
  738. fileList={this.getOppositeIdUrl}
  739. pictureUrl={this.state.oppositeIdUrl}
  740. />
  741. <p>建议:图片要清晰。</p>
  742. </FormItem>
  743. </div>
  744. ) : (
  745. ''
  746. )}
  747. </div>
  748. ) : (this.state.auditStatus == '2' || this.state.auditStatus == '1') &&
  749. this.state.expert == '1' ? (
  750. <div>
  751. <div className="authState">
  752. 专家认证<span>({getAuthState(this.state.auditStatus)})</span>
  753. </div>
  754. <FormItem className="half-item" {...formItemLayout} label="毕业院校">
  755. <span>{theData.graduateSchool}</span>
  756. </FormItem>
  757. <FormItem className="half-item" {...formItemLayout} label="专业类别">
  758. <span>{theData.majorCategory}</span>
  759. </FormItem>
  760. <FormItem className="half-item" {...formItemLayout} label="职业资格">
  761. <span>{theData.qualification}</span>
  762. </FormItem>
  763. <FormItem className="half-item" {...formItemLayout} label="就职单位">
  764. <span>{theData.workUnit}</span>
  765. </FormItem>
  766. <FormItem className="half-item" {...formItemLayout} label="职称">
  767. <span>{theData.professionalTitle}</span>
  768. </FormItem>
  769. <div className="clearfix">
  770. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 13 }} label="专家照片">
  771. <Upload
  772. className="demandDetailShow-upload"
  773. listType="picture-card"
  774. fileList={this.state.headPortraitUrl}
  775. onPreview={(file) => {
  776. this.setState({
  777. previewImage: file.url || file.thumbUrl,
  778. previewVisible: true
  779. });
  780. }}
  781. />
  782. <Modal
  783. maskClosable={false}
  784. footer={null}
  785. visible={this.state.previewVisible}
  786. onCancel={() => {
  787. this.setState({ previewVisible: false });
  788. }}
  789. >
  790. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  791. </Modal>
  792. </FormItem>
  793. </div>
  794. <FormItem
  795. className="picWidth"
  796. labelCol={{ span: 9 }}
  797. wrapperCol={{ span: 10 }}
  798. label="身份证正面"
  799. >
  800. <div className="clearfix">
  801. <Upload
  802. className="demandDetailShow-upload"
  803. listType="picture-card"
  804. fileList={this.state.positiveIdUrl}
  805. onPreview={(file) => {
  806. this.setState({
  807. previewImage: file.url || file.thumbUrl,
  808. previewVisible: true
  809. });
  810. }}
  811. />
  812. <Modal
  813. maskClosable={false}
  814. footer={null}
  815. visible={this.state.previewVisible}
  816. onCancel={() => {
  817. this.setState({ previewVisible: false });
  818. }}
  819. >
  820. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  821. </Modal>
  822. </div>
  823. </FormItem>
  824. <FormItem
  825. className="picWidth"
  826. labelCol={{ span: 9 }}
  827. wrapperCol={{ span: 10 }}
  828. label="身份证反面"
  829. >
  830. <div className="clearfix">
  831. <Upload
  832. className="demandDetailShow-upload"
  833. listType="picture-card"
  834. fileList={this.state.oppositeIdUrl}
  835. onPreview={(file) => {
  836. this.setState({
  837. previewImage: file.url || file.thumbUrl,
  838. previewVisible: true
  839. });
  840. }}
  841. />
  842. <Modal
  843. maskClosable={false}
  844. footer={null}
  845. visible={this.state.previewVisible}
  846. onCancel={() => {
  847. this.setState({ previewVisible: false });
  848. }}
  849. >
  850. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  851. </Modal>
  852. </div>
  853. </FormItem>
  854. </div>
  855. ) : (this.state.auditStatus == '2' || this.state.auditStatus == '1') &&
  856. this.state.expert == '2' ? (
  857. <div className="clearfix">
  858. <div className="authState">
  859. 顾问认证<span>({getAuthState(this.state.auditStatus)})</span>
  860. </div>
  861. <FormItem className="half-item" {...formItemLayout} label="顾问类型">
  862. <span>{getAdviserType(theData.consultantType)}</span>
  863. </FormItem>
  864. {theData.consultantType == '4' ? (
  865. <div className="clearfix">
  866. <div className="clearfix">
  867. <FormItem className="half-item" {...formItemLayout} label="律师事务所">
  868. <span>{theData.workUnit1}</span>
  869. </FormItem>
  870. </div>
  871. <div className="clearfix">
  872. <FormItem className="half-item" {...formItemLayout} label="职称">
  873. <span>{theData.honer}</span>
  874. </FormItem>
  875. </div>
  876. <div className="clearfix">
  877. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 10 }} label="擅长行业">
  878. <span>{theData.goodAtIndustry}</span>
  879. </FormItem>
  880. </div>
  881. <div className="clearfix">
  882. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 10 }} label="典型案例">
  883. <span>{theData.typicalCase}</span>
  884. </FormItem>
  885. </div>
  886. </div>
  887. ) : (
  888. ''
  889. )}
  890. <div className="clearfix">
  891. <FormItem className="picWidth" labelCol={{ span: 9 }} wrapperCol={{ span: 10 }} label="顾问照片">
  892. <Upload
  893. className="demandDetailShow-upload"
  894. listType="picture-card"
  895. fileList={this.state.headPortraitUrl}
  896. onPreview={(file) => {
  897. this.setState({
  898. previewImage: file.url || file.thumbUrl,
  899. previewVisible: true
  900. });
  901. }}
  902. />
  903. <Modal
  904. maskClosable={false}
  905. footer={null}
  906. visible={this.state.previewVisible}
  907. onCancel={() => {
  908. this.setState({ previewVisible: false });
  909. }}
  910. >
  911. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  912. </Modal>
  913. </FormItem>
  914. {theData.consultantType == '4' && (
  915. <FormItem className="picWidth" labelCol={{ span: 9 }} wrapperCol={{ span: 10 }} label="律师职业资格证">
  916. <Upload
  917. className="demandDetailShow-upload"
  918. listType="picture-card"
  919. fileList={this.state.lawUrl}
  920. onPreview={(file) => {
  921. this.setState({
  922. previewImage: file.url || file.thumbUrl,
  923. previewVisible: true
  924. });
  925. }}
  926. />
  927. <Modal
  928. maskClosable={false}
  929. footer={null}
  930. visible={this.state.previewVisible}
  931. onCancel={() => {
  932. this.setState({ previewVisible: false });
  933. }}
  934. >
  935. <img
  936. alt=""
  937. style={{ width: '100%' }}
  938. src={this.state.previewImage || ''}
  939. />
  940. </Modal>
  941. </FormItem>
  942. )}
  943. </div>
  944. <div>
  945. <FormItem
  946. className="picWidth"
  947. labelCol={{ span: 9 }}
  948. wrapperCol={{ span: 10 }}
  949. label="身份证正面"
  950. >
  951. <div className="clearfix">
  952. <Upload
  953. className="demandDetailShow-upload"
  954. listType="picture-card"
  955. fileList={this.state.positiveIdUrl}
  956. onPreview={(file) => {
  957. this.setState({
  958. previewImage: file.url || file.thumbUrl,
  959. previewVisible: true
  960. });
  961. }}
  962. />
  963. <Modal
  964. maskClosable={false}
  965. footer={null}
  966. visible={this.state.previewVisible}
  967. onCancel={() => {
  968. this.setState({ previewVisible: false });
  969. }}
  970. >
  971. <img
  972. alt=""
  973. style={{ width: '100%' }}
  974. src={this.state.previewImage || ''}
  975. />
  976. </Modal>
  977. </div>
  978. </FormItem>
  979. <FormItem
  980. className="picWidth"
  981. labelCol={{ span: 9 }}
  982. wrapperCol={{ span: 10 }}
  983. label="身份证反面"
  984. >
  985. <div className="clearfix">
  986. <Upload
  987. className="demandDetailShow-upload"
  988. listType="picture-card"
  989. fileList={this.state.oppositeIdUrl}
  990. onPreview={(file) => {
  991. this.setState({
  992. previewImage: file.url || file.thumbUrl,
  993. previewVisible: true
  994. });
  995. }}
  996. />
  997. <Modal
  998. maskClosable={false}
  999. footer={null}
  1000. visible={this.state.previewVisible}
  1001. onCancel={() => {
  1002. this.setState({ previewVisible: false });
  1003. }}
  1004. >
  1005. <img
  1006. alt=""
  1007. style={{ width: '100%' }}
  1008. src={this.state.previewImage || ''}
  1009. />
  1010. </Modal>
  1011. </div>
  1012. </FormItem>
  1013. </div>
  1014. </div>
  1015. ) : (
  1016. ''
  1017. )}
  1018. <div className="clearfix">
  1019. <Row style={{ marginBottom: 20 }}>
  1020. <Col offset={3} span={4}>
  1021. <Button size="large" className="set-submit" type="primary" htmlType="submit">
  1022. 保存
  1023. </Button>
  1024. </Col>
  1025. </Row>
  1026. </div>
  1027. </Spin>
  1028. </Form>
  1029. <Modal visible={this.state.visible} onOk={this.handleOk} onCancel={this.handleCancel}>
  1030. {this.state.authenticationState == '0' && <p>是否申请专家认证?注意:认证成功后,您的信息将在本平台展示。</p>}
  1031. {this.state.authenticationState == '1' && <p>是否申请顾问认证?注意:认证成功后,您的信息将在本平台展示。</p>}
  1032. </Modal>
  1033. </div>
  1034. );
  1035. }
  1036. });
  1037. export default Form.create()(Expert);