/**
|
* 徐祥健<xuxj@hugeinfo.com.cn>
|
* 2018年8月29日 16:19
|
*
|
*/
|
import React from 'react';
|
|
import { Row, Col, Input, DatePicker, Button, Modal, Upload, Table, Icon, message, Divider, TimePicker, Badge, Select, Popconfirm, Spin, Breadcrumb } from 'antd';
|
const { TextArea, Search } = Input;
|
import HeadView from '../view/HeadView';
|
import BusDetailView from '../view/BusDetailView';
|
import TableView from '../view/TableView';
|
import ImageBoxView from '../view/ImageBoxView'
|
// 引入编辑器以及编辑器样式
|
import BraftEditor from 'braft-editor'
|
import 'braft-editor/dist/index.css'
|
import Fetch from '../fetch';
|
import moment from 'moment';
|
const format = 'HH:mm';
|
const { Option } = Select;
|
const yearFormat = 'YYYY-MM-DD';
|
const divStyle = {
|
margin: '20px'
|
}
|
const domain = Fetch.domain;
|
|
function typeStatus(type) {
|
switch (type) {
|
case 1:
|
return "待审核";
|
case 2:
|
return "未签到";
|
case 3:
|
return "已签到";
|
case 4:
|
return "不通过";
|
case 99:
|
return "取消";
|
}
|
}
|
export default class ActiveManageEdit extends React.Component {
|
constructor(props) {
|
super(props);
|
this.state = {
|
dateSource: [],
|
savedate: {},
|
formdata: {},
|
fileList: [],
|
attList1: [],
|
previewVisible: false,
|
previewImage: '',
|
visible: false,
|
hitList: [],
|
num: 0,
|
activityType: 'act_1',
|
disabled: true,
|
status: '',
|
loading: false,
|
code: '',
|
editorState: BraftEditor.createEditorState(null),
|
questionnaireModal: false,
|
pageSize: 10,
|
page: 1,
|
selectedRowKeys: [],
|
selectedQuestionnaireData: {}
|
};
|
}
|
|
componentDidMount() {
|
document.title = '活动发布';
|
this.getDetail();
|
}
|
|
getDetail = () => {
|
const { id } = this.props.match.params;
|
this.setState({ loading: true })
|
Fetch.getActiveDetail(id)
|
.then(res => {
|
let { startTime, endTime } = res.activity;
|
if (startTime == null) {
|
startTime = Date.now();
|
}
|
if (endTime == null) {
|
endTime = Date.now();
|
}
|
console.log(res.attachments)
|
this.setState({
|
savedate: {
|
...res.activity,
|
startDate: moment(startTime).format(yearFormat),
|
startHour: moment(startTime).format(format),
|
endDate: moment(endTime).format(yearFormat),
|
endHour: moment(endTime).format(format),
|
activityType: res.activity.activityType || 'act_1',
|
},
|
code: res.code || '',
|
editorState: BraftEditor.createEditorState(res.activity.course),
|
activityType: res.activity.activityType || 'act_1',
|
status: res.activity.activityStatus || '',
|
disabled: res.activity.activityStatus == 0 ? false : true,
|
dateSource: res.personList || [],
|
// fileList: res.attachments.length > 0 ? res.attachments.filter(item=>(item.typeId==1000)) : [],
|
fileList: res.attachments || [],
|
attList1: res.attList1 || [],
|
loading: false,
|
modalLoading: false,
|
selectedQuestionnaireData: res.questionnaire || {}
|
});
|
})
|
}
|
onShowSizeChange = (current, pageSize) => {
|
this.setState({ pageSize, page: 1 })
|
this.loadData(1, pageSize);
|
}
|
pageChange = (page, pageSize) => {
|
this.loadData(page, pageSize);
|
}
|
|
saveInputChange = ({ target: { value, name } }) => {
|
this.setState(({ savedate }) => ({
|
savedate: {
|
...savedate,
|
[name]: value
|
}
|
}))
|
}
|
|
selectonClick = () => {
|
this.setState({
|
questionnaireModal: true,
|
modalLoading: true
|
})
|
Fetch.questionQuery({
|
status: 3,
|
page: this.state.page,
|
size: this.state.pageSize,
|
})
|
.then(res => {
|
console.log('res', res);
|
this.setState({
|
modalLoading: false
|
})
|
if (res.code == 0) {
|
for (var i = 0; i < res.data.content.length; i++) {
|
res.data.content[i]['index'] = i + 1;
|
res.data.content[i]['key'] = i;
|
}
|
this.setState({
|
tableData: res.data.content,
|
totalElements: res.data.totalElements
|
});
|
|
}
|
});
|
}
|
|
selectCancelModel = () => {
|
this.setState({
|
questionnaireModal: false,
|
selectedRowKeys: [],
|
selectedQuestionnaireData: {},
|
})
|
}
|
|
|
questionnaireCancle = () => {
|
const { selectedQuestionnaireData } = this.state;
|
// this.props.history.push(`/questionnaire/detail/${selectedQuestionnaireData.id}`)
|
window.open('index.html#/activeManageEditquestionnaire/' + selectedQuestionnaireData.id);
|
}
|
|
questionnaireDel = () => {
|
this.setState({ selectedQuestionnaireData: {} })
|
}
|
|
handleOk = (e) => {
|
console.log(e)
|
this.setState({
|
questionnaireModal: false,
|
selectedRowKeys: []
|
})
|
}
|
|
questionnaireSearch = (value) => {
|
console.log(value)
|
}
|
|
submit = () => {
|
const { savedate, selectedQuestionnaireData, fileList } = this.state;
|
savedate.startTime = moment(savedate.startDate + " " + moment(savedate.startHour).format(format), 'YYYY-MM-DD HH:mm')
|
savedate.endTime = moment(savedate.endDate + " " + moment(savedate.endHour).format(format), 'YYYY-MM-DD HH:mm')
|
// console.log({...savedate,queId:selectedQuestionnaireData[0].id});
|
console.log(savedate);
|
console.log(selectedQuestionnaireData);
|
if (!savedate.host) {
|
message.warning("主持人不能为空");
|
return;
|
}
|
if (savedate.activityPhone) {
|
if (!savedate.activityPhone) {
|
return message.warning("联系电话不能为空");
|
}
|
}
|
if (!savedate.activityTitle) {
|
message.warning("活动标题不能为空");
|
return;
|
}
|
if (!savedate.activityAddress) {
|
message.warning("活动地址不能为空");
|
return;
|
}
|
if (!savedate.activityPersonQuota) {
|
message.warning("活动人数不能为空");
|
return;
|
}
|
if (!savedate.activityDesc) {
|
message.warning("活动描述不能为空");
|
return;
|
}
|
if (!savedate.requirement) {
|
message.warning("报名要求不能为空");
|
return;
|
}
|
|
if (fileList.length = 0) {
|
message.warning("添加图片不能为空");
|
return;
|
}
|
|
if (!selectedQuestionnaireData) {
|
return message.warning("调查问卷不能为空");
|
}
|
|
Fetch.saveActive({ ...savedate, queId: selectedQuestionnaireData.id })
|
.then(res => {
|
if (res.code === 0) {
|
message.success("提交成功!");
|
this.props.history.push("/activeManage")
|
} else {
|
message.error('保存失败,请联系管理员', 2)
|
}
|
});
|
}
|
|
cancle = () => {
|
this.props.history.push("/activeManage");
|
}
|
handlePreview = (file) => {
|
this.setState({
|
previewImage: file.url || file.thumbUrl,
|
previewVisible: true,
|
});
|
}
|
|
showModal = () => {
|
this.setState({
|
visible: true,
|
});
|
}
|
|
handleCancelModel = (e) => {
|
this.setState({
|
visible: false,
|
});
|
}
|
|
getNum = (e) => {
|
console.log(e.target.value)
|
this.setState({
|
num: e.target.value
|
})
|
}
|
getPerson = () => {
|
const { num } = this.state;
|
const { id } = this.state.savedate;
|
if (!num) {
|
message.error("请输入摇号数量")
|
return;
|
}
|
if (isNaN(num)) {
|
message.error("请输入数字")
|
return;
|
}
|
Fetch.getActPerson(id, num)
|
.then(res => {
|
this.setState({
|
hitList: res.data
|
})
|
});
|
}
|
|
|
publishResult = () => {
|
const { hitList, savedate } = this.state;
|
Fetch.publishResult(hitList, savedate.id)
|
.then(res => {
|
if (res.code === 0) {
|
message.success("发布成功!");
|
this.setState({
|
visible: false,
|
}, this.getDetail);
|
} else {
|
message.error('发布失败,请联系管理员', 2)
|
}
|
});
|
}
|
|
confirm = (e) => {
|
console.log(e);
|
const data = { id: e, status: 2 };
|
this.setState({ loading: true })
|
Fetch.auditPerson(data).then(res => {
|
if (res.code == 0) {
|
console.log(res)
|
this.setState({ loading: false })
|
message.success('审核通过');
|
this.getDetail();
|
} else {
|
this.setState({ loading: false })
|
message.error('请求失败,请联系管理员', 2)
|
}
|
}
|
)
|
}
|
|
cancel = (e) => {
|
console.log(e);
|
const data = { id: e, status: 4 };
|
this.setState({ loading: true })
|
Fetch.auditPerson(data).then(res => {
|
if (res.code == 0) {
|
console.log(res)
|
this.setState({ loading: false })
|
message.error('审核不通过');
|
this.getDetail();
|
} else {
|
this.setState({ loading: false })
|
message.error('请求失败,请联系管理员', 2)
|
}
|
}
|
)
|
}
|
|
uploadFn = (param) => {
|
|
const serverURL = domain + 'api/v1/attachment/upload'
|
const xhr = new XMLHttpRequest
|
const fd = new FormData()
|
const successFn = (response) => {
|
// 假设服务端直接返回文件上传后的地址
|
// 上传成功后调用param.success并传入上传后的文件地址
|
//Pz
|
const res = JSON.parse(xhr.responseText);
|
param.success({
|
url: domain + 'api/v1/attachment/image/' + res[0].id,
|
meta: {
|
id: res[0].id,
|
title: res[0].name,
|
alt: res[0].name,
|
loop: true, // 指定音视频是否循环播放
|
autoPlay: true, // 指定音视频是否自动播放
|
controls: true, // 指定音视频是否显示控制栏
|
poster: domain + 'api/v1/attachment/image/' + res[0].id, // 指定视频播放器的封面
|
}
|
})
|
}
|
|
|
const progressFn = (event) => {
|
// 上传进度发生变化时调用param.progress
|
param.progress(event.loaded / event.total * 100)
|
}
|
|
const errorFn = (response) => {
|
// 上传发生错误时调用param.error
|
param.error({
|
msg: 'unable to upload.'
|
})
|
}
|
xhr.upload.addEventListener("progress", progressFn, false)
|
xhr.addEventListener("load", successFn, false)
|
xhr.addEventListener("error", errorFn, false)
|
xhr.addEventListener("abort", errorFn, false)
|
fd.append('file', param.file)
|
xhr.open('POST', serverURL, true)
|
xhr.send(fd)
|
}
|
|
handleEditorChange = (editorState) => {
|
this.setState({ editorState })
|
}
|
|
submitContent = () => {
|
// 在编辑器获得焦点时按下ctrl+s会执行此方法
|
// 编辑器内容提交到服务端之前,可直接调用editorState.toHTML()来获取HTML格式的内容
|
const htmlContent = this.state.editorState.toHTML()
|
this.setState(({ savedate }) => ({
|
savedate: {
|
...savedate,
|
course: htmlContent
|
}
|
}))
|
}
|
|
onSelectChange = (selectedRowKeys, selectedRows) => {
|
const { tableData } = this.state;
|
console.log('selectedRowKeys changed: ', selectedRowKeys);
|
console.log('selectedRowKeys changed: ', selectedRows);
|
console.log(tableData[selectedRowKeys[0]]);
|
console.log(tableData);
|
this.setState({
|
selectedQuestionnaireData: tableData[selectedRowKeys[0]],
|
selectedRowKeys
|
})
|
};
|
|
handleCancel = () => this.setState({ previewVisible: false })
|
render() {
|
const { savedate, previewVisible, previewImage, editorState, selectedRowKeys, fileList, attList1, dateSource, code, hitList, activityType, disabled, loading, modalLoading } = this.state;
|
console.log('disabled', fileList)
|
const props = {
|
action: domain + 'api/v1/attachment/materials?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,
|
};
|
});
|
}
|
};
|
const bottmProps = {
|
action: domain + 'api/v1/attachment/materials?entityId=' + savedate.id,
|
onChange: ({ file, fileList }) => {
|
this.setState({ attList1: fileList });
|
},
|
fileList: attList1,
|
onRemove: (file) => {
|
Fetch.deleteAttachment(file.uid)
|
.then(res => {
|
message.success("移除成功!");
|
});
|
this.setState(({ attList1 }) => {
|
const index = attList1.indexOf(file);
|
const newFileList = attList1.slice();
|
newFileList.splice(index, 1);
|
return {
|
fileList: newFileList,
|
};
|
});
|
}
|
};
|
const columns = [{
|
title: '姓名',
|
dataIndex: 'proposerName',
|
key: 'proposerName'
|
}, {
|
title: '联系电话',
|
dataIndex: 'proposerPhone',
|
key: 'proposerPhone',
|
}, {
|
title: '是否中奖',
|
dataIndex: 'isHit',
|
key: 'isHit',
|
render: text => ((
|
savedate.activityStatus < 3 ?
|
<span>未开奖</span> :
|
(
|
text == 0 ? <span>未中奖</span> : <Badge count={'中奖'} style={{ backgroundColor: '#52c41a' }} />
|
)
|
)
|
)
|
}];
|
const questionnaireColumns = [{
|
title: '主题',
|
dataIndex: 'title',
|
key: 'title',
|
ellipsis: true,
|
render: (cur, item) => {
|
return cur || '暂无'
|
}
|
}, {
|
title: '描述',
|
dataIndex: 'content',
|
key: 'content',
|
ellipsis: true,
|
render: (cur, item) => {
|
return cur || '暂无'
|
}
|
}, {
|
title: '发布时间',
|
dataIndex: 'publicTime',
|
key: 'publicTime',
|
render: (cur, item) => {
|
return cur ? moment(cur).format("YYYY-MM-DD HH:mm") : '暂无'
|
}
|
}];
|
|
const act2columns = [{
|
title: '报名方',
|
dataIndex: 'proposerName',
|
key: 'proposerName'
|
},
|
// {
|
// title: '报名方性质',
|
// dataIndex: 'signerType',
|
// key: 'signerType',
|
// render: text => (<span>{text == 1 ? '个人' : '企业'}</span>)
|
// }, {
|
// title: '报名人数',
|
// dataIndex: 'signNum',
|
// key: 'signNum',
|
// },
|
{
|
title: '审核状态',
|
dataIndex: 'signStatus',
|
key: 'signStatus',
|
render: text => (<span>{typeStatus(text)}</span>)
|
}, {
|
title: '操作',
|
dataIndex: 'isHit',
|
key: 'isHit',
|
render: (text, record) => (
|
record.signStatus == 1 ?
|
<Popconfirm
|
title="确认通过审核吗?"
|
id={record.id}
|
onConfirm={e => this.confirm(record.id)}
|
onCancel={this.cancel}
|
okText="通过"
|
cancelText="不通过"
|
>
|
<a href="#">审核</a>
|
</Popconfirm> : <span disabled></span>
|
)
|
}];
|
console.log('savedate.activityStatus', savedate.activityStatus)
|
console.log('savedate.activityType', savedate.activityType)
|
return (
|
<div className="app-page">
|
<Spin spinning={loading}>
|
<HeadView history={this.props.history} />
|
<Breadcrumb style={{ padding: '20px' }}>
|
<Breadcrumb.Item><a href="index.html#/activeManage">法治活动</a></Breadcrumb.Item>
|
<Breadcrumb.Item>活动发布</Breadcrumb.Item>
|
</Breadcrumb>
|
<BusDetailView type='活动发布' >
|
<div style={divStyle}>
|
<Row type="flex" align='middle' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>活动类型</span></Col>
|
<Col span={6} push={0} >
|
<Select disabled={disabled} value={savedate.activityType || 'act_1'} style={{ width: "300px" }} onChange={(value) => this.saveInputChange({ target: { name: 'activityType', value } })}>
|
<Option value='act_1'>南检活动</Option>
|
<Option value='act_2'>法治培训</Option>
|
<Option value='act_3'>普法预约</Option>
|
</Select>
|
</Col>
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>主持人</span></Col>
|
<Col span={6} push={0} ><Input disabled={disabled} placeholder="请输入主持人姓名" style={{ width: '300px' }} name='host' onChange={this.saveInputChange} value={savedate.host || ""} /></Col>
|
</Row>
|
</div>
|
|
<div style={divStyle}>
|
<Row type="flex" align='middle' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>活动标题</span></Col>
|
<Col span={6} push={0} ><Input disabled={disabled} placeholder="请输入活动标题" style={{ width: '300px' }} name='activityTitle' onChange={this.saveInputChange} value={savedate.activityTitle || ""} /></Col>
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>主办方电话</span></Col>
|
<Col span={6} push={0} ><Input disabled={disabled} placeholder="请输入活动主办方联系电话" style={{ width: '300px' }} name='activityPhone' onChange={this.saveInputChange} value={savedate.activityPhone || ""} /></Col>
|
</Row>
|
</div>
|
|
<div style={divStyle}>
|
<Row type="flex" align='middle' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>开始时间</span></Col>
|
<Col span={6} push={0} >
|
<DatePicker disabled={disabled} style={{ width: '165px' }} onChange={(_, value) => this.saveInputChange({ target: { name: 'startDate', value } })} value={moment(savedate.startDate || new Date(), yearFormat)} format={yearFormat} />
|
<TimePicker disabled={disabled} minuteStep={30} onChange={(value) => this.saveInputChange({ target: { name: 'startHour', value } })} value={moment(savedate.startHour || new Date(), format)} format={format} /></Col>
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>结束时间</span></Col>
|
<Col span={6} push={0} >
|
<DatePicker disabled={disabled} style={{ width: '165px' }} onChange={(_, value) => this.saveInputChange({ target: { name: 'endDate', value } })} value={moment(savedate.endDate || new Date(), yearFormat)} format={yearFormat} />
|
<TimePicker disabled={disabled} minuteStep={30} onChange={(value) => this.saveInputChange({ target: { name: 'endHour', value } })} value={moment(savedate.endHour || new Date(), format)} format={format} /></Col>
|
|
</Row>
|
</div>
|
|
<div style={divStyle}>
|
<Row type="flex" align='middle' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>活动地点</span></Col>
|
<Col span={6} push={0} ><Input disabled={disabled} placeholder="请输入详细地址" style={{ width: '300px' }} name='activityAddress' onChange={this.saveInputChange} value={savedate.activityAddress || ""} /></Col>
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>活动人数</span></Col>
|
<Col span={6} push={0} >
|
<Input disabled={disabled} style={{ width: '300px' }} name='activityPersonQuota' onChange={this.saveInputChange} value={savedate.activityPersonQuota || ""} />
|
</Col>
|
</Row>
|
</div>
|
|
<div style={divStyle}>
|
<Row type="flex" align='middle' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>活动描述</span></Col>
|
<Col span={18} push={0} ><TextArea disabled={disabled} rows={4} placeholder="请输入活动描述" style={{ width: '92%' }} value={savedate.activityDesc || ""} onChange={this.saveInputChange} name='activityDesc' /></Col>
|
</Row>
|
</div>
|
<div style={divStyle}>
|
<Row type="flex" align='middle' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>报名要求</span></Col>
|
<Col span={18} push={0} ><TextArea disabled={disabled} placeholder="请输入报名要求" style={{ width: '92%' }} name='requirement' onChange={this.saveInputChange} value={savedate.requirement || ""} /></Col>
|
</Row>
|
</div>
|
|
<div style={divStyle}>
|
<Row type="flex" align='top' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>添加图片</span></Col>
|
<Col span={18} push={0} >
|
<Upload disabled={disabled} 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>
|
</div>
|
|
{
|
code && <div style={divStyle}>
|
<Row type="flex" align='middle' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>活动二维码</span></Col>
|
<Col span={18} push={0} ><img style={{ width: '150px', height: '150px' }} src={`data:image/png;base64,${code}`} /></Col>
|
</Row>
|
</div>
|
|
}
|
|
<div style={divStyle}>
|
<Row type="flex" align='top' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>活动进程</span></Col>
|
<Col span={18} push={0} style={{ border: 'solid 1px rgba(0, 0, 0, 0.25)', borderRadius: '5PX' }} >
|
<BraftEditor
|
value={editorState}
|
disabled={disabled}
|
placeholder='请输入活动进程'
|
media={{
|
allowPasteImage: true, // 是否允许直接粘贴剪贴板图片(例如QQ截图等)到编辑器
|
image: true, // 开启图片插入功能
|
video: false, // 开启视频插入功能
|
audio: false, // 开启音频插入功能
|
uploadFn: this.uploadFn
|
}}
|
excludeControls={['emoji']}
|
onChange={this.handleEditorChange}
|
onSave={this.submitContent}
|
onBlur={this.submitContent}
|
/>
|
</Col>
|
</Row>
|
</div>
|
{
|
savedate.activityStatus == null || savedate.activityStatus == 0 ?
|
<div style={divStyle}>
|
<Row type="flex" align='top' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>调查问卷</span></Col>
|
<Col span={18} push={0} >
|
{
|
this.state.selectedQuestionnaireData.title ?
|
<div>
|
<span style={{ margin: '0 20px' }}>{this.state.selectedQuestionnaireData.title}</span>
|
<Button type="link" onClick={this.questionnaireCancle}>查看</Button>
|
<Button type="link" onClick={this.questionnaireDel}>删除</Button>
|
</div> :
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.selectonClick}>请选择</Button>
|
}
|
</Col>
|
</Row>
|
</div> :
|
<div style={divStyle}>
|
<Row type="flex" align='top' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>调查问卷</span></Col>
|
<Col span={18} push={0} >
|
{
|
this.state.selectedQuestionnaireData.title ?
|
<div>
|
<span style={{ margin: '0 20px' }}>{this.state.selectedQuestionnaireData.title}</span>
|
<Button type="link" disabled onClick={this.questionnaireCancle}>查看</Button>
|
<Button type="link" disabled onClick={this.questionnaireDel}>删除</Button>
|
</div> :
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.selectonClick}>请选择</Button>
|
}
|
</Col>
|
</Row>
|
</div>
|
}
|
|
{
|
savedate.activityType == 'act_1' ? (dateSource.length > 0 ?
|
<div style={divStyle}>
|
<Divider orientation="left" style={{ margin: '20px', width: '97%' }}>报名人员信息</Divider>
|
<TableView columns={columns} data={dateSource} pageSize='6' size='small' />
|
</div> : null) : null
|
}
|
{
|
savedate.activityType == 'act_2' || savedate.activityType == 'act_3' ? (dateSource.length > 0 ?
|
<div style={divStyle}>
|
<Divider orientation="left" style={{ margin: '20px', width: '97%' }}>报名名单</Divider>
|
<TableView columns={act2columns} data={dateSource} pageSize='6' size='small' />
|
</div> : null) : null
|
}
|
{
|
savedate.activityType == 'act_2' || savedate.activityType == 'act_3' ? (dateSource.length > 0 ?
|
<div style={divStyle}>
|
<Divider orientation="left" style={{ margin: '20px', width: '97%' }}>培训结果</Divider>
|
<div style={divStyle}>
|
<Row type="flex" align='top' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>结果材料</span></Col>
|
<Col span={18} push={0} >
|
<Upload disabled={disabled} listType="picture-card" onPreview={this.handlePreview} {...bottmProps}>
|
|
</Upload>
|
<Modal visible={previewVisible} footer={null} onCancel={this.handleCancel}>
|
<img alt="example" style={{ width: '100%' }} src={previewImage} />
|
</Modal>
|
</Col>
|
</Row>
|
<Row type="flex" align='top' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>培训结果</span></Col>
|
<Col span={18} push={0} >
|
<span>{savedate.result}</span>
|
</Col>
|
</Row>
|
</div>
|
|
</div> : null) : null
|
}
|
|
{
|
savedate.activityType == 'act_1' && (
|
savedate.activityStatus == null || savedate.activityStatus == 0 ?
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<Button style={{ marginRight: '15px', width: '150px' }} type="primary" onClick={this.submit}>提交</Button>
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.cancle}>返回</Button>
|
</div>
|
: (
|
savedate.activityStatus == 3 ?
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<Button style={{ marginRight: '15px', width: '150px' }} type="primary" onClick={this.showModal}>活动摇号</Button>
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.cancle}>返回</Button>
|
</div>
|
:
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.cancle}>返回</Button>
|
</div>
|
)
|
)
|
}
|
{
|
savedate.activityType == 'act_2' || savedate.activityType == 'act_3' ? (
|
savedate.activityStatus == null || savedate.activityStatus == 0 ?
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<Button style={{ marginRight: '15px', width: '150px' }} type="primary" onClick={this.submit}>提交</Button>
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.cancle}>返回</Button>
|
</div>
|
: (
|
savedate.activityStatus == 3 ?
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
{/* <Button style={{ marginRight: '15px', width: '150px' }} type="primary" onClick={this.showModal}>活动摇号</Button> */}
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.cancle}>返回</Button>
|
</div>
|
:
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.cancle}>返回</Button>
|
</div>
|
)
|
) : '123'
|
}
|
|
</BusDetailView>
|
|
<Modal
|
title="活动摇号"
|
visible={this.state.visible}
|
onCancel={this.handleCancelModel}
|
footer={null}
|
width='1000px'
|
>
|
<div style={divStyle}>
|
<Row type="flex" align='middle' justify="space-around">
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>活动报名人数</span></Col>
|
<Col span={6} push={0} ><Input placeholder="请输入活动标题" style={{ width: '200px' }} name='activityTitle' value={savedate.activityPersonQuota} disabled /></Col>
|
<Col span={6} pull={0} style={{ textAlign: 'center' }}><span>摇号名额</span></Col>
|
<Col span={6} push={0} ><Input placeholder="请输入摇号名额" style={{ width: '200px' }} onChange={this.getNum} /></Col>
|
</Row>
|
</div>
|
|
<div style={{ display: 'flex', marginBottom: '20px', justifyContent: 'space-around' }}>
|
{
|
hitList.map((data) => (
|
<ImageBoxView url={data.headimgurl} userName={data.userName} />
|
))
|
}
|
</div>
|
|
|
{
|
hitList.length > 0 ?
|
< div style={{ display: 'flex', justifyContent: 'center' }}>
|
<Button style={{ marginRight: '15px', width: '150px' }} type="primary" onClick={this.publishResult}>发布结果</Button>
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.getPerson}>重新摇号</Button>
|
</div>
|
:
|
< div style={{ display: 'flex', justifyContent: 'center' }}>
|
<Button style={{ marginRight: '15px', width: '150px' }} type="primary" onClick={this.getPerson}>活动摇号</Button>
|
<Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.handleCancelModel}>返回</Button>
|
</div>
|
}
|
|
</Modal>
|
<Modal
|
title="选择调查问卷"
|
visible={this.state.questionnaireModal}
|
onCancel={this.selectCancelModel}
|
onOk={this.handleOk}
|
width='1000px'
|
>
|
<Search
|
placeholder="请输入问卷调查标题"
|
enterButton="查询"
|
size="large"
|
style={{ margin: '12px' }}
|
onSearch={value => this.questionnaireSearch(value)}
|
/>
|
|
<Table
|
size="middle"
|
dataSource={this.state.tableData}
|
rowSelection={{
|
selectedRowKeys,
|
type: 'radio',
|
onChange: this.onSelectChange,
|
}}
|
loading={{ spinning: this.state.modalLoading }}
|
columns={questionnaireColumns}
|
pagination={{
|
pageSize: this.state.pageSize,
|
onChange: this.pageChange,
|
total: this.state.totalElements,
|
showSizeChanger: true,
|
onShowSizeChange: this.onShowSizeChange,
|
showTotal: (total, range) => `共${total}条记录 `,
|
// itemRender: this.itemRender,
|
showQuickJumper: true,
|
defaultCurrent: 1,
|
current: this.state.page
|
}}
|
/>
|
{/* <TableView columns={columns} data={this.state.tableData} pageSize='10' size='default' loading={modalLoading} /> */}
|
</Modal>
|
</Spin>
|
</div>
|
);
|
}
|
|
}
|