businessDetails.jsx 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398
  1. import React from 'react';
  2. import $ from 'jquery/src/ajax';
  3. import { Modal, message, Upload, Button, Form } from 'antd';
  4. import { getprovince, splitUrl } from '@/tools.js';
  5. import SpinContainer from '../../SpinContainer';
  6. import './business.less';
  7. import 'react-quill/dist/quill.bubble.css';
  8. const DemandDetail = Form.create()(
  9. React.createClass({
  10. getInitialState() {
  11. return {
  12. visible: false,
  13. loading: false,
  14. auditStatus: 0,
  15. textFileList: [],
  16. videoFileList: [],
  17. pictureUrl: []
  18. };
  19. },
  20. loadData(id) {
  21. this.setState({
  22. loading: true
  23. });
  24. $.ajax({
  25. method: 'get',
  26. dataType: 'json',
  27. crossDomain: false,
  28. url: globalConfig.context + '/api/user/jtBusiness/project/detail',
  29. data: {
  30. id: id
  31. },
  32. success: function(data) {
  33. let thisData = data.data;
  34. if (!thisData) {
  35. if (data.error && data.error.length) {
  36. message.warning(data.error[0].message);
  37. }
  38. thisData = {};
  39. }
  40. let categoryList = this.props.categoryList,name='';
  41. categoryList.map(item=>{
  42. if((item.children).length){
  43. (item.children).map(atem=>{
  44. if(atem.value==thisData.categoryId){
  45. name=item.label+'/'+atem.label;
  46. return;
  47. }
  48. })
  49. }
  50. })
  51. let tagFirst =thisData.tags,tagTxt=[];
  52. tagFirst.map(item=>{
  53. tagTxt.push(item.name);
  54. })
  55. //富文本处理
  56. document.querySelector('.txt').innerHTML='';
  57. let eleDiv = document.createElement('div');
  58. eleDiv.innerHTML=thisData.introduce;
  59. document.querySelector('.txt').append(eleDiv);
  60. this.setState({
  61. id: thisData.id,
  62. data: thisData,
  63. name:name,
  64. tags:tagTxt.join(' - '),
  65. createTime: thisData.createTime ? new Date(thisData.createTime).toLocaleString() : '',
  66. auditStatus: thisData.auditStatus,
  67. orgCodeUrl: thisData.minImgUrl
  68. ? splitUrl(thisData.minImgUrl, ',', globalConfig.avatarHost + '/upload')
  69. : [],
  70. companyLogoUrl: thisData.maxImgUrl
  71. ? splitUrl(thisData.maxImgUrl, ',', globalConfig.avatarHost + '/upload')
  72. : []
  73. });
  74. }.bind(this)
  75. }).always(
  76. function() {
  77. this.setState({
  78. loading: false
  79. });
  80. }.bind(this)
  81. );
  82. },
  83. cancelFun() {
  84. this.props.closeDesc();
  85. },
  86. //刷新发布
  87. updateFun(inex) {
  88. this.setState({
  89. loading: true
  90. });
  91. $.ajax({
  92. method: 'get',
  93. dataType: 'json',
  94. crossDomain: false,
  95. url: globalConfig.context + '/api/user/jtBusiness/project/refreshPublish',
  96. data: {
  97. id: this.state.id,
  98. auditStatus: this.state.auditStatus
  99. }
  100. }).done(
  101. function(data) {
  102. if (!data.error.length) {
  103. message.success('刷新成功!');
  104. this.setState({
  105. loading: false
  106. });
  107. } else {
  108. message.warning(data.error[0].message);
  109. }
  110. this.props.handOk();
  111. }.bind(this)
  112. );
  113. },
  114. //撤销发布
  115. revokeFun() {
  116. this.setState({
  117. loading: true
  118. });
  119. $.ajax({
  120. method: 'get',
  121. dataType: 'json',
  122. crossDomain: false,
  123. url: globalConfig.context + '/api/user/jtBusiness/project/offShelf',
  124. data: {
  125. id: this.state.id,
  126. auditStatus:this.state.auditStatus
  127. }
  128. }).done(
  129. function(data) {
  130. if (!data.error.length) {
  131. message.success('撤销成功!');
  132. this.setState({
  133. loading: false
  134. });
  135. } else {
  136. message.warning(data.error[0].message);
  137. }
  138. this.props.handOk();
  139. }.bind(this)
  140. );
  141. },
  142. componentWillMount() {
  143. if (this.props.data.id) {
  144. this.loadData(this.props.data.id);
  145. } else {
  146. this.state.data = {};
  147. }
  148. },
  149. componentWillReceiveProps(nextProps) {
  150. if (!this.props.visible && nextProps.visible) {
  151. this.state.textFileList = [];
  152. this.state.videoFileList = [];
  153. if (nextProps.data.id) {
  154. this.loadData(nextProps.data.id);
  155. } else {
  156. this.state.data = {};
  157. this.state.pictureUrl = [];
  158. }
  159. this.props.form.resetFields();
  160. }
  161. },
  162. render() {
  163. const theData = this.state.data || {};
  164. const FormItem = Form.Item;
  165. return (
  166. <div className="patent-desc">
  167. <Form
  168. layout="horizontal"
  169. onSubmit={(e) => {
  170. this.handleSubmit(e, 0);
  171. }}
  172. id="demand-form"
  173. >
  174. <SpinContainer spinning={this.state.loading}>
  175. <div className="clearfix">
  176. <FormItem
  177. className="half-item"
  178. labelCol={{ span:8 }}
  179. wrapperCol={{ span: 12 }}
  180. label="项目名称"
  181. >
  182. <span>{theData.name}</span>
  183. </FormItem>
  184. <FormItem
  185. className="half-item"
  186. labelCol={{ span: 8 }}
  187. wrapperCol={{ span: 12 }}
  188. label="业务品类"
  189. >
  190. <span>{this.state.name}</span>
  191. </FormItem>
  192. </div>
  193. <div className="clearfix">
  194. <FormItem
  195. className="half-item"
  196. labelCol={{ span:8 }}
  197. wrapperCol={{ span: 12 }}
  198. label="省份"
  199. >
  200. <span>{theData.province!='0'?getprovince(theData.province):'全国'}</span>
  201. </FormItem>
  202. {/*<FormItem
  203. className="half-item"
  204. labelCol={{ span: 8 }}
  205. wrapperCol={{ span: 12 }}
  206. label="热点"
  207. >
  208. <span>{theData.isHot=='1' ? '是' :theData.isHot=='0'?'否':''}</span>
  209. </FormItem>*/}
  210. <FormItem
  211. className="half-item"
  212. labelCol={{ span: 8}}
  213. wrapperCol={{ span: 12 }}
  214. label="创建时间"
  215. >
  216. <span>{this.state.createTime}</span>
  217. </FormItem>
  218. </div>
  219. <div className="clearfix">
  220. <FormItem
  221. className="half-item"
  222. labelCol={{ span:8 }}
  223. wrapperCol={{ span: 12 }}
  224. label="市场价"
  225. >
  226. <span>{theData.price?theData.price+' 万元':''}</span>
  227. </FormItem>
  228. <FormItem
  229. className="half-item"
  230. labelCol={{ span:8 }}
  231. wrapperCol={{ span: 12 }}
  232. label="活动价"
  233. >
  234. <span>{theData.activityPrice?theData.activityPrice+' 万元':''}</span>
  235. </FormItem>
  236. <FormItem
  237. className="half-item"
  238. labelCol={{ span:8 }}
  239. wrapperCol={{ span: 12 }}
  240. label="最低折扣"
  241. >
  242. <span>{theData.offset?theData.offset+' 万元':''}</span>
  243. </FormItem>
  244. <FormItem
  245. className="half-item"
  246. labelCol={{ span:8 }}
  247. wrapperCol={{ span: 12 }}
  248. label="会员价"
  249. >
  250. <span>{theData.memberPrice?theData.memberPrice+' 万元':''}</span>
  251. </FormItem>
  252. <FormItem
  253. className="half-item"
  254. labelCol={{ span: 8 }}
  255. wrapperCol={{ span: 12 }}
  256. label="活动生效"
  257. >
  258. <span>{theData.activityFlag=='1' ? '有效' :theData.activityFlag=='0'?'无效':''}</span>
  259. </FormItem>
  260. <FormItem
  261. className="half-item"
  262. labelCol={{ span:8 }}
  263. wrapperCol={{ span: 12 }}
  264. label="关键字"
  265. >
  266. <span>{theData.keyword}</span>
  267. </FormItem>
  268. </div>
  269. <div className="clearfix">
  270. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 12 }} label="标签">
  271. <span>{this.state.tags}</span>
  272. </FormItem>
  273. </div>
  274. <div className="clearfix">
  275. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 12 }} label="项目简介">
  276. <span>{theData.summary}</span>
  277. </FormItem>
  278. </div>
  279. <div className="clearfix">
  280. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 12 }} label="项目营销说明">
  281. <span>{theData.advertisement}</span>
  282. </FormItem>
  283. </div>
  284. {/*
  285. <div className="clearfix">
  286. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 12 }} label="业务项目价值及作用">
  287. <span>{theData.value}</span>
  288. </FormItem>
  289. </div>
  290. <div className="clearfix">
  291. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 12 }} label="业务项目客户基本条件">
  292. <span>{theData.applyConditions}</span>
  293. </FormItem>
  294. </div>*/}
  295. <div className="clearfix">
  296. <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 18 }} label="业务项目服务内容">
  297. <div className="ql-editor">
  298. <div className="txt"></div>
  299. </div>
  300. </FormItem>
  301. </div>
  302. <div className="clearfix pictures">
  303. <FormItem
  304. className="half-item"
  305. labelCol={{ span: 8 }}
  306. wrapperCol={{ span: 10 }}
  307. label="业务项目图标(小)"
  308. >
  309. <Upload
  310. className="demandDetailShow-upload"
  311. listType="picture-card"
  312. fileList={this.state.orgCodeUrl}
  313. onPreview={(file) => {
  314. this.setState({
  315. previewImage: file.url || file.thumbUrl,
  316. previewVisible: true
  317. });
  318. }}
  319. />
  320. <Modal
  321. maskClosable={false}
  322. footer={null}
  323. visible={this.state.previewVisible}
  324. onCancel={() => {
  325. this.setState({ previewVisible: false });
  326. }}
  327. >
  328. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  329. </Modal>
  330. </FormItem>
  331. <FormItem
  332. className="half-item"
  333. labelCol={{ span: 8 }}
  334. wrapperCol={{ span: 12 }}
  335. label="业务项目图标(大)"
  336. >
  337. <Upload
  338. className="demandDetailShow-upload"
  339. listType="picture-card"
  340. fileList={this.state.companyLogoUrl}
  341. onPreview={(file) => {
  342. this.setState({
  343. previewImage: file.url || file.thumbUrl,
  344. previewVisible: true
  345. });
  346. }}
  347. />
  348. <Modal
  349. maskClosable={false}
  350. footer={null}
  351. visible={this.state.previewVisible}
  352. onCancel={() => {
  353. this.setState({ previewVisible: false });
  354. }}
  355. >
  356. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  357. </Modal>
  358. </FormItem>
  359. </div>
  360. <div className="clearfix">
  361. {this.props.data.auditStatus == '2' && (
  362. <FormItem wrapperCol={{ span: 12, offset: 3 }}>
  363. <Button
  364. className="set-submit"
  365. type="primary"
  366. onClick={(e) => {
  367. this.updateFun();
  368. }}
  369. >
  370. 刷新发布
  371. </Button>
  372. <Button
  373. type="danger"
  374. style={{ marginRight: 20 }}
  375. onClick={(e) => {
  376. this.revokeFun();
  377. }}
  378. >
  379. 撤销发布
  380. </Button>
  381. <Button className="set-submit" type="ghost" onClick={this.cancelFun}>
  382. 取消
  383. </Button>
  384. </FormItem>
  385. )}
  386. </div>
  387. </SpinContainer>
  388. </Form>
  389. </div>
  390. );
  391. }
  392. })
  393. );
  394. export default DemandDetail;