From 2ce6364f53a85623c9c2a99e9fcf58d4e8a2530c Mon Sep 17 00:00:00 2001 From: dminyi <1301963064@qq.com> Date: Sat, 31 Aug 2024 15:33:14 +0800 Subject: [PATCH] 事项详情接口 --- gz-customerSystem/src/views/register/visit/component/MattersInfo.jsx | 115 ++++++++++++++++++++++++++++++++++----------------------- 1 files changed, 69 insertions(+), 46 deletions(-) diff --git a/gz-customerSystem/src/views/register/visit/component/MattersInfo.jsx b/gz-customerSystem/src/views/register/visit/component/MattersInfo.jsx index 4e346eb..72eeb62 100644 --- a/gz-customerSystem/src/views/register/visit/component/MattersInfo.jsx +++ b/gz-customerSystem/src/views/register/visit/component/MattersInfo.jsx @@ -2,38 +2,62 @@ * @Author: dminyi 1301963064@qq.com * @Date: 2024-08-27 11:31:01 * @LastEditors: dminyi 1301963064@qq.com - * @LastEditTime: 2024-08-28 14:41:24 + * @LastEditTime: 2024-08-31 15:32:42 * @FilePath: \gzDyh\gz-customerSystem\src\views\register\visit\component\MattersInfo.jsx * @Description: 事项详情 */ -import React, { useState } from 'react'; +import React, { useState, useEffect } from 'react'; import PersonCard from '@/components/personCard' import { Row, Col, Space, Button, Switch } from 'antd'; import TableView from '@/components/TableView' import { question, register, Matter, transfer } from '../../../../assets/images' import * as $$ from '@/utils/utility'; -import { Tabs, Typography, Steps } from '@arco-design/web-react'; +import { Typography, Steps } from '@arco-design/web-react'; import "@arco-themes/react-gzzz/css/arco.css"; import { IconCalendar, IconClockCircle, IconUser } from '@arco-design/web-react/icon'; -import Handle from './handle' -const TabPane = Tabs.TabPane; +import Handle from './handle'; +import EventFlow from './secondWanderStep/EventFlow'; const style = { // textAlign: 'center', // marginTop: 20, }; -const MattersInfo = (props) => { - const [fakeData, setFakeData] = useState([]);//当事人信息数据 - const [agentVisible, setAgentVisible] = useState(false); - const [dialogType, setDialogType] = useState(0);//添加当事人的类型 - const [detailVisabled, setDetailVisabled] = useState(false);//查看信息弹窗控制 - const [addVisabled, setAddVisabled] = useState(false);//添加当事人弹窗控制 + +function getCaseInfoApi(id) { + return $$.ax.request({ url: 'caseInfo/getCaseInfo?id=' + id, type: 'get', service: 'mediate' }); +} + + +const MattersInfo = (props) => { + const [fakeData, setFakeData] = useState([{ + "trueName": "王大锤", + "mobile": "13380313412", + "certiType": "09_00015-1", + "certiTypeName": "身份证", + "certiNo": "440981199902025123", + "perType": "15_020008-1", + "perClass": "09_01001-1", + "perTypeName": "申请方当事人", + "perClassName": "自然人", + "id": "24083010053310002" + }, { + "trueName": "刘俊峰", + "mobile": "13380313412", + "certiType": "09_00015-1", + "certiTypeName": "身份证", + "certiNo": "440981199902023234", + "perType": "15_020008-2", + "perClass": "09_01001-1", + "perTypeName": "被申请方当事人", + "perClassName": "自然人", + "id": "24083010054710003" + }]);//当事人信息数据 const [upload, setUpLoad] = useState(false); const [filesCheck, setFilesCheck] = useState(false); - const Step = Steps.Step; + const [infoData, setInfoData] = useState({}); const fakeColumns = [ @@ -141,30 +165,30 @@ // 更多数据... ]; + //获取id + const getCaseInfo = async () => { + const res = await getCaseInfoApi('24083010062110001') + if (res.type) { + let data = res.data + setInfoData([...fakeData1, { + ...data, + // status: + // data.status === '1' ? '待签收' : + // data.status === '2' ? '待受理' : + // data.status === '3' ? '办理中' : + // data.status === '4' ? '结案审核' : + // data.status === '5' ? '待评价' : + // data.status === '6' ? '已归档' : '未知状态' + }]) - //查看 - const handleCheckParty = (value) => { - console.log(value); - setDialogType(value.partyType) - setDetailVisabled(true) - } - - //添加申请人: 0、被申请人: 1、申请代理人: 2、被申请代理人:3 - const handleAdd = (type) => { - if (type === 2 || type === 3) { - setAgentVisible(true) - } else { - setAddVisabled(true) + setInfoData(res.data) } - setDialogType(type) } - //删除当事人 - const handleDeleteParty = (event, value) => { - event.stopPropagation(); - const filterData = fakeData.filter(item => item.id !== value.id) - setFakeData(filterData) - } + useEffect(() => { + getCaseInfo() + }, []) + return ( <div style={{ position: 'relative' }}> @@ -182,12 +206,8 @@ </Col> <div style={{ margin: '16px 0' }}> <PersonCard - isCheck={true} - partyType={'applicant'} // 这里设定为申请人 + isCheck={false} data={fakeData} - handleCheckParty={handleCheckParty} - handleAdd={handleAdd} - handleDeleteParty={handleDeleteParty} /> </div> <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '4px' }}> @@ -198,32 +218,32 @@ <Row gutter={[16, 16]}> <Col span={8}> <div><div className="title-text">事项状态</div></div> - <div style={{ color: '#1A6FB8' }}>待办理</div> + <div style={{ color: '#1A6FB8' }}>{infoData.statusName || '-'}</div> </Col> <Col span={16}> <div><div className="title-text">事项编号</div></div> - <div>GZ202408010001</div> + <div>{infoData.caseId || '-'}</div> </Col> {/*事项等级分为三级,颜色需要做判断*/} <Col span={8}> <div className="title"><div className="title-text">事项等级</div></div> - <div style={{ display: 'flex' }}><div style={{ backgroundColor: '#00B42A', marginRight: '4px', borderRadius: '4px' }}><div style={{ color: '#FFFFFF', padding: '0px 6px' }}>3</div></div>级</div> + <div style={{ display: 'flex' }}><div style={{ backgroundColor: '#00B42A', marginRight: '4px', borderRadius: '4px' }}><div style={{ color: '#FFFFFF', padding: '0px 6px' }}>{infoData.caseLevel || '-'}</div></div>级</div> </Col> <Col span={8}> <div><div className="title-text">来访时间</div></div> - <div>2024-7-12 10:00</div> + <div>{infoData.visitTime || '-'}</div> </Col> <Col span={8}> <div ><div className="title-text">来访人数(人)</div></div> - <div>2</div> + <div>{infoData.visitPeopleNum || '-'}</div> </Col> <Col span={8}> <div ><div className="title-text">纠纷类型</div></div> - <div>市场监管/金融纠纷</div> + <div>{infoData.caseTypeFirstName}/{infoData.caseTypeName}</div> </Col> <Col span={8}> <div ><div className="title-text">纠纷发生时间</div></div> - <div>2024-7-11</div> + <div>{infoData.occurTime}</div> </Col> <Col span={8}> <div ><div className="title-text">纠纷发生地点</div></div> @@ -231,7 +251,7 @@ </Col> <Col span={8}> <div ><div className="title-text">问题属地</div></div> - <div>广州市/天河区/棠下街道</div> + {/* <div>{queProvName}/{queCityName}/{queAreaName}/{queRoadName}</div> */} </Col> <Col span={8}> <div ><div className="title-text">涉及人数(人)</div></div> @@ -305,10 +325,13 @@ </Typography.Paragraph> } { - props.active === '3' && <Typography.Paragraph style={style}> + (props.active === '2' && props.current === 3) && <Typography.Paragraph style={style}> <Handle /> </Typography.Paragraph> } + { + (props.active === '2' && props.current === 2) && <EventFlow /> + } </div> ) } -- Gitblit v1.8.0