businessForm.jsx 22 KB

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