businessForm.jsx 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812
  1. import React from 'react';
  2. import $ from 'jquery/src/ajax';
  3. import {
  4. Icon,
  5. Tooltip,
  6. Modal,
  7. message,
  8. Spin,
  9. Upload,
  10. Input,
  11. Select,
  12. Button,
  13. Radio,
  14. Form,
  15. Cascader,
  16. Checkbox,
  17. Tag,
  18. Row,Col,
  19. InputNumber
  20. } from 'antd';
  21. import { citySelect } from '@/NewDicProvinceListAll';
  22. import { splitUrl ,getReleaseStateList} from '@/tools.js';
  23. import Editors from '@/richTextEditors';
  24. import './business.less';
  25. //图片组件
  26. const PicturesWall = React.createClass({
  27. getInitialState() {
  28. return {
  29. previewVisible: false,
  30. previewImage: '',
  31. fileList: []
  32. };
  33. },
  34. handleCancel() {
  35. this.setState({ previewVisible: false });
  36. },
  37. handlePreview(file) {
  38. this.setState({
  39. previewImage: file.url || file.thumbUrl,
  40. previewVisible: true
  41. });
  42. },
  43. handleChange(info) {
  44. let fileList = info.fileList;
  45. this.setState({ fileList });
  46. this.props.fileList(fileList);
  47. },
  48. componentWillReceiveProps(nextProps) {
  49. this.state.fileList = nextProps.pictureUrl;
  50. },
  51. render() {
  52. const { previewVisible, previewImage, fileList } = this.state;
  53. const uploadButton = (
  54. <div>
  55. <Icon type="plus" />
  56. <div className="ant-upload-text">点击上传</div>
  57. </div>
  58. );
  59. return (
  60. <div style={{ display: 'inline-block' }}>
  61. <Upload
  62. action={globalConfig.context + '/api/user/jtBusiness/project/uploadPicture'}
  63. data={{ sign: 'jt_project_picture' }}
  64. listType="picture-card"
  65. fileList={fileList}
  66. onPreview={this.handlePreview}
  67. onChange={this.handleChange}
  68. >
  69. {fileList.length >= 1 ? null : uploadButton}
  70. </Upload>
  71. <Modal maskClosable={false} visible={previewVisible} footer={null} onCancel={this.handleCancel}>
  72. <img alt="example" style={{ width: '100%' }} src={previewImage} />
  73. </Modal>
  74. </div>
  75. );
  76. }
  77. });
  78. const DemandDetailForm = Form.create()(
  79. React.createClass({
  80. getInitialState() {
  81. return {
  82. tagArr:[],
  83. visible: false,
  84. loading: false,
  85. auditStatus: 0,
  86. textFileList: [],
  87. videoFileList: [],
  88. pictureUrl: [],
  89. orgCodeUrl: [],
  90. companyLogoUrl: [],
  91. tags: [],
  92. introduce:{},
  93. };
  94. },
  95. //左侧图片地址
  96. getOrgCodeUrl(e) {
  97. this.setState({ orgCodeUrl: e });
  98. },
  99. //右侧图片地址
  100. getCompanyLogoUrl(e) {
  101. this.setState({ companyLogoUrl: e });
  102. },
  103. //编辑部门,保存
  104. handleSubmit(e,index) {
  105. e.preventDefault();
  106. if (!this.state.name) {
  107. message.warning('请输入项目名称');
  108. return;
  109. }
  110. if ((this.state.name).length>50) {
  111. message.warning('项目名称在50个字以内');
  112. return false;
  113. };
  114. if (!this.state.categoryId||!this.state.categoryId[1]) {
  115. message.warning('请选择项目二级业务品类');
  116. return;
  117. }
  118. if (!this.state.ProvinceCity.length) {
  119. message.warning('请选择省份');
  120. return;
  121. }
  122. if (!this.state.price) {
  123. message.warning('请输入正确的市场价');
  124. return;
  125. }
  126. if(this.state.advertisement&&(this.state.advertisement).length>30){
  127. message.warning('项目营销说明字数不得超过30个字。');
  128. return;
  129. }
  130. if(this.state.introduce&&(this.state.introduce.length)>10000){
  131. message.warning('业务项目服务内容不大于10000字')
  132. return;
  133. }
  134. this.setState({
  135. loading: true
  136. });
  137. let minPictureUrl = [];
  138. if (this.state.orgCodeUrl.length) {
  139. let picArr = [];
  140. this.state.orgCodeUrl.map(function(item) {
  141. if (item.response && item.response.data && item.response.data.length) {
  142. picArr.push(item.response.data);
  143. }
  144. });
  145. minPictureUrl = picArr.join(',');
  146. }
  147. let maxPictureUrl = [];
  148. if (this.state.companyLogoUrl.length) {
  149. let picArr = [];
  150. this.state.companyLogoUrl.map(function(item) {
  151. if (item.response && item.response.data && item.response.data.length) {
  152. picArr.push(item.response.data);
  153. }
  154. });
  155. maxPictureUrl = picArr.join(',');
  156. }
  157. $.ajax({
  158. method: 'post',
  159. dataType: 'json',
  160. crossDomain: false,
  161. url: globalConfig.context + '/api/user/jtBusiness/project/update',
  162. data: {
  163. auditStatus:index,
  164. id: this.state.id, //业务名称
  165. name: this.state.name, //业务名称
  166. categoryId: this.state.categoryId[1], //业务品类
  167. price: this.state.price, //市场价
  168. advertisement:this.state.advertisement,//项目营销说明
  169. activityPrice: this.state.activityPrice ? this.state.activityPrice : '0', //最低折扣
  170. memberPrice: this.state.memberPrice ? this.state.memberPrice : '0', //会员价
  171. offset: this.state.offset ? this.state.offset : '0',
  172. activityFlag: this.state.activityFlag, //活动生效标识
  173. province: this.state.ProvinceCity ? this.state.ProvinceCity[0] : '', //是否全国
  174. city: this.state.ProvinceCity ? this.state.ProvinceCity[1] : '',
  175. introduce: this.state.introduce,
  176. value: this.state.value,
  177. isHot: this.state.isHot,
  178. minImgUrl: minPictureUrl.length ? minPictureUrl : '',
  179. maxImgUrl: maxPictureUrl.length ? maxPictureUrl : '',
  180. applyConditions: this.state.applyConditions,
  181. tag:this.state.tagArr.join(',')
  182. }
  183. }).done(
  184. function(data) {
  185. if (!data.error.length) {
  186. this.setState({
  187. loading: false,
  188. editvisible: false
  189. });
  190. if(index){
  191. this.submission();
  192. }else{
  193. message.success('保存成功!');
  194. }
  195. } else {
  196. message.warning(data.error[0].message);
  197. }
  198. this.props.handOk();
  199. }.bind(this)
  200. );
  201. },
  202. loadData(ids) {
  203. $.ajax({
  204. method: 'get',
  205. dataType: 'json',
  206. crossDomain: false,
  207. url: globalConfig.context + '/api/user/jtBusiness/project/detail',
  208. data: {
  209. id: ids
  210. },
  211. success: function(data) {
  212. if (!data.data) {
  213. if (data.error && data.error.length) {
  214. message.warning(data.error[0].message);
  215. }
  216. } else {
  217. let categoryIdArr=[];
  218. let thisdata = data.data;
  219. let ProvinceCityArr = [];
  220. ProvinceCityArr.push(thisdata.province, thisdata.city);
  221. (this.props.categoryList).map(item=>{
  222. if(item.children.length){
  223. (item.children).map(atem=>{
  224. if(atem.value==thisdata.categoryId){
  225. categoryIdArr.push(item.value,atem.value)
  226. }
  227. })
  228. }
  229. })
  230. let tagFirst =thisdata.tags,tagTxt=[],tagArr=[];
  231. tagFirst.map(item=>{
  232. tagTxt.push(item.name);
  233. tagArr.push(item.id)
  234. })
  235. this.setState({
  236. id: thisdata.id, //业务名称
  237. name: thisdata.name, //业务名称
  238. tagTxt:tagTxt.join(' - '),
  239. tagArr:tagArr,
  240. categoryId: categoryIdArr, //业务品类
  241. number: thisdata.number,
  242. auditInfo:thisdata.auditInfo,
  243. price: thisdata.price, //市场价
  244. advertisement:thisdata.advertisement,
  245. activityPrice: thisdata.activityPrice ? thisdata.activityPrice : '', //最低折扣
  246. memberPrice: thisdata.memberPrice ? thisdata.memberPrice : '', //会员价
  247. offset: thisdata.offset ? thisdata.offset : '',
  248. activityFlag: thisdata.activityFlag ? thisdata.activityFlag.toString() : '', //活动生效标识
  249. ProvinceCity: ProvinceCityArr,
  250. introduce: thisdata.introduce,
  251. createTime: thisdata.createTime ? new Date(thisdata.createTime).toLocaleString() : '',
  252. value: thisdata.value,
  253. isHot:thisdata.isHot,
  254. auditStatus:thisdata.auditStatus,
  255. applyConditions: thisdata.applyConditions,
  256. orgCodeUrl: thisdata.minImgUrl
  257. ? splitUrl(thisdata.minImgUrl, ',', globalConfig.avatarHost + '/upload')
  258. : [],
  259. companyLogoUrl: thisdata.maxImgUrl
  260. ? splitUrl(thisdata.maxImgUrl, ',', globalConfig.avatarHost + '/upload')
  261. : []
  262. });
  263. }
  264. }.bind(this)
  265. }).always(
  266. function() {
  267. this.setState({
  268. loading: false
  269. });
  270. }.bind(this)
  271. );
  272. },
  273. submission(e) {
  274. $.ajax({
  275. method: 'get',
  276. dataType: 'json',
  277. crossDomain: false,
  278. async: true,
  279. url: globalConfig.context + '/api/user/jtBusiness/project/publish',
  280. data: {
  281. id: this.state.id,
  282. auditStatus:1
  283. }
  284. }).done(
  285. function(data) {
  286. if (!data.error.length) {
  287. message.success('提交成功,请耐心等待审核结果.')
  288. this.setState({
  289. loading: false
  290. });
  291. } else {
  292. message.warning(data.error[0].message);
  293. }
  294. }.bind(this)
  295. );
  296. },
  297. cancelFun() {
  298. this.props.closeDesc();
  299. },
  300. componentWillMount() {
  301. if (this.props.data.id) {
  302. this.state.introduce='<p><br></p>';
  303. this.loadData(this.props.data.id);
  304. }
  305. },
  306. //标签
  307. tagOk(){
  308. this.setState({
  309. visibleTag:false
  310. })
  311. },
  312. tagCancel(){
  313. this.setState({
  314. visibleTag:false
  315. })
  316. },
  317. selTag(){
  318. this.setState({
  319. visibleTag:true
  320. })
  321. this.state.tagArr=this.state.tagArr;
  322. },
  323. onChange(e){
  324. this.setState({
  325. tagArr:e
  326. })
  327. },
  328. tagSubmit(e){
  329. e.preventDefault();
  330. let tags =[];
  331. (this.props.tagList).map(item=>{
  332. for(let i=0;i<(this.state.tagArr).length;i++){
  333. if(item.id==(this.state.tagArr[i])){
  334. tags.push(item.name)
  335. }
  336. }
  337. })
  338. this.tagCancel();
  339. this.setState({
  340. tagTxt:tags.join(' - ')
  341. })
  342. },
  343. //发布后查看效果
  344. lookSee(e){
  345. e.preventDefault();
  346. if (!this.state.name) {
  347. message.warning('请输入项目名称');
  348. return;
  349. }
  350. if ((this.state.name).length>16) {
  351. message.warning('项目名称在16个字以内');
  352. return false;
  353. };
  354. if (!this.state.categoryId||!this.state.categoryId[1]) {
  355. message.warning('请选择项目二级业务品类');
  356. return;
  357. }
  358. if (!this.state.ProvinceCity.length) {
  359. message.warning('请选择省份');
  360. return;
  361. }
  362. if (!this.state.price) {
  363. message.warning('请输入正确的市场价');
  364. return;
  365. }
  366. if(this.state.advertisement&&(this.state.advertisement).length>30){
  367. message.warning('项目营销说明字数不得超过30个字.');
  368. return;
  369. }
  370. this.setState({
  371. loading: true
  372. });
  373. let minPictureUrl = [];
  374. if (this.state.orgCodeUrl.length) {
  375. let picArr = [];
  376. this.state.orgCodeUrl.map(function(item) {
  377. if (item.response && item.response.data && item.response.data.length) {
  378. picArr.push(item.response.data);
  379. }
  380. });
  381. minPictureUrl = picArr.join(',');
  382. }
  383. let maxPictureUrl = [];
  384. if (this.state.companyLogoUrl.length) {
  385. let picArr = [];
  386. this.state.companyLogoUrl.map(function(item) {
  387. if (item.response && item.response.data && item.response.data.length) {
  388. picArr.push(item.response.data);
  389. }
  390. });
  391. maxPictureUrl = picArr.join(',');
  392. }
  393. $.ajax({
  394. method: 'post',
  395. dataType: 'json',
  396. crossDomain: false,
  397. url: globalConfig.context + '/api/user/jtBusiness/project/update',
  398. data: {
  399. id: this.state.id, //业务名称
  400. name: this.state.name, //业务名称
  401. categoryId: this.state.categoryId[1], //业务品类
  402. price: this.state.price, //市场价
  403. advertisement:this.state.advertisement,//项目营销说明
  404. activityPrice: this.state.activityPrice ? this.state.activityPrice : '0', //最低折扣
  405. memberPrice: this.state.memberPrice ? this.state.memberPrice : '0', //会员价
  406. offset: this.state.offset ? this.state.offset : '0',
  407. activityFlag: this.state.activityFlag, //活动生效标识
  408. province: this.state.ProvinceCity ? this.state.ProvinceCity[0] : '', //是否全国
  409. city: this.state.ProvinceCity ? this.state.ProvinceCity[1] : '',
  410. introduce: this.state.introduce,
  411. value: this.state.value,
  412. isHot: this.state.isHot,
  413. minImgUrl: minPictureUrl.length ? minPictureUrl : '',
  414. maxImgUrl: maxPictureUrl.length ? maxPictureUrl : '',
  415. applyConditions: this.state.applyConditions,
  416. tag:this.state.tagArr.join(',')
  417. }
  418. }).done(
  419. function(data) {
  420. if (!data.error.length) {
  421. this.setState({
  422. loading: false,
  423. });
  424. message.success('提交预览请求成功,即将跳转预览页面');
  425. setTimeout(()=>{
  426. window.open(globalConfig.context+'/portal/service/patentDetail?id='+this.state.id)
  427. },1000)
  428. } else {
  429. message.warning(data.error[0].message);
  430. }
  431. }.bind(this)
  432. );
  433. },
  434. componentWillReceiveProps(nextProps) {
  435. if (!this.props.visible && nextProps.visible) {
  436. this.state.textFileList = [];
  437. this.state.videoFileList = [];
  438. if (nextProps.data.id) {
  439. this.state.introduce='<p><br></p>';
  440. this.loadData(nextProps.data.id);
  441. }
  442. }
  443. },
  444. render() {
  445. const FormItem = Form.Item;
  446. const formItemLayout = {
  447. labelCol: { span: 6 },
  448. wrapperCol: { span: 16 },
  449. };
  450. let categoryList = this.props.categoryList||[];
  451. let plainOptions= this.props.tagList||[];
  452. return (
  453. <div className="patent-desc">
  454. <Form layout="horizontal" onSubmit={(e)=>{this.handleSubmit(e,0)}} id="demand-form">
  455. <Spin spinning={this.state.loading}>
  456. <div className="clearfix" style={{ paddingLeft: '86px' }}>
  457. <FormItem
  458. className="half-item"
  459. labelCol={{ span: 4 }}
  460. wrapperCol={{ span: 12 }}
  461. label={
  462. <span>
  463. <strong style={{ color: 'red' }}>*</strong>项目名称
  464. </span>
  465. }
  466. >
  467. <Input
  468. placeholder="项目名称"
  469. value={this.state.name}
  470. onChange={(e) => {
  471. this.setState({ name: e.target.value });
  472. }}
  473. />
  474. </FormItem>
  475. <FormItem
  476. className="half-item"
  477. labelCol={{ span: 4 }}
  478. wrapperCol={{ span: 12 }}
  479. label={
  480. <span>
  481. <strong style={{ color: 'red' }}>*</strong>业务品类
  482. </span>
  483. }
  484. >
  485. <Cascader
  486. options={categoryList}
  487. value={this.state.categoryId}
  488. placeholder="业务品类"
  489. onChange={(e, pre) => {
  490. this.setState({ categoryId: e });
  491. }}
  492. />
  493. </FormItem>
  494. </div>
  495. <div className="clearfix" style={{ paddingLeft: '86px' }}>
  496. <FormItem
  497. className="half-item"
  498. labelCol={{ span: 4 }}
  499. wrapperCol={{ span: 12 }}
  500. label={
  501. <span>
  502. <strong style={{ color: 'red' }}>*</strong>省-市
  503. </span>
  504. }
  505. >
  506. <Cascader
  507. options={citySelect()}
  508. value={this.state.ProvinceCity}
  509. placeholder="选择市"
  510. onChange={(e, pre) => {
  511. this.setState({ ProvinceCity: e });
  512. }}
  513. />
  514. </FormItem>
  515. <FormItem
  516. className="half-item"
  517. labelCol={{ span: 4 }}
  518. wrapperCol={{ span: 12 }}
  519. label={
  520. <span>
  521. <strong style={{ color: 'red' }}>*</strong>热点
  522. </span>
  523. }
  524. >
  525. <Radio.Group
  526. onChange={(e) => {
  527. this.setState({ isHot: e.target.value });
  528. }}
  529. value={this.state.isHot}
  530. >
  531. <Radio value={0}>否</Radio>
  532. <Radio value={1}>是</Radio>
  533. </Radio.Group>
  534. </FormItem>
  535. </div>
  536. <div className="clearfix" style={{ paddingLeft: '86px' }}>
  537. <FormItem
  538. className="half-item"
  539. labelCol={{ span: 4 }}
  540. wrapperCol={{ span: 12 }}
  541. label={
  542. <span>
  543. <strong style={{ color: 'red' }}>*</strong>市场价
  544. </span>
  545. }
  546. >
  547. <InputNumber
  548. placeholder="市场价"
  549. value={this.state.price}
  550. style={{ width: 120 }}
  551. onChange={(e) => {
  552. this.setState({ price: e });
  553. }}
  554. required="required"
  555. />
  556. <span style={{ marginLeft: 10 }}>万元</span>
  557. </FormItem>
  558. <FormItem
  559. className="half-item"
  560. labelCol={{ span: 4 }}
  561. wrapperCol={{ span: 12 }}
  562. label="活动价"
  563. >
  564. <InputNumber
  565. placeholder="活动价"
  566. value={this.state.activityPrice}
  567. style={{ width: 120 }}
  568. onChange={(e) => {
  569. this.setState({ activityPrice: e });
  570. }}
  571. min={0}
  572. max={999999}
  573. step={0.01}
  574. />
  575. <span style={{ marginLeft: 10 }}>万元</span>
  576. </FormItem>
  577. <FormItem
  578. className="half-item"
  579. labelCol={{ span: 4 }}
  580. wrapperCol={{ span: 12 }}
  581. label="最低折扣"
  582. >
  583. <InputNumber
  584. placeholder="最低折扣(如:0.5)"
  585. value={this.state.offset}
  586. style={{ width: '50%' }}
  587. onChange={(e) => {
  588. this.setState({ offset: e });
  589. }}
  590. min={0}
  591. max={1}
  592. step={0.01}
  593. />
  594. </FormItem>
  595. <FormItem
  596. className="half-item"
  597. labelCol={{ span: 4 }}
  598. wrapperCol={{ span: 12 }}
  599. label="会员价"
  600. >
  601. <InputNumber
  602. placeholder="会员价"
  603. value={this.state.memberPrice}
  604. style={{ width: '120px' }}
  605. onChange={(e) => {
  606. this.setState({ memberPrice: e });
  607. }}
  608. min={0}
  609. max={999999}
  610. step={0.01}
  611. />
  612. <span style={{ marginLeft: 10 }}>万元</span>
  613. </FormItem>
  614. <FormItem
  615. className="half-item"
  616. labelCol={{ span: 4 }}
  617. wrapperCol={{ span: 12 }}
  618. label="活动生效"
  619. >
  620. <Select
  621. placeholder="活动生效"
  622. value={this.state.activityFlag}
  623. style={{ width: '94%' }}
  624. onChange={(e) => {
  625. this.setState({ activityFlag: e });
  626. }}
  627. >
  628. <Select.Option key="0">无效</Select.Option>
  629. <Select.Option key="1">有效</Select.Option>
  630. </Select>
  631. </FormItem>
  632. <FormItem
  633. className="half-item"
  634. labelCol={{ span: 4 }}
  635. wrapperCol={{ span: 12 }}
  636. label="创建时间"
  637. >
  638. <span style={{ width: '94%' }}>{this.state.createTime}</span>
  639. </FormItem>
  640. </div>
  641. <div className="clearfix">
  642. <FormItem
  643. labelCol={{ span: 4 }}
  644. wrapperCol={{ span: 12 }}
  645. label="标签">
  646. <div>
  647. <span style={{marginRight:10}}>{this.state.tagTxt}</span>
  648. <Button onClick={this.selTag}>选择</Button>
  649. </div>
  650. </FormItem>
  651. </div>
  652. <div>
  653. <FormItem
  654. labelCol={{ span: 4 }}
  655. wrapperCol={{ span: 12 }}
  656. label="发布状态">
  657. <span>{getReleaseStateList(this.state.auditStatus)}</span>
  658. </FormItem>
  659. </div>
  660. <div className="clearfix">
  661. {this.state.auditInfo?<FormItem
  662. labelCol={{ span: 4 }}
  663. wrapperCol={{ span: 12 }}
  664. label="拒绝原因">
  665. <span>{this.state.auditInfo}</span>
  666. </FormItem>:''}
  667. </div>
  668. <div className="clearfix">
  669. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 12 }} label="项目营销说明">
  670. <Input
  671. type="textarea"
  672. rows={4}
  673. placeholder="项目营销说明"
  674. value={this.state.advertisement}
  675. onChange={(e) => {
  676. this.setState({ advertisement: e.target.value });
  677. }}
  678. />
  679. </FormItem>
  680. </div>
  681. <div className="clearfix">
  682. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 12 }} label="业务项目价值及作用">
  683. <Input
  684. type="textarea"
  685. rows={4}
  686. placeholder="业务项目价值及作用"
  687. value={this.state.value}
  688. onChange={(e) => {
  689. this.setState({ value: e.target.value });
  690. }}
  691. />
  692. </FormItem>
  693. </div>
  694. <div className="clearfix">
  695. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 12 }} label="业务项目客户基本条件">
  696. <Input
  697. type="textarea"
  698. rows={4}
  699. placeholder="业务项目客户基本条件"
  700. value={this.state.applyConditions}
  701. onChange={(e) => {
  702. this.setState({ applyConditions: e.target.value });
  703. }}
  704. />
  705. </FormItem>
  706. </div>
  707. <div className="clearfix">
  708. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label='业务项目服务内容'>
  709. <Editors textContent={this.state.introduce}
  710. uploadUrl={'/api/user/demand/uploadPicture'}
  711. uploadSign={'demand_picture'}
  712. handleRichText={(value) => { this.state.introduce = value; }}
  713. visible={this.state.visible} />
  714. <Button type="dashed" onClick={this.lookSee} style={{marginTop:10}}>预览发布后效果</Button>
  715. </FormItem>
  716. </div>
  717. <div className="clearfix pictures">
  718. <FormItem
  719. className="half-item"
  720. labelCol={{ span: 8 }}
  721. wrapperCol={{ span: 10 }}
  722. label="业务项目图标(小)"
  723. >
  724. <PicturesWall
  725. pictureSign="business_project_min_picture"
  726. fileList={this.getOrgCodeUrl}
  727. pictureUrl={this.state.orgCodeUrl}
  728. />
  729. <p>图片建议:图片要清晰。(72*72)</p>
  730. </FormItem>
  731. <FormItem
  732. className="half-item"
  733. labelCol={{ span: 8 }}
  734. wrapperCol={{ span: 12 }}
  735. label="业务项目图标(大)"
  736. >
  737. <PicturesWall
  738. pictureSign="business_project_max_picture"
  739. fileList={this.getCompanyLogoUrl}
  740. pictureUrl={this.state.companyLogoUrl}
  741. />
  742. <p>图片建议:图片要清晰。(330*230)</p>
  743. </FormItem>
  744. </div>
  745. <Button
  746. className="set-submit"
  747. type="primary"
  748. htmlType="submit"
  749. style={{ marginLeft: '160px', marginBottom: '20px', marginTop: '20px' }}
  750. >
  751. 保存
  752. </Button>
  753. <Button
  754. className="set-submit"
  755. type="ghost"
  756. onClick={(e) => {
  757. this.handleSubmit(e,1)
  758. }}
  759. >
  760. 提交审核
  761. </Button>
  762. <Button
  763. className="set-submit"
  764. type="ghost"
  765. onClick={this.cancelFun}
  766. >
  767. 取消
  768. </Button>
  769. </Spin>
  770. </Form>
  771. <Modal
  772. maskClosable={false}
  773. visible={this.state.visibleTag}
  774. onOk={this.tagOk}
  775. onCancel={this.tagCancel}
  776. width="450px"
  777. title="新建标签"
  778. footer=""
  779. >
  780. <Form layout="horizontal" onSubmit={(e)=>{this.tagSubmit(e)}} id="demand-form">
  781. <Form.Item {...formItemLayout} label={<span><strong style={{color:'#f00'}}> * </strong>标签</span>}>
  782. <Checkbox.Group
  783. value={this.state.tagArr}
  784. onChange={this.onChange}>
  785. <Row>
  786. {plainOptions.map((item)=>{
  787. return <Col span={8} key={item.id} ><Checkbox value={item.id}>{item.name}</Checkbox></Col>
  788. })}
  789. </Row>
  790. </Checkbox.Group>
  791. </Form.Item>
  792. <div className="clearfix">
  793. <Form.Item wrapperCol={{ span: 12, offset: 6 }}>
  794. <Button className="set-submit" type="primary" htmlType="submit">
  795. 选定
  796. </Button>
  797. <Button className="set-submit" type="ghost" onClick={this.tagCancel}>
  798. 取消
  799. </Button>
  800. </Form.Item>
  801. </div>
  802. </Form>
  803. </Modal>
  804. </div>
  805. );
  806. }
  807. })
  808. );
  809. export default DemandDetailForm;