/**
|
* 柯礼钦<kelq@hugeinfo.com.cn>
|
* 2018年9月4日 16:00
|
*
|
*/
|
|
import React from "react";
|
import { Input, Button, message, Breadcrumb } from "antd";
|
import moment from "moment";
|
import BusDetailView from "../view/BusDetailView";
|
import LineView from "../view/LineView";
|
import HeadView from "../view/HeadView";
|
import video from "../asset/image/video.png";
|
import Fetch from "../fetch";
|
const { TextArea } = Input;
|
|
export default class BusDetail extends React.Component {
|
constructor(props) {
|
super(props);
|
this.state = {
|
savedate: {},
|
msgData: {},
|
data: {}
|
};
|
}
|
|
componentDidMount() {
|
const { busId, type, createId } = this.props.match.params;
|
Fetch.getBusDetail1({ busId, type, createId }).then(data => {
|
console.log(data)
|
this.setState({
|
msgData: data
|
});
|
});
|
// Fetch.getSnapshotDetail(id).then(data => {
|
|
// this.setState(
|
// {
|
// data: data,
|
// snapshot: data.pictures,
|
// savedate:
|
// {
|
// businessId: id,
|
// businessType: 25,
|
// approvalStatus: 2
|
// }
|
// }
|
// );
|
// })
|
}
|
|
goBack = () => {
|
this.props.history.goBack();
|
};
|
|
onInputChange = ({ target: { value, name } }) => {
|
this.setState(({ savedate }) => ({
|
savedate: {
|
...savedate,
|
[name]: value
|
}
|
}));
|
console.log(name, value)
|
};
|
|
openImg = attachmentId => {
|
const { busId } = this.props.match.params;
|
const hash = "/bus/attachment/" + busId + "/" + attachmentId;
|
const { origin, pathname } = location;
|
window.open(`${origin}${pathname}#${hash}`);
|
};
|
|
submitAudit = () => {
|
const { savedate } = this.state;
|
const { type, busId } = this.props.match.params;
|
|
console.log(savedate);
|
if (!savedate.opinion) {
|
message.warning("请填写回复内容！");
|
return;
|
}
|
|
// Fetch.snapshotReply(savedate).then(res => {
|
// if (res.code === 0) {
|
// message.success("回复成功", 2, () => {
|
// this.props.history.goBack();
|
// });
|
// } else {
|
// message.error("回复失败，请联系管理员", 2);
|
// }
|
// });
|
Fetch.busAudit({ inputValue: savedate.opinion, value: 2, businessType: 21, busId }).then(res => {
|
if (res.code === 0) {
|
message.success("回复成功", 2, () => {
|
this.props.history.goBack();
|
});
|
} else {
|
message.error("用户登录失败，请检查用户名或密码", 2);
|
}
|
});
|
};
|
|
titleOfType(type) {
|
if (type === "deputy") {
|
return "人大代表联络站";
|
} else if (type === "committee") {
|
return "政协委员联络站";
|
} else if (type === "peopleSupervise") {
|
return "人民监督员联络站";
|
} else if (type === "authProcurator") {
|
return "特约检察员联络站";
|
} else if (type === "online") {
|
return "在线咨询(个人)";
|
} else if (type === "onlineCompany") {
|
return "在线咨询（企业）";
|
}
|
return "Unkown";
|
}
|
|
render() {
|
// 居中样式
|
const center = {
|
display: "flex",
|
alignItems: "center",
|
justifyContent: "center"
|
};
|
const { msgData, data } = this.state;
|
const { flag, sontype } = this.props.match.params;
|
const title = this.titleOfType(sontype);
|
const { userInfo } = msgData || {};
|
console.log(msgData)
|
return (
|
<div className="app-page">
|
<HeadView history={this.props.history} />
|
<Breadcrumb style={{ padding: "20px" }}>
|
<Breadcrumb.Item>后台中心</Breadcrumb.Item>
|
<Breadcrumb.Item>消息管理</Breadcrumb.Item>
|
<Breadcrumb.Item style={{ color: "#1790FF" }}>
|
{title}
|
</Breadcrumb.Item>
|
</Breadcrumb>
|
<BusDetailView type={title + "详情"}>
|
<div>
|
{
|
userInfo &&
|
<LineView title={'个人信息'} style="35vh" lineHeight="34px">
|
<table>
|
<tbody>
|
<tr>
|
<td className="table-vaule1">姓名</td>
|
<td className="table-vaule2">{userInfo.name || '无'}</td>
|
<td className="table-vaule3">性别</td>
|
<td className="table-vaule4">{userInfo.sex || "无"}</td>
|
</tr>
|
<tr>
|
<td className="table-vaule1">出生日期</td>
|
<td className="table-vaule2">
|
{userInfo.birthday || "无"}
|
</td>
|
<td className="table-vaule3">民族</td>
|
<td className="table-vaule4">{userInfo.nation || "无"}</td>
|
</tr>
|
<tr>
|
<td className="table-vaule1">职业</td>
|
<td className="table-vaule2">
|
{userInfo.profession || "无"}
|
</td>
|
<td className="table-vaule3">工作单位</td>
|
<td className="table-vaule4">
|
{userInfo.workPlace || "无 "}
|
</td>
|
</tr>
|
<tr>
|
<td className="table-vaule1">住所</td>
|
<td className="table-vaule2">{userInfo.address || "无"}</td>
|
<td className="table-vaule3">联系方式</td>
|
<td className="table-vaule4">{userInfo.mobile || "无"}</td>
|
</tr>
|
<tr>
|
<td className="table-vaule1">身份证号码</td>
|
<td className="table-vaule2">{userInfo.idCard || "无"}</td>
|
</tr>
|
<tr>
|
<td className="table-vaule1">身份证照片</td>
|
</tr>
|
</tbody>
|
</table>
|
<div className="apply-img-div">
|
{userInfo.idCardPaths
|
? userInfo.idCardPaths.map((data, key) => (
|
<div style={{ marginRight: "10px" }} key={key}>
|
<img
|
src={data.path}
|
className="apply-img"
|
onClick={() => this.openImg(data.attId)}
|
/>
|
</div>
|
))
|
: null}
|
</div>
|
</LineView>
|
}
|
{
|
userInfo &&
|
<LineView title="联络详情" style="13vh" lineHeight="20px">
|
<table>
|
<tbody>
|
<tr>
|
<td className="table-vaule1">标题</td>
|
<td className="table-vaule2">{msgData.bussInfo.title || "无"}</td>
|
<td className="table-vaule3">发送人</td>
|
<td className="table-vaule4">{msgData.bussInfo.name || "无"}</td>
|
</tr>
|
</tbody>
|
</table>
|
</LineView>
|
|
}
|
{
|
userInfo &&
|
<LineView title="投诉建议内容" style="13vh" lineHeight="20px">
|
<span>{msgData.bussInfo.content}</span>
|
</LineView>
|
}
|
</div>
|
<LineView title="相关材料" style="14vh">
|
<div className="apply-img-div">
|
{msgData.attachmentList
|
? msgData.attachmentList.map(
|
(data, key) =>
|
data.type != 21 ? (
|
<div style={{ marginRight: "10px" }} key={key}>
|
<img src={data.path} width="70" height="70" onClick={() => this.openImg(data.attId)} />
|
</div>
|
) : (
|
<div style={{ marginRight: "10px" }} key={key}>
|
<a href={data.path} target="_black">
|
<video src={data.path} width="70" height="70" />
|
</a>
|
</div>
|
)
|
)
|
: null}
|
</div>
|
</LineView>
|
{
|
userInfo && msgData.auditList.length > 0 ?
|
(
|
<LineView title="回复记录" style="15vh">
|
<colgroup span="4" />
|
{msgData.auditList
|
? msgData.auditList.map((data, key) => (
|
<table>
|
<tbody>
|
<tr>
|
<td>回复内容：</td>
|
<td>{data.opinion}</td>
|
</tr>
|
<tr>
|
<td>回复人：</td>
|
<td>{data.authorName}</td>
|
<td>回复时间：</td>
|
<td>{moment(data.auditTime).format(
|
"YYYY-MM-DD HH:mm"
|
)}</td>
|
</tr>
|
</tbody>
|
</table>
|
))
|
: null}
|
</LineView>
|
) :
|
null}
|
|
{flag == "do" && userInfo ? (
|
msgData.bussInfo.status == 1 ? (
|
<LineView title="回复" lineHeight="50px">
|
<table>
|
<tbody>
|
<tr>
|
<td>回复内容</td>
|
<td>
|
<TextArea
|
placeholder="请输入回复内容"
|
autosize={{ minRows: 2, maxRows: 6 }}
|
onChange={({ target: { value } }) =>
|
this.onInputChange({
|
target: { name: "opinion", value }
|
})
|
}
|
/>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
<div>
|
<Button
|
type="primary"
|
className="app-btn"
|
onClick={this.submitAudit}
|
>
|
提交回复
|
</Button>
|
<Button className="app-btn" onClick={this.goBack}>
|
返回
|
</Button>
|
</div>
|
</LineView>
|
) : (
|
<div style={{ textAlign: "center" }}>
|
<Button className="app-btn" onClick={this.goBack}>
|
返回
|
</Button>
|
</div>
|
)
|
) : (
|
<div style={{ textAlign: "center" }}>
|
<Button className="app-btn" onClick={this.goBack}>
|
返回
|
</Button>
|
</div>
|
)}
|
</BusDetailView>
|
</div>
|
);
|
}
|
}
|
