From a92f3c4d10bebbdc55270e72ccd97cd1ba7d4e28 Mon Sep 17 00:00:00 2001 From: LAPTOP-RI7D261L\Mr Ke <545800322@qq.com> Date: Wed, 26 Feb 2020 16:40:55 +0800 Subject: [PATCH] Merge branch 'master' of http://120.79.193.119:9090/r/nsjcy/frontEnd/nsjcy --- SunshineIns/src/page/ActiveManage.jsx | 247 +++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 227 insertions(+), 20 deletions(-) diff --git a/SunshineIns/src/page/ActiveManage.jsx b/SunshineIns/src/page/ActiveManage.jsx index c457ae4..1eebd18 100644 --- a/SunshineIns/src/page/ActiveManage.jsx +++ b/SunshineIns/src/page/ActiveManage.jsx @@ -1,20 +1,16 @@ -/** - * 徐祥健<xuxj@hugeinfo.com.cn> - * 2018年8月28日 10:41 - * - */ - import React from 'react'; import HeadView from '../view/HeadView'; import TableBtnView from '../view/TableBtnView'; -import { Divider, Modal, message, Tooltip, Progress } from 'antd' +import CommonSearchForm from '../view/CommonSearchForm'; +import { Divider, Modal, message, Button, Row, Col, Progress, Input, Upload, Icon } from 'antd' import moment from 'moment' import Fetch from '../fetch'; import { domain } from '../fetch/_fetch'; import TableView from '../view/TableView'; const confirm = Modal.confirm; +const { TextArea } = Input; function typeOfName(type) { switch (type) { case 0: @@ -40,12 +36,55 @@ return "普法预约"; } } + +const taskNodeIds = { + 'act_1': '南检活动', + 'act_2': '法治培训', + 'act_3': '普法预约', +} + +const activityTypeList = [ + 'act_1', + 'act_2', + 'act_3', +] + +const activityStatusIds = { + 0: '未发布', + 1: '报名中', + 2: '活动中', + 3: '已结束', + 100: '已摇号', +} + +const activityStatusList = [ + 0, + 1, + 2, + 3, + 100, +] export default class ActiveManage extends React.Component { constructor(props) { super(props); this.state = { data: [], - resetKey: Date.now() + resetKey: Date.now(), + loading: false, + confirmLoading: false, + modal: false, + closeKey: Date.now(), + formData: { + __key: Date.now(), + activityType: '', + activityStatus: '', + startTime: '', + endTime: '', + }, + savedate: {}, + fileList: [], + previewVisible: false, + previewImage: '', }; } @@ -53,17 +92,83 @@ document.title = '活动管理'; this.getData(); } + + setFormData = data => { + console.log('form', data); + this.setState({ + formData: data, + }); + } + + handlePreview = (file) => { + this.setState({ + previewImage: file.url || file.thumbUrl, + previewVisible: true, + }); + } + + handleOk = () => { + console.log('success') + this.setState({ confirmLoading: true }); + const { savedate } = this.state; + console.log(savedate) + + if (!savedate.result) { + return message.warning("培训结果不能为空"); + } + Fetch.addResult({ ...savedate }) + .then(res => { + console.log(res) + if (res.code === 0) { + this.setState({ + confirmLoading: false, + modal: false, + closeKey: Date.now() + }, this.getData); + message.success("提交成功!") + } else { + message.error('保存失败,请联系管理员', 2) + } + }); + } + + handleCancel = () => { + this.setState({ + closeKey: Date.now(), + modal: false + }); + } + + searchonClick = data => { + console.log('form', data); + this.setState({ + formData: data, + }); + this.getData(); + } + + saveInputChange = ({ target: { value, name } }) => { + this.setState(({ savedate }) => ({ + savedate: { + ...savedate, + [name]: value + } + })) + } + getData = () => { // this.setState({ // data: [] // }); - Fetch.activeManage() + this.setState({ loading: true }) + Fetch.activeManage({ ...this.state.formData }) .then(res => { for (var i = 0; i < res.length; i++) { res[i]['index'] = i + 1; } this.setState({ - data: res + data: res, + loading: false }); }); } @@ -71,8 +176,18 @@ this.props.history.push("/activeManageEdit/" + id); } - signIn= (id) => { + signIn = (id) => { window.open('index.html#/signIn/' + id); + } + + addResult = (id) => { + this.setState(({ savedate }) => ({ + savedate: { + ...savedate, + id: id + }, + modal: true + })) } pulish = (id) => { @@ -162,26 +277,118 @@ <Divider type="vertical" /> <label className='theme-color' onClick={() => this.deleteItems(record.id)} style={{ cursor: 'pointer' }}>删除</label> </span> - : - record.status == 2 ? + : + record.status == 2 ? <span> <label className='theme-color' onClick={() => this.showModal(record.id)} style={{ cursor: 'pointer' }}>查看</label> <Divider type="vertical" /> <label className='theme-color' onClick={() => this.signIn(record.id)} style={{ cursor: 'pointer' }}>签到上墙</label> </span> - : - <span><label className='theme-color' onClick={() => this.showModal(record.id)} style={{ cursor: 'pointer' }}>查看</label></span> + : + record.status == 3 ? + <span> + <label className='theme-color' onClick={() => this.showModal(record.id)} style={{ cursor: 'pointer' }}>查看</label> + {!record.result && + <React.Fragment> + <Divider type="vertical" /> + <label className='theme-color' onClick={() => this.addResult(record.id)} style={{ cursor: 'pointer' }}>添加结果</label> + </React.Fragment> + } + </span> + : + <span><label className='theme-color' onClick={() => this.showModal(record.id)} style={{ cursor: 'pointer' }}>查看</label></span> ) ), }]; - const { data, resetKey } = this.state; + const { data, previewImage, formData, loading, modal, fileList, previewVisible, confirmLoading, closeKey, savedate } = this.state; + const props = { + action: domain + 'api/v1/attachment/materials?associateTypeId=1020&entityId=' + savedate.id, + onChange: ({ file, fileList }) => { + this.setState({ fileList }); + }, + fileList: fileList, + onRemove: (file) => { + Fetch.deleteAttachment(file.uid) + .then(res => { + message.success("移除成功!"); + }); + this.setState(({ fileList }) => { + const index = fileList.indexOf(file); + const newFileList = fileList.slice(); + newFileList.splice(index, 1); + return { + fileList: newFileList, + }; + }); + } + }; return ( - <div className="app-page"> + <div className="app-page" > <HeadView history={this.props.history} /> - <TableBtnView key={-resetKey} type="infoManage" name='活动一览' btnName='活动发布' onClick={() => this.showModal('new')}> - </TableBtnView> - <TableView columns={columns} data={data} pageSize='10' size='default' /> + <div style={{ marginLeft: '90%', marginBottom: '20px', marginTop: '20px' }}> + <Button type="primary" size='large' onClick={() => this.showModal('new')}>活动发布</Button> + </div> + {/* <TableBtnView key={-resetKey} type="infoManage" name='活动一览' btnName='活动发布' onClick={() => this.showModal('new')}> + </TableBtnView> */} + <div style={{ background: '#fff', margin: 20 }}> + <CommonSearchForm + {...this.props} + formData={formData} + setFormData={this.setFormData} + searchonClick={this.searchonClick} + pathName={this.props.location.pathname} + data={[ + { + type: 'select', name: '活动类型', label: '活动类型', key: 'activityType', list: activityTypeList.map(key => ({ + id: key, + name: taskNodeIds[key] + })), + }, + { + type: 'select', name: '活动状态', label: '活动状态', key: 'activityStatus', list: activityStatusList.map(key => ({ + id: key, + name: activityStatusIds[key] + })), + }, + { + type: 'rangePicker', + label: '任务生成时间', + name: JSON.stringify(['开始时间', '结束时间']), + key: JSON.stringify(['startTime', 'endTime']), + keylistName: 'rangeTimelist', + }, + ]} /> + <TableView columns={columns} data={data} pageSize='10' size='default' loading={loading} /> + </div> + <Modal + key={closeKey} + confirmLoading={confirmLoading} + visible={modal} + width={'50%'} + title="添加结果" + onOk={this.handleOk} + onCancel={this.handleCancel} + > + <Row type="flex" align='middle' style={{ margin: '12px 0' }} justify="space-around"> + <Col span={6} pull={0} style={{ textAlign: 'center' }}><span>培训结果</span></Col> + <Col span={18} push={0} ><TextArea rows={4} placeholder="请输入培训结果" value={savedate.result || ""} onChange={this.saveInputChange} name='result' /></Col> + </Row> + <Row type="flex" align='middle' justify="space-around"> + <Col span={6} pull={0} style={{ textAlign: 'center' }}><span>培训材料</span></Col> + <Col span={18} push={0} > + <Upload listType="picture-card" onPreview={this.handlePreview} {...props}> + <div> + <Icon type="plus" /> + <div className="ant-upload-text">上传图片</div> + </div> + </Upload> + <Modal visible={previewVisible} footer={null} onCancel={this.handleCancel}> + <img alt="example" style={{ width: '100%' }} src={previewImage} /> + </Modal> + </Col> + </Row> + </Modal> </div> ); } -- Gitblit v1.8.0