Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh ...

liuwh

2024-09-10 86df8c2c269721e5ac76b41e740fb0647eda1f27

 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-06 11:03:29
 * @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: '70px' }}>督办内容：</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>
@@ -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'>