import React from 'react';
|
import { Input, Button, DatePicker, Divider, message, Popconfirm, Select, Badge, Spin, Breadcrumb } from 'antd';
|
import Questionnair from '../page/Questionnair'
|
import Fetch from '../fetch'
|
import TableView from '../view/TableView';
|
import HeadView from '../view/HeadView';
|
|
import moment from 'moment';
|
const divStyle = {
|
margin: '20px'
|
}
|
export default class QuestionDetail extends React.Component {
|
constructor(props) {
|
super(props);
|
this.state = {
|
loading: false,
|
data: [],
|
initData: null,
|
btnLoading: false,
|
dateSource: []
|
};
|
}
|
|
componentDidMount() {
|
|
document.title = '问卷详情';
|
const { id } = this.props.match.params;
|
|
this.setState({
|
loading: true
|
});
|
Fetch.questionFindById(id).then(res => {
|
console.log('res', res);
|
console.log('res.mps', res.submitMaps);
|
this.setState({
|
loading: false,
|
initData: res,
|
dateSource: res.submitMaps || [],
|
})
|
})
|
}
|
|
|
showModal = (userId) => {
|
const { id } = this.props.match.params;
|
console.log(id)
|
this.props.history.push("/questionnaire/persondetail/" + id + '/' + userId);
|
}
|
|
submitQuestionTemp = (questionDtos, extraData) => {
|
const { initData } = this.state;
|
console.log('questionDtos', questionDtos);
|
console.log('initData', initData);
|
if (!extraData.questionnairTitle) {
|
return message.error('请填写问卷标题');
|
}
|
questionDtos = questionDtos.map(({ type, title, required, remarkText, options, scores, warnFlag }) => ({
|
type, title, required, remarkText, options, scores, warnFlag
|
}));
|
this.setState({
|
btnLoading: true
|
})
|
Fetch.saveQuestionTemp({
|
...initData,
|
title: extraData.questionnairTitle,
|
content: extraData.questionnairDescription,
|
businessType: extraData.questionnairBusinessType,
|
questionDtos
|
}).then(res => {
|
console.log('res', res);
|
this.setState({
|
btnLoading: false
|
})
|
if (res.code == 0) {
|
message.success('问卷提交成功');
|
}
|
})
|
}
|
|
getData = () => {
|
|
}
|
|
render() {
|
|
const { data, loading, resetKey, initData, btnLoading, dateSource } = this.state;
|
console.log(dateSource)
|
const act2columns = [{
|
title: '提交人昵称',
|
dataIndex: 'userName',
|
key: 'userName'
|
},
|
{
|
title: '提交时间',
|
dataIndex: 'createTime',
|
key: 'createTime',
|
render: text => <span>{text || ''}</span>
|
}, {
|
title: '操作',
|
dataIndex: 'isHit',
|
key: 'isHit',
|
render: (text, record) => (
|
<label className='theme-color' onClick={() => this.showModal(record.userId)} style={{ cursor: 'pointer' }}>查看</label>
|
)
|
}];
|
return (
|
<div className="app-page">
|
<HeadView history={this.props.history} />
|
<div style={{
|
margin: 10
|
}}>
|
<Breadcrumb>
|
<Breadcrumb.Item>
|
<a onClick={() => {
|
this.props.history.goBack();
|
}}>问卷管理</a>
|
</Breadcrumb.Item>
|
|
<Breadcrumb.Item>
|
问卷详情
|
</Breadcrumb.Item>
|
</Breadcrumb>
|
</div>
|
{
|
loading ?
|
<div style={{ height: 200, width: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
|
<Spin spinning={loading} />
|
</div> :
|
<React.Fragment>
|
{/* <Questionnair submitQuestionTemp={this.submitQuestionTemp} btnLoading={btnLoading} /> */}
|
{
|
initData &&
|
<div style={{ background: '#fff', marginTop: 10 }}>
|
<div style={{ width: 700, margin: '0 auto', padding: '20px 0 0 0 ' }}>
|
<h3>
|
问卷标题：{initData.title || '暂无'}
|
</h3>
|
<h4 style={{ marginBottom: 0 }}>
|
问卷描述：{initData.content || '暂无'}
|
</h4>
|
<h4 style={{ marginBottom: 0 }}>
|
业务类型：{typeStatus(initData.businessType) || '暂无'}
|
</h4>
|
</div>
|
</div>
|
}
|
|
{initData && initData.questionDtos.map((item, index) => (
|
<Questionnair.Editor editor={item} acitveAnswer={true} key={item.questionId} index={index} />
|
))}
|
|
{
|
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
|
}
|
</React.Fragment>
|
}
|
|
</div>
|
);
|
}
|
|
}
|
|
function typeStatus(type) {
|
switch (type) {
|
case 1:
|
return "企业体检";
|
case 2:
|
return "培训活动";
|
case 3:
|
return "未检调查";
|
case 4:
|
return "刑执监督";
|
}
|
}
|
