newDetails.jsx 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251
  1. import React from 'react';
  2. import $ from 'jquery/src/ajax';
  3. import {
  4. Modal,
  5. message,
  6. Spin,
  7. Upload,
  8. Button,
  9. Form,
  10. } from 'antd';
  11. import {getProvince} from '@/NewDicProvinceList';
  12. import {getReleaseStateList,getNewPosition,splitUrl} from '@/tools';
  13. const NewDetail = Form.create()(React.createClass({
  14. getInitialState() {
  15. return {
  16. visible: false,
  17. loading: false,
  18. auditStatus: 0,
  19. textFileList: [],
  20. videoFileList: [],
  21. pictureUrl: [],
  22. };
  23. },
  24. loadData(id) {
  25. this.setState({
  26. loading: true
  27. });
  28. $.ajax({
  29. method: "get",
  30. dataType: "json",
  31. crossDomain: false,
  32. url: globalConfig.context + '/api/admin/news/detail' ,
  33. data: {
  34. id: id
  35. },
  36. success: function (data) {
  37. let thisData = data.data;
  38. if (!thisData) {
  39. if (data.error && data.error.length) {
  40. message.warning(data.error[0].message);
  41. };
  42. thisData = {};
  43. };
  44. document.querySelector('.txt').innerHTML='';
  45. let publishPagesArr = [];
  46. let pageList = thisData.publishPages?(thisData.publishPages).split(','):[];
  47. pageList.map(item=>{
  48. publishPagesArr.push(item.publishPage)
  49. });
  50. let ProvinceS = thisData.provinceId,page=[], //getprovince
  51. ProvinceCity = getProvince(ProvinceS);
  52. let pages =thisData.newsPublishs ||[];
  53. pages.map(item=>{
  54. page.push(item.publishPage)
  55. })
  56. console.log(page)
  57. let eleDiv = document.createElement('div');
  58. eleDiv.innerHTML=thisData.content;
  59. console.log(eleDiv);
  60. document.querySelector('.txt').append(eleDiv);
  61. this.setState({
  62. id:thisData.id,
  63. publishPagesArr:publishPagesArr,
  64. data: thisData,
  65. page:page,
  66. eleDiv:eleDiv,
  67. ProvinceCity:ProvinceCity,
  68. edit:{content:thisData.content},
  69. auditStatus:thisData.auditStatus,
  70. pictureUrl: thisData.titleImg ? splitUrl(thisData.titleImg, ',', globalConfig.avatarHost + '/upload') : []
  71. });
  72. }.bind(this),
  73. }).always(function () {
  74. this.setState({
  75. loading: false
  76. });
  77. }.bind(this));
  78. },
  79. cancelFun(){
  80. this.props.closeDesc();
  81. },
  82. //刷新发布
  83. updateFun(inex){
  84. this.setState({
  85. loading:true
  86. })
  87. $.ajax({
  88. method: "POST",
  89. dataType: "json",
  90. crossDomain: false,
  91. url: globalConfig.context +'/api/admin/news/updateStatus',
  92. data: {
  93. id: this.state.id,
  94. auditStatus:this.state.auditStatus,
  95. refresh:1
  96. }
  97. }).done(function (data) {
  98. if (!data.error.length) {
  99. message.success('刷新成功!');
  100. this.setState({
  101. loading: false,
  102. });
  103. } else {
  104. message.warning(data.error[0].message);
  105. };
  106. this.props.handOk();
  107. }.bind(this));
  108. },
  109. //撤销发布
  110. revokeFun(){
  111. this.setState({
  112. loading:true
  113. })
  114. $.ajax({
  115. method: "POST",
  116. dataType: "json",
  117. crossDomain: false,
  118. url: globalConfig.context + '/api/admin/news/updateStatus',
  119. data: {
  120. id: this.state.id,
  121. auditStatus:4,
  122. }
  123. }).done(function (data) {
  124. if (!data.error.length) {
  125. message.success('撤销成功!');
  126. this.setState({
  127. loading: false,
  128. });
  129. } else {
  130. message.warning(data.error[0].message);
  131. };
  132. this.props.handOk();
  133. }.bind(this));
  134. },
  135. componentWillMount() {
  136. if (this.props.data.id) {
  137. this.loadData(this.props.data.id);
  138. } else {
  139. this.state.data = {};
  140. };
  141. },
  142. componentWillReceiveProps(nextProps) {
  143. if (!this.props.visible && nextProps.visible) {
  144. this.state.textFileList = [];
  145. this.state.videoFileList = [];
  146. if (nextProps.data.id) {
  147. this.loadData(nextProps.data.id);
  148. } else {
  149. this.state.data = {};
  150. this.state.pictureUrl = [];
  151. };
  152. this.props.form.resetFields();
  153. };
  154. },
  155. render() {
  156. const theData = this.state.data || {};
  157. const FormItem = Form.Item
  158. const formItemLayout = {
  159. labelCol: { span: 6 },
  160. wrapperCol: { span: 12 },
  161. };
  162. return (
  163. <div className='login'>
  164. <Form layout="horizontal" id="demand-form">
  165. <Spin spinning={this.state.loading}>
  166. <div className="clearfix">
  167. <FormItem className="half-item" {...formItemLayout} label="新闻标题">
  168. <span>{theData.title}</span>
  169. </FormItem>
  170. <FormItem className="half-item" {...formItemLayout} label="热门">
  171. <span>{theData.hot=='0'&&'否'}{theData.hot=='1'&&'是'}</span>
  172. </FormItem>
  173. <FormItem className="half-item" {...formItemLayout} label="新闻来源">
  174. <span>{theData.source}</span>
  175. </FormItem>
  176. <FormItem className="half-item" {...formItemLayout} label="来源链接">
  177. <span>{theData.sourceUrl}</span>
  178. </FormItem>
  179. <FormItem className="half-item" {...formItemLayout} label="省市区">
  180. <span>{this.state.ProvinceCity}</span>
  181. </FormItem>
  182. </div>
  183. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="新闻图片">
  184. <div className="clearfix">
  185. <Upload className="demandDetailShow-upload"
  186. listType="picture-card"
  187. fileList={this.state.pictureUrl}
  188. onPreview={(file) => {
  189. this.setState({
  190. previewImage: file.url || file.thumbUrl,
  191. previewVisible: true,
  192. });
  193. }} >
  194. </Upload>
  195. <Modal maskClosable={false} footer={null}
  196. visible={this.state.previewVisible}
  197. onCancel={() => { this.setState({ previewVisible: false }) }}>
  198. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  199. </Modal>
  200. </div>
  201. </FormItem>
  202. <div className="clearfix">
  203. <FormItem className="half-item" {...formItemLayout} label="发布状态">
  204. <span>{getReleaseStateList(theData.auditStatus)}</span>
  205. </FormItem>
  206. <FormItem className="half-item" {...formItemLayout} label="发布时间">
  207. <span>{theData.releaseDate?(new Date(theData.releaseDate)).toLocaleString():''}</span>
  208. </FormItem>
  209. </div>
  210. <div className="clearfix">
  211. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="发布位置">
  212. <span>{getNewPosition(this.state.page)}</span>
  213. </FormItem>
  214. </div>
  215. <div className="clearfix">
  216. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="新闻简介">
  217. <span>{theData.summary}</span>
  218. </FormItem>
  219. <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="新闻正文">
  220. <span className="txt"></span>
  221. </FormItem>
  222. </div>
  223. <div className="clearfix">
  224. {this.props.data.auditStatus=='2'&&<FormItem wrapperCol={{ span: 12, offset: 3 }}>
  225. <Button className="set-submit" type="primary" onClick={(e)=>{this.updateFun()}} >
  226. 刷新发布
  227. </Button>
  228. <Button type="danger" style={{marginRight:20}} onClick={(e)=>{this.revokeFun()}}>
  229. 撤销发布
  230. </Button>
  231. <Button className="set-submit" type="ghost" onClick={this.cancelFun}>
  232. 取消
  233. </Button>
  234. </FormItem>}
  235. </div>
  236. </Spin>
  237. </Form>
  238. </div>
  239. )
  240. }
  241. }));
  242. export default NewDetail;