import React from 'react';
|
import { Input, Button, DatePicker, Divider, message, Popconfirm, Select, Badge, Spin, Breadcrumb, Table } from 'antd';
|
import Questionnair from './Questionnair'
|
import Fetch from '../fetch'
|
import TableView from '../view/TableView';
|
import HeadView from '../view/HeadView';
|
import moment from 'moment';
|
|
export default class QuestionPersonDetail extends React.Component {
|
constructor(props) {
|
super(props);
|
this.state = {
|
loading: false,
|
data: [],
|
initData: null,
|
btnLoading: false,
|
dateSource: null
|
};
|
}
|
|
componentDidMount() {
|
|
document.title = '问卷详情';
|
const { id } = this.props.match.params;
|
const { userId } = this.props.match.params;
|
console.log(id)
|
console.log(userId)
|
this.setState({
|
loading: true
|
});
|
Fetch.getAnswer({ id, userId }).then(res => {
|
console.log('res', res);
|
console.log('res', res);
|
this.setState({
|
loading: false,
|
dataSoure: res
|
})
|
})
|
}
|
|
|
showModal = (id) => {
|
this.props.history.push("/activeManageEdit/" + id);
|
}
|
|
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 = () => {
|
|
}
|
|
switchByType = (type) => {
|
switch (type) {
|
case 'radio':
|
return '单选题';
|
case 'checkbox':
|
return '多选题'
|
}
|
}
|
|
columns = () => {
|
return [
|
{
|
title: '问题',
|
dataIndex: 'questionTitle',
|
key: 'questionTitle',
|
},
|
{
|
title: '问题类型',
|
dataIndex: 'type',
|
key: 'type',
|
render: (cur, item) => {
|
return this.switchByType(cur)
|
}
|
},
|
{
|
title: '问题选项',
|
dataIndex: 'options',
|
key: 'options',
|
render: (cur) => {
|
return cur.map((a, idx) => {
|
return <div>
|
{idx + 1}、{a};
|
</div>
|
})
|
}
|
},
|
{
|
title: '答题情况',
|
dataIndex: 'itemDesc',
|
key: 'itemDesc',
|
render: (cur, item) => {
|
return cur || '未提供答案'
|
}
|
},
|
{
|
title: '得分',
|
dataIndex: 'score',
|
key: 'score',
|
render: (cur) => {
|
return cur + '分'
|
}
|
},
|
];
|
}
|
|
render() {
|
|
const { loading, dataSoure } = this.state;
|
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} /> */}
|
{
|
dataSoure &&
|
<div style={{ background: '#fff', marginTop: 10 }}>
|
<div style={{ width: 600, margin: '0 auto', padding: '20px 0 0 0 ' }}>
|
<h3>
|
问卷标题：{dataSoure[0].title || '暂无'}
|
</h3>
|
<h4 style={{ marginBottom: 0 }}>
|
答题人：{dataSoure[0].userName || '暂无'}
|
</h4>
|
<h4 style={{ marginBottom: 0 }}>
|
答题时间：{dataSoure[0].createTime ? moment(dataSoure[0].createTime).format("YYYY-MM-DD HH:mm") : '暂无'}
|
</h4>
|
<h4 style={{ marginBottom: 0 }}>
|
答题总得分：{dataSoure.map(({ score }) => score).reduce(function (prev, cur, index, array) {
|
return prev + cur
|
})}分
|
</h4>
|
</div>
|
</div>
|
}
|
|
{/* {initData && initData.questionDtos.map((item, index) => (
|
<React.Fragment>
|
<Questionnair.Editor editor={item} acitveAnswer={true} data={initData} key={item.questionId} index={index} disabled={true}/>
|
<Questionnair.Answer answer={item} index={index} />
|
</React.Fragment>
|
))} */}
|
|
{
|
dataSoure &&
|
<div style={{ background: '#fff', padding: 40 }}>
|
<Table columns={this.columns()} dataSource={dataSoure} style={{ width: '80%', margin: '0 auto' }} pagination={false}></Table>
|
</div>
|
}
|
|
</React.Fragment>
|
}
|
|
</div>
|
);
|
}
|
|
}
|
|
function typeStatus(type) {
|
switch (type) {
|
case 1:
|
return "企业体检";
|
case 2:
|
return "培训活动";
|
case 3:
|
return "未检调查";
|
case 4:
|
return "刑执监督";
|
}
|
}
|
