/**
|
* 徐祥健<xuxj@hugeinfo.com.cn>
|
* 2018年8月28日 10:41
|
*
|
*/
|
|
|
import React from 'react';
|
|
import HeadView from '../view/HeadView';
|
import TableBtnView from '../view/TableBtnView';
|
import LinkView from '../view/LinkView';
|
import { Input, Button, DatePicker, Divider, Row, Col, message, Modal, Popconfirm, Badge, Tabs, Form, Table } from 'antd';
|
import moment from 'moment';
|
import Fetch from '../fetch';
|
import TableView from '../view/TableView';
|
|
const { TabPane } = Tabs;
|
class QuestionnaireTable extends React.Component {
|
constructor(props) {
|
super(props);
|
this.state = {
|
loading: false,
|
formdata: {},
|
userId: "",
|
tableData: [],
|
totalElements: 1,
|
pageSize: 10,
|
page: 1,
|
currItem: {},
|
auditVisible: false //审核弹窗
|
};
|
}
|
|
componentDidMount() {
|
document.title = '问卷管理';
|
this.loadData(1, this.state.pageSize);
|
}
|
|
loadData = (page, pageSize) => {
|
let _this = this;
|
_this.setState({
|
loading: true
|
})
|
_this.props.form.validateFields((err, values) => {
|
_this.setState({ formdata: values });
|
Fetch.questionQuery({
|
...values,
|
page: page,
|
size: pageSize,
|
})
|
.then(res => {
|
console.log('res', res);
|
this.setState({
|
loading: 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,
|
loading: false,
|
totalElements: res.data.totalElements,
|
page
|
});
|
|
}
|
});
|
})
|
}
|
|
onShowSizeChange = (current, pageSize) => {
|
this.setState({ pageSize, page: 1 })
|
this.loadData(1, pageSize);
|
}
|
pageChange = (page, pageSize) => {
|
this.loadData(page, pageSize);
|
}
|
|
audit = (data) => {
|
Fetch.questionAudit({
|
id: this.state.currItem.id,
|
...data,
|
}).then(res => {
|
console.log('res', res);
|
if (res) {
|
message.success('操作完成');
|
} else {
|
message.warn('操作失败,请稍后重试！')
|
}
|
this.setState({
|
auditVisible: false,
|
}, ()=> {
|
this.loadData(this.state.page, this.state.pageSize)
|
})
|
})
|
}
|
|
callback(key) {
|
console.log(key);
|
}
|
|
render() {
|
const columns = [{
|
title: '编号',
|
dataIndex: 'index',
|
key: 'index',
|
}, {
|
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") : '暂无'
|
}
|
}, {
|
title: '创建人',
|
dataIndex: 'createrName',
|
key: 'createrName',
|
render: (cur, item) => {
|
return cur || '暂无'
|
}
|
}, {
|
title: '创建时间',
|
dataIndex: 'createTime',
|
key: 'createTime',
|
render: text => <span>{moment(text).format("YYYY-MM-DD HH:mm")}</span>
|
}, {
|
title: '状态',
|
dataIndex: 'status',
|
key: 'status',
|
render: cur => (
|
renderStatus(cur)
|
)
|
}, {
|
title: '操作',
|
key: 'action',
|
render: (cur, item) => {
|
return <React.Fragment>
|
<a onClick={() => {
|
console.log(item.id);
|
this.props.history.push(`/questionnaire/detail/${item.id}`)
|
}}>查看</a>
|
{
|
item.status == 0 &&
|
<React.Fragment>
|
<Divider type="vertical" />
|
<a onClick={() => {
|
console.log(item.id);
|
this.props.history.push(`/questionnaire/newly/${item.id}`)
|
}}>编辑</a>
|
<br />
|
</React.Fragment>
|
}
|
{
|
item.status == 1 &&
|
<React.Fragment>
|
<Divider type="vertical" />
|
<a onClick={() => {
|
this.setState({
|
auditVisible: true,
|
currItem: cur
|
})
|
}}>审核</a>
|
<br/>
|
<a onClick={() => {
|
console.log(item.id);
|
this.props.history.push(`/questionnaire/newly/${item.id}`)
|
}}>编辑</a>
|
</React.Fragment>
|
}
|
{
|
item.status == 2 &&
|
<React.Fragment>
|
<Divider type="vertical" />
|
<a onClick={() => {
|
this.audit({
|
status: 3,
|
id: item.id
|
})
|
}}>发布</a>
|
|
</React.Fragment>
|
}
|
{
|
item.status == 3 &&
|
<React.Fragment>
|
<Divider type="vertical" />
|
<a onClick={() => {
|
this.audit({
|
status: 4,
|
id: item.id
|
})
|
}}>回收</a>
|
</React.Fragment>
|
}
|
</React.Fragment>
|
|
},
|
}];
|
const { data, loading, auditVisible } = this.state;
|
const { title, local, type, total, notRead, contact, sed } = this.props;
|
return (
|
<div className="app-page">
|
{/* <div style={{ background: '#fff', margin: '0 20px' }} >
|
<Tabs type="card" style={{ margin: 0 }} onChange={this.callback}>
|
<TabPane tab="全部" key="1">
|
</TabPane>
|
<TabPane tab="派送中" key="2">
|
</TabPane>
|
<TabPane tab="已回收" key="3">
|
</TabPane>
|
</Tabs>
|
</div> */}
|
{/* <TableView columns={columns} data={data} pageSize='10' size='default' loading={loading} /> */}
|
<div style={{
|
padding: '8px',
|
margin: '0px 20px',
|
backgroundColor: '#fff'
|
}}>
|
<Table
|
size="middle"
|
dataSource={this.state.tableData}
|
loading={{ spinning: this.state.loading }}
|
columns={columns}
|
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
|
}}
|
/>
|
</div>
|
|
<Modal
|
title="调查问卷审核"
|
visible={this.state.auditVisible}
|
footer={null}
|
onCancel={() => {
|
this.setState({
|
auditVisible: false
|
})
|
}}
|
>
|
<Row type="flex" justify="end" gutter={20}>
|
<Col>
|
<Button onClick={() => {
|
this.setState({
|
auditVisible: false
|
})
|
}}>取消</Button>
|
</Col>
|
<Col>
|
<Button onClick={() => {
|
this.audit({
|
status: 99
|
});
|
}}>不通过</Button>
|
</Col>
|
<Col>
|
<Button type="primary" onClick={() => {
|
this.audit({
|
status: 2
|
});
|
}}>通过</Button>
|
</Col>
|
</Row>
|
</Modal>
|
</div>
|
);
|
}
|
}
|
const QuestionnaireTableList = Form.create()(QuestionnaireTable);
|
export default QuestionnaireTableList;
|
|
function renderStatus(status) {
|
switch (status) {
|
case 0:
|
return <Badge count={'草稿'} style={{ background: '#2db7f5' }} />
|
case 1:
|
return <Badge count={'待审核'} style={{ background: '#f50' }} />
|
case 2:
|
return <Badge count={'待发布'} style={{ background: '#f50' }} />
|
case 3:
|
return <Badge count={'已发布'} style={{ background: '#87d068' }} />
|
case 4:
|
return <Badge count={'已回收'} style={{ background: '#fadb14' }} />
|
case 99:
|
return <Badge count={'不通过'} style={{ background: '#fadb14' }} />
|
default:
|
return '暂无'
|
}
|
}
|
