| | |
| | | */ |
| | | import React from 'react'; |
| | | |
| | | import { Row, Col, Input, DatePicker, Button, Modal, Upload, Icon, message, Divider, TimePicker, Badge } from 'antd'; |
| | | const { TextArea } = Input; |
| | | 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); |
| | |
| | | savedate: {}, |
| | | formdata: {}, |
| | | fileList: [], |
| | | attList1: [], |
| | | previewVisible: false, |
| | | previewImage: '', |
| | | visible: false, |
| | | hitList: [], |
| | | num: 0 |
| | | num: 0, |
| | | activityType: 'act_1', |
| | | disabled: true, |
| | | status: '', |
| | | loading: false, |
| | | code: '', |
| | | editorState: BraftEditor.createEditorState(null), |
| | | questionnaireModal: false, |
| | | pageSize: 10, |
| | | page: 1, |
| | | selectedRowKeys: [], |
| | | selectedQuestionnaireData: {} |
| | | }; |
| | | } |
| | | |
| | |
| | | |
| | | getDetail = () => { |
| | | const { id } = this.props.match.params; |
| | | this.setState({ loading: true }) |
| | | Fetch.getActiveDetail(id) |
| | | .then(res => { |
| | | let { startTime, endTime } = res.activity; |
| | |
| | | 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) |
| | | 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 || [] |
| | | // 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 } }) => { |
| | |
| | | })) |
| | | } |
| | | |
| | | 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 } = this.state; |
| | | 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); |
| | | if(!savedate.activityPersonQuota){ |
| | | message.warning("活动人数不能为空"); |
| | | return; |
| | | console.log(selectedQuestionnaireData); |
| | | if (!savedate.host) { |
| | | message.warning("主持人不能为空"); |
| | | return; |
| | | } |
| | | if (savedate.activityPhone) { |
| | | if (!validator.phone(savedate.activityPhone)) { |
| | | return message.warning("联系电话格式不正确"); |
| | | if (!savedate.activityPhone) { |
| | | return message.warning("联系电话不能为空"); |
| | | } |
| | | } |
| | | Fetch.saveActive(savedate) |
| | | } |
| | | 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("提交成功!"); |
| | |
| | | }); |
| | | } |
| | | |
| | | 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, fileList, dateSource, hitList } = this.state; |
| | | 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 }) => { |
| | | 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 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> |
| | | ) |
| | | }]; |
| | | |
| | | return ( |
| | | <div className="app-page"> |
| | | <HeadView history={this.props.history} /> |
| | | <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} ><Input 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 placeholder="请输入活动主办方联系电话" style={{ width: '300px' }} name='activityPhone' onChange={this.saveInputChange} value={savedate.activityPhone || ""} /></Col> |
| | | </Row> |
| | | </div> |
| | | <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} > |
| | | <DatePicker style={{ width: '165px' }} onChange={(_, value) => this.saveInputChange({ target: { name: 'startDate', value } })} value={moment(savedate.startDate, yearFormat)} format={yearFormat} /> |
| | | <TimePicker minuteStep={30} onChange={(value) => this.saveInputChange({ target: { name: 'startHour', value } })} value={moment(savedate.startHour, format)} format={format} /></Col> |
| | | <Col span={6} pull={0} style={{ textAlign: 'center' }}><span>结束时间</span></Col> |
| | | <Col span={6} push={0} > |
| | | <DatePicker style={{ width: '165px' }} onChange={(_, value) => this.saveInputChange({ target: { name: 'endDate', value } })} value={moment(savedate.endDate, yearFormat)} format={yearFormat} /> |
| | | <TimePicker minuteStep={30} onChange={(value) => this.saveInputChange({ target: { name: 'endHour', value } })} value={moment(savedate.endHour, format)} format={format} /></Col> |
| | | <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> |
| | | |
| | | </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> |
| | | |
| | | <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: '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 style={{ width: '300px' }} name='activityPersonQuota' onChange={this.saveInputChange} value={savedate.activityPersonQuota || ""} /> |
| | | </Col> |
| | | </Row> |
| | | </div> |
| | | </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 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={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='top' 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> |
| | | </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> |
| | | |
| | | { |
| | | 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 |
| | | <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> |
| | | |
| | | } |
| | | { |
| | | 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> |
| | | ) |
| | | } |
| | | |
| | | </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} /> |
| | | )) |
| | | 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> |
| | | |
| | | <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> |
| | | } |
| | | |
| | | { |
| | | 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 |
| | | } |
| | | { |
| | | activityType == 'act_2' || 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 |
| | | } |
| | | { |
| | | activityType == 'act_2' || 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> |
| | | </div> |
| | | </div> : null) : null |
| | | } |
| | | |
| | | { |
| | | 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> |
| | | ) |
| | | ) |
| | | } |
| | | { |
| | | activityType == 'act_2' || 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> |
| | | ) |
| | | ) |
| | | } |
| | | |
| | | </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> |
| | | } |
| | | { |
| | | 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> |
| | | <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> |
| | | ); |
| | | } |