expert.jsx 34 KB

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