/**
|
* 柯礼钦<kelq@hugeinfo.com.cn>
|
* 2018年9月4日 16:00
|
*
|
*/
|
|
import React from "react";
|
// import { Modal } from 'antd-mobile';
|
import {
|
Radio,
|
DatePicker,
|
TimePicker,
|
Input,
|
Button,
|
message,
|
Icon,
|
Form,
|
Row,
|
Col,
|
Tag
|
} from "antd";
|
import moment from "moment";
|
import LinkView from "../view/LinkView";
|
import BusDetailView from "../view/BusDetailView";
|
import LineView from "../view/LineView";
|
import HeadView from "../view/HeadView";
|
import SendModel from "../view/SendModel";
|
import TableView from "../view/TableView";
|
import FormSearch from "../view/FormSearch";
|
|
import Fetch from "../fetch";
|
|
const RadioGroup = Radio.Group;
|
const { TextArea } = Input;
|
const format = "HH:mm";
|
|
function nameOfBus(status) {
|
switch (status) {
|
case '1':
|
return "诉讼代理人";
|
case '2':
|
return "辩护人";
|
case '3':
|
return "近亲属";
|
}
|
}
|
|
export default class BusDetail extends React.Component {
|
constructor(props) {
|
super(props);
|
this.state = {
|
businessType: this.props.match.params.type,
|
applyPaper: {},
|
dateString: null,
|
inputValue: "",
|
startTime: null,
|
endTime: null,
|
value: "",
|
type: "",
|
local: "",
|
visible: false,
|
formdata: {},
|
selectedRowKeys: [],
|
selectedRows: [],
|
complaintAudit: {},
|
};
|
}
|
|
componentDidMount() {
|
const { busId, type, createId } = this.props.match.params;
|
this.dealType(type);
|
Fetch.getBusDetail1({ busId, type, createId }).then(data => {
|
this.setState(
|
{
|
applyPaper: data,
|
mark: data.bussInfo.flag
|
},
|
() => {
|
if (this.state.mark) {
|
Fetch.getSendPerson({}).then(data => {
|
this.setState({
|
data
|
});
|
});
|
}
|
}
|
);
|
});
|
}
|
|
onSelectChange = (selectedRowKeys, selectedRows) => {
|
console.log("selectedRowKeys changed: ", selectedRowKeys, selectedRows);
|
this.setState({ selectedRows, selectedRowKeys });
|
};
|
|
dealType = type => {
|
var _type;
|
if (type == 12) {
|
_type = "在线申诉";
|
} else if (type == 10) {
|
_type = "国家赔偿";
|
} else if (type == 14) {
|
_type = "信访预约";
|
} else if (type == 11) {
|
_type = "司法救助";
|
} else if (type == 13) {
|
_type = "案件进度";
|
} else if (type == 22) {
|
const { sontype } = this.props.match.params;
|
if (sontype == "onlineAdvice") {
|
_type = "在线建议";
|
}
|
if (sontype == "onlineComplaints") {
|
_type = "在线投诉";
|
}
|
if (sontype == "onlineLetter") {
|
_type = "在线信访";
|
}
|
if (sontype == "another") {
|
_type = "其他";
|
}
|
}
|
this.setState({
|
type: _type + "详情",
|
local: _type
|
});
|
};
|
|
goBack = () => {
|
this.props.history.goBack();
|
};
|
|
onDateChange = (date, dateString) => {
|
this.setState({ dateString: dateString });
|
};
|
|
onStartTimeChange = time => {
|
this.setState({ startTime: time.valueOf() });
|
};
|
|
onEndTimeChange = time => {
|
this.setState({ endTime: time.valueOf() });
|
};
|
|
onInputChange = e => {
|
this.setState({
|
inputValue: e.target.value
|
});
|
};
|
|
submitAudit = () => {
|
const { busId } = this.props.match.params;
|
const { inputValue, formdata, businessType } = this.state;
|
const value = formdata.radio;
|
if (!value) {
|
message.warning("请选择审批结论！");
|
return;
|
}
|
Fetch.busAudit({ inputValue, value, businessType, busId }).then(res => {
|
if (res.code === 0) {
|
message.success("审批成功！", 2, () => {
|
this.props.history.goBack();
|
});
|
} else {
|
message.error("审批失败！", 2);
|
}
|
});
|
};
|
|
// 转派人审批
|
submitcomplaintAudit = () => {
|
|
const { busId } = this.props.match.params;
|
const { inputValue, selectedRows } = this.state;
|
|
if (selectedRows.length > 0) {
|
Fetch.complaintAudit({
|
reContent: inputValue,
|
handlerName: selectedRows[0].qywxUsername,
|
handlerId: selectedRows[0].qywxUserid,
|
businessId: busId
|
}).then(res => {
|
if (res.code === 0) {
|
message.success("审批成功", 2, () => {
|
this.props.history.goBack();
|
});
|
} else {
|
message.error("审批失败，请联系管理员", 2);
|
}
|
});
|
} else {
|
Fetch.complaintAudit({
|
reContent: inputValue,
|
handlerName: '',
|
handlerId: '',
|
businessId: busId
|
}).then(res => {
|
if (res.code === 0) {
|
message.success("审批成功", 2, () => {
|
this.props.history.goBack();
|
});
|
} else {
|
message.error("审批失败，请联系管理员", 2);
|
}
|
});
|
}
|
|
|
};
|
|
addPerson = () => {
|
this.setState({
|
visible: true
|
});
|
};
|
openImg = attachmentId => {
|
const { busId } = this.props.match.params;
|
const hash = "/bus/attachment/" + busId + "/" + attachmentId;
|
const { origin, pathname } = location;
|
window.open(`${origin}${pathname}#${hash}`);
|
};
|
|
openAllImg = () => {
|
const { busId } = this.props.match.params;
|
const hash = "/bus/attachment/" + busId;
|
const { origin, pathname } = location;
|
window.open(`${origin}${pathname}#${hash}`);
|
};
|
|
// 弹窗确定事件
|
onOK = () => {
|
this.setState({
|
visible: false
|
});
|
};
|
|
// 弹窗取消事件
|
onCancel = () => {
|
this.setState({
|
visible: false
|
});
|
};
|
|
onSubmit = () => {
|
Fetch.getSendPerson({ ...this.state.formdata }).then(data => {
|
this.setState({
|
data
|
});
|
});
|
};
|
|
onClose = e => {
|
e.preventDefault();
|
this.setState({
|
selectedRows: [],
|
selectedRowKeys: []
|
});
|
};
|
|
onChange = (name, value) => {
|
if (name === "reset") {
|
this.setState({ formdata: {} });
|
} else {
|
const formdata = {
|
...this.state.formdata,
|
[name]: value
|
};
|
this.setState({ formdata });
|
}
|
};
|
|
render() {
|
const {
|
local,
|
type,
|
applyPaper,
|
visible,
|
data,
|
selectedRows,
|
selectedRowKeys,
|
mark
|
} = this.state;
|
const { userInfo, agentInfo, attachmentList, auditList, bussInfo } =
|
applyPaper || {};
|
const busType = this.props.match.params.type;
|
const { flag } = this.props.match.params;
|
var sed;
|
if (flag == "bus" || flag == "detail") {
|
sed = "业务管理";
|
}
|
if (flag == "com" || flag == "comDetail") {
|
sed = "投诉建议管理";
|
}
|
const rowSelection = {
|
selectedRows,
|
selectedRowKeys,
|
onChange: this.onSelectChange,
|
hideDefaultSelections: true,
|
type: "radio"
|
};
|
const columns = [
|
{
|
title: "序号",
|
dataIndex: "index",
|
key: "id",
|
render: (text, record, index) => <span>{index + 1}</span>
|
},
|
{
|
title: "姓名",
|
dataIndex: "qywxUsername",
|
key: "qywxUsername"
|
},
|
{
|
title: "职位",
|
dataIndex: "upasPostname",
|
key: "upasPostname"
|
},
|
{
|
title: "手机",
|
dataIndex: "mobile",
|
key: "mobile"
|
}
|
];
|
var titleSum = {};
|
var hight = '35vh'
|
if (busType == 12) {
|
//在线申诉
|
titleSum = {
|
title1: "申诉人信息",
|
title2: "代理人信息",
|
title3: "在线申诉内容"
|
};
|
}
|
if (busType == 10) {
|
//国家赔偿
|
titleSum = {
|
title1: "申请人信息",
|
title2: "代理人信息",
|
title3: "在线申诉内容"
|
};
|
}
|
if (busType == 14) {
|
//信访预约
|
titleSum = {
|
title1: "信访人信息",
|
title2: "代理人信息",
|
title3: "信访内容"
|
};
|
}
|
if (busType == 11) {
|
//司法救助
|
titleSum = {
|
title1: "个人信息",
|
title2: "案件信息",
|
title3: "司法救助理由"
|
};
|
}
|
if (busType == 13) {
|
//案件进度
|
titleSum = {
|
title1: "申请人信息",
|
title2: "案件信息",
|
title3: "申请内容"
|
};
|
hight = '20vh'
|
}
|
if (busType == 22) {
|
//投诉建议
|
titleSum = {
|
title1: "个人信息"
|
};
|
}
|
// 居中样式
|
const center = {
|
display: "flex",
|
alignItems: "center",
|
justifyContent: "center"
|
};
|
|
return (
|
<div className="app-page">
|
<HeadView history={this.props.history} />
|
<LinkView local={local} sed={sed} />
|
{/* 转派人弹窗 */}
|
{visible && (
|
<SendModel
|
type={"选择转派人"}
|
onOk={this.onOK}
|
onCancel={this.onCancel}
|
>
|
<FormSearch onChange={this.onChange} onSubmit={this.onSubmit} />
|
<TableView
|
columns={columns}
|
data={data}
|
pageSize="10"
|
size="default"
|
rowSelection={rowSelection}
|
/>
|
</SendModel>
|
)}
|
|
{userInfo && (
|
<BusDetailView type={type}>
|
{(busType == 14 ||
|
busType == 10 ||
|
busType == 12 ||
|
busType == 11 ||
|
busType == 13 ||
|
busType == 22) && (
|
<div>
|
<LineView
|
title={titleSum.title1}
|
style={hight}
|
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>
|
{busType == 10 && (
|
<td className="table-vaule1">年龄</td>
|
)}
|
{busType == 10 && (
|
<td className="table-vaule2">
|
{applyPaper.visitorAddress}
|
</td>
|
)}
|
</tr>
|
{busType != 13 && (<tr>
|
<td className="table-vaule1">身份证照片</td>
|
</tr>)}
|
</tbody>
|
</table>
|
{busType != 13 && (<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>
|
{(busType == 14 || busType == 10 || busType == 12) && (
|
<div>
|
<LineView
|
title={titleSum.title2}
|
style="13vh"
|
lineHeight="34px"
|
>
|
<table>
|
<tbody>
|
<tr>
|
<td className="table-vaule1">姓名/单位名称</td>
|
<td className="table-vaule2">
|
{agentInfo.agentName}
|
</td>
|
<td className="table-vaule3">工作单位</td>
|
<td className="table-vaule4">
|
{agentInfo.agentUnit}
|
</td>
|
</tr>
|
<tr>
|
<td className="table-vaule1">证件类型</td>
|
<td className="table-vaule2">
|
{agentInfo.agentCert}
|
</td>
|
<td className="table-vaule3">证件号码</td>
|
<td className="table-vaule4">
|
{agentInfo.agentCertNo}
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</LineView>
|
<LineView
|
title={titleSum.title3}
|
style="13vh"
|
lineHeight="20px"
|
>
|
<span>{bussInfo.content}</span>
|
</LineView>
|
</div>
|
)}
|
</div>
|
)}
|
|
{/* 案件进度 */}
|
{busType == 13 && (
|
<div>
|
<LineView title="案件信息" style="14vh" lineHeight="34px">
|
<table>
|
<tbody>
|
<tr>
|
<td className="table-vaule1">案件名称</td>
|
<td className="table-vaule2">{bussInfo.caseTitle}</td>
|
<td className="table-vaule3">身份关系</td>
|
<td className="table-vaule4">
|
{nameOfBus(bussInfo.caseRelation)}
|
</td>
|
</tr>
|
<tr>
|
|
<td className="table-vaule3">工作单位</td>
|
<td className="table-vaule4">
|
{bussInfo.unit}
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</LineView>
|
<LineView title="申请内容" style="10vh" lineHeight="20px">
|
<span>{bussInfo.content}</span>
|
</LineView>
|
</div>
|
)}
|
|
{/* 司法救助 */}
|
{busType == 11 && (
|
<div>
|
<LineView title="案件信息" style="14vh" lineHeight="34px">
|
<table>
|
<tbody>
|
<tr>
|
<td className="table-vaule1">案件编号</td>
|
<td className="table-vaule2">{bussInfo.caseNo}</td>
|
<td className="table-vaule3">案由名称</td>
|
<td className="table-vaule4">{bussInfo.caseTitle}</td>
|
</tr>
|
<tr>
|
<td className="table-vaule1">案件关系</td>
|
<td className="table-vaule2">
|
{bussInfo.caseRelation}
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</LineView>
|
<LineView title="救助申请理由" style="13vh" lineHeight="20px">
|
<span>{bussInfo.content}</span>
|
</LineView>
|
</div>
|
)}
|
|
{flag == "com" && (
|
<div>
|
<LineView title="投诉建议内容" style="13vh" lineHeight="20px">
|
<span>{bussInfo.content}</span>
|
</LineView>
|
</div>
|
)}
|
|
{/* 相关材料栏 */}
|
<LineView title="相关材料" style="14vh">
|
<div className="apply-img-div">
|
{attachmentList
|
? attachmentList.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>
|
|
{/* 审批记录 */}
|
{
|
auditList.length > 0 ?
|
(
|
<LineView title="审核记录" style="15vh">
|
<colgroup span="4" />
|
{auditList
|
? 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 === "bus" && bussInfo.status == 1 ? (
|
<LineView title="申诉审批" lineHeight="50px">
|
<table>
|
<tbody>
|
<tr>
|
<td>审批结论</td>
|
<td>
|
<RadioGroup
|
onChange={e => {
|
this.onChange("radio", e.target.value);
|
}}
|
value={this.state.formdata.radio}
|
>
|
<Radio value={2}>审批通过</Radio>
|
<Radio value={3}>驳回申诉</Radio>
|
<Radio value={4}>补充材料或相关证据</Radio>
|
</RadioGroup>
|
</td>
|
</tr>
|
<tr>
|
<td>审批意见</td>
|
<td>
|
<TextArea
|
placeholder="请输入审批意见及理由"
|
autosize={{ minRows: 2, maxRows: 6 }}
|
onChange={this.onInputChange}
|
/>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
<div>
|
<Button
|
type="primary"
|
className="app-btn"
|
onClick={this.submitAudit}
|
>
|
提交审核
|
</Button>
|
<Button
|
type="primary"
|
className="app-btn"
|
onClick={this.openAllImg}
|
>
|
查看所有附件
|
</Button>
|
<Button className="app-btn" onClick={this.goBack}>
|
返回
|
</Button>
|
</div>
|
</LineView>
|
) : null}
|
|
{/* 转派人操作 */}
|
{flag === "com" ? (
|
<LineView title="审批操作" lineHeight="50px">
|
<table>
|
<tbody>
|
<tr>
|
<td style={{ width: "10%" }}>选择转派人</td>
|
<td>
|
{mark == "未转派" ? (
|
<div>
|
<Button
|
type="dashed"
|
onClick={this.addPerson}
|
style={{ marginRight: "15px" }}
|
>
|
<Icon type="plus-circle-o" />
|
添加
|
</Button>
|
{selectedRows.map(item => {
|
return (
|
<Tag closable onClose={this.onClose}>
|
{item.qywxUsername}
|
</Tag>
|
);
|
})}
|
</div>
|
) : (
|
<span>{bussInfo.flag}</span>
|
)}
|
</td>
|
</tr>
|
{bussInfo.jurisdiction == "true" ?
|
<tr>
|
<td>审批结论</td>
|
<td>
|
<TextArea
|
autosize={{ minRows: 2, maxRows: 6 }}
|
onChange={this.onInputChange}
|
/>
|
</td>
|
</tr>
|
: <tr>
|
<td>审批结论</td>
|
<td>
|
<TextArea
|
autosize={{ minRows: 2, maxRows: 6 }}
|
onChange={this.onInputChange}
|
disabled={true}
|
/>
|
</td>
|
</tr>
|
}
|
|
</tbody>
|
</table>
|
<div>
|
{mark == "未转派" || bussInfo.jurisdiction == "true" ? (
|
<Button
|
type="primary"
|
className="app-btn"
|
onClick={this.submitcomplaintAudit}
|
>
|
提交审批
|
</Button>
|
) : null}
|
<Button
|
type="primary"
|
className="app-btn"
|
onClick={this.openAllImg}
|
>
|
查看所有附件
|
</Button>
|
<Button className="app-btn" onClick={this.goBack}>
|
返回
|
</Button>
|
</div>
|
</LineView>
|
) : null}
|
{(flag === "detail" || flag == "comDetail" || bussInfo.status > 1) && (
|
<Row>
|
<Col span={5} offset={10}>
|
<Button
|
className="app-btn"
|
onClick={this.goBack}
|
>
|
返回
|
</Button>
|
</Col>
|
</Row>
|
)}
|
</BusDetailView>
|
)}
|
</div>
|
);
|
}
|
}
|
