businessForm.jsx 23 KB

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