From 8d6b46929dc3cb6d012c889f22cb8976fa6bd04d Mon Sep 17 00:00:00 2001 From: dminyi <1301963064@qq.com> Date: Wed, 11 Sep 2024 12:05:04 +0800 Subject: [PATCH] 修改 --- gz-customerSystem/src/views/register/handleFeedback/component/handle.jsx | 798 +++++++++++++++++++++----------------------------------- 1 files changed, 305 insertions(+), 493 deletions(-) diff --git a/gz-customerSystem/src/views/register/handleFeedback/component/handle.jsx b/gz-customerSystem/src/views/register/handleFeedback/component/handle.jsx index b2ebf37..056f38a 100644 --- a/gz-customerSystem/src/views/register/handleFeedback/component/handle.jsx +++ b/gz-customerSystem/src/views/register/handleFeedback/component/handle.jsx @@ -1,89 +1,35 @@ import React, { useState, useRef, useEffect } from 'react'; +import { useParams } from 'react-router-dom'; import { Col, Space, Row, Tooltip } from 'antd'; -import { register, fold, down, empty, link, edit } from '@/assets/images'; -import { knock } from '@/assets/images/icon' -import { Form, Input, Tabs, Typography, Empty, Radio, Button, Modal } from '@arco-design/web-react'; +import { register, aiPerson } from '@/assets/images'; +import { Form, Input, Tabs, Typography, Button, Modal, Select } from '@arco-design/web-react'; import { question1, } from '@/assets/images'; import ProgressStep from '@/components/ProgressStep/VisitStep'; import SelectObjModal from '@/components/SelectObjModal/selectPerson'; import WantUserTag from '@/components/WantUserTag/Handling'; import { scan } from '@/assets/images/icon' -import DocumentScanner from './FileUpLoad' +import DocumentScanner from '../../matterDetail/FileUpLoad'; import * as $$ from '@/utils/utility'; import CaseResult from './CaseResult' import ArcoUpload from '@/components/ArcoUpload'; +import HandleRecord from '../../matterDetail/HandleRecord'; +import SupervisingView from '../../matterDetail/Supervising' +import UniteHandle from '../../matterDetail/UniteHandle'; +import { useNavigate } from 'react-router-dom'; -const InputSearch = Input.Search; +const Option = Select.Option; const FormItem = Form.Item; const TabPane = Tabs.TabPane; -const RadioGroup = Radio.Group; const appUrl = $$.appUrl; -const style = { - // textAlign: 'center', - // marginTop: 20, -}; -const fakeData = [ - { - handlerUserName: '天河区棠下街综治中心', - finishTime: new Date().getTime() - 24 * 60 * 60 * 1000, // 一天前的时间 - handleResult: '1', - status: '2', - taskNodeName: '来访登记', - mediResult: '22_00025-1', - handleContent: '调解成功,双方达成一致意见。', - operationName: '李晓明' - }, - { - handlerUserName: '系统派单', - finishTime: new Date().getTime() - 12 * 60 * 60 * 1000, // 半天前的时间 - handleResult: '1', - status: '2', - taskNodeName: '事件流转', - mediResult: '22_00025-1', - handleContent: '派单至:白云区新市街市场监管所', - }, - { - handlerUserName: '白云区新市街市场监管所', - finishTime: new Date().getTime() - 11 * 60 * 60 * 1000, // 半天前的时间 - handleResult: '1', - status: '2', - taskNodeName: '事件流转', - mediResult: '22_00025-1', - handleContent: '已签收', - operationName: '赵菲菲' - }, - { - handlerUserName: '白云区新市街市场监管所', - finishTime: new Date().getTime() - 11 * 60 * 60 * 1000, // 半天前的时间 - handleResult: '1', - status: '3', - taskNodeName: '事件回退', - mediResult: '22_00025-1', - // handleContent: '已签收', - operationName: '赵菲菲' - }, - { - handlerUserName: '天河区棠下街综治中心', - finishTime: new Date().getTime() - 6 * 60 * 60 * 1000, // 6小时前的时间 - handleResult: '2', - status: '1', - taskNodeName: '事件流转', - mediResult: '22_00025-1', - handleContent: '案件已被签收,准备开始调解。', - operationName: '李晓明' - }, -]; -function getByIdRoleApi(id) { - return $$.ax.request({ url: 'ctUser/getByIdRole?id=' + id, type: 'get', service: 'cust' }); -} -function choosePrincipalApi(id) { - return $$.ax.request({ url: 'caseInfoUnfold/choosePrincipal?caseId=24083010062110001&userId=' + id, type: 'get', service: 'mediate' }); + +function choosePrincipalApi(caseId, userId) { + return $$.ax.request({ url: `caseInfoUnfold/choosePrincipal?caseId=${caseId}&userId=` + userId, type: 'get', service: 'mediate' }); } function delFile(id) { @@ -102,140 +48,67 @@ return $$.ax.request({ url: `caseFeedback/listFeedback?id=` + id, type: 'get', service: 'mediate' }); } +function updateFeedbackApi(data) { + return $$.ax.request({ url: `caseFeedback/updateFeedback`, type: 'post', service: 'mediate', data }); +} + +function getFeedbackInfoApi(caseId) { + return $$.ax.request({ url: `caseFeedback/getFeedbackInfo?caseId=` + caseId, type: 'get', service: 'mediate' }); +} + +function getByIdRoleApi(id) { + return $$.ax.request({ url: `ctUser/getByIdRole?id=` + id, type: 'get', service: 'cust' }); +} + +function getListCaseFlow(caseId) { + return $$.ax.request({ url: `caseTask/listCaseFlow?caseId=` + caseId, type: 'get', service: 'mediate' }); +} - -const Handle = () => { +const Handle = ({ authorData, caseTaskId, caseId }) => { const formRef = useRef(); + const navigate = useNavigate(); const [selectedTab, setSelectedTab] = useState('1'); // 默认选中第一个 tab const [selectedTab1, setSelectedTab1] = useState('1'); // 默认选中第一个 tab - - const [wantUser, setWantUser] = useState({}); const [formView, setFormView] = useState(false); const [personView, setPersonView] = useState(false); const [supervising, setSupervising] = useState(false) const [data, setData] = useState({}) + const [feedbackInfoData, setFeedbackInfoData] = useState({}) + const [personData, setPersonData] = useState({}) const [caseResult, SetCaseResult] = useState(false); - const [response, setResponse] = useState('') - const [list, setList] = useState([]) + const [list, setList] = useState([]); + const [mode, SetMode] = useState(false); + const [uniteHandleView, setUniteHandleView] = useState(false); + const [isModalVisible, setIsModalVisible] = useState(false); + const [id, setId] = useState(''); + const [uniteHandleId, setUniteHandleId] = useState(''); + const [caseResultId, setCaseResultId] = useState(''); + const [managerName, setManagerName] = useState('') + const [progressData, setProgressData] = useState({}); - const tabs = [ - { index: '1', label: '承办部门' }, - { index: '2', label: '配合部门' }, - ]; + + const tabs1 = [ - { index: '1', label: '公共模板1:化解成功结案意见范本' }, - { index: '2', label: '个人模板1:化解成功结案意见范本(完整版)' } + { index: '1', label: '公共模板:提醒尽快启动调解程序督办模板' }, + { index: '2', label: '个人模板:推动事件尽快办结督办模板' } ] - const tabs2 = [ - { index: '1', label: '公共模板1:回复督办内容收到通用范本' }, - ] + const options = [ + { value: '1', label: '一' }, { value: '2', label: '二' }, { value: '3', label: '三' } + ]; - const [isModalVisible, setIsModalVisible] = useState(false); - const [id, setId] = useState('') - const handleTabChange = (newTabIndex) => { - setSelectedTab(newTabIndex); - }; + + + + const handleCheckedKeys = (userId) => { choosePrincipal(userId) } - - const [records, setRecords] = useState([ - { - id: 1, - date: '2024 - 7 - 1 10:00', - location: '天河区棠下街综治中心', - remark: '配合部门', - showView: false, - details: [ - { - title: '操作人', - content: ( - <div style={{ display: 'flex' }}> - <div>李晓明</div> - <img src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '4px' }} /> - </div> - ), - }, - { - title: '办理意见', - content: ( - <div> - 调解开始,我首先安抚双方情绪,确保对话在一个平和的氛围中展开。随后,我引导王先生详细说明了他的财务困境及还款意愿,同时让银行代表理解其处境,强调长期合作的重要性。经过反复沟通,银行同意调整还款计划,降低利率,并给予王先生一定的宽限期。王先生则承诺按新计划履行还款义务,双方最终达成一致,签署了调解协议。 - </div> - ), - }, - { - title: '办理附件', - content: ( - <a href="your-link-here.html" target="_blank"> - <img src={link} alt="" className="title-file" />江照月法人身份证明.pdf - </a> - ), - }, - ], - }, - { - id: 2, - date: '2024 - 7 - 2 14:00', - location: '天河区天河南街道办事处', - remark: '承办部门', - showView: false, - details: [ - { - title: '操作人', - content: ( - <div style={{ display: 'flex' }}> - <div>张伟</div> - <img src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '4px' }} /> - </div> - ), - }, - { - title: '办理意见', - content: ( - <div> - 在本次协调会议中,我们成功解决了双方之间的纠纷,确保了所有参与方的利益得到了妥善处理。通过深入交流,各方达成了共识,同意采取一系列措施来解决现存的问题。 - </div> - ), - }, - { - title: '办理附件', - content: '广州市天河区天河南路200号', - }, - ], - }, - ]); - - - - const toggleView = (id) => { - setList(list.map(record => { - if (record.id === id) { - return { - ...record, - showView: !record.showView, - }; - } - return record; - })); - }; - - const handleEdit = (id) => { - console.log(id, 'handleEdit') - let handleContent = list.find(item => item.id = id).handleContent - setList(list.filter(record => record.id !== id)); - setFormView(!formView); - formRef.current.setFieldsValue({ - handleContent: handleContent - }) - } - const [scannerVisible, setScannerVisible] = useState(false); @@ -253,23 +126,24 @@ setScannerVisible(true); }; - const getByIdRole = async () => { - const res = await getByIdRoleApi('2105180249501982') - if (res.type) { - let data = res.data - setData(data) - } - - } const choosePrincipal = async (id) => { console.log(id, 'choosePrincipalId') - const res = await choosePrincipalApi(id) + const res = await choosePrincipalApi(caseId, id) if (res.type) { let data = res.data console.log(data, 'choosePrincipalchoosePrincipal') } + } + + const getByIdRole = async () => { + console.log(feedbackInfoData?.handleUserId, 'feedbackInfoData?.handleUserId') + const res = await getByIdRoleApi(feedbackInfoData?.handleUserId) + if(res.type){ + setPersonView(!personView) + setPersonData(res.data) + } } @@ -281,45 +155,109 @@ } } - const getNewTimeId = async () => { - const res = await getNewTimeIdApi() - if (res.type) { - setId(res.data) - } - } + + //新增、编辑办理理由 const saveFeedback = async (submitData) => { console.log(submitData, 'submitData1111') - const res = await saveFeedbackApi(submitData) - if (res.type) { - $$.infoSuccess({ content: '保存成功' }); + if (submitData.id) { + //编辑 + const res = await updateFeedbackApi({ + ...submitData, + }) + if (res.type) { + $$.infoSuccess({ content: '修改成功' }); + listFeedback(caseId); + formRef.current.resetFields(); + } + } else { + const res = await saveFeedbackApi({ + ...submitData, + caseId: caseId, + id: id, + caseTaskId: '', + }) + if (res.type) { + $$.infoSuccess({ content: '保存成功' }); + listFeedback(caseId); + formRef.current.resetFields(); + } } } + const getFeedbackInfo = async () => { + const res = await getFeedbackInfoApi(caseId) + if (res.type) { + setFeedbackInfoData(() => res.data) + console.log(res.data, 'res.data') + // getByIdRole(); + } + } + + //获取办理记录接口 const listFeedback = async (id) => { const res = await listFeedbackApi(id) if (res.type) { - let data = res.data.caseFeedbackList + let data = res.data.caseFeedbackList; + let manager = res.data.manager setList(data) + setManagerName(manager) } - console.log(list, 'listFeedbackApilistFeedbackApi') } + //获取理由id + const getNewTimeId = async (type) => { + const res = await getNewTimeIdApi() + if (res.type) { + if (type === 'uniteHandle') { + setUniteHandleId(res.data) + } + if (type === 'addMark') + setId(res.data) + if (type === 'caseResult') { + setCaseResultId(res.data) + } + } + } + + const getData = async (id) => { + const res = await getListCaseFlow(id) + if (res.type) { + setProgressData(res.data) + } + } + + //添加办理记录 const addMark = () => { setFormView(!formView); - getNewTimeId() + getNewTimeId('addMark') } + //保存信息 const handleFinish = () => { - console.log(formRef.current.getFields(), formRef, 'formRef.current.getFields()', 'formRef') let submitData = formRef.current.getFields() saveFeedback(submitData) setFormView(!formView); } + //点击编辑办理事由 + const handleEdit = (record) => { + setFormView(true) + formRef.current.setFieldsValue({ + ...record + }) + } + const Supervising = () => { setSupervising(!supervising) } + + const uniteHandle = () => { + getNewTimeId('uniteHandle') + setUniteHandleView(!uniteHandleView) + } + + const handleTabChange1 = (newTabIndex) => { setSelectedTab1(newTabIndex); @@ -333,15 +271,37 @@ setSupervising(!supervising) } - const handleResponse = () => { - setResponse(!response) + const handlePersonView = () => { + getByIdRole(); + + } + + const handleCaseResultApply = () => { + SetCaseResult(!caseResult) + getNewTimeId('caseResult') } useEffect(() => { - listFeedback('24083010062110001'); - // getByIdRole() + listFeedback(caseId); + getData(caseId) + getFeedbackInfo(); }, []) + + // useEffect(() => { + // if (authorData) { + // const { buttonList } = authorData; + // setStaticButtonList(myButton.filter(item => { + // const flag = buttonList.some(result => { + // if (result.id === item.key) { + // return true + // } + // }) + // return flag + // })) + // } + // }, [authorData]) + return ( @@ -350,28 +310,33 @@ <div className='container-top'> <Col span={24}> <Space size='small'> - <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>当事人信息</h5> + <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>办理信息</h5> </Space> </Col> <Row gutter={[16, 16]}> <Col span={8} style={{ display: 'flex' }}> <div><div className="title-text">承办部门:</div></div> - <div>天河区棠下街综治中心</div> + <div>{feedbackInfoData?.handleUnitName}</div> </Col> <Col span={8} style={{ display: 'flex' }}> <div><div className="title-text">经办人:</div></div> <div style={{ display: 'flex' }}> - <div>王一顺</div> - <img onClick={() => setPersonView(!personView)} src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '4px' }} /> + { + feedbackInfoData?.handleUserName ? + <> + <div>{feedbackInfoData?.handleUserName}</div> + <img onClick={() => handlePersonView()} src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '4px' }} /> + </> : '-' + } </div> </Col> <Col span={8} style={{ display: 'flex' }}> <div><div className="title-text">配合部门:</div></div> - <div>-</div> + <div>{feedbackInfoData?.assistUnitName}</div> </Col> <Col span={8} style={{ display: 'flex' }}> <div><div className="title-text">受理时间:</div></div> - <div>2024-7-5 11:45</div> + <div>{feedbackInfoData?.acceptTime}</div> </Col> </Row> @@ -401,146 +366,90 @@ {wantUser.wantUserId ? <WantUserTag name={wantUser.wantUserName} onClose={() => setWantUser({ wantUserId: null, wantUserName: null })} /> : - <Button onClick={() => setIsModalVisible(true)} style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }} type='outline'>选择</Button> - // <InputSearch - // searchButton='选择' - // placeholder='请选择' - // style={{ width: 350 }} - // onClick={() => setIsModalVisible(true)} - // onSearch={() => setIsModalVisible(true)} - // /> + caseId && managerName ? + <WantUserTag name={managerName} onClose={() => setWantUser({ wantUserId: null, wantUserName: null })} /> + : + <Button onClick={() => { setIsModalVisible(true); }} style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }} type='outline'>选择</Button> } </FormItem> </Col> <Col span={24}> <div style={{ color: 'rgb(134, 144, 156)' }}>办理记录</div> - {list?.length > 0 ? - <div> - {list?.map(record => ( - <div key={record.id} className='container-bottom-left-record'> - <div className='container-bottom-left-record-top'> - { - record.showView ? ( - <img src={down} alt='' style={{ width: '18px', marginRight: '6px' }} onClick={() => toggleView(record.id)} /> - ) : ( - <img src={fold} alt='' className='container-bottom-left-record-top-icon' onClick={() => toggleView(record.id)} /> - ) - } - <div>{`${record.createTime} ${record.handleUnitName}`}</div> - <div className={`container-bottom-left-record-top-${record.handleType === '2' ? 'remark' : 'hostOrg'}`}>{record.handleType === '2' ? '配合部门' : '承办部门'}</div> - <div><img src={edit} alt='' className='container-bottom-left-record-top-edit' onClick={() => handleEdit(record.id)} /></div> - </div> - <div className='container-bottom-left-record-bottom' style={{ display: record.showView ? 'block' : 'none' }}> - <table border="1" cellpadding="8" className='container-bottom-left-record-bottom-table'> - <tr> - <th bgcolor="#F7F8FA" className="table-title" width="120">操作人</th> - <td>{record.handleUnitName}</td> - </tr> - <tr> - <th bgcolor="#F7F8FA" className="table-title" width="120">办理意见</th> - <td>{record.handleContent}</td> - </tr> - <tr> - <th bgcolor="#F7F8FA" className="table-title" width="120">办理附件</th> - <td>{record.handleUnitName}</td> - </tr> - </table> - </div> - </div> - ))} - </div> - : - <Empty - icon={ - <div - style={{ - display: 'flex', - justifyContent: 'center', - marginBottom: '100px' - }} - > - <img src={empty} alt='' style={{ width: '160px', height: '160px' }} /> - </div> - } - description='暂无数据' - /> - } - {formView && - <div className='Form'> - <Col span={24} style={{ marginBottom: '8px' }}> - <Space size='small'> - <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>添加办理记录</h5> - </Space> - </Col> - <Col span={24}> - <Form - ref={formRef} - layout='vertical' - requiredSymbol={false} - scrollToFirstError={true} - > - <Row gutter={[32, 0]}> - <Col span={24}> - <FormItem - label={<div style={{ display: 'flex' }}> - 办理意见 - <img src={scan} alt="" style={{ marginRight: '-2px', marginLeft: '8px' }} /> - <div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }} onClick={openScanner}>识别材料</div> - </div> - } - field='handleContent' - rules={[{ message: '请填写事项概况', required: true }]} - > - <Input.TextArea - maxLength={200} - showWordLimit - rows={5} - placeholder='请完整描述事项概况,应具备5要素:发生时间+发生地点+人物情况+事项起因+事项经过' - wrapperStyle={{ width: '100%' }} - /> - </FormItem> - - </Col> - <Col span={24}> - <FormItem - label={<div style={{ display: 'flex' }}> - 办理附件 - </div> - } - field='caseDes' - rules={[{ message: '请填写事项概况', required: true }]} - > - <ArcoUpload - params={{ - action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId='24083010062110001'&&ownerId=${id}&ownerType=22_00018-102`, - }} - field='file1' - // handleChangeFile={handleChangeFile} - label='' - // editData={props.editData} - handleDelFile={handleDelFile} - /> - </FormItem> - </Col> - - </Row> - </Form> - </Col> - <Space size='middle'> - <Button type='primary' onClick={() => handleFinish()}>保存</Button> - <Button type='secondary'>取消添加</Button> + <HandleRecord isReview={false} handleEdit={handleEdit} data={list} /> + {/* {formView && */} + <div className='Form' style={{ display: formView ? '' : 'none' }}> + <Col span={24} style={{ marginBottom: '8px' }}> + <Space size='small'> + <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>添加办理记录</h5> </Space> - </div> + </Col> + <Col span={24}> + <Form + ref={formRef} + layout='vertical' + requiredSymbol={false} + scrollToFirstError={true} + > + <Row gutter={[32, 0]}> + <Col span={24}> + <FormItem + label={<div style={{ display: 'flex' }}> + 办理意见 + <img src={scan} alt="" style={{ marginRight: '-2px', marginLeft: '8px' }} /> + <div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }} onClick={openScanner}>识别材料</div> + </div> + } + field='handleContent' + rules={[{ message: '请填写事项概况', required: true }]} + > + <Input.TextArea + maxLength={200} + showWordLimit + rows={5} + placeholder='请完整描述事项概况,应具备5要素:发生时间+发生地点+人物情况+事项起因+事项经过' + wrapperStyle={{ width: '100%' }} + /> + </FormItem> + </Col> + <Col span={24}> + <FormItem + label={<div style={{ display: 'flex' }}> + 办理附件 + </div> + } + field='caseDes' + rules={[{ message: '请填写事项概况', required: true }]} + > + <ArcoUpload + params={{ + action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${caseId}&ownerId=${id}&ownerType=${'22_00018-501'}`, + }} + field='file1' + // handleChangeFile={handleChangeFile} + label='' + // editData={props.editData} + handleDelFile={handleDelFile} + /> + </FormItem> + </Col> - } + </Row> + </Form> + </Col> + <Space size='middle'> + <Button type='primary' onClick={() => handleFinish()}>保存</Button> + <Button type='secondary' onClick={() => { setFormView(!formView); }}>取消添加</Button> + </Space> + </div> + {/* } */} </Col> </Form> <Space style={{ marginTop: '38px', bottom: '4px' }}> <Button type="primary" style={{ backgroundColor: '#1A6FB8' }} onClick={() => addMark()}>添加办理记录</Button> - <Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }}>联合处置申请</Button> - <Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }} onClick={() => SetCaseResult(!caseResult)}>结案申请</Button> + <Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }} onClick={() => uniteHandle()}>联合处置申请</Button> + <Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }} onClick={() => handleCaseResultApply()} >结案申请</Button> <Button type='outline' style={{ color: '#EF6C24', border: '1px solid #EF6C24' }} onClick={() => Supervising()}>督办</Button> - <Button type='secondary'>返回上级页面</Button> + <Button type='secondary' onClick={() => navigate(-1)}>返回上级页面</Button> </Space> </div> <div className='container-bottom-right'> @@ -554,7 +463,11 @@ } > <Typography.Paragraph> - <div style={{ display: 'flex', marginLeft: '16px', gap: '16px' }}> + <div className='progress'> + <ProgressStep progressData={progressData} hasTab={true} /> + </div> + + {/* <div style={{ display: 'flex', marginLeft: '16px', gap: '16px' }}> {tabs.map((tab) => ( <div key={tab.index} @@ -575,7 +488,7 @@ <div className='progress'> <ProgressStep progressData={fakeData} /> </div> - } + } */} </Typography.Paragraph> </TabPane> <TabPane @@ -587,39 +500,7 @@ } > <Typography.Paragraph> - <RadioGroup - type='button' - name='lang' - defaultValue='1' - style={{ display: 'flex', margin: '0 16px 0px 16px', }} - > - <Radio value='1' style={{ flex: 1, textAlign: 'center' }}>未回复</Radio> - <Radio value='2' style={{ flex: 1, textAlign: 'center' }}>已回复</Radio> - </RadioGroup> - <div className='Supervising'> - <div style={{ display: 'flex' }}> - <img src={knock} alt='' style={{ marginRight: '4px' }} /> - <div style={{ color: '#EF6C24' }} >回复期限剩3小时</div> - </div> - <div className='Supervising-item'> - <div className='Supervising-item-title'>督办时间:</div> - <div>2024-7-12 10:50</div> - </div> - <div className='Supervising-item'> - <div className='Supervising-item-title'>督办人:</div> - <div>张三丰</div> - </div> - <div className='Supervising-item'> - <div className='Supervising-item-title'>督办内容:</div> - <div>该纠纷事件目前群众较为关注,现要求相关部门即刻启动纠纷化解工作。请负责同事务必于本周内制定出具体解决方案,并确保与当事人进行有效沟通。请各位积极响应,高效协作,争取在最短时间内妥善处理完毕。</div> - </div> - <div className='Supervising-item'> - <div className='Supervising-item-title'>督办附件:</div> - <img src={link} alt='' style={{ width: '16px' }} /> - <div>2</div> - </div> - <Button className='Supervising-btn' size='small' type='outline' onClick={() => handleResponse()}>回复</Button> - </div> + <SupervisingView id={id} /> </Typography.Paragraph> </TabPane> </Tabs> @@ -632,12 +513,15 @@ visible={isModalVisible} checkKeys={wantUser.wantUserId ? [{ label: wantUser.wantUserName, value: wantUser.wantUserId }] : undefined} onOk={(value) => { + console.log(value, 'value') console.log(value.key, value, 'value.key', 'value') setIsModalVisible(false); setWantUser({ wantUserId: value.keys[0], wantUserName: value.items[0].name }); handleCheckedKeys(value.keys?.[0]) + }} onClose={() => setIsModalVisible(false)} + type='person' /> <DocumentScanner @@ -649,27 +533,27 @@ <table border="1" align="center" cellpadding="5" className="table"> <tr> <th bgcolor="#F7F8FA" className="table-title" width="120">姓名</th> - <td width='380'><div style={{ display: 'flex' }}><div>{data.trueName}</div></div></td> + <td width='380'><div style={{ display: 'flex' }}><div>{personData?.trueName}</div></div></td> <th bgcolor="#F7F8FA" className="table-title" width="120">登录账号</th> - <td width='380'>{data.acc}</td> + <td width='380'>{personData?.acc}</td> </tr> <tr> <th bgcolor="#F7F8FA" className="table-title">手机号码</th> - <td>{data.mobile}</td> + <td>{personData?.mobile}</td> <th bgcolor="#F7F8FA" className="table-title">工作电话</th> - <td>020-83002020</td> + <td>-</td> </tr> <tr> <th bgcolor="#F7F8FA" className="table-title">所属部门</th> - <td>{data.deptName}</td> + <td>{personData?.unitName}</td> <th bgcolor="#F7F8FA" className="table-title">职务</th> - <td>主任</td> + <td>{personData?.userRoles}</td> </tr> </table> </Modal> <Modal visible={supervising} onCancel={() => setSupervising(false)} title='督办' centered footer={null}> - <div style={{ marginTop: '18px' }}>督办意见</div> <Form + ref={formRef} layout='vertical' requiredSymbol={false} scrollToFirstError={true} @@ -680,24 +564,47 @@ <Row> <Col span={24}> <FormItem + label={<div style={{ display: 'flex' }}><div>督办部门</div><div style={{ color: '#86909C' }}>(可多选)</div></div>} + field='' + > + <Select + mode='multiple' + placeholder='请选择督办部门' + style={{}} + allowClear + > + {options.map((option) => ( + <Option key={option.value} value={option.value} onChange={(v) => console.log(v, 'vvvvvv')}> + {option.label} + </Option> + ))} + </Select> + </FormItem> + </Col> + <div style={{ marginBottom: '8px' }}>督办意见</div> + <Col span={24}> + <FormItem field='suggestion' > - <div className='tabs1'> - {tabs1.map((tab) => ( - <div - key={tab.index} - style={{ - color: selectedTab1 === tab.index ? 'rgba(26,111,184,1)' : 'rgba(0,0,0,0.45)', - border: `1px solid ${selectedTab1 === tab.index ? 'rgba(26,111,184,1)' : 'rgba(229,230,235,1)'}`, - borderRadius: '2px', - cursor: 'pointer', - padding: '0px 8px', - }} - onClick={() => handleTabChange1(tab.index)} - > - {tab.label} - </div> - ))} + <div style={{ display: 'flex', justifyContent: 'space-between' }}> + <div className='tabs1'> + {tabs1.map((tab) => ( + <div + key={tab.index} + style={{ + color: selectedTab1 === tab.index ? 'rgba(26,111,184,1)' : 'rgba(0,0,0,0.45)', + border: `1px solid ${selectedTab1 === tab.index ? 'rgba(26,111,184,1)' : 'rgba(229,230,235,1)'}`, + borderRadius: '2px', + cursor: 'pointer', + padding: '0px 8px', + }} + onClick={() => handleTabChange1(tab.index)} + > + {tab.label} + </div> + ))} + </div> + <div style={{ color: '#1A6FB8' }} onClick={() => SetMode(!mode)}>更多模板</div> </div> <Input.TextArea rows={5} @@ -728,103 +635,8 @@ </Row> </Form> </Modal> - <Modal visible={response} onCancel={() => setResponse(false)} title='回复督办' centered footer={null} style={{overflowY:'auto'}}> - <div style={{ }}> - <Col span={24} style={{ marginBottom: '8px' }}> - <Space size='small'> - <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>督办意见</h5> - </Space> - </Col> - <Row gutter={[16, 16]}> - <Col span={24} > - <div className="title-text">督办时间</div> - <div>2024-7-12 10:50</div> - </Col> - <Col span={24}> - <div className="title-text">督办人</div> - <div>张三丰</div> - </Col> - <Col span={24}> - <div className="title-text">督办内容</div> - <div>该纠纷事件目前群众较为关注,现要求相关部门即刻启动纠纷化解工作。请负责同事务必于本周内制定出具体解决方案,并确保与当事人进行有效沟通。请各位积极响应,高效协作,争取在最短时间内妥善处理完毕。</div> - </Col> - <Col span={24}> - <div className="title-text">督办附件</div> - <img src={link} alt="" className="title-file" />广东好又多贸易有限公司营业执照副本.pdf - </Col> - </Row> - <Col span={24} style={{ marginBottom: '8px' }}> - <Space size='small'> - <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>督办回复</h5> - </Space> - </Col> - <Form - layout='vertical' - requiredSymbol={false} - scrollToFirstError={true} - initialValues={{ - suggestion: '' - }}//默认值 - > - <Row> - <Col span={24}> - <FormItem - field='suggestion' - > - <div> - - </div> - <div className='tabs1'> - {tabs2.map((tab) => ( - <div - key={tab.index} - style={{ - color: selectedTab1 === tab.index ? 'rgba(26,111,184,1)' : 'rgba(0,0,0,0.45)', - border: `1px solid ${selectedTab1 === tab.index ? 'rgba(26,111,184,1)' : 'rgba(229,230,235,1)'}`, - borderRadius: '2px', - cursor: 'pointer', - padding: '0px 8px', - }} - onClick={() => handleTabChange1(tab.index)} - > - {tab.label} - </div> - ))} - </div> - <div>更多模板</div> - - <Input.TextArea - rows={5} - wrapperStyle={{ width: '700px' }} - value={content} - /> - </FormItem> - </Col> - <Col span={24}> - <FormItem - label='附件材料' - field='caseDes' - rules={[{ message: '请填写事项概况', required: true }]} - > - <ArcoUpload - params={{ - action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId='24083010062110001'&&ownerId=${id}&ownerType=22_00018-102`, - }} - field='file1' - // handleChangeFile={handleChangeFile} - label='' - // editData={props.editData} - handleDelFile={handleDelFile} - /> - </FormItem> - </Col> - <Button type='primary' style={{ marginTop: '-16px',marginBottom:'16px' }} onClick={() => handleSupervising()}>提交</Button> - </Row> - </Form> - </div> - </Modal> - - <CaseResult visible={caseResult} handleOnCancel={() => SetCaseResult(false)} /> + <UniteHandle id={uniteHandleId} visible={uniteHandleView} handleOnCancel={() => setUniteHandleView(false)} /> + <CaseResult visible={caseResult} handleOnCancel={() => SetCaseResult(false)} caseResultId={caseResultId} caseId={caseId} caseTaskId={caseTaskId} /> </div> </> -- Gitblit v1.8.0