From 57d1fbef468c74a6c57a7f2e48de082707dbdff0 Mon Sep 17 00:00:00 2001 From: dminyi <1301963064@qq.com> Date: Fri, 13 Sep 2024 11:27:26 +0800 Subject: [PATCH] 办理反馈页面修改 --- gz-customerSystem/src/views/register/matterDetail/Supervising.jsx | 155 +++++---------------------------------------------- 1 files changed, 15 insertions(+), 140 deletions(-) diff --git a/gz-customerSystem/src/views/register/matterDetail/Supervising.jsx b/gz-customerSystem/src/views/register/matterDetail/Supervising.jsx index 8b2e4e5..ef4bc15 100644 --- a/gz-customerSystem/src/views/register/matterDetail/Supervising.jsx +++ b/gz-customerSystem/src/views/register/matterDetail/Supervising.jsx @@ -2,19 +2,19 @@ * @Author: dminyi 1301963064@qq.com * @Date: 2024-09-06 09:54:09 * @LastEditors: dminyi 1301963064@qq.com - * @LastEditTime: 2024-09-06 10:18:22 + * @LastEditTime: 2024-09-13 11:20:00 * @FilePath: \gzDyh\gz-customerSystem\src\views\register\matterDetail\Supervising.jsx * @Description: 督办 */ import React, { useState } from 'react'; -import { Form, Input, Tabs, Typography, Empty, Radio, Button, Modal, Select } from '@arco-design/web-react'; -import { Col, Space, Row, Tooltip } from 'antd'; +import { Form, Input, Radio, Button, Modal } from '@arco-design/web-react'; +import { Col, Space, Row, } from 'antd'; import { knock } from '@/assets/images/icon' import { link, register } from '@/assets/images'; import { question1, } from '@/assets/images'; import ArcoUpload from '@/components/ArcoUpload'; import * as $$ from '@/utils/utility'; -import TableView from '@/components/TableView'; +import ModeSelect from './ModeSelect' const RadioGroup = Radio.Group; @@ -30,119 +30,19 @@ const SupervisingView = (id) => { - const [radioValue, setRadioValue] = useState('') + const [radioValue, setRadioValue] = useState('1') const [response, setResponse] = useState('') const [selectedTab1, setSelectedTab1] = useState('1'); // 默认选中第一个 tab const [detail, setDetail] = useState(false); const [mode, SetMode] = useState(false); const [supervising, setSupervising] = useState(false); - const [modeDetail, setModeDetail] = useState(false); const tabs2 = [ { index: '1', label: '公共模板1:回复督办内容收到通用范本' }, ] - const fakeColumns = [ - { - title: '序号', - dataIndex: 'caseNo', - key: 'caseNo', - width: 51, - render: (text, record, index) => <span>{index + 1}</span>, - }, - { - title: '类型', - dataIndex: 'judicNo', - key: 'judicNo', - width: 85, - }, - { - title: '模板名称', - dataIndex: 'inputUserName', - key: 'perClassName', - width: 160, - render: (text) => ( - <> - {text} - {/* {sourceType === '1' ? matterNumber : sourceType === '2' ? evidenceNumber : 0}份 */} - </> - ) - - - }, - { - title: '模板内容', - dataIndex: 'perClassName', - key: 'perClassName', - width: 400, - render: (text) => ( - <div style={{}}> - <div style={{ width: '300px', height: '110px', overflow: 'hidden', display: 'flex', whiteSpace: 'pre-line' }}>{text}</div> - <div style={{ color: '#1A6FB8', marginTop: '4px' }} onClick={() => setModeDetail(true)}>...查看更多</div> - </div> - ) - - }, - { - title: '操作', - dataIndex: 'perClassName', - key: 'perClassName', - width: 53, - render: (text) => ( - <div style={{ color: '#1A6FB8' }}>使用</div> - ) - }, - // 更多列配置... - ]; - - const fakeData1 = [ - { - id: 1, - caseNo: 'A20230101', - judicNo: '公共模板', - perClassName: '鉴于本事项的重要性及紧迫性,现要求你尽快启动调解程序[事项1......][事项2......]', - inputUserName: '尽快启动调解程序督办', - mediateUserName: '2024-7-12 12:00', - judgeName: '王五', - mediator: '赵六', - handlerUserName: '钱七', - returnUserName: '孙八', - expireTime: '2023-08-10T08:00:00.000Z', - processName: '进行中', - otherMediator: '周九', - canalName: '网络', - judicResult: '通过', - assistName: '吴十', - mediTypeName: '民事调解', - serieStatus: '1', // 1 表示非系列案,2 表示系列案 - // 更多字段... - }, - { - id: 2, - caseNo: 'A20230101', - judicNo: '个人模板', - perClassName: '鉴于本事项的重要性及紧迫性,现要求你尽快启动调解程序[事项1......][事项2......]', - inputUserName: '尽快启动调解程序督办', - mediateUserName: '2024-7-12 12:00', - judgeName: '王五', - mediator: '赵六', - handlerUserName: '钱七', - returnUserName: '孙八', - expireTime: '2023-08-10T08:00:00.000Z', - processName: '进行中', - otherMediator: '周九', - canalName: '网络', - judicResult: '通过', - assistName: '吴十', - mediTypeName: '民事调解', - serieStatus: '1', // 1 表示非系列案,2 表示系列案 - // 更多字段... - }, - - // 更多数据... - ]; const content = selectedTab1 === '1' @@ -169,9 +69,7 @@ setSupervising(!supervising) } - const handleUse = () => { - setModeDetail(!modeDetail) - } + @@ -185,7 +83,7 @@ value={radioValue} onChange={(v) => setRadioValue(v)} > - <Radio value='1' style={{ flex: 1, textAlign: 'center' }}>未回复</Radio> + <Radio value='1' style={{ flex: 1, textAlign: 'center' }} >未回复</Radio> <Radio value='2' style={{ flex: 1, textAlign: 'center' }}>已回复</Radio> </RadioGroup> { @@ -204,12 +102,12 @@ <div>张三丰</div> </div> <div className='Supervising-item'> - <div className='Supervising-item-title'>督办内容:</div> - <div>该纠纷事件目前群众较为关注,现要求相关部门即刻启动纠纷化解工作。请负责同事务必于本周内制定出具体解决方案,并确保与当事人进行有效沟通。请各位积极响应,高效协作,争取在最短时间内妥善处理完毕。</div> + <div className='Supervising-item-title' style={{ width: '80px' }}>督办内容:</div> + <div style={{ flex: 1 }}>该纠纷事件目前群众较为关注,现要求相关部门即刻启动纠纷化解工作。请负责同事务必于本周内制定出具体解决方案,并确保与当事人进行有效沟通。请各位积极响应,高效协作,争取在最短时间内妥善处理完毕。</div> </div> <div className='Supervising-item'> <div className='Supervising-item-title'>督办附件:</div> - <img src={link} alt='' style={{ width: '16px' }} /> + <img src={link} alt='' className='Supervising-item-file' /> <div>2</div> </div> <Button className='Supervising-btn' size='small' type='outline' onClick={() => handleResponse()}>回复</Button> @@ -227,8 +125,8 @@ <div>张三丰</div> </div> <div className='Supervising-item'> - <div className='Supervising-item-title'>督办内容:</div> - <div>该纠纷事件目前群众较为关注,现要求相关部门即刻启动纠纷化解工作。请负责同事务必于本周内制定出具体解决方案,并确保与当事人进行有效沟通。请各位积极响应,高效协作,争取在最短时间内妥善处理完毕。</div> + <div className='Supervising-item-title' style={{ width: '80px' }}>督办内容:</div> + <div style={{ flex: 1 }}>该纠纷事件目前群众较为关注,现要求相关部门即刻启动纠纷化解工作。请负责同事务必于本周内制定出具体解决方案,并确保与当事人进行有效沟通。请各位积极响应,高效协作,争取在最短时间内妥善处理完毕。</div> </div> <div className='Supervising-item'> <div className='Supervising-item-title'>督办附件:</div> @@ -263,7 +161,7 @@ </Col> <Col span={24}> <div className="title-text">督办附件</div> - <img src={link} alt="" className="title-file" />广东好又多贸易有限公司营业执照副本.pdf + <img src={link} alt="" style={{ width: '14px', height: '14px' }} />广东好又多贸易有限公司营业执照副本.pdf </Col> </Row> <Col span={24} style={{ marginBottom: '8px' }}> @@ -334,30 +232,7 @@ </Form> </div> </Modal> - <Modal visible={mode} onCancel={() => SetMode(false)} title='选择模板' centered footer={null}> - <TableView - columns={fakeColumns} - dataSource={fakeData1} - size="small" - rowKey="id" - bordered={true} - style={{}} - /> - </Modal> - <Modal simple={true} visible={modeDetail} cancelText='关闭' okText='使用' onOk={() => handleUse()} onCancel={() => setModeDetail(!modeDetail)} style={{ width: '400px', borderRadius: ' 4px' }}> - <div className='modal'> - <div className='modal-mark'>模板</div> - <div className='modal-title'>尽快启动调解程序督办</div> - </div> - <div style={{ marginBottom: '-16px' }}> - 鉴于本事项的重要性及紧迫性,现要求你尽快启动调解程序,并确保案件能够得到及时有效的处理。请您务必于本周内完成以下 - 事项:<br /> - [事项1......]<br /> - [事项2......]<br /> - [事项3......]<br /> - 请确保在事项办理的过程中,遵循公平、公正的原则,并积极促进双方达成共识。 - </div> - </Modal> + <ModeSelect onCancel={() => SetMode(false)} mode={mode} /> <Modal visible={detail} onCancel={() => setDetail(false)} title='督办回复详情' centered footer={null}> <Col span={24} style={{ marginBottom: '8px' }}> <Space size='small'> @@ -382,7 +257,7 @@ <Col span={24}> <div className="title-text">督办附件</div> <div style={{ display: 'flex' }}> - <img src={link} alt="" className="title-file" /> + <img src={link} alt="" style={{ width: '14px', height: '14px' }} /> <div style={{ color: '#1A6FB8' }}>广东好又多贸易有限公司营业执照副本.pdf</div> </div> -- Gitblit v1.8.0