import React, { useEffect, useState } from 'react';
|
import { Form, Space } from 'antd';
|
import TableDraftSearch from '@/components/TableDraftSearch';
|
import TableView from '@/components/TableView';
|
import * as $$ from '@/utils/utility';
|
import SupervisingViews from '../../register/matterDetail/SupervisingViews';
|
import Response from '../../register/matterDetail/response';
|
import ResponseDetail from '../../register/matterDetail/responseDetail';
|
import { Modal } from '@arco-design/web-react';
|
|
//督办添加id
|
function getNewTimeIdApi(id) {
|
return $$.ax.request({ url: `caseUtils/getNewTimeId`, type: 'get', service: 'utils' });
|
}
|
|
//table
|
function getTable(data) {
|
return $$.ax.request({ url: `analysis/pageQuantity`, type: 'get', service: 'mediate', data });
|
}
|
|
function caseSuperviseInfoApi(data) {
|
return $$.ax.request({ url: `caseSupervise/getById`, type: 'get', service: 'mediate', data });
|
}
|
|
//督办次数
|
function pageCaseSuperviseApi(data) {
|
return $$.ax.request({ url: 'caseSupervise/pageCaseSupervise', type: 'get', service: 'mediate', data });
|
}
|
|
export default function TimeoutDialog(props) {
|
const [form] = Form.useForm();
|
const dialogNameMap = {
|
'fpcs': '分派',
|
'qscs': '签收',
|
'slcs': '受理',
|
'dbcs': '回复',
|
}
|
const dialogTypeMap = {
|
'fpcs': 1,
|
// 'qscs': 2,
|
'slcs': 2,
|
'dbcs': 3,
|
}
|
const columns = [
|
{
|
title: '流转时间',
|
dataIndex: 'turnaroundTime',
|
key: 'turnaroundTime',
|
width: 150,
|
sorter: true,
|
sortNumber: 1,//设置这个传给后端的
|
},
|
{
|
title: `${dialogNameMap[props.timeoutKey]}时限`,
|
dataIndex: 'timeLimit',
|
key: 'timeLimit',
|
width: 200,
|
render: (text, record, index) => {
|
return <>
|
<span className="timeTip-red">
|
<span className="timeTip-red-drop"></span>
|
{`超${text}小时`}
|
</span>
|
<span className="timeTip-red-tips">督</span>
|
</>
|
},
|
sorter: true,
|
sortNumber: 2
|
},
|
{
|
title: `${dialogNameMap[props.timeoutKey]}部门`,
|
dataIndex: 'candeUnitName',
|
key: 'candeUnitName',
|
width: 150,
|
},
|
{
|
title: '事项等级',
|
dataIndex: 'caseGrade',
|
key: 'caseGrade',
|
width: 100,
|
sorter: true,
|
sortNumber: 3
|
},
|
{
|
title: '事项来源',
|
dataIndex: 'caseSource',
|
key: 'caseSource',
|
width: 120,
|
},
|
{
|
title: '问题属地',
|
dataIndex: 'queAddress',
|
key: 'queAddress',
|
width: 180,
|
},
|
{
|
title: '纠纷类型',
|
dataIndex: 'caseType',
|
key: 'caseType',
|
width: 260,
|
},
|
{
|
title: '督办次数',
|
dataIndex: 'superviseCount',
|
key: 'superviseCount',
|
width: 100,
|
render: (text, record, index) => (
|
<div
|
onClick={() => { text !== 0 && handleSupervising(record.caseId) }}
|
style={{ cursor: 'pointer', color: text != 0 ? '#1A6FB8' : '#000' }}
|
>
|
{text}
|
</div>
|
),
|
// sorter: true,
|
// sortNumber: 4
|
},
|
{
|
title: '操作',
|
dataIndex: 'actions',
|
key: 'actions',
|
width: 120,
|
fixed: 'right',
|
render: (text, record) => (
|
<Space>
|
<div onClick={() => { window.open(`${$$.windowUrl}/windowDetail?caseTaskId=${record.caseTaskId}&caseId=${record.caseId}`) }} style={{ cursor: 'pointer', color: '#1A6FB8' }}>详情</div>
|
<div onClick={() => { handleSupervisingAdd(record.caseId) }} style={{ cursor: 'pointer', color: '#1A6FB8' }}>督办</div>
|
</Space>
|
),
|
},
|
]
|
//督办次数
|
const supervisingColumns = [
|
{
|
title: '督办时间',
|
dataIndex: 'supTime',
|
key: 'supTime',
|
width: 50,
|
},
|
{
|
title: '回复时限',
|
dataIndex: 'timeLimit',
|
key: 'timeLimit',
|
width: 80,
|
render: (text, record) => {
|
return (record.supStatus === 1 ? '-' : $$.getDiffTime(record.timeLimit))
|
}
|
},
|
{
|
title: '督办意见',
|
dataIndex: 'supContent',
|
key: 'supContent',
|
width: 100,
|
},
|
{
|
title: '事项等级',
|
dataIndex: 'caseGrade',
|
key: 'caseGrade',
|
width: 50,
|
},
|
{
|
title: '回复状态',
|
dataIndex: 'supStatus',
|
key: 'supStatus',
|
width: 50,
|
render: (text, record) => (
|
<div style={{ color: record.supStatus === 0 ? '#F53F3F' : '#00B42A' }}>{record.supStatus === 0 ? '未回复' : '已回复'}</div>
|
)
|
},
|
{
|
title: '操作',
|
dataIndex: 'defendants',
|
key: 'defendants',
|
width: 50,
|
fixed: 'right',
|
render: (text, record) => (
|
<Space>
|
<div onClick={() => handleResponse(record.id, 'responseDetail')} style={{ cursor: 'pointer', color: '#1A6FB8' }}>详情</div>
|
{record.supStatus == 0 &&
|
<div onClick={() => handleResponse(record.id, 'response')} style={{ cursor: 'pointer', color: '#1A6FB8' }}>回复</div>
|
}
|
</Space>
|
)
|
},
|
]
|
const [searchData, setSearchData] = useState({//查询有关数据
|
page: 1,
|
size: 10,
|
sortType: 2,
|
sortColmn: 1,
|
})
|
const [tableData, setTableData] = useState([])//表格数据
|
const [total, setTotal] = useState(0);//表格数据总数量
|
const [supervising, setSupervising] = useState(false);//督办弹窗控制
|
const [supervisingAddId, setSupervisingAddId] = useState('');
|
const [supervisingId, setSupervisingId] = useState('');
|
const [loading, setLoading] = useState(false);
|
const [selectedRowKeys, setSelectedRowKeys] = useState([]);//批量id
|
const [selectedRows, setSelectedRows] = useState([]);//批量数据
|
//以下状态拉过来的，还没看懂先不写注释
|
const [supervisingList, setSupervisingList] = useState(false);//督办次数弹窗
|
const [superviseInfo, setSuperviseInfo] = useState({});
|
const [response, setResponse] = useState(false);
|
const [responseId, setResponseId] = useState('');
|
const [detail, setDetail] = useState(false);
|
const [responseDetail, setResponseDetail] = useState({});
|
const [superviseListData, setSuperviseListData] = useState([]);
|
const [searchSupervise, setSearchSupervise] = useState({
|
page: '1',
|
size: 20,
|
caseId: '',
|
type: 0,
|
})
|
|
useEffect(() => {
|
getTableData()
|
}, [searchData])
|
|
//获取表格数据
|
const getTableData = async () => {
|
setLoading(true)
|
const res = await getTable({
|
...searchData,
|
queryType: dialogTypeMap[props.timeoutKey],
|
...props.search,
|
})
|
if (res.type) {
|
const { data } = res
|
setTableData(data?.content)
|
setTotal(data.totalElements)
|
setLoading(false)
|
}
|
}
|
|
const handleSearch = () => {
|
let values = form.getFieldsValue();
|
if (values.updateTime && values.updateTime.length != 0) {
|
$$.changeTimNeweFormat(values, 'updateTime', 'createStart', 'createEnd');
|
values.createStart = values.createStart ? $$.dateFormat(values.createStart) : '';
|
values.createEnd = values.createEnd ? $$.dateFormat(values.createEnd) : '';
|
}
|
setSearchData({
|
...searchData,
|
...values
|
})
|
}
|
|
const handleChangePage = (pagination, filters, sort) => {
|
let sortColmn = sort.column ? sort.column.sortNumber : 1
|
let sortType = sort.order == "descend" ? 2 : 1//1：正序；2：倒序
|
setSearchData({
|
...searchData,
|
sortType,
|
sortColmn,
|
page: pagination.current,
|
size: pagination.pageSize
|
})
|
}
|
|
//督办次数
|
const handleSupervising = (caseId) => {
|
pageCaseSupervise(caseId)
|
setSupervisingList(!supervisingList)
|
}
|
|
//督办回复
|
const handleResponse = (id, type) => {
|
if (type === 'response') {
|
setResponse(!response)
|
setResponseId(id)
|
caseSuperviseInfo(id, 'response')
|
}
|
if (type === 'responseDetail') {
|
setDetail(!detail)
|
caseSuperviseInfo(id, 'responseDetail')
|
}
|
}
|
|
//回复
|
const caseSuperviseInfo = async (id, type) => {
|
const res = await caseSuperviseInfoApi({ id: id })
|
if (type === 'response') {
|
if (res.type) {
|
setSuperviseInfo(res.data)
|
}
|
}
|
if (type === 'responseDetail') {
|
if (res.type) {
|
setResponseDetail(res.data)
|
}
|
}
|
}
|
|
//督办次数列表
|
const pageCaseSupervise = async (caseId) => {
|
const res = await pageCaseSuperviseApi({ ...searchSupervise, caseId: caseId });
|
if (res.type) {
|
let data = res.data.content
|
setSuperviseListData(data)
|
}
|
}
|
|
//添加督办
|
const handleSupervisingAdd = (caseId) => {
|
setSupervising(!supervising)
|
setSupervisingAddId(caseId)
|
getNewTimeId()
|
}
|
|
//获取添加督办id
|
const getNewTimeId = async () => {
|
const res = await getNewTimeIdApi()
|
if (res.type) {
|
setSupervisingId(res.data)
|
}
|
}
|
|
//批量选择
|
const onSelectChange = (newSelectedRowKeys, selectedRows) => {
|
setSelectedRowKeys(newSelectedRowKeys);
|
setSelectedRows(selectedRows)
|
}
|
|
//批量督办
|
const handleBatchDB = () => {
|
|
}
|
|
const rowSelection = {
|
selectedRowKeys: selectedRowKeys,
|
onChange: onSelectChange,
|
}
|
|
return (
|
<div>
|
<TableDraftSearch
|
labelLength={4}
|
exportButtonShow={false}
|
handleText={'重置'}
|
form={form}
|
itemData={[
|
{ type: 'RangePicker', name: 'updateTime', label: '流转时间', placeholder: ['流转开始日期', '流转结束日期'], shortcutsPlacementLeft: true, shortcuts: $$.shortcutsList(), span: 7 },
|
{ type: 'Select', name: 'plaintiffs', placeholder: '请选择', label: '事项等级', span: 6, selectdata: $$.options.caseLevelList },
|
{ type: 'Select', name: 'defendants', placeholder: '请选择', label: '事项来源', span: 6, selectdata: $$.options.caseCanal, },
|
]}
|
handleReset={() => {
|
form.resetFields();
|
handleSearch();
|
}}
|
handleSearch={() => handleSearch()}
|
btnSpan={5}
|
/>
|
<div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', marginBottom: '12px' }}></div>
|
<div style={{ marginTop: '0px' }} >
|
<TableView
|
rowKey='caseTaskId'
|
showHeader
|
title="查询结果"
|
columns={columns}
|
dataSource={tableData}
|
onChange={handleChangePage}
|
pagination={{
|
current: searchData.page,
|
pageSize: searchData.size,
|
total: total,
|
}}
|
isScroll={true}
|
tableHeight={550}
|
loading={loading}
|
rowSelection={rowSelection}
|
/>
|
{selectedRowKeys.length != 0 && <div className='efficiency'>
|
<span>已选{selectedRowKeys.length}项</span>
|
<span className='linkBtnColor' onClick={() => {
|
setSelectedRowKeys([])
|
setSelectedRows([])
|
}}>取消</span>
|
<span className='linkBtnColor' onClick={handleBatchDB}>批量督办</span>
|
</div>}
|
</div>
|
{/* 防滚动的别删 */}
|
<div style={{ height: '16px' }}></div>
|
<SupervisingViews
|
visible={supervising}
|
handleOnCancel={() => setSupervising(false)}
|
caseId={supervisingAddId}
|
supervisingId={supervisingId}
|
getTableData={() => { }}
|
/>
|
<Modal
|
title='督办信息'
|
style={{ width: '938px' }}
|
onCancel={() => setSupervisingList(false)}
|
visible={supervisingList}
|
footer={null}
|
>
|
<TableView
|
showHeader
|
columns={supervisingColumns}
|
dataSource={superviseListData || []}
|
rowKey='id'
|
tableHeight={500}
|
style={{ marginTop: '-40px' }}
|
/>
|
</Modal>
|
<Response visible={response} handleOnCancel={() => setResponse(false)} responseId={responseId} data={superviseInfo} />
|
<ResponseDetail visible={detail} handleOnCancel={() => setDetail(false)} data={responseDetail} />
|
</div>
|
)
|
}
|
