businessForm.jsx 22 KB

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