businessForm.jsx 22 KB

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