activity.jsx 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673
  1. import React from 'react';
  2. import { Icon, Button, Spin, message, Table, Input, Modal, DatePicker, Upload, Select } from 'antd';
  3. import { beforeUpload, getBase64, getActivityForm, getActivityType, splitUrl } from '../../../tools';
  4. import { activityForm, activityType } from '../../../dataDic';
  5. import moment from 'moment';
  6. import ajax from 'jquery/src/ajax/xhr.js';
  7. import $ from 'jquery/src/ajax';
  8. const Avatar = React.createClass({
  9. getInitialState () {
  10. return {
  11. imageUrl: ''
  12. }
  13. },
  14. handleChange (info) {
  15. if (info.file.status === 'done') {
  16. // Get this url from response in real world.
  17. getBase64(info.file.originFileObj, imageUrl => this.setState({ imageUrl }));
  18. this.props.urlData(info.file.response.data);
  19. }
  20. },
  21. componentWillReceiveProps (nextProps) {
  22. if (this.props.visible && !nextProps.visible) {
  23. this.state.imageUrl = null;
  24. };
  25. },
  26. render () {
  27. const imageUrl = this.state.imageUrl;
  28. return (
  29. <Upload
  30. className="avatar-uploader"
  31. name={this.props.name}
  32. showUploadList={false}
  33. action={globalConfig.context + "/api/admin/activity/upload"}
  34. data={{ 'sign': 'activity_title_picture' }}
  35. beforeUpload={beforeUpload}
  36. onChange={this.handleChange} >
  37. {
  38. (imageUrl || this.props.imageUrl) ?
  39. <img src={imageUrl || this.props.imageUrl} role="presentation" id={this.props.name} /> :
  40. <Icon type="plus" className="avatar-uploader-trigger" />
  41. }
  42. </Upload>
  43. );
  44. }
  45. });
  46. const PicturesWall = React.createClass({
  47. getInitialState () {
  48. return {
  49. previewVisible: false,
  50. previewImage: '',
  51. fileList: [],
  52. }
  53. },
  54. handleCancel () {
  55. this.setState({ previewVisible: false })
  56. },
  57. handlePreview (file) {
  58. this.setState({
  59. previewImage: file.url || file.thumbUrl,
  60. previewVisible: true,
  61. });
  62. },
  63. handleChange (info) {
  64. let fileList = info.fileList;
  65. this.setState({ fileList });
  66. this.props.fileList(fileList);
  67. },
  68. componentWillReceiveProps (nextProps) {
  69. this.state.fileList = nextProps.pictureUrl;
  70. },
  71. render () {
  72. const { previewVisible, previewImage, fileList } = this.state;
  73. const uploadButton = (
  74. <div>
  75. <Icon type="plus" />
  76. <div className="ant-upload-text">点击上传</div>
  77. </div>
  78. );
  79. return (
  80. <div className="clearfix">
  81. <Upload
  82. action={globalConfig.context + "/api/admin/activity/upload"}
  83. data={{ 'sign': 'activity_content_picture' }}
  84. listType="picture-card"
  85. fileList={fileList}
  86. onPreview={this.handlePreview}
  87. onChange={this.handleChange} >
  88. {fileList.length >= 5 ? null : uploadButton}
  89. </Upload>
  90. <Modal maskClosable={false} visible={previewVisible} footer={null} onCancel={this.handleCancel}>
  91. <img alt="example" style={{ width: '100%' }} src={previewImage} />
  92. </Modal>
  93. </div>
  94. );
  95. }
  96. });
  97. const Activity = React.createClass({
  98. loadData (pageNo) {
  99. this.setState({
  100. loading: true
  101. });
  102. $.ajax({
  103. method: "get",
  104. dataType: "json",
  105. crossDomain: false,
  106. url: globalConfig.context + '/api/admin/activity/list',
  107. data: {
  108. pageNo: pageNo || 1,
  109. pageSize: this.state.pagination.pageSize,
  110. sTime: this.state.startDate, //活动开始时间(startTime起)
  111. eTime: this.state.endDate, //活动开始时间(startTime止)
  112. name: this.state.searchName,
  113. host: this.state.searchHost,
  114. type: this.state.searchType ? Number(this.state.searchType) : undefined, // 活动类型
  115. form: this.state.searchForm ? Number(this.state.searchForm) : undefined, //活动形式
  116. },
  117. success: function (data) {
  118. let theArr = [];
  119. if (!data.data || !data.data.list) {
  120. if (data.error && data.error.length) {
  121. message.warning(data.error[0].message);
  122. };
  123. } else {
  124. for (let i = 0; i < data.data.list.length; i++) {
  125. let thisdata = data.data.list[i];
  126. theArr.push({
  127. key: i,
  128. id: thisdata.id,
  129. startTime: thisdata.startTime,
  130. startTimeFormattedDate: thisdata.startTimeFormattedDate,
  131. endTime: thisdata.endTime,
  132. endTimeFormattedDate: thisdata.endTimeFormattedDate,
  133. name: thisdata.name,
  134. host: thisdata.host,
  135. type: thisdata.type,
  136. form: thisdata.form,
  137. enrollDeadline: thisdata.enrollDeadline,
  138. enrollDeadlineFormattedDate: thisdata.enrollDeadlineFormattedDate
  139. });
  140. };
  141. this.state.pagination.current = data.data.pageNo;
  142. this.state.pagination.total = data.data.totalCount;
  143. };
  144. this.setState({
  145. tableData: theArr,
  146. pagination: this.state.pagination
  147. });
  148. }.bind(this),
  149. }).always(function () {
  150. this.setState({
  151. loading: false
  152. });
  153. }.bind(this));
  154. },
  155. loadDetailData () {
  156. this.setState({
  157. loading: true
  158. });
  159. $.ajax({
  160. method: "get",
  161. dataType: "json",
  162. crossDomain: false,
  163. url: globalConfig.context + '/api/admin/activity/detail',
  164. data: {
  165. id: this.state.RowData.id //新闻主键ID(数字类型,非字符串)
  166. },
  167. success: function (data) {
  168. let theObj = {}, theArr = [];
  169. if (!data.data) {
  170. if (data.error && data.error.length) {
  171. message.warning(data.error[0].message);
  172. };
  173. } else {
  174. theObj = data.data;
  175. theArr = theObj.asist ? theObj.asist.split(',') : [];
  176. theObj.imgUrls = theObj.imgUrls ? splitUrl(theObj.imgUrls, ',', globalConfig.avatarHost + '/upload') : [];
  177. };
  178. this.setState({
  179. RowData: theObj,
  180. asistArray: theArr
  181. });
  182. }.bind(this),
  183. }).always(function () {
  184. this.setState({
  185. loading: false
  186. });
  187. }.bind(this));
  188. },
  189. getInitialState () {
  190. return {
  191. loading: false,
  192. visible: false,
  193. selectedRowKeys: [],
  194. selectedRows: [],
  195. asistArray: [],
  196. keysObj: {},
  197. RowData: {},
  198. pagination: {
  199. defaultCurrent: 1,
  200. defaultPageSize: 10,
  201. showQuickJumper: true,
  202. pageSize: 10,
  203. onChange: function (page) {
  204. this.loadData(page);
  205. }.bind(this),
  206. showTotal: function (total) {
  207. return '共' + total + '条数据';
  208. }
  209. },
  210. columns: [
  211. {
  212. title: '活动名称',
  213. dataIndex: 'name',
  214. key: 'name',
  215. width: '20%'
  216. }, {
  217. title: '主办单位',
  218. dataIndex: 'host',
  219. key: 'host',
  220. }, {
  221. title: '活动类型',
  222. dataIndex: 'type',
  223. key: 'type',
  224. render: (text) => { return getActivityType(text); }
  225. }, {
  226. title: '活动形式',
  227. dataIndex: 'form',
  228. key: 'form',
  229. render: (text) => { return getActivityForm(text); }
  230. }, {
  231. title: '报名截止时间',
  232. dataIndex: 'enrollDeadlineFormattedDate',
  233. key: 'enrollDeadlineFormattedDate'
  234. }, {
  235. title: '活动开始时间',
  236. dataIndex: 'startTimeFormattedDate',
  237. key: 'startTimeFormattedDate'
  238. }
  239. ],
  240. tableData: []
  241. };
  242. },
  243. tableRowClick (record, index) {
  244. this.state.RowData = record;
  245. this.loadDetailData();
  246. this.setState({
  247. visible: true
  248. });
  249. },
  250. componentWillMount () {
  251. this.loadData();
  252. let theTypeOption = [], theFormOption = [];
  253. activityType.map((item) => {
  254. theTypeOption.push(
  255. <Select.Option key={item.value}>{item.key}</Select.Option>
  256. )
  257. });
  258. activityForm.map((item) => {
  259. theFormOption.push(
  260. <Select.Option key={item.value}>{item.key}</Select.Option>
  261. )
  262. });
  263. this.state.activityTypeOption = theTypeOption;
  264. this.state.activityFormOption = theFormOption;
  265. },
  266. submit () {
  267. if (!this.state.RowData.name) {
  268. message.warning('必须填写一个标题!');
  269. return;
  270. };
  271. if (!this.state.RowData.startTimeFormattedDate) {
  272. message.warning('必须选择一个活动开始时间!');
  273. return;
  274. };
  275. if (!this.state.RowData.type) {
  276. message.warning('必须选择一个活动类型!');
  277. return;
  278. };
  279. if (!this.state.RowData.form) {
  280. message.warning('必须选择一个活动形式!');
  281. return;
  282. };
  283. if (!this.state.RowData.address) {
  284. message.warning('必须选择一个活动地点!');
  285. return;
  286. };
  287. let imgUrls = null;
  288. if (this.state.RowData.imgUrls && this.state.RowData.imgUrls.length) {
  289. let picArr = [];
  290. this.state.RowData.imgUrls.map(function (item) {
  291. if ( item.response && item.response.data && item.response.data.length ){
  292. picArr.push(item.response.data);
  293. }
  294. });
  295. imgUrls = picArr.join(",");
  296. };
  297. this.setState({
  298. loading: true
  299. });
  300. $.ajax({
  301. method: "post",
  302. dataType: "json",
  303. crossDomain: false,
  304. url: globalConfig.context + (this.state.RowData.id ? '/api/admin/activity/update' : '/api/admin/activity/add'),
  305. data: {
  306. id: this.state.RowData.id || null, //主键,如果不填主键则为新增记录,填主键则为更新
  307. name: this.state.RowData.name,// 标题,
  308. address: this.state.RowData.address,// 活动地址,
  309. host: this.state.RowData.host,// 主办单位,
  310. undertake: this.state.RowData.undertake,// 承办单位,
  311. asist: this.state.asistArray ? this.state.asistArray.join(',') : undefined,// 协办单位A,协办单位B,
  312. type: this.state.RowData.type,// 0, //活动类型
  313. form: this.state.RowData.form,// 1, //活动形式
  314. imgUrls: imgUrls,// 活动图片,
  315. result: this.state.RowData.result,// 活动结果,
  316. titleUrl: this.state.RowData.titleUrl,// 题图URL,
  317. summary: this.state.RowData.summary,// 描述,
  318. startTimeFormattedDate: this.state.RowData.startTimeFormattedDate,// 2012-02-02, //活动开始时间 yyyy-MM-dd
  319. endTimeFormattedDate: this.state.RowData.endTimeFormattedDate,// 2012-09-09, //活动结束时间 yyyy-MM-dd
  320. enrollDeadlineFormattedDate: this.state.RowData.enrollDeadlineFormattedDate,// 2012-09-09, //报名结束时间 yyyy-MM-dd
  321. },
  322. success: function (data) {
  323. if (data.error && data.error.length) {
  324. message.warning(data.error[0].message);
  325. } else {
  326. message.success('保存成功!');
  327. this.setState({ visible: false });
  328. this.loadData();
  329. };
  330. }.bind(this),
  331. }).always(function () {
  332. this.setState({
  333. loading: false
  334. });
  335. }.bind(this));
  336. },
  337. cleanCache (sign) {
  338. this.setState({
  339. loading: true
  340. });
  341. $.ajax({
  342. method: "post",
  343. dataType: "json",
  344. crossDomain: false,
  345. url: globalConfig.context + '/api/admin/activity/cleanCache',
  346. data: {
  347. 'cacheKey': sign
  348. },
  349. success: function (data) {
  350. if (data.error && data.error.length) {
  351. message.warning(data.error[0].message);
  352. } else {
  353. message.success('清除缓存成功!');
  354. };
  355. }.bind(this),
  356. }).always(function () {
  357. this.setState({
  358. loading: false
  359. });
  360. }.bind(this));
  361. },
  362. delectRow () {
  363. let deletedIds = [];
  364. for (let idx = 0; idx < this.state.selectedRows.length; idx++) {
  365. let rowItem = this.state.selectedRows[idx];
  366. if (rowItem.id) {
  367. deletedIds.push(rowItem.id)
  368. };
  369. };
  370. this.setState({
  371. selectedRowKeys: [],
  372. loading: deletedIds.length > 0
  373. });
  374. $.ajax({
  375. method: "POST",
  376. dataType: "json",
  377. crossDomain: false,
  378. url: globalConfig.context + "/api/admin/activity/delete",
  379. data: {
  380. ids: deletedIds
  381. }
  382. }).done(function (data) {
  383. if (data.error && data.error.length) {
  384. message.warning(data.error[0].message);
  385. } else {
  386. message.success('删除成功!');
  387. };
  388. this.setState({
  389. loading: false,
  390. });
  391. this.loadData();
  392. }.bind(this));
  393. },
  394. reset () {
  395. this.state.startDate = undefined;
  396. this.state.endDate = undefined;
  397. this.state.searchName = undefined;
  398. this.state.searchHost = undefined;
  399. this.state.searchType = undefined;
  400. this.state.searchForm = undefined;
  401. this.loadData();
  402. },
  403. render () {
  404. const rowSelection = {
  405. selectedRowKeys: this.state.selectedRowKeys,
  406. onChange: (selectedRowKeys, selectedRows) => {
  407. this.setState({
  408. selectedRows: selectedRows.slice(-1),
  409. selectedRowKeys: selectedRowKeys.slice(-1)
  410. });
  411. }
  412. };
  413. const hasSelected = this.state.selectedRowKeys.length > 0;
  414. return (
  415. <div className="admin-content" >
  416. <div className="admin-content-title">
  417. <span>活动圈管理</span>
  418. <Button type="primary" style={{ float: 'right' }}
  419. onClick={() => { this.setState({ RowData: {}, visible: true }) }}>
  420. 添加<Icon type="plus" />
  421. </Button>
  422. </div>
  423. <div className="admin-content-warp">
  424. <div className="admin-content-search">
  425. <Input placeholder="活动名称" style={{ width: 200 }}
  426. value={this.state.searchName}
  427. onChange={(e) => { this.setState({ searchName: e.target.value }); }} />
  428. <Input placeholder="主办单位" style={{ width: 200 }}
  429. value={this.state.searchHost}
  430. onChange={(e) => { this.setState({ searchHost: e.target.value }); }} />
  431. <Select placeholder="活动类型"
  432. style={{ width: 100 }}
  433. value={this.state.searchType}
  434. onChange={(e) => { this.setState({ searchType: e }) }}>
  435. {this.state.activityTypeOption}
  436. </Select>
  437. <Select placeholder="活动形式"
  438. style={{ width: 100 }}
  439. value={this.state.searchForm}
  440. onChange={(e) => { this.setState({ searchForm: e }) }}>
  441. {this.state.activityFormOption}
  442. </Select>
  443. <span>活动时间</span>
  444. <DatePicker style={{ width: 150 }}
  445. showTime
  446. format="YYYY-MM-DD HH:mm:ss"
  447. placeholder="搜索开始时间"
  448. value={this.state.startDate ? moment(this.state.startDate, "YYYY-MM-DD HH:mm:ss") : undefined}
  449. onChange={(t, str) => {
  450. this.setState({ startDate: str });
  451. }} />
  452. <span>到</span>
  453. <DatePicker style={{ width: 150 }}
  454. showTime
  455. format="YYYY-MM-DD HH:mm:ss"
  456. placeholder="搜索结束时间"
  457. value={this.state.endDate ? moment(this.state.endDate, "YYYY-MM-DD HH:mm:ss") : undefined}
  458. onChange={(t, str) => {
  459. this.setState({ endDate: str });
  460. }} />
  461. <Button type="primary" onClick={() => { this.loadData() }}>搜索</Button>
  462. <Button onClick={this.reset}>重置</Button>
  463. <Button type='danger' disabled={!hasSelected} onClick={this.delectRow}>
  464. 删除<Icon type="minus" />
  465. </Button>
  466. <Button type="primary" onClick={() => { this.cleanCache('activity_portal_list_cache_key'); }}>清除缓存</Button>
  467. </div>
  468. <Spin spinning={this.state.loading}>
  469. <Table className="no-all-select" columns={this.state.columns}
  470. dataSource={this.state.tableData}
  471. pagination={this.state.pagination}
  472. rowSelection={rowSelection}
  473. onRowClick={this.tableRowClick} />
  474. </Spin>
  475. </div>
  476. <Modal title="活动详情" width={600} className="activity-modal"
  477. visible={this.state.visible}
  478. maskClosable={false}
  479. footer={null}
  480. afterClose={() => { this.state.RowData = {}; this.state.asist = null; this.state.asistArray = []; }}
  481. onCancel={() => { this.setState({ visible: false }) }} >
  482. <Spin spinning={this.state.loading}>
  483. <div className="clearfix">
  484. <div className="modal-box">
  485. <span className="modal-box-title">活动标题</span>
  486. <div className="modal-box-detail">
  487. <Input value={this.state.RowData.name}
  488. onChange={(e) => {
  489. this.state.RowData.name = e.target.value;
  490. this.setState({ RowData: this.state.RowData });
  491. }} />
  492. </div>
  493. </div>
  494. <div className="modal-box">
  495. <span className="modal-box-title">标题图片</span>
  496. <div className="modal-box-detail clearfix" style={{ width: '360px' }}>
  497. <Avatar visible={this.state.visible}
  498. imageUrl={this.state.RowData.titleUrl ? (globalConfig.avatarHost + "/upload" + this.state.RowData.titleUrl) : null}
  499. urlData={(url) => { this.state.RowData.titleUrl = url }} />
  500. </div>
  501. </div>
  502. <div className="modal-box">
  503. <span className="modal-box-title">活动描述</span>
  504. <div className="modal-box-detail">
  505. <Input type="textarea" rows={4} value={this.state.RowData.summary}
  506. onChange={(e) => {
  507. this.state.RowData.summary = e.target.value;
  508. this.setState({ RowData: this.state.RowData });
  509. }} />
  510. </div>
  511. </div>
  512. <div className="modal-box">
  513. <span className="modal-box-title">活动类型</span>
  514. <div className="modal-box-detail" style={{ width: '160px' }}>
  515. <Select placeholder="选择活动类型"
  516. style={{ width: 120 }}
  517. value={this.state.RowData.type}
  518. onChange={(e) => {
  519. this.state.RowData.type = e;
  520. this.setState({ RowData: this.state.RowData });
  521. }}>
  522. {this.state.activityTypeOption}
  523. </Select>
  524. </div>
  525. <span className="modal-box-title">活动形式</span>
  526. <div className="modal-box-detail" style={{ width: '160px' }}>
  527. <Select placeholder="选择活动形式"
  528. style={{ width: 120 }}
  529. value={this.state.RowData.form}
  530. onChange={(e) => {
  531. this.state.RowData.form = e;
  532. this.setState({ RowData: this.state.RowData });
  533. }}>
  534. {this.state.activityFormOption}
  535. </Select>
  536. </div>
  537. </div>
  538. <div className="modal-box">
  539. <span className="modal-box-title">活动地址</span>
  540. <div className="modal-box-detail">
  541. <Input value={this.state.RowData.address}
  542. onChange={(e) => {
  543. this.state.RowData.address = e.target.value;
  544. this.setState({ RowData: this.state.RowData });
  545. }} />
  546. </div>
  547. </div>
  548. <div className="modal-box">
  549. <span className="modal-box-title">主办单位</span>
  550. <div className="modal-box-detail">
  551. <Input value={this.state.RowData.host}
  552. onChange={(e) => {
  553. this.state.RowData.host = e.target.value;
  554. this.setState({ RowData: this.state.RowData });
  555. }} />
  556. </div>
  557. </div>
  558. <div className="modal-box">
  559. <span className="modal-box-title">承办单位</span>
  560. <div className="modal-box-detail">
  561. <Input value={this.state.RowData.undertake}
  562. onChange={(e) => {
  563. this.state.RowData.undertake = e.target.value;
  564. this.setState({ RowData: this.state.RowData });
  565. }} />
  566. </div>
  567. </div>
  568. <div className="modal-box">
  569. <span className="modal-box-title">协办单位</span>
  570. <div className="modal-box-detail">
  571. <Input value={this.state.asist} style={{ width: '320px', marginRight: '20px' }}
  572. onChange={(e) => { this.setState({ asist: e.target.value }); }} />
  573. <Button onClick={() => {
  574. if (!this.state.asist || this.state.asist.length == 0) {
  575. return;
  576. }
  577. let _me = this, theArr = this.state.asistArray.concat(), theBool = true;
  578. if (!theArr.length) {
  579. theArr.push(this.state.asist);
  580. } else {
  581. this.state.asistArray.map((item, i) => {
  582. if (item === _me.state.asist) {
  583. theBool = false;
  584. };
  585. });
  586. if (theBool) {
  587. theArr.push(_me.state.asist);
  588. } else {
  589. message.warning('已经录入该单位!')
  590. }
  591. };
  592. this.setState({ asistArray: theArr, asist: null });
  593. }}>添加</Button>
  594. </div>
  595. <div className="modal-box-detail" style={{ marginLeft: '106px' }}>
  596. {this.state.asistArray.map((item, i) => {
  597. return <p key={i}>{item}</p>
  598. })}
  599. </div>
  600. </div>
  601. <div className="modal-box">
  602. <span className="modal-box-title">活动时间</span>
  603. <div className="modal-box-detail">
  604. <DatePicker style={{ width: '150px' }}
  605. showTime
  606. format="YYYY-MM-DD HH:mm:ss"
  607. placeholder="选择开始时间"
  608. value={this.state.RowData.startTimeFormattedDate ? moment(this.state.RowData.startTimeFormattedDate, "YYYY-MM-DD HH:mm:ss") : undefined}
  609. onChange={(t, str) => {
  610. this.state.RowData.startTimeFormattedDate = str;
  611. this.setState({ RowData: this.state.RowData });
  612. }} />
  613. <span>到</span>
  614. <DatePicker style={{ width: '150px' }}
  615. showTime
  616. format="YYYY-MM-DD HH:mm:ss"
  617. placeholder="选择结束时间"
  618. value={this.state.RowData.endTimeFormattedDate ? moment(this.state.RowData.endTimeFormattedDate, "YYYY-MM-DD HH:mm:ss") : undefined}
  619. onChange={(t, str) => {
  620. this.state.RowData.endTimeFormattedDate = str;
  621. this.setState({ RowData: this.state.RowData });
  622. }} />
  623. </div>
  624. </div>
  625. <div className="modal-box">
  626. <span className="modal-box-title">报名截止时间</span>
  627. <div className="modal-box-detail">
  628. <DatePicker style={{ width: '150px' }}
  629. showTime
  630. format="YYYY-MM-DD HH:mm:ss"
  631. placeholder="选择截止时间"
  632. value={this.state.RowData.enrollDeadlineFormattedDate ? moment(this.state.RowData.enrollDeadlineFormattedDate, "YYYY-MM-DD HH:mm:ss") : undefined}
  633. onChange={(t, str) => {
  634. this.state.RowData.enrollDeadlineFormattedDate = str;
  635. this.setState({ RowData: this.state.RowData });
  636. }} />
  637. </div>
  638. </div>
  639. <div className="modal-box">
  640. <span className="modal-box-title">活动图片</span>
  641. <div className="modal-box-detail">
  642. <PicturesWall
  643. fileList={(e) => { this.state.RowData.imgUrls = e; this.setState({ RowData: this.state.RowData }); }}
  644. pictureUrl={this.state.RowData.imgUrls || []} />
  645. </div>
  646. </div>
  647. <div className="modal-box">
  648. <span className="modal-box-title">活动结果描述</span>
  649. <div className="modal-box-detail">
  650. <Input type="textarea" rows={4} value={this.state.RowData.result}
  651. onChange={(e) => {
  652. this.state.RowData.result = e.target.value;
  653. this.setState({ RowData: this.state.RowData });
  654. }} />
  655. </div>
  656. </div>
  657. </div>
  658. <div className="modal-box">
  659. <Button type="primary" onClick={this.submit}>提交</Button>
  660. <Button type="ghost" onClick={() => { this.setState({ visible: false }) }}>取消</Button>
  661. </div>
  662. </Spin>
  663. </Modal>
  664. </div >
  665. );
  666. }
  667. });
  668. export default Activity;