From f6efc465e8f5633313afc8da54c17988722073eb Mon Sep 17 00:00:00 2001 From: zhangyongtian <1181606322@qq.com> Date: Sat, 14 Sep 2024 15:55:07 +0800 Subject: [PATCH] fix: 审核页面逻辑调整、滚动调整 --- gz-customerSystem/src/views/register/closingReview/component/ReviewExamine.jsx | 290 ++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 203 insertions(+), 87 deletions(-) diff --git a/gz-customerSystem/src/views/register/closingReview/component/ReviewExamine.jsx b/gz-customerSystem/src/views/register/closingReview/component/ReviewExamine.jsx index e5b8cad..c5e7665 100644 --- a/gz-customerSystem/src/views/register/closingReview/component/ReviewExamine.jsx +++ b/gz-customerSystem/src/views/register/closingReview/component/ReviewExamine.jsx @@ -1,41 +1,152 @@ -import React, { useRef, useState } from 'react' +import React, { useRef, useState, useEffect } from 'react' import { Row, Col, Space } from 'antd'; import { link, register } from '@/assets/images'; import { Form, Input, Button, Radio } from '@arco-design/web-react'; import ArcoUpload from '@/components/ArcoUpload'; import { Scrollbars } from "react-custom-scrollbars"; import ReviewProgress from './ReviewProgress'; +import * as $$ from '@/utils/utility'; +import { useNavigate } from 'react-router-dom'; +import { getOffset, getSize } from '@/utils/utility'; const RadioGroup = Radio.Group; const FormItem = Form.Item; const TextArea = Input.TextArea; +const appUrl = $$.appUrl; + +function getData(data) { + return $$.ax.request({ url: `caseTask/getWindupApplyInfo`, type: 'get', service: 'mediate', data }); +} + +function getId() { + return $$.ax.request({ url: `caseUtils/getNewTimeId`, type: 'get', service: 'utils' }); +} + +function delFile(id) { + return $$.ax.request({ url: `fileInfo/deleteFileById`, type: 'get', service: 'sys', data: { id } }); +} + +function submit(data) { + return $$.ax.request({ url: `caseTask/windupAudit`, type: 'post', service: 'mediate', data }); +} + +function getListCaseFlow(data) { + return $$.ax.request({ url: `caseTask/listCaseFlow`, type: 'get', service: 'mediate', data }); +} export default function ReviewExamine(props) { + const navigate = useNavigate(); const formRef = useRef(); + const scrollRef = useRef(null); const [result, setResult] = useState() - const infoData = { - result: '化解不成功', - time: '2024-7-21 12:00', - people: '白云区新市街市场监管所', - person: '张晓霞', - reason: '当事人拒绝参加调解,对调解工作极为抗拒', - opinion: `针对该事项,我部门高度重视并立即启动了调解程序。然而,在调解过程中遇到的主要困难是当事人李晓明未能积极配合我们的工作,具体表现为: - 1、拒绝提供必要的证据材料; - 2、不接听我们拨打的相关电话; - 3、拒绝到场参加任何调解行为 - 由于上述原因,我们目前无法进一步查清事实真相,也无法制定出切实可行的解决方案。为了保障当事人的合法权益得到维护,已引导当事人走司法途径,目前已在法院立案,特申请结案。`, - isProceeding: '是', - proceeding: '(粤)云调20240811号' + const [infoData, setInfoData] = useState({}); + const [id, setId] = useState(); + const [progressData, setProgressData] = useState({}) + const [reasonRadio, setReasonRadio] = useState(); + const [height, setHeight] = useState(500); + const options = [ + { + label: '材料不完整', + value: '1' + }, + { + label: '办理流程有问题', + value: '2' + }, + { + label: '当事人不满意调解结果', + value: '3' + }, + { + label: '其他', + value: '4' + }, + ] + + useEffect(() => { + getInfoData() + // getAppId() + getProData() + onWindowResize() + window.addEventListener("resize", onWindowResize); + // 返回一个函数,该函数会在组件卸载前执行 + return () => { + // 组件销毁时执行 + window.removeEventListener("resize", onWindowResize); + }; + }, []) + + const onWindowResize = () => { + let offsetTop = 0; + if (scrollRef.current.container) { + offsetTop = getOffset(scrollRef.current.container).top; + } + setHeight(getSize().windowH - offsetTop - 80) + }; + + //获取id + // const getAppId = async () => { + // const res = await getId() + // if (res.type) { + // setId(res.data) + // } + // } + + //回显数据 + const getInfoData = async () => { + const res = await getData({ caseTaskId: props.caseTaskId }) + if (res.type) { + setInfoData(res.data || {}) + setId(res.data.id) + } + } + + //获取流程信息 + const getProData = async () => { + const res = await getListCaseFlow({ + caseId: props.caseId + }) + if (res.type) { + setProgressData(res.data) + } } const handleSubmit = () => { + if (formRef.current) { + formRef.current.validate(undefined, (errors, values) => { + if (!errors) { + const { file, myNoUp, ...rest } = formRef.current.getFields() + requestSubmit({ + id: id, + caseId: props.caseId, + caseTaskId: props.caseTaskId, + ...rest + }) + } + }) + } + } + const requestSubmit = async (data) => { + const res = await submit(data) + if (res.type) { + $$.infoSuccess({ content: '提交成功!' }); + navigate(`/mediate/visit/visitWorkBench`) + } + } + + //删除文件 + const handleDelFile = async (id) => { + const res = await delFile(id) + if (res.type) { + $$.infoSuccess({ content: '删除成功!' }); + } } return ( <div className='dataSync'> - <div className='dataSync-noBackTabPage'> - <Scrollbars style={{ height: '100%' }} autoHide> + <div className='dataSync-noBackTabPage' style={{ background: '#fff' }}> + <Scrollbars style={{ height: height + 'px' }} autoHide ref={scrollRef}> <div className='whiteBox'> <Space size='small'> <div className='MediationInfo-subTitle' style={{ marginTop: '-8px' }}></div><h5>结案申请</h5> @@ -43,35 +154,39 @@ <Row gutter={[16, 16]}> <Col span={24}> <div><div className="title-text">化解结果</div></div> - <div>{infoData?.result || '-'}</div> + <div style={{ color: infoData.mediResult == '22_00025-1' ? '#00B42A' : '#F53F3F' }}>{infoData?.mediResultName || '-'}</div> </Col> <Col span={24}> <div><div className="title-text">无法化解理由</div></div> - <div>{infoData?.reason || '-'}</div> + <div>{infoData?.failReason || '-'}</div> </Col> <Col span={24}> <div><div className="title-text">结案意见</div></div> - <div>{infoData?.opinion || '-'}</div> + <div>{infoData?.auditContent || '-'}</div> </Col> - <Col span={24}> + {/* <Col span={24}> <div><div className="title-text">是否转诉讼案件</div></div> <div>{infoData?.isProceeding || '-'}</div> </Col> <Col span={24}> <div><div className="title-text">诉讼案号</div></div> <div>{infoData?.proceeding || '-'}</div> - </Col> + </Col> */} <Col span={24}> <div><div className="title-text">申请时间</div></div> - <div>{infoData?.time || '-'}</div> + <div>{$$.myTimeFormat(infoData?.applyTime, 'YYYY-MM-DD HH:mm') || '-'}</div> </Col> <Col span={24}> <div><div className="title-text">申请人</div></div> - <div>{infoData?.people} {infoData?.person}<img src={register} alt="" className="title-register" /></div> + <div> + {infoData?.applyUnitName} + {infoData?.applyUserName} + <img src={register} alt="" className="title-register" /> + </div> </Col> </Row> </div> - <div style={{ display: 'flex', marginTop: '8px' }}> + <div style={{ display: 'flex', borderTop: '8px solid #f0f2f5' }}> <div className='whiteBox' style={{ flex: 1, marginRight: '8px' }}> <Space size='small'> <div className='MediationInfo-subTitle' style={{ marginTop: '-8px' }}></div><h5>审核</h5> @@ -81,6 +196,8 @@ layout='vertical' requiredSymbol={false} initialValues={{ + auditResult: '24_00004-1', + auditResultName: '同意' }}//默认值 scrollToFirstError > @@ -88,98 +205,97 @@ <Col span={24}> <FormItem label={(<div style={{ display: 'flex' }}>审核结果</div>)} - field='result' + field='auditResult' > <RadioGroup direction='vertical' - options={[ - { - label: '同意', - value: 1 - }, - { - label: '不同意', - value: 0 - }, - ]} - onChange={(v) => { setResult(v) }} - > - </RadioGroup> + options={$$.options.auditResult} + onChange={(value) => { + setResult(value) + if (value) { + const data = $$.options.auditResult.find(item => item.value === value) + formRef.current.setFieldValue('auditResultName', data.label) + } else { + formRef.current.setFieldValue('auditResultName', '') + } + }} + /> </FormItem> </Col> - {result === 0 && + {result === '24_00004-2' && <> <Col span={24}> <FormItem label={(<div style={{ display: 'flex' }}>理由说明<div className="must">必填</div></div>)} - field='trueName' + field='myNoUp' rules={[{ required: true, message: '请选择理由说明' }]} > - <RadioGroup direction='vertical' options={[ - { - label: '材料不完整', - value: '0' - }, - { - label: '办理流程有问题', - value: '1' - }, - { - label: '当事人不满意调解结果', - value: '2' - }, - { - label: '其他', - value: '3' - }, - ]}> + <RadioGroup + direction='vertical' + options={options} + onChange={(value) => { + setReasonRadio(value) + if (value !== '4') { + const obj = options.find(item => item.value === value) + formRef.current.setFieldValue('auditContent', obj.label) + } else { + formRef.current.setFieldValue('auditResultName', '') + } + }} + > </RadioGroup> </FormItem> </Col> - <Col span={24}> - <FormItem - label=' ' - field='luyou' - rules={[{ required: true, message: '理由不能为空' }]} - > - <TextArea - autoSize={{ minRows: 4, maxRows: 8 }} - placeholder='请填写回退的具体理由' - /> - </FormItem> - </Col> + { + reasonRadio === '4' && <Col span={24}> + <FormItem + label=' ' + field='auditContent' + rules={[{ required: true, message: '理由不能为空' }]} + > + <TextArea + autoSize={{ minRows: 4, maxRows: 8 }} + placeholder='请填写回退的具体理由' + /> + </FormItem> + </Col> + } <Col span={24} className="doubleFile"> <ArcoUpload params={{ - action: ``, + action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${props.caseId}&ownerId=${id}&ownerType=22_00018-514`, }} field='file' label='附件材料' + handleDelFile={handleDelFile} /> </Col> </> } </Row> </Form> - <div className='dialogFooter'> - <Button - type="primary" - className="dialogPrimary" - onClick={handleSubmit} - > - 提交 - </Button> + </div> + { + (infoData.caseLevel === 1 || infoData.caseLevel === 2) && + <div className='whiteBox' style={{ width: '400px' }}> + <Space size='small'> + <div className='MediationInfo-subTitle' style={{ marginTop: '-8px' }}></div><h5>审核进度</h5> + </Space> + <ReviewProgress progressData={progressData} /> </div> - </div> - <div className='whiteBox' style={{ width: '400px' }}> - <Space size='small'> - <div className='MediationInfo-subTitle' style={{ marginTop: '-8px' }}></div><h5>审核进度</h5> - </Space> - <ReviewProgress /> - </div> + } </div> - </Scrollbars> + <div className='dialogFooter' style={{ margin: 0, padding: '16px 12px' }}> + <Button + type="primary" + className="dialogPrimary" + onClick={handleSubmit} + > + 提交 + </Button> + <Button type='secondary' onClick={() => navigate(-1)}>返回上级页面</Button> + </div> </div> </div> ) -- Gitblit v1.8.0