myClientDesc.jsx 60 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356
  1. import React from 'react';
  2. import { Tabs, Table, Icon, Tooltip, Modal, message, AutoComplete, Spin, DatePicker,Upload, Input, InputNumber, Select,TimePicker, Button, Radio, Form, Cascader, Tag, Switch } from 'antd';
  3. import './myClient.less';
  4. import ajax from 'jquery/src/ajax/xhr.js';
  5. import moment from 'moment';
  6. import $ from 'jquery/src/ajax';
  7. import { areaSelect } from '../../NewDicProvinceList';
  8. import { maturityList, innovationList, transferModeList,cityArr ,newFollow,customerStatus,intentionalService,tag} from '../../dataDic';
  9. import { IndustryObject, getIndustryCategory } from '../../DicIndustryList.js';
  10. import { beforeUploadFile, splitUrl, companySearch, getTransferMode, getAchievementCategory, getTechAuditStatus, getDemandType, getMaturity, getInnovation,beforeUpload, getBase64,getsex,getCompanyIntention,getcityArr,getfllowSituation,getcustomerStatue} from '../../tools.js';
  11. import throttle from '../../throttle.js';
  12. const KeyWordTagGroup = React.createClass({
  13. getInitialState() {
  14. return {
  15. tags: [],
  16. inputVisible: false,
  17. inputValue: ''
  18. };
  19. },
  20. handleClose(removedTag) {
  21. const tags = this.state.tags.filter(tag => tag !== removedTag);
  22. this.props.tagsArr(tags);
  23. this.setState({ tags });
  24. },
  25. showInput() {
  26. this.setState({ inputVisible: true }, () => this.input.focus());
  27. },
  28. handleInputChange(e) {
  29. this.setState({ inputValue: e.target.value });
  30. },
  31. handleInputConfirm() {
  32. const state = this.state;
  33. const inputValue = state.inputValue;
  34. let tags = state.tags;
  35. if (inputValue && tags.indexOf(inputValue) === -1 && inputValue.replace(/(^\s*)|(\s*$)/g, "").length != 0) {
  36. tags = [...tags, inputValue.replace(/(^\s*)|(\s*$)/g, "")];
  37. };
  38. this.props.tagsArr(tags);
  39. this.setState({
  40. tags,
  41. inputVisible: false,
  42. inputValue: '',
  43. });
  44. },
  45. componentWillMount() {
  46. this.state.tags = this.props.keyWordArr;
  47. },
  48. componentWillReceiveProps(nextProps) {
  49. if (this.props.keyWordArr != nextProps.keyWordArr) {
  50. this.state.tags = nextProps.keyWordArr;
  51. };
  52. },
  53. render() {
  54. const { tags, inputVisible, inputValue } = this.state;
  55. return (
  56. <div className="keyWord-tips">
  57. {tags.map((tag, index) => {
  58. const isLongTag = tag.length > 10;
  59. const tagElem = (
  60. <Tag key={tag} closable={index !== -1} afterClose={() => this.handleClose(tag)}>
  61. {isLongTag ? `${tag.slice(0, 10)}...` : tag}
  62. </Tag>
  63. );
  64. return isLongTag ? <Tooltip key={tag} title={tag}>{tagElem}</Tooltip> : tagElem;
  65. })}
  66. {inputVisible && (
  67. <Input
  68. ref={input => this.input = input}
  69. type="text"
  70. style={{ width: 78 }}
  71. value={inputValue}
  72. onChange={this.handleInputChange}
  73. onBlur={this.handleInputConfirm}
  74. onPressEnter={this.handleInputConfirm}
  75. />
  76. )}
  77. {!inputVisible && <Button className="addtips" type="dashed" disabled={tags.length > 9 ? true : false} onClick={this.showInput}>+ 新关键词</Button>}
  78. </div>
  79. );
  80. }
  81. });
  82. const PicturesWall = React.createClass({
  83. getInitialState() {
  84. return {
  85. previewVisible: false,
  86. previewImage: '',
  87. fileList: [],
  88. }
  89. },
  90. handleCancel() {
  91. this.setState({ previewVisible: false })
  92. },
  93. handlePreview(file) {
  94. this.setState({
  95. previewImage: file.url || file.thumbUrl,
  96. previewVisible: true,
  97. });
  98. },
  99. handleChange(info) {
  100. let fileList = info.fileList;
  101. this.setState({ fileList });
  102. this.props.fileList(fileList);
  103. },
  104. componentWillReceiveProps(nextProps) {
  105. this.state.fileList = nextProps.pictureUrl;
  106. },
  107. render() {
  108. const { previewVisible, previewImage, fileList } = this.state;
  109. const uploadButton = (
  110. <div>
  111. <Icon type="plus" />
  112. <div className="ant-upload-text">点击上传</div>
  113. </div>
  114. );
  115. return (
  116. <div className="clearfix">
  117. <Upload
  118. action={globalConfig.context + "/api/admin/achievement/uploadPicture"}
  119. data={{ 'sign': this.props.pictureSign }}
  120. listType="picture-card"
  121. fileList={fileList}
  122. onPreview={this.handlePreview}
  123. onChange={this.handleChange} >
  124. {fileList.length >= 5 ? null : uploadButton}
  125. </Upload>
  126. <Modal maskClosable={false} visible={previewVisible} footer={null} onCancel={this.handleCancel}>
  127. <img alt="example" style={{ width: '100%' }} src={previewImage} />
  128. </Modal>
  129. </div>
  130. );
  131. }
  132. });
  133. const AchievementDetailShow = Form.create()(React.createClass({
  134. getInitialState() {
  135. return {
  136. loading: false,
  137. buttonLoading: false,
  138. contactsObj: {},
  139. data: {},
  140. tags: [],
  141. technicalPictureUrl: [],
  142. coverImg: [],
  143. maturityPictureUrl: [],
  144. textFileList: [],
  145. techPlanFileList: [],
  146. businessPlanFileList: []
  147. };
  148. },
  149. //鼠标点击整行的时候的函数
  150. loadData(id, detailApiUrl) {
  151. this.setState({
  152. loading: true
  153. });
  154. $.ajax({
  155. method: "post",
  156. dataType: "json",
  157. crossDomain: false,
  158. url: globalConfig.context + detailApiUrl,
  159. data: {
  160. id: id
  161. },
  162. success: function (data) {
  163. let thisData = data.data;
  164. if (!thisData) {
  165. if (data.error && data.error.length) {
  166. message.warning(data.error[0].message);
  167. };
  168. thisData = {};
  169. };
  170. this.setState({
  171. data: thisData,
  172. orgDisplay: thisData.ownerType,
  173. switchValue: Boolean(!thisData.ownerId),
  174. radios:thisData.hot==='1'?true:false,
  175. tags: thisData.keyword ? (thisData.keyword.replace(/(,|、)/g, ",")).split(',') : [],
  176. technicalPictureUrl: thisData.technicalPictureUrl ? splitUrl(thisData.technicalPictureUrl, ',', globalConfig.avatarHost + '/upload') : [],
  177. coverImg: thisData.coverImg ? splitUrl(thisData.coverImg, ',', globalConfig.avatarHost + '/upload') : [],
  178. maturityPictureUrl: thisData.maturityPictureUrl ? splitUrl(thisData.maturityPictureUrl, ',', globalConfig.avatarHost + '/upload') : [],
  179. });
  180. if (thisData.ownerId) {
  181. this.getContactsList(thisData.ownerId);
  182. };
  183. }.bind(this),
  184. }).always(function () {
  185. this.setState({
  186. loading: false
  187. });
  188. }.bind(this));
  189. },
  190. offShelf() {
  191. this.setState({
  192. loading: true
  193. });
  194. $.ajax({
  195. method: "post",
  196. dataType: "json",
  197. crossDomain: false,
  198. url: globalConfig.context + "/api/admin/achievement/offShelf",
  199. data: { "id": this.props.data.id }
  200. }).done(function (data) {
  201. if (!data.error.length) {
  202. message.success('撤销成功!');
  203. this.setState({
  204. visible: false,
  205. releaseSubmitVisible: false
  206. });
  207. this.props.handleOk();
  208. } else {
  209. message.warning(data.error[0].message);
  210. }
  211. }.bind(this));
  212. },
  213. modifyBroker() {
  214. this.props.form.validateFields((err, values) => {
  215. if (!err) {
  216. this.setState({
  217. loading: true
  218. });
  219. $.ajax({
  220. method: "POST",
  221. dataType: "json",
  222. crossDomain: false,
  223. url: globalConfig.context + '/api/admin/audit/modifyAchievementTechBroker',
  224. data: {
  225. id: this.props.data.id,
  226. techBrokerId: values.modifyTechBrokerId
  227. }
  228. }).done(function (data) {
  229. this.state.auditStatus = 0;
  230. this.setState({
  231. loading: false
  232. });
  233. if (data.error && data.error.length) {
  234. message.warning(data.error[0].message);
  235. } else {
  236. message.success('保存成功!');
  237. this.props.handleOk();
  238. };
  239. }.bind(this));
  240. }
  241. });
  242. },
  243. formSubmit() {
  244. this.props.form.validateFields((err, values) => {
  245. if (!err) {
  246. this.setState({
  247. loading: true
  248. });
  249. $.ajax({
  250. method: "POST",
  251. dataType: "json",
  252. crossDomain: false,
  253. url: globalConfig.context + '/api/admin/audit/achievement',
  254. data: {
  255. id: this.props.data.id,
  256. techBroderId: values.techBrokerId,
  257. auditStatus: values.auditStatus
  258. }
  259. }).done(function (data) {
  260. this.state.auditStatus = 0;
  261. this.setState({
  262. loading: false
  263. });
  264. if (!data.error.length) {
  265. message.success('保存成功!');
  266. this.setState({
  267. formSubmitVisible: false
  268. });
  269. this.props.handleOk();
  270. } else {
  271. message.warning(data.error[0].message);
  272. };
  273. }.bind(this));
  274. }
  275. });
  276. },
  277. handleSubmit(e) {
  278. e.preventDefault();
  279. this.props.form.validateFields((err, values) => {
  280. if (values.auditStatus == 4) {
  281. this.setState({
  282. formSubmitVisible: true
  283. });
  284. } else {
  285. this.formSubmit();
  286. };
  287. });
  288. },
  289. buildMatchList() {
  290. this.setState({
  291. buttonLoading: true
  292. });
  293. $.ajax({
  294. method: "POST",
  295. dataType: "json",
  296. crossDomain: false,
  297. url: globalConfig.context + '/api/admin/achievement/matchDemand',
  298. data: {
  299. id: this.props.data.id,
  300. }
  301. }).done(function (data) {
  302. this.setState({
  303. buttonLoading: false
  304. });
  305. if (!data.error.length) {
  306. message.success('匹配完成!匹配到' + data.data + '条记录');
  307. } else {
  308. message.warning(data.error[0].message);
  309. };
  310. }.bind(this));
  311. },
  312. getContactsList(theUid) {
  313. $.ajax({
  314. method: "get",
  315. dataType: "json",
  316. crossDomain: false,
  317. url: globalConfig.context + "/api/admin/findCustomer",
  318. data: {
  319. id: theUid
  320. },
  321. success: function (data) {
  322. if (!data.data) {
  323. if (data.error && data.error.length) {
  324. message.warning(data.error[0].message);
  325. return;
  326. };
  327. } else {
  328. this.setState({
  329. contactsObj: data.data || {}
  330. });
  331. };
  332. }.bind(this),
  333. });
  334. },
  335. componentWillMount() {
  336. this.loadData(this.props.data.id, this.props.detailApiUrl);
  337. },
  338. componentWillReceiveProps(nextProps) {
  339. if (!this.props.visible && nextProps.visible) {
  340. this.loadData(nextProps.data.id, nextProps.detailApiUrl);
  341. this.state.textFileList = [];
  342. this.state.techPlanFileList = [];
  343. this.state.businessPlanFileList = [];
  344. this.props.form.resetFields();
  345. };
  346. },
  347. render() {
  348. const theData = this.state.data || {};
  349. const { getFieldDecorator } = this.props.form;
  350. const FormItem = Form.Item
  351. const formItemLayout = {
  352. labelCol: { span: 8 },
  353. wrapperCol: { span: 14 },
  354. };
  355. return (
  356. <Form horizontal onSubmit={this.handleSubmit} id="demand-form">
  357. <Spin spinning={this.state.loading}>
  358. <div className="clearfix">
  359. <FormItem className="half-item"
  360. {...formItemLayout}
  361. label="客户类型5555" >
  362. <span>{theData._shareType}</span>
  363. </FormItem>
  364. <FormItem className="half-item"
  365. {...formItemLayout}
  366. label="编号" >
  367. <span>{theData.id}</span>
  368. </FormItem>
  369. <div className="clearfix" style={{marginLeft:'40px',marginBottom:'20px',color:'#000000'}}>基本资料:</div>
  370. </div>
  371. {/* <FormItem className="half-item"
  372. {...formItemLayout}
  373. label="录入时间" >
  374. {getFieldDecorator('createTime', {
  375. initialValue: theData.createTime ? moment(theData.createTime) : null
  376. })(
  377. <DatePicker />
  378. )}
  379. </FormItem> */}
  380. <FormItem className="half-item"
  381. {...formItemLayout}
  382. label="跟单人" >
  383. {getFieldDecorator('ownerId', {
  384. initialValue: theData.ownerId
  385. })(
  386. <Input />
  387. )}
  388. </FormItem>
  389. <div className="clearfix" style={{marginLeft:'40px',marginBottom:'20px',color:'#000000'}}>公司资料:</div>
  390. <div>
  391. <FormItem className="half-item"
  392. {...formItemLayout}
  393. label="公司名称" >
  394. {getFieldDecorator('companyName', {
  395. rules: [{ required: true, message: '此项为必填项!' }],
  396. initialValue: theData.companyName
  397. })(
  398. <Input />
  399. )}
  400. </FormItem>
  401. <FormItem className="half-item"
  402. {...formItemLayout}
  403. label="公司行业" >
  404. {getFieldDecorator('companyIndustry', {
  405. initialValue: theData.companyIndustry
  406. })(
  407. <Input />
  408. )}
  409. </FormItem>
  410. <FormItem className="half-item"
  411. {...formItemLayout}
  412. label="意向服务" >
  413. {getFieldDecorator('companyIntention', {
  414. rules: [{ required: true, message: '此项为必填项!' }],
  415. initialValue: theData.companyIntention
  416. })(
  417. <Select placeholder="选择服务类型" >
  418. {
  419. intentionalService.map(function (item) {
  420. return <Select.Option key={item.value} >{item.key}</Select.Option>
  421. })
  422. }
  423. </Select>
  424. )}
  425. </FormItem>
  426. <FormItem className="half-item"
  427. {...formItemLayout}
  428. label="地区" >
  429. {getFieldDecorator('locationProvince', {
  430. initialValue: theData.locationProvince
  431. })(
  432. <Select placeholder="选择地区" style={{ width: 160 }} >
  433. {
  434. cityArr.map(function (item) {
  435. return <Select.Option key={item.value} >{item.key}</Select.Option>
  436. })
  437. }
  438. </Select>
  439. )}
  440. </FormItem>
  441. <FormItem className="half-item"
  442. {...formItemLayout}
  443. label="最新跟进" >
  444. {getFieldDecorator('followSituation', {
  445. initialValue: theData.followSituation
  446. })(
  447. <Select placeholder="选择跟进进度" style={{ width: 160 }} >
  448. {
  449. newFollow.map(function (item) {
  450. return <Select.Option key={item.value} >{item.key}</Select.Option>
  451. })
  452. }
  453. </Select>
  454. )}
  455. </FormItem>
  456. <FormItem className="half-item"
  457. {...formItemLayout}
  458. label="客户状态" >
  459. {getFieldDecorator('customerStatus', {
  460. initialValue: theData.customerStatus
  461. })(
  462. <Select placeholder="选择客户状态" style={{ width: 160 }} >
  463. {
  464. customerStatus.map(function (item) {
  465. return <Select.Option key={item.value} >{item.key}</Select.Option>
  466. })
  467. }
  468. </Select>
  469. )}
  470. </FormItem>
  471. <FormItem className="half-item"
  472. {...formItemLayout}
  473. label="详细地址" >
  474. {getFieldDecorator('adress', {
  475. initialValue: theData.adress
  476. })(
  477. <Input />
  478. )}
  479. </FormItem>
  480. <div className="clearfix">
  481. <FormItem
  482. labelCol={{ span: 4 }}
  483. wrapperCol={{ span: 18 }}
  484. label="备注" >
  485. {getFieldDecorator('remarks', {
  486. initialValue: theData.remarks
  487. })(
  488. <Input type="textarea" rows={4} />
  489. )}
  490. </FormItem>
  491. </div>
  492. </div>
  493. <div className="clearfix" style={{marginLeft:'40px',marginBottom:'20px',color:'#000000'}}>联系资料:</div>
  494. <div>
  495. <FormItem className="half-item"
  496. {...formItemLayout}
  497. label="姓名" >
  498. {getFieldDecorator('name', {
  499. rules: [{ required: true, message: '此项为必填项!' }],
  500. initialValue: theData.name
  501. })(
  502. <Input />
  503. )}
  504. </FormItem>
  505. <FormItem className="half-item"
  506. {...formItemLayout}
  507. label="性别" >
  508. {getFieldDecorator('sex', {
  509. rules: [{ required: true, message: '此项为必填项!' }],
  510. initialValue:getsex(theData.sex)
  511. })(
  512. <Radio.Group>
  513. <Radio value="0">男</Radio>
  514. <Radio value="1">女</Radio>
  515. </Radio.Group>
  516. )}
  517. </FormItem>
  518. <FormItem className="half-item"
  519. {...formItemLayout}
  520. label="手机号码" >
  521. {getFieldDecorator('telNum', {
  522. rules: [{ required: true, message: '此项为必填项!' }],
  523. initialValue: theData.telNum
  524. })(
  525. <Input />
  526. )}
  527. </FormItem>
  528. <FormItem className="half-item"
  529. {...formItemLayout}
  530. label="座机号" >
  531. {getFieldDecorator('mobile', {
  532. initialValue: theData.mobile
  533. })(
  534. <Input />
  535. )}
  536. </FormItem>
  537. <FormItem className="half-item"
  538. {...formItemLayout}
  539. label="QQ号码" >
  540. {getFieldDecorator('qq', {
  541. initialValue: theData.qq
  542. })(
  543. <Input />
  544. )}
  545. </FormItem>
  546. <FormItem className="half-item"
  547. {...formItemLayout}
  548. label="邮箱号" >
  549. {getFieldDecorator('email', {
  550. initialValue: theData.email
  551. })(
  552. <Input />
  553. )}
  554. </FormItem>
  555. <FormItem className="half-item"
  556. {...formItemLayout}
  557. label="微信" >
  558. {getFieldDecorator('wechat', {
  559. initialValue: theData.wechat
  560. })(
  561. <Input />
  562. )}
  563. </FormItem>
  564. <FormItem className="half-item"
  565. {...formItemLayout}
  566. label="部门" >
  567. {getFieldDecorator('depatrment', {
  568. initialValue: theData.depatrment
  569. })(
  570. <Input />
  571. )}
  572. </FormItem>
  573. <FormItem className="half-item"
  574. {...formItemLayout}
  575. label="职位" >
  576. {getFieldDecorator('customerPosition', {
  577. initialValue: theData.customerPosition
  578. })(
  579. <Input />
  580. )}
  581. </FormItem>
  582. </div>
  583. <FormItem wrapperCol={{ span: 12, offset: 4 }}>
  584. <Button className="set-submit" type="primary" htmlType="submit" id="change_keep">保存</Button>
  585. <Button className="set-submit" type="ghost" onClick={this.props.closeDesc} id='change_rem'>取消</Button>
  586. </FormItem>
  587. {/* <FormItem wrapperCol={{ span: 12, offset: 4 }}>
  588. {theData.auditStatus == 2 ? <Button className="set-submit" type="primary" htmlType="submit">保存</Button> : <span></span>}
  589. {theData.auditStatus == 3 ? <Button className="set-submit" type="primary" onClick={() => { this.modifyBroker(); }}>保存</Button> : <span></span>}
  590. <Button className="set-submit" type="ghost" onClick={this.props.closeDesc}>取消</Button> */}
  591. {/*{window.showAuditStatus ? <Button className="set-submit" loading={this.state.buttonLoading} type="primary" onClick={this.buildMatchList}>生成匹配列表</Button> : <span></span>}*/}
  592. {/* </FormItem>
  593. */}
  594. </Spin>
  595. </Form >
  596. )
  597. }
  598. }));
  599. const AchievementDetailForm = Form.create()(React.createClass({
  600. getInitialState() {
  601. return {
  602. loading: false,
  603. auditStatus: 0,
  604. textFileList: [],
  605. switchValue: false,
  606. radios: false,
  607. techPlanFileList: [],
  608. data: {},
  609. tags: [],
  610. technicalPictureUrl: [],
  611. coverImg: [],
  612. maturityPictureUrl: [],
  613. businessPlanFileList: [],
  614. dataSource: [],
  615. };
  616. },
  617. loadData(id, detailApiUrl) {
  618. this.setState({
  619. loading: true
  620. });
  621. $.ajax({
  622. method: "get",
  623. dataType: "json",
  624. crossDomain: false,
  625. url: globalConfig.context + detailApiUrl,
  626. data: {
  627. id: id
  628. },
  629. success: function (data) {
  630. let thisData = data.data;
  631. if (!thisData) {
  632. if (data.error && data.error.length) {
  633. message.warning(data.error[0].message);
  634. };
  635. thisData = {};
  636. };
  637. this.setState({
  638. data: thisData,
  639. orgDisplay: thisData.ownerType,
  640. switchValue: Boolean(!thisData.ownerId),
  641. radios: thisData.hot == '1' ? true : false,
  642. transferPriceDis: thisData.transferMode == 1 ? true : false,
  643. tags: thisData.keyword ? (thisData.keyword.replace(/(,|、)/g, ",")).split(',') : [],
  644. technicalPictureUrl: thisData.technicalPictureUrl ? splitUrl(thisData.technicalPictureUrl, ',', globalConfig.avatarHost + '/upload') : [],
  645. coverImg: thisData.coverImg ? splitUrl(thisData.coverImg, ',', globalConfig.avatarHost + '/upload') : [],
  646. maturityPictureUrl: thisData.maturityPictureUrl ? splitUrl(thisData.maturityPictureUrl, ',', globalConfig.avatarHost + '/upload') : [],
  647. });
  648. if (thisData.ownerType == "1" && thisData.ownerId) {
  649. this.getContactsList(thisData.ownerId);
  650. };
  651. }.bind(this),
  652. }).always(function () {
  653. this.setState({
  654. loading: false
  655. });
  656. }.bind(this));
  657. },
  658. getContactsList(theUid) {
  659. $.ajax({
  660. method: "get",
  661. dataType: "json",
  662. crossDomain: false,
  663. url: globalConfig.context + "/api/admin/getContacts",
  664. data: {
  665. uid: theUid
  666. },
  667. success: function (data) {
  668. let theOption = [];
  669. if (!data.data) {
  670. if (data.error && data.error.length) {
  671. message.warning(data.error[0].message);
  672. return;
  673. };
  674. };
  675. for (let item in data.data) {
  676. let theData = data.data[item];
  677. theOption.push(
  678. <Select.Option value={item} key={theData}>{theData}</Select.Option>
  679. );
  680. };
  681. this.setState({
  682. contactsOption: theOption
  683. });
  684. }.bind(this),
  685. });
  686. },
  687. getTagsArr(e) {
  688. this.setState({ tags: e });
  689. },
  690. getMaturityPictureUrl(e) {
  691. this.setState({ maturityPictureUrl: e });
  692. },
  693. getTechnicalPictureUrl(e) {
  694. this.setState({ technicalPictureUrl: e });
  695. },
  696. getcoverImg(e) {
  697. this.setState({coverImg: e });
  698. },
  699. handleSearch(e) {
  700. if (this.props.detailApiUrl.indexOf('org') != -1) {
  701. $.ajax({
  702. method: "get",
  703. dataType: "json",
  704. crossDomain: false,
  705. url: globalConfig.context + "/api/admin/achievement/orgOwner",
  706. data: { name: e },
  707. success: function (data) {
  708. let theArr = [];
  709. let theObj = {};
  710. if (!data.data) {
  711. if (data.error && data.error.length) {
  712. message.warning(data.error[0].message);
  713. };
  714. } else if (!$.isEmptyObject(data.data)) {
  715. data.data.map(function (item) {
  716. theArr.push(item.unitName);
  717. theObj[item.unitName] = item.uid;
  718. });
  719. };
  720. this.setState({
  721. dataSource: theArr,
  722. dataSourceObj: theObj
  723. });
  724. }.bind(this),
  725. });
  726. } else {
  727. $.ajax({
  728. method: "get",
  729. dataType: "json",
  730. crossDomain: false,
  731. url: globalConfig.context + "/api/admin/achievement/userOwner",
  732. data: { name: e },
  733. success: function (data) {
  734. let theArr = [];
  735. let theObj = {};
  736. if (!data.data) {
  737. if (data.error && data.error.length) {
  738. message.warning(data.error[0].message);
  739. };
  740. } else if (!$.isEmptyObject(data.data)) {
  741. for (let item in data.data) {
  742. theArr.push(data.data[item]);
  743. theObj[data.data[item]] = item;
  744. };
  745. };
  746. this.setState({
  747. dataSource: theArr,
  748. dataSourceObj: theObj
  749. });
  750. }.bind(this),
  751. });
  752. };
  753. },
  754. handleSubmit(e) {
  755. e.preventDefault();
  756. this.props.form.validateFields((err, values) => {
  757. //url转化
  758. let theTechnicalPictureUrl = [];
  759. if (this.state.technicalPictureUrl.length) {
  760. let picArr = [];
  761. this.state.technicalPictureUrl.map(function (item) {
  762. picArr.push(item.response.data);
  763. });
  764. theTechnicalPictureUrl = picArr.join(",");
  765. };
  766. let thecoverImg = [];
  767. if (this.state.coverImg.length) {
  768. let picArr = [];
  769. this.state.coverImg.map(function (item) {
  770. picArr.push(item.response.data);
  771. });
  772. thecoverImg = picArr.join(",");
  773. };
  774. let theMaturityPictureUrl = [];
  775. if (this.state.maturityPictureUrl.length) {
  776. let picArr = [];
  777. this.state.maturityPictureUrl.map(function (item) {
  778. picArr.push(item.response.data);
  779. });
  780. theMaturityPictureUrl = picArr.join(",");
  781. };
  782. if (!err) {
  783. this.setState({
  784. loading: true
  785. });
  786. $.ajax({
  787. method: "POST",
  788. dataType: "json",
  789. crossDomain: false,
  790. url: this.props.data.id ? globalConfig.context + '/api/admin/customer/updCustomer' : globalConfig.context + '/api/admin/customer/addCustomer',
  791. data: {
  792. id: this.props.data.id, //编号
  793. customerTyp :values.customerTyp ,//客户信息 1
  794. createTime: values.createTime ? values.createTime.format('YYYY-MM-DD') : undefined,//时间 1\
  795. companyIntention: this.props.data.companyIntention,
  796. companyName: values.companyName,//公司名称 1
  797. companyIndustry: values.companyIndustry,//公司行业
  798. companyIntention: values.companyIntention,//公司意向1
  799. tag: values.tag,
  800. locationProvince: values.locationProvince,//省份1
  801. adress: values.adress,//详细地址1
  802. remarks: values.remarks,//备注1
  803. followSituation: values.followSituation,//最新跟进1
  804. customerStatus: values.customerStatus,//客户状态1
  805. name: values.name,//客户姓名1
  806. mobile: values.mobile,//座机1
  807. telNum: values.telNum,//手机号码1
  808. sex: values.sex,//性别1
  809. customerPosition: values.customerPosition,//职位1
  810. wechat: values.wechat,//微信号1
  811. qq: values.qq,//qq 1
  812. depatrment: values.depatrment,//部门 1
  813. email: values.email,//邮箱 1
  814. shareTyp:0,
  815. }
  816. }).done(function (data) {
  817. this.state.auditStatus = 0;
  818. this.setState({
  819. loading: false
  820. });
  821. if (!data.error.length) {
  822. message.success('保存成功!');
  823. this.props.handleOk();
  824. } else {
  825. message.warning(data.error[0].message);
  826. }
  827. }.bind(this));
  828. }
  829. });
  830. },
  831. componentWillMount() {
  832. this.state.therottleSearch = throttle(this.handleSearch, 1000, { leading: false }).bind(this);
  833. if (this.props.data && this.props.data.id) {
  834. this.loadData(this.props.data.id, this.props.detailApiUrl);
  835. };
  836. },
  837. componentWillReceiveProps(nextProps) {
  838. if (!this.props.visible && nextProps.visible) {
  839. if (nextProps.data && nextProps.data.id) {
  840. this.loadData(nextProps.data.id, nextProps.detailApiUrl);
  841. };
  842. this.state.data = {};
  843. this.state.tags = [];
  844. this.state.switchValue = false;
  845. this.state.radios = false;
  846. this.state.technicalPictureUrl = [];
  847. this.state.coverImg = [];
  848. this.state.maturityPictureUrl = [];
  849. this.state.textFileList = [];
  850. this.state.techPlanFileList = [];
  851. this.state.businessPlanFileList = [];
  852. this.props.form.resetFields();
  853. };
  854. },
  855. render() {
  856. const theData = this.state.data || {};
  857. const { getFieldDecorator } = this.props.form;
  858. const FormItem = Form.Item
  859. const formItemLayout = {
  860. labelCol: { span: 8 },
  861. wrapperCol: { span: 14 },
  862. };
  863. return (
  864. <Form horizontal onSubmit={this.handleSubmit} id="demand-form">
  865. <Spin spinning={this.state.loading}>
  866. <div className="clearfix">
  867. <FormItem className="half-item"
  868. {...formItemLayout}
  869. label="客户类型11111" >
  870. {getFieldDecorator('customerTyp', {
  871. rules: [{ required: true, message: '此项为必填项!' }],
  872. initialValue: theData.customerTyp
  873. })(
  874. <Select placeholder="选择客户类型" style={{ width: 160 }} >
  875. <Select.Option value="0" >个人客户</Select.Option>
  876. <Select.Option value="1" >公司客户</Select.Option>
  877. </Select>
  878. )}
  879. </FormItem>
  880. <FormItem className="half-item"
  881. {...formItemLayout}
  882. label="编号" >
  883. <span>{theData.id}</span>
  884. </FormItem>
  885. <div className="clearfix" style={{marginLeft:'40px',marginBottom:'20px',color:'#000000'}}>基本资料:</div>
  886. <div>
  887. {/* <FormItem className="half-item"
  888. {...formItemLayout}
  889. label="录入时间" >
  890. {getFieldDecorator('createTime', {
  891. initialValue: theData.createTime ? moment(theData.createTime) : null
  892. })(
  893. <DatePicker />
  894. )}
  895. </FormItem> */}
  896. {/* <FormItem className="half-item" style={{marginLeft:'-160px'}}
  897. {...formItemLayout}
  898. label="" >
  899. {getFieldDecorator('createTim', {
  900. initialValue: theData.createTime ? moment(theData.createTime) : null
  901. })(
  902. <TimePicker />
  903. )}
  904. </FormItem> */}
  905. <FormItem className="half-item"
  906. {...formItemLayout}
  907. label="跟单人" >
  908. {getFieldDecorator('ownerId', {
  909. initialValue: theData.ownerId
  910. })(
  911. <Input />
  912. )}
  913. </FormItem>
  914. </div>
  915. <div className="clearfix" style={{marginLeft:'40px',marginBottom:'20px',color:'#000000'}}>公司资料:</div>
  916. <div>
  917. <FormItem className="half-item"
  918. {...formItemLayout}
  919. label="公司名称" >
  920. {getFieldDecorator('companyName', {
  921. rules: [{ required: true, message: '此项为必填项!' }],
  922. initialValue: theData.companyName
  923. })(
  924. <Input />
  925. )}
  926. </FormItem>
  927. <FormItem className="half-item"
  928. {...formItemLayout}
  929. label="公司行业" >
  930. {getFieldDecorator('companyIndustry', {
  931. initialValue: theData.companyIndustry
  932. })(
  933. <Input />
  934. )}
  935. </FormItem>
  936. <FormItem className="half-item"
  937. {...formItemLayout}
  938. label="意向服务" >
  939. {getFieldDecorator('companyIntention', {
  940. rules: [{ required: true, message: '此项为必填项!' }],
  941. initialValue: getCompanyIntention(theData.companyIntention)
  942. })(
  943. <Select placeholder="选择服务类型" >
  944. {
  945. intentionalService.map(function (item) {
  946. return <Select.Option key={item.value} >{item.key}</Select.Option>
  947. })
  948. }
  949. </Select>
  950. )}
  951. </FormItem>
  952. <FormItem className="half-item"
  953. {...formItemLayout}
  954. label="地区" >
  955. {getFieldDecorator('locationProvince', {
  956. initialValue: getcityArr(theData.locationProvince)
  957. })(
  958. <Select placeholder="选择地区" style={{ width: 160 }} >
  959. {
  960. cityArr.map(function (item) {
  961. return <Select.Option key={item.value} >{item.key}</Select.Option>
  962. })
  963. }
  964. </Select>
  965. )}
  966. </FormItem>
  967. <FormItem className="half-item"
  968. {...formItemLayout}
  969. label="最新跟进" >
  970. {getFieldDecorator('followSituation', {
  971. initialValue: getfllowSituation(theData.followSituation)
  972. })(
  973. <Select placeholder="选择跟进进度" style={{ width: 160 }} >
  974. {
  975. newFollow.map(function (item) {
  976. return <Select.Option key={item.value} >{item.key}</Select.Option>
  977. })
  978. }
  979. </Select>
  980. )}
  981. </FormItem>
  982. <FormItem className="half-item"
  983. {...formItemLayout}
  984. label="客户状态" >
  985. {getFieldDecorator('customerStatus', {
  986. initialValue: getcustomerStatue(theData.customerStatus)
  987. })(
  988. <Select placeholder="选择客户状态" style={{ width: 160 }} >
  989. {
  990. customerStatus.map(function (item) {
  991. return <Select.Option key={item.value} >{item.key}</Select.Option>
  992. })
  993. }
  994. </Select>
  995. )}
  996. </FormItem>
  997. <FormItem className="half-item"
  998. {...formItemLayout}
  999. label="详细地址" >
  1000. {getFieldDecorator('adress', {
  1001. initialValue: theData.adress
  1002. })(
  1003. <Input />
  1004. )}
  1005. </FormItem>
  1006. <FormItem className="half-item"
  1007. {...formItemLayout}
  1008. label="标签" >
  1009. {getFieldDecorator('tag', {
  1010. initialValue: theData.tag
  1011. })(
  1012. <Select placeholder="选择客户标签" >
  1013. {
  1014. tag.map(function (item) {
  1015. return <Select.Option key={item.key} >{item.key}</Select.Option>
  1016. })
  1017. }
  1018. </Select>
  1019. )}
  1020. </FormItem>
  1021. <div className="clearfix">
  1022. <FormItem
  1023. labelCol={{ span: 4 }}
  1024. wrapperCol={{ span: 18 }}
  1025. label="备注" >
  1026. {getFieldDecorator('remarks', {
  1027. initialValue: theData.remarks
  1028. })(
  1029. <Input type="textarea" rows={4} />
  1030. )}
  1031. </FormItem>
  1032. </div>
  1033. </div>
  1034. <div className="clearfix" style={{marginLeft:'40px',marginBottom:'20px',color:'#000000'}}>联系资料:</div>
  1035. <div>
  1036. <FormItem className="half-item"
  1037. {...formItemLayout}
  1038. label="姓名" >
  1039. {getFieldDecorator('name', {
  1040. rules: [{ required: true, message: '此项为必填项!' }],
  1041. initialValue: theData.name
  1042. })(
  1043. <Input />
  1044. )}
  1045. </FormItem>
  1046. <FormItem className="half-item"
  1047. {...formItemLayout}
  1048. label="性别" >
  1049. {getFieldDecorator('sex', {
  1050. rules: [{ required: true, message: '此项为必填项!' }],
  1051. initialValue: getsex(theData.sex)
  1052. })(
  1053. <Radio.Group>
  1054. <Radio value="0">男</Radio>
  1055. <Radio value="1">女</Radio>
  1056. </Radio.Group>
  1057. )}
  1058. </FormItem>
  1059. <FormItem className="half-item"
  1060. {...formItemLayout}
  1061. label="手机号码" >
  1062. {getFieldDecorator('telNum', {
  1063. initialValue: theData.telNum
  1064. })(
  1065. <Input />
  1066. )}
  1067. </FormItem>
  1068. <FormItem className="half-item"
  1069. {...formItemLayout}
  1070. label="座机号" >
  1071. {getFieldDecorator('mobile', {
  1072. initialValue: theData.mobile
  1073. })(
  1074. <Input />
  1075. )}
  1076. </FormItem>
  1077. <FormItem className="half-item"
  1078. {...formItemLayout}
  1079. label="QQ号码" >
  1080. {getFieldDecorator('qq', {
  1081. initialValue: theData.qq
  1082. })(
  1083. <Input />
  1084. )}
  1085. </FormItem>
  1086. <FormItem className="half-item"
  1087. {...formItemLayout}
  1088. label="邮箱号" >
  1089. {getFieldDecorator('email', {
  1090. initialValue: theData.email
  1091. })(
  1092. <Input />
  1093. )}
  1094. </FormItem>
  1095. <FormItem className="half-item"
  1096. {...formItemLayout}
  1097. label="微信" >
  1098. {getFieldDecorator('wechat', {
  1099. initialValue: theData.wechat
  1100. })(
  1101. <Input />
  1102. )}
  1103. </FormItem>
  1104. <FormItem className="half-item"
  1105. {...formItemLayout}
  1106. label="部门" >
  1107. {getFieldDecorator('depatrment', {
  1108. initialValue: theData.depatrment
  1109. })(
  1110. <Input />
  1111. )}
  1112. </FormItem>
  1113. <FormItem className="half-item"
  1114. {...formItemLayout}
  1115. label="职位" >
  1116. {getFieldDecorator('customerPosition', {
  1117. initialValue: theData.customerPosition
  1118. })(
  1119. <Input />
  1120. )}
  1121. </FormItem>
  1122. </div>
  1123. </div>
  1124. <FormItem wrapperCol={{ span: 12, offset: 4 }}>
  1125. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  1126. {/*<Button className="set-submit" type="ghost" onClick={(e) => { this.state.auditStatus = 1; }} htmlType="submit">发布</Button>*/}
  1127. <Button className="set-submit" type="ghost" onClick={this.props.closeDesc}>取消</Button>
  1128. </FormItem>
  1129. </Spin>
  1130. </Form >
  1131. )
  1132. }
  1133. }));
  1134. const AchievementDetail = React.createClass({
  1135. getInitialState() {
  1136. return {
  1137. visible: false,
  1138. tabsKey: 1,
  1139. loading: false,
  1140. columns: [
  1141. {
  1142. title: '客户信息',
  1143. dataIndex: 'id',
  1144. key: 'id',
  1145. render: text => {
  1146. switch (text) {
  1147. case "0":
  1148. return <span>个人客户</span>;
  1149. case "1":
  1150. return <span>公司客户</span>;
  1151. }
  1152. }
  1153. }, {
  1154. title: '名称',
  1155. dataIndex: 'companyNmae',
  1156. key: 'companyNmae',
  1157. }, {
  1158. title: '关键字',
  1159. dataIndex: 'keyword',
  1160. key: 'keyword',
  1161. }, {
  1162. title: '类型',
  1163. dataIndex: 'demandType',
  1164. key: 'demandType',
  1165. render: text => { return getDemandType(text); }
  1166. }, {
  1167. title: '所有人名称',
  1168. dataIndex: 'theName',
  1169. key: 'theName',
  1170. }, {
  1171. title: '发布时间',
  1172. dataIndex: 'releaseDateFormattedDate',
  1173. key: 'releaseDateFormattedDate',
  1174. }, {
  1175. title: '有效期限',
  1176. dataIndex: 'validityPeriodFormattedDate',
  1177. key: 'validityPeriodFormattedDate',
  1178. },
  1179. ],
  1180. dataSource: [],
  1181. };
  1182. },
  1183. getTechBrodersList() {
  1184. this.setState({
  1185. loading: true
  1186. });
  1187. $.ajax({
  1188. method: "get",
  1189. dataType: "json",
  1190. crossDomain: false,
  1191. url: globalConfig.context + "/api/admin/audit/techBroders",
  1192. success: function (data) {
  1193. if (!data.data) {
  1194. if (data.error && data.error.length) {
  1195. message.warning(data.error[0].message);
  1196. }
  1197. return;
  1198. };
  1199. let _me = this, theArr = [];
  1200. for (var item in data.data) {
  1201. theArr.push(
  1202. <Select.Option key={item}>{data.data[item]}</Select.Option>
  1203. )
  1204. };
  1205. this.setState({
  1206. techBrodersOption: theArr,
  1207. techBrodersObj: data.data
  1208. });
  1209. }.bind(this),
  1210. }).always(function () {
  1211. this.setState({
  1212. loading: false
  1213. });
  1214. }.bind(this));
  1215. },
  1216. getTableList() {
  1217. this.setState({
  1218. loading: true
  1219. });
  1220. $.ajax({
  1221. method: "get",
  1222. dataType: "json",
  1223. crossDomain: false,
  1224. url: globalConfig.context + "/api/admin/achievement/achievementDemand",
  1225. data: { id: this.props.data.id },
  1226. success: function (data) {
  1227. let theArr = [];
  1228. if (!data.data) {
  1229. if (data.error && data.error.length) {
  1230. message.warning(data.error[0].message);
  1231. };
  1232. } else if (data.data.length) {
  1233. for (let i = 0; i < data.data.length; i++) {
  1234. let thisdata = data.data[i];
  1235. theArr.push({
  1236. key: i,
  1237. id: thisdata.id,
  1238. serialNumber: thisdata.serialNumber,
  1239. createTime: thisdata.createTime,
  1240. name: thisdata.name,
  1241. keyword: thisdata.keyword,
  1242. demandType: thisdata.demandType,
  1243. theName: thisdata.username || thisdata.unitName,
  1244. releaseDateFormattedDate: thisdata.releaseDateFormattedDate,
  1245. validityPeriodFormattedDate: thisdata.validityPeriodFormattedDate,
  1246. coverImg: thisdata.coverImg,
  1247. hot: thisdata.hot,
  1248. });
  1249. };
  1250. };
  1251. this.setState({
  1252. dataSource: theArr,
  1253. });
  1254. }.bind(this),
  1255. }).always(function () {
  1256. this.setState({
  1257. loading: false
  1258. });
  1259. }.bind(this));
  1260. },
  1261. tableRowClick(record, index) {
  1262. window.open(globalConfig.context + '/portal/detail/demandDetail.html?id=' + record.id + '&type=' + record.dataCategory);
  1263. },
  1264. handleCancel(e) {
  1265. this.setState({
  1266. visible: false,
  1267. });
  1268. this.props.closeDesc(false);
  1269. },
  1270. handleOk(e) {
  1271. this.setState({
  1272. visible: false,
  1273. });
  1274. this.props.closeDesc(false, true);
  1275. },
  1276. componentWillMount() {
  1277. this.getTechBrodersList();
  1278. },
  1279. componentWillReceiveProps(nextProps) {
  1280. if (!this.state.visible && nextProps.showDesc) {
  1281. this.state.tabsKey = "1";
  1282. };
  1283. this.state.visible = nextProps.showDesc;
  1284. },
  1285. render() {
  1286. if (this.props.data) {
  1287. return (
  1288. <div className="patent-desc">
  1289. <Modal maskClosable={false} visible={this.state.visible}
  1290. onOk={this.checkPatentProcess} onCancel={this.handleCancel}
  1291. width='1000px'
  1292. footer=''
  1293. className="admin-desc-content">
  1294. <Spin spinning={this.state.loading}>
  1295. <Tabs activeKey={this.state.tabsKey}
  1296. onChange={(e) => {
  1297. this.setState({ tabsKey: e });
  1298. if (e == "2") {
  1299. this.getTableList();
  1300. };
  1301. }} >
  1302. <Tabs.TabPane tab="客户详情" key="1">
  1303. {(() => {
  1304. if (this.props.data.id && this.props.data.auditStatus != "0" && this.props.data.auditStatus != "4") {
  1305. return <AchievementDetailShow
  1306. data={this.props.data}
  1307. detailApiUrl={this.props.detailApiUrl}
  1308. techBrodersOption={this.state.techBrodersOption}
  1309. techBrodersObj={this.state.techBrodersObj}
  1310. closeDesc={this.handleCancel}
  1311. visible={this.state.visible}
  1312. handleOk={this.handleOk} />
  1313. } else {
  1314. return <AchievementDetailForm
  1315. data={this.props.data}
  1316. detailApiUrl={this.props.detailApiUrl}
  1317. achievementCategoryOption={this.props.achievementCategoryOption}
  1318. techBrodersObj={this.state.techBrodersObj}
  1319. closeDesc={this.handleCancel}
  1320. visible={this.state.visible}
  1321. handleOk={this.handleOk} />
  1322. };
  1323. })()}
  1324. </Tabs.TabPane>
  1325. </Tabs>
  1326. </Spin>
  1327. </Modal>
  1328. </div>
  1329. );
  1330. } else {
  1331. return <div></div>
  1332. }
  1333. },
  1334. });
  1335. export default AchievementDetail;