forked from nsjcy/frontEnd/nsjcy

liuwh
2020-02-20 6383764128f9f38513df1a55449b230a7b29092a
SunshineIns/src/page/ActiveManageEdit.jsx
@@ -5,7 +5,7 @@
 */
import React from 'react';
import { Row, Col, Input, DatePicker, Button, Modal, Upload, Icon, message, Divider, TimePicker, Badge } from 'antd';
import { Row, Col, Input, DatePicker, Button, Modal, Upload, Icon, message, Divider, TimePicker, Badge, Select, Popconfirm, Spin } from 'antd';
const { TextArea } = Input;
import HeadView from '../view/HeadView';
import BusDetailView from '../view/BusDetailView';
@@ -15,11 +15,27 @@
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);
@@ -32,7 +48,11 @@
            previewImage: '',
            visible: false,
            hitList: [],
            num: 0
            num: 0,
            activityType: 'act_1',
            disabled: true,
            status: '',
            loading: false,
        };
    }
@@ -43,6 +63,7 @@
    getDetail = () => {
        const { id } = this.props.match.params;
        this.setState({ loading: true })
        Fetch.getActiveDetail(id)
            .then(res => {
                let { startTime, endTime } = res.activity;
@@ -58,10 +79,15 @@
                        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',
                    },
                    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 || [],
                    loading: false,
                });
            })
    }
@@ -163,9 +189,46 @@
            });
    }
    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)
            }
        }
        )
    }
    handleCancel = () => this.setState({ previewVisible: false })
    render() {
        const { savedate, previewVisible, previewImage, fileList, dateSource, hitList } = this.state;
        const { savedate, previewVisible, previewImage, fileList, dateSource, hitList, activityType, disabled, loading } = this.state;
        console.log('disabled', disabled)
        const props = {
            action: domain + 'api/v1/attachment/materials?entityId=' + savedate.id,
            onChange: ({ file, fileList }) => {
@@ -208,16 +271,77 @@
            )
            )
        }];
        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">
                <Spin spinning={loading}>
                <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} >
                                    <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={12} pull={0}></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='host' onChange={this.saveInputChange} value={savedate.host || ""} /></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='requirement' onChange={this.saveInputChange} value={savedate.requirement || ""} /></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 placeholder="请输入活动标题" style={{ width: '300px' }} name='activityTitle' onChange={this.saveInputChange} value={savedate.activityTitle || ""} /></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 placeholder="请输入活动主办方联系电话" style={{ width: '300px' }} name='activityPhone' onChange={this.saveInputChange} value={savedate.activityPhone || ""} /></Col>
                                <Col span={6} push={0} ><Input disabled={disabled} placeholder="请输入活动主办方联系电话" style={{ width: '300px' }} name='activityPhone' onChange={this.saveInputChange} value={savedate.activityPhone || ""} /></Col>
                        </Row>
                    </div>
@@ -225,12 +349,12 @@
                        <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>
                                    <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 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>
                                    <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>
                        </Row>
                    </div>
@@ -238,10 +362,10 @@
                    <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} 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 style={{ width: '300px' }} name='activityPersonQuota' onChange={this.saveInputChange} value={savedate.activityPersonQuota || ""} />
                                    <Input disabled={disabled} style={{ width: '300px' }} name='activityPersonQuota' onChange={this.saveInputChange} value={savedate.activityPersonQuota || ""} />
                            </Col>
                        </Row>
                    </div>
@@ -249,7 +373,7 @@
                    <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>
                                <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>
@@ -257,7 +381,7 @@
                        <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}>
                                    <Upload disabled={disabled} listType="picture-card" onPreview={this.handlePreview} {...props}>
                                    <div>
                                        <Icon type="plus" />
                                        <div className="ant-upload-text">上传图片</div>
@@ -271,15 +395,21 @@
                    </div>
                    {
                        dateSource.length > 0 ?
                            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
                                </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_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>
@@ -295,6 +425,27 @@
                                    <  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>
                                    )
                            )
                    }
@@ -339,7 +490,7 @@
                    }
                </Modal>
                </Spin>
            </div>
        );
    }