test

liuwh

2020-06-09 5a887acf1924950715086633d329db045223b5c4

 SunshineIns/src/page/ActiveManageEdit.jsx

@@ -5,21 +5,39 @@
 */
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);
@@ -28,11 +46,23 @@
            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: {}
        };
    }

@@ -43,6 +73,7 @@

    getDetail = () => {
        const { id } = this.props.match.params;
        this.setState({ loading: true })
        Fetch.getActiveDetail(id)
            .then(res => {
                let { startTime, endTime } = res.activity;
@@ -58,12 +89,30 @@
                        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 } }) => {
@@ -75,21 +124,109 @@
        }))
    }

    selectonClick = (value) => {
        this.setState({
            questionnaireModal: true,
            modalLoading: true
        })
        Fetch.questionQuery({
            status: 3,
            title : value,
            page: this.state.page,
            size: this.state.pageSize,
        })
            .then(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
                    });

                }
            });
    }

    selClick = () =>{
        this.selectonClick("");
    }

    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) => {
        this.setState({
            questionnaireModal: false,
            selectedRowKeys: []
        })
    }

    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);
        if(!savedate.activityPersonQuota){
            message.warning("活动人数不能为空");
            return; 
        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("提交成功！");
@@ -123,7 +260,6 @@
    }

    getNum = (e) => {
        console.log(e.target.value)
        this.setState({
            num: e.target.value
        })
@@ -163,9 +299,120 @@
            });
    }

    confirm = (e) => {
        const data = { id: e, status: 2 };
        this.setState({ loading: true })
        Fetch.auditPerson(data).then(res => {
            if (res.code == 0) {
                this.setState({ loading: false })
                message.success('审核通过');
                this.getDetail();
            } else {
                this.setState({ loading: false })
                message.error('请求失败，请联系管理员', 2)
            }
        }
        )
    }

    cancel = (e) => {
        const data = { id: e, status: 4 };
        this.setState({ loading: true })
        Fetch.auditPerson(data).then(res => {
            if (res.code == 0) {
                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) => {
        console.log('editorState', editorState)
        this.setState({ editorState })
        const htmlContent = editorState.toHTML()
        console.log(htmlContent)
        this.setState(({ savedate }) => ({
            savedate: {
                ...savedate,
                course: htmlContent
            }
        }))
    }

    submitContent = () => {
        // 在编辑器获得焦点时按下ctrl+s会执行此方法
        // 编辑器内容提交到服务端之前，可直接调用editorState.toHTML()来获取HTML格式的内容
        const htmlContent = this.state.editorState.toHTML()
        console.log(htmlContent)
        this.setState(({ savedate }) => ({
            savedate: {
                ...savedate,
                course: htmlContent
            }
        }))
    }

    onSelectChange = (selectedRowKeys, selectedRows) => {
        const { tableData } = this.state;
        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;
        const props = {
            action: domain + 'api/v1/attachment/materials?entityId=' + savedate.id,
            onChange: ({ file, fileList }) => {
@@ -180,6 +427,27 @@
                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,
@@ -208,138 +476,390 @@
            )
            )
        }];
        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} />
                                &nbsp;&nbsp;<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} />
                                &nbsp;&nbsp;<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} />
                                    &nbsp;&nbsp;<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} />
                                    &nbsp;&nbsp;<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.selClick}>请选择</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" onClick={this.questionnaireCancle}>查看</Button>
                                                        <Button type="link" disabled onClick={this.questionnaireDel}>删除</Button>
                                                    </div> :
                                                    <Button style={{ marginLeft: '15px', width: '150px' }} onClick={this.selClick}>请选择</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>
                                    )
                            ) : ''
                        }

                    </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.selectonClick(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>
        );
    }