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

liuwh

2024-09-10 7bec45c3da050deda516f96b0a89f94b06814ae9

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

 gz-customerSystem/src/api/appUrl.js

@@ -2,29 +2,29 @@
 * @Company: hugeInfo
 * @Author: ldh
 * @Date: 2022-02-16 11:25:57
 * @LastEditTime: 2024-09-10 16:53:01
 * @LastEditTime: 2024-09-10 16:55:40
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description: api地址
 */
export const debug = {
    // web服务
    // baseUrl: 'http://gz.hugeinfo.com.cn',
    // baseUrl: "http://192.168.3.108:9002",
    baseUrl: 'http://6dycet.natappfree.cc',
  // web服务
  // baseUrl: 'http://gz.hugeinfo.com.cn',
  baseUrl: "http://6dycet.natappfree.cc",
  // baseUrl: 'http://mdqgnh.natappfree.cc',

    // 附件服务
    // fileUrl: "http://192.168.3.108:9002",
    // fileUrl: 'http://gz.hugeinfo.com.cn',
    fileUrl: 'http://6dycet.natappfree.cc',
    // 文件查看url 后面接附件编号
    fileShowUrl: '/dyh-sys/api/v1/fileInfo/show/',
    // 文件下载url 后面接附件编号
    fileDownUrl: '/dyh-sys/api/v1/fileInfo/down/',
    // 在线文档编辑链接
    fileDocx: '/word/docDraft/showWord',
    // 签章的文档编辑链接
    fileDocx2: '/InsertSeal/Word/AddSeal1/Word1',
  // 附件服务
  fileUrl: "http://6dycet.natappfree.cc",
  // fileUrl: 'http://gz.hugeinfo.com.cn',

  // 文件查看url 后面接附件编号
  fileShowUrl: "/dyh-sys/api/v1/fileInfo/show/",
  // 文件下载url 后面接附件编号
  fileDownUrl: "/dyh-sys/api/v1/fileInfo/down/",
  // 在线文档编辑链接
  fileDocx: "/word/docDraft/showWord",
  // 签章的文档编辑链接
  fileDocx2: "/InsertSeal/Word/AddSeal1/Word1",

    // 不同服务接口type
    mediate: 'dyh-mediate', // dyh-mediate

 gz-customerSystem/src/router/router.js

@@ -2,8 +2,8 @@
 * @Company: hugeInfo
 * @Author: ldh
 * @Date: 2022-03-28 11:22:41
 * @LastEditTime: 2024-09-10 10:14:40
 * @LastEditors: lwh
 * @LastEditTime: 2024-09-10 14:15:11
 * @LastEditors: dminyi 1301963064@qq.com
 * @Version: 1.0.0
 * @Description: 路由
 */

 gz-customerSystem/src/views/logAndSign/index.jsx

@@ -113,7 +113,7 @@
                const res = await switchRoleApi({ roleCode: ctUseroleList[0]?.roleCode });
                if (res.type) {
                    $$.setSessionStorage('customerSystemToken', res.data);
                    navigate('/mediate/workbench');
                    navigate('/mediate/visit/visitWorkBench');
                }
            } else {
                returnLogStatus(true);
@@ -205,7 +205,7 @@
        global.setSpinning(false);
        if (res.type) {
            $$.setSessionStorage('customerSystemToken', res.data);
            navigate('/mediate/workbench');
            navigate('/mediate/visit/visitWorkBench');
        }
    }


 gz-customerSystem/src/views/register/closingReview/component/ReviewExamine.jsx

@@ -6,6 +6,7 @@
import { Scrollbars } from "react-custom-scrollbars";
import ReviewProgress from './ReviewProgress';
import * as $$ from '@/utils/utility';
import { useNavigate } from 'react-router-dom';

const RadioGroup = Radio.Group;
const FormItem = Form.Item;
@@ -33,6 +34,7 @@
}

export default function ReviewExamine(props) {
  const navigate = useNavigate();
  const formRef = useRef();
  const [result, setResult] = useState()
  const [infoData, setInfoData] = useState({});
@@ -109,7 +111,7 @@
    const res = await submit(data)
    if (res.type) {
      $$.infoSuccess({ content: '提交成功！' });
    }
      navigate(`/mediate/visit/visitWorkBench`)    }
  }

  //删除文件

 gz-customerSystem/src/views/register/closingReview/index.jsx

@@ -12,8 +12,8 @@

const TabPane = Tabs.TabPane;

function getTabButton(data) {
    return $$.ax.request({ url: `caseTask/getTabButton`, type: 'get', service: 'mediate', data });
function getTabButton(caseTaskId) {
    return $$.ax.request({ url: `caseTask/getTabButton?caseTaskId=${caseTaskId}`, type: 'get', service: 'mediate' });
}

const myTab = [
@@ -34,6 +34,8 @@
    },
]
const ClosingReview = () => {
    const caseId = $$.getQueryString('caseId')
    const caseTaskId = $$.getQueryString('caseTaskId')
    const routeData = useParams();
    const [authorData, setAuthorData] = useState({});
    const [tabsList, setTabsList] = useState([]);
@@ -41,13 +43,12 @@

    useEffect(() => {
        getAuthor()
        console.log(caseId,caseTaskId,'caseId','caseTaskId')
    }, [])

    //获取权限tab和按钮权限
    const getAuthor = async () => {
        const res = await getTabButton({
            caseTaskId: routeData.caseTaskId
        })
        const res = await getTabButton(caseTaskId)
        if (res.type) {
            const { tabList } = res.data
            setAuthorData(res.data)
@@ -70,13 +71,13 @@
    //根据id定义组件
    const getTypeDom = (key) => {
        if (key === 'dslxq' || key === 'sxxq') {
            return <EventFlow authorData={authorData} caseId={routeData.caseId} />
            return <EventFlow authorData={authorData} caseId={caseId} />
        }
        if (key === 'sqjl') {
            return <ApplyInfo />
        }
        if (key === 'jash') {
            return <ReviewExamine caseTaskId={routeData.caseTaskId} caseId={routeData.caseId} />
            return <ReviewExamine caseTaskId={caseTaskId} caseId={caseId} />
        }
    }


 gz-customerSystem/src/views/register/eventFlow/component/AssignedModel.jsx

@@ -60,7 +60,7 @@

  //交办请求
  const handleAssign = async (data) => {
    const res = await assign(data)
    const res = await assign({ ...data, caseTaskId: props.caseTaskId })
    if (res.type) {
      $$.infoSuccess({ content: '交办成功！' });
      props.onCancel()

 gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx

@@ -10,6 +10,7 @@
import MatterDetail from '../../matterDetail';
import SupervisingView from "../../matterDetail/Supervising";
import * as $$ from '@/utils/utility';
import { useNavigate } from 'react-router-dom';

const TabPane = Tabs.TabPane;
const Step = Steps.Step;
@@ -76,6 +77,7 @@
    },
  ]
  const scrollRef = useRef(null)
  const navigate = useNavigate();
  const [backVisible, setBackVisible] = useState(false)
  const [height, setHeight] = useState(500)
  const [escalationVisible, setEscalationVisible] = useState(false)
@@ -212,7 +214,7 @@
          autoFocus={false}
          focusLock={false}
        >
          <AssignedModel caseId={props.caseId} onCancel={() => { setAssignedVisible(false) }} />
          <AssignedModel caseId={props.caseId} caseTaskId={props.caseTaskId} onCancel={() => { setAssignedVisible(false) }} />
        </Modal>
        <div className="dataSync-excel">
          <Space size="large" style={{ margin: '4px 14px' }}>
@@ -220,7 +222,7 @@
              const { label, key, click, ...rest } = item;
              return <Button key={key} onClick={click} {...rest} >{label}</Button>
            })}
            <Button type='secondary' >返回上级页面</Button>
            <Button type='secondary'  onClick={() => navigate(-1)}>返回上级页面</Button>
          </Space>
        </div>
      </div>

 gz-customerSystem/src/views/register/eventFlow/index.jsx

@@ -1,10 +1,10 @@
import React, { useState, useRef, Fragment, useEffect } from "react";
import React, { useState, useEffect } from "react";
import NewPage from '@/components/NewPage';
import * as $$ from '@/utils/utility';
import "@arco-themes/react-gzzz/css/arco.css";
import '../index.less';
import { Steps, Tabs } from '@arco-design/web-react';
import { examine, Matter, transfer, applyRecord } from '@/assets/images'
import { examine, Matter, applyRecord } from '@/assets/images'
import EventFlow from './component/EventFlow';
import Examine from "./component/Examine";
import ApplyInfo from "../matterDetail/ApplyInfo";
@@ -59,7 +59,7 @@

    //获取权限tab和按钮权限
    const getAuthor = async () => {
        console.log(routeData, 'routeData')
        console.log(caseTaskId, caseId)
        const res = await getTabButton({
            caseTaskId: caseTaskId
        })

 gz-customerSystem/src/views/register/handleFeedback/component/CaseResult.jsx

@@ -2,7 +2,7 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-09-02 14:49:13
 * @LastEditors: dminyi 1301963064@qq.com
 * @LastEditTime: 2024-09-09 22:14:40
 * @LastEditTime: 2024-09-10 15:46:08
 * @FilePath: \gzDyh\gz-customerSystem\src\views\register\handleFeedback\component\CaseResult.jsx
 * @Description: 结案申请
 */
@@ -26,7 +26,7 @@



const CaseResult = ({ visible = false, handleOnCancel, caseResultId, caseId ,caseTaskId}) => {
const CaseResult = ({ visible = false, handleOnCancel, caseResultId, caseId, caseTaskId }) => {
  const formRef = useRef();
  const formRefWrite = useRef();
  const failRef = useRef();
@@ -110,10 +110,22 @@
  }

  const windupApply = async (submitData) => {
    console.log(
      {
        mediResultName: selectedTab === '1' ? '化解成功' : '化解不成功',
        agreeType: value === 1 ? '口头协议' : '书面协议',
        caseTaskId: caseTaskId,
        caseId: caseId,
        caseResultId: caseResultId,
        ...submitData
      },'windupApplyData'
    )
    const res = await windupApplyApi({
      mediResultName: selectedTab === '1' ? '化解成功' : '化解不成功',
      agreeType: value === 1 ? '口头协议' : '书面协议',
      caseTaskId: caseTaskId,
      caseId:caseId,
      caseResultId:caseResultId,
      caseId: caseId,
      caseResultId: caseResultId,
      ...submitData
    })
    if (res.type) {

 gz-customerSystem/src/views/register/handleFeedback/component/handle.jsx

@@ -15,6 +15,7 @@
import HandleRecord from '../../matterDetail/HandleRecord';
import SupervisingView from '../../matterDetail/Supervising'
import UniteHandle from '../../matterDetail/UniteHandle';
import { useNavigate } from 'react-router-dom';


const Option = Select.Option;
@@ -113,7 +114,7 @@

const Handle = ({ authorData, caseTaskId, caseId }) => {
  const formRef = useRef();
  const routeData = useParams();
  const navigate = useNavigate();
  const [selectedTab, setSelectedTab] = useState('1'); // 默认选中第一个 tab
  const [selectedTab1, setSelectedTab1] = useState('1'); // 默认选中第一个 tab
  const [wantUser, setWantUser] = useState({});
@@ -131,7 +132,7 @@
  const [id, setId] = useState('');
  const [uniteHandleId, setUniteHandleId] = useState('');
  const [caseResultId, setCaseResultId] = useState('');
  const [managerName,setManagerName] = useState('')
  const [managerName, setManagerName] = useState('')


  const tabs = [
@@ -396,7 +397,7 @@
                  {wantUser.wantUserId ?
                    <WantUserTag name={wantUser.wantUserName} onClose={() => setWantUser({ wantUserId: null, wantUserName: null })} />
                    :
                    caseId ?
                    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>
@@ -453,7 +454,7 @@
                          >
                            <ArcoUpload
                              params={{
                                action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${'24083010062110001'}&ownerId=${id}&ownerType=${'22_00018-501'}`,
                                action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${caseId}&ownerId=${caseId}&ownerType=${'22_00018-501'}`,
                              }}
                              field='file1'
                              // handleChangeFile={handleChangeFile}
@@ -480,7 +481,7 @@
              <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'>
@@ -662,7 +663,7 @@
          </Form>
        </Modal>
        <UniteHandle id={uniteHandleId} visible={uniteHandleView} handleOnCancel={() => setUniteHandleView(false)} />
        <CaseResult visible={caseResult} handleOnCancel={() => SetCaseResult(false)} caseResultId={caseResultId} caseId={caseId} caseTaskId={caseTaskId}/>
        <CaseResult visible={caseResult} handleOnCancel={() => SetCaseResult(false)} caseResultId={caseResultId} caseId={caseId} caseTaskId={caseTaskId} />

      </div>
    </>

 gz-customerSystem/src/views/register/handleFeedback/index.jsx

@@ -3,7 +3,7 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-08-09 09:59:43
 * @LastEditors: dminyi 1301963064@qq.com
 * @LastEditTime: 2024-09-10 09:16:47
 * @LastEditTime: 2024-09-10 16:22:30
 * @FilePath: \gzDyh\gz-customerSystem\src\views\basicInformation\organization\index.jsx
 * @Description: 来访登记
 * 
@@ -40,8 +40,8 @@



function getTabButton(data) {
    return $$.ax.request({ url: `caseTask/getTabButton`, type: 'get', service: 'mediate', data });
function getTabButton(caseTaskId) {
    return $$.ax.request({ url: `caseTask/getTabButton?caseTaskId=` + caseTaskId, type: 'get', service: 'mediate' });
}


@@ -108,9 +108,7 @@


    const getAuthor = async () => {
        const res = await getTabButton({
            caseTaskId: caseTaskId
        })
        const res = await getTabButton(caseTaskId)
        if (res.type) {
            const { tabList } = res.data
            console.log(tabList, 'tabList1')
@@ -180,11 +178,11 @@
                                </div>
                            }
                            {tabsActive === 'sxxq' &&
                                <MatterDetail hasApplet={true} hasEditBtn={true} authorData={authorData} />
                                <MatterDetail hasApplet={true} hasEditBtn={true} authorData={authorData} caseId={caseId} />
                            }
                            {
                                tabsActive === 'sxbl' && <Typography.Paragraph style={style}>
                                    <Handle authorData={authorData} caseId={caseId} caseTaskId={caseTaskId}/>
                                    <Handle authorData={authorData} caseId={caseId} caseTaskId={caseTaskId} />
                                </Typography.Paragraph>
                            }
                            {

 gz-customerSystem/src/views/register/index.jsx

@@ -2,7 +2,7 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-09-08 15:14:12
 * @LastEditors: dminyi 1301963064@qq.com
 * @LastEditTime: 2024-09-10 10:17:00
 * @LastEditTime: 2024-09-10 16:54:28
 * @FilePath: \gzDyh\gz-customerSystem\src\views\register\index.jsx
 * @Description: 工作台
 */
@@ -14,11 +14,12 @@
import { Tabs, Typography, Radio } from '@arco-design/web-react';
import * as $$ from '@/utils/utility';


const TabPane = Tabs.TabPane;

function pageMyTaskBlApi(data) {
  return $$.ax.request({ url: `caseTask/pageMyTaskBl`, type: 'get', service: 'mediate', data });
}
// function pageMyTaskBlApi(data) {
//   return $$.ax.request({ url: `caseTask/pageMyTaskBl`, type: 'get', service: 'mediate', data });
// }

function getCountListApi(data) {
  return $$.ax.request({ url: `caseTask/getCountList`, type: 'get', service: 'mediate', data });
@@ -41,6 +42,17 @@
//办理中
function pageMyTaskBlzApi(data) {
  return $$.ax.request({ url: `caseTask/pageMyTaskBlz?page=1&size=10&sortType=1&sortColmn=1&status=1`, type: 'get', service: 'mediate', data });
}

//待审核
function pageMyTaskShApi(type) {
  return $$.ax.request({ url: `caseTask/pageMyTaskSh?page=1&size=10&sortType=1&status=0&type=` + type, type: 'get', service: 'mediate' });
}


//待审核
function pageMyTaskBlApi(type) {
  return $$.ax.request({ url: `caseTask/pageMyTaskBl?page=1&size=10&sortType=1&sortColmn=1&status=` + type, type: 'get', service: 'mediate' });
}

//签收
@@ -81,7 +93,7 @@
      key: '4',
      label: '办理中',
      bgColor: '#E6FFFB',
      num: `${CountList?.waitReview || '0'}`,
      num: `${CountList?.processing || '0'}`,
      img: tab4

    },
@@ -89,7 +101,7 @@
      key: '5',
      label: '待审核',
      bgColor: '#E8F7FF',
      num: `${CountList?.supervise || '0'}`,
      num: `${CountList?.waitReview || '0'}`,
      img: tab5

    },
@@ -97,7 +109,7 @@
      key: '6',
      label: '督办',
      bgColor: '#FFF7E6',
      num: `${CountList?.processing || '0'}`,
      num: `${CountList?.supervise || '0'}`,
      img: tab6

    },
@@ -485,8 +497,8 @@
      width: 180,
      render: (text, record) => (
        <Space style={{ color: '#1A6FB8' }}>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div>
        </Space>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div>
          </Space>
      ),
    },
  ];
@@ -541,7 +553,7 @@
      width: 180,
      render: (text, record) => (
        <Space style={{ color: '#1A6FB8' }}>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => handleSign(record.caseId, record.ownerId)}>签收</div>
        </Space>
      ),
@@ -598,7 +610,7 @@
      width: 180,
      render: (text, record) => (
        <Space style={{ color: '#1A6FB8' }}>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div>签收</div>
        </Space>
      ),
@@ -654,7 +666,7 @@
      width: 180,
      render: (text, record) => (
        <Space style={{ color: '#1A6FB8' }}>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>处理</div>
        </Space>
      ),
@@ -710,7 +722,7 @@
      width: 180,
      render: (text, record) => (
        <Space style={{ color: '#1A6FB8' }}>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div>
        </Space>
      ),
@@ -785,7 +797,7 @@
      width: 180,
      render: (text, record) => (
        <Space>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer', color: '#1A6FB8' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/handleFeedback?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer', color: '#1A6FB8' }}>处理</div>
        </Space>
      ),
@@ -848,7 +860,7 @@
      width: 180,
      render: (text, record) => (
        <Space>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div>
          {/* <div onClick={() => navigate(`/mediate/visit/handleFeedback?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div> */}
          {(direction === '回退审核' || direction === '上报审核') &&
            <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div>
@@ -932,6 +944,76 @@
    },
  ])

  //结案申请
  const caseResultApply = [
    {
      title: '结案申请时间',
      dataIndex: 'turnaroundTime',
      key: 'turnaroundTime',
      width: 100,
    },
    {
      title: '事项等级',
      dataIndex: 'caseGrade',
      key: 'caseGrade',
      width: 180,
    },
    {
      title: '事项来源',
      dataIndex: 'caseSource',
      key: 'caseSource',
      width: 180,
    },
    {
      title: '事项类型',
      dataIndex: 'caseType',
      key: 'caseType',
      width: 180,
    },
    {
      title: '承办部门',
      dataIndex: 'organizingUnit',
      key: 'organizingUnit',
      width: 180,
    },
    {
      title: '配合部门',
      dataIndex: 'cooperatingUnit',
      key: 'cooperatingUnit',
      width: 180,
    },
    {
      title: '申请方',
      dataIndex: 'plaintiffs',
      key: 'plaintiffs',
      width: 180,
    },
    {
      title: '化解结果',
      dataIndex: 'mediResult',
      key: 'mediResult',
      width: 180,
    },
    {
      title: '被申请方',
      dataIndex: 'defendants',
      key: 'defendants',
      width: 180,
    },
    {
      title: '操作',
      dataIndex: 'actions',
      key: 'actions',
      width: 180,
      render: (text, record) => (
        <Space style={{ color: '#1A6FB8' }}>
          <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div>
          <div onClick={() => navigate(`/mediate/visit/closingReview?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>处理</div>
        </Space>
      ),
    },
  ];

  const sign = async (caseId, ownerId) => {
    const res = await signApi({ caseId: caseId, caseTaskId: ownerId })
    if (res.type) {
@@ -976,7 +1058,17 @@
        setFakeData1(res.data?.content)
      }
    }
    if (type === '5') {
    }
  }

  const handleSh = async (e) => {
    console.log(direction, 'direction')
    const res = await pageMyTaskShApi(e === '回退审核' ? 1 : e === '上报审核' ? 2 : e === '结案申请审核' ? 3 : e === '联合处置审核' ? 4 : null)
    if (res.type) {
      setColumnType(caseResultApply)
      setFakeData1(res.data?.content)
    }
  }

  const handleColumnType = (type) => {
@@ -991,10 +1083,22 @@
      if (tabActivekey === '3') {
        setColumnType(fakeColumns2Info)
      }
      if (tabActivekey === '4') {
        setColumnType(caseResultApply)
        pageMyTaskBl('1')
      }
    }
    if (type === '1') {
      if (tabActivekey === '1') {
        setColumnType(fakeColumns3)
      }
    }

    if (type === '3') {
      if (tabActivekey === '4') {
        setColumnType(backColumn)
        pageMyTaskBl('2')

      }
    }

@@ -1036,11 +1140,10 @@
    }
  }

  const pageMyTaskBl = async () => {
    const res = await pageMyTaskBlApi({ page: 1, size: 10, timeStart: '', timeEnd: '', partyName: '', sortType: '', sortColmn: '' })
  const pageMyTaskBl = async (type) => {
    const res = await pageMyTaskBlApi(type)
    if (res.type) {
      console.log(res.data, 'res.data')
      // setColumn(res.data)
      setFakeData1(res.data?.content)
    }
  }

@@ -1111,7 +1214,7 @@
                  type='button'
                  name='direction'
                  value={direction}
                  onChange={(e) => setDirection(e)}
                  onChange={(e) => { setDirection(e); handleSh(e) }}
                  style={{ marginBottom: 16 }}
                  options={['回退审核', '上报审核', '结案申请审核', '联合处置审核']}
                ></Radio.Group>
@@ -1166,6 +1269,17 @@
              }
            >
              <Typography.Paragraph>
                <TableView
                  columns={columnType}
                  dataSource={fakeData1}
                  size="small"
                  rowKey="id"
                  bordered={true}
                  // style={{ marginBottom: '65px', marginTop: '-16px' }}
                  rowSelection={{
                    type: 'Checkbox'
                  }}
                />
              </Typography.Paragraph>
            </TabPane>
          }

 gz-customerSystem/src/views/register/index.less

@@ -88,7 +88,7 @@
        width: 14px;
        height: 14px;
        margin-right: 4px;
        margin-top: 4px;
        margin-top: -2px;
    }

    &-register {
@@ -141,7 +141,7 @@
        align-items: center;
        justify-content: space-between;
        box-shadow: 0px -1px 2px 0px rgba(0, 0, 0, 0.25);
        z-index: 1;
        z-index: 2;
    }

    &-hasTabPage {

 gz-customerSystem/src/views/register/matterDetail/FileTable.jsx

@@ -342,7 +342,6 @@
        size="small"
        rowKey="ownerType"
        bordered={true}
        style={{ marginBottom: '65px' }}
        scroll={{ x: 1300 }}
      />
      <Modal

 gz-customerSystem/src/views/register/matterDetail/RateModule.jsx

New file
@@ -0,0 +1,41 @@
import React, { Fragment } from 'react'
import { Row, Col, Space } from 'antd';
import { Rate } from '@arco-design/web-react';

export default function RateModule(props) {
  return (
    <Fragment>
      <Col span={24} style={{ display: 'flex', alignItems: 'center', margin: '12px 0px 4px 0px' }}>
        <Space size='small'>
          <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>当事人评价</h4>
        </Space>
      </Col>
      <Row gutter={[16, 16]}>
        <Col span={8}>
          <div className="title">
            <div className="title-text">评价等级</div>
          </div>
          <div style={{ display: 'flex' }}><Rate value={props.grade?.evaluateGrade} disabled /></div>
        </Col>
        <Col span={8}>
          <div className="title">
            <div className="title-text">评价时间</div>
          </div>
          <div>{props.grade?.createTime || '-'}</div>
        </Col>
        <Col span={8}>
          <div className="title">
            <div className="title-text">评价人</div>
          </div>
          <div>{props.grade?.evaluateUserName || '-'}</div>
        </Col>
        <Col span={12}>
          <div className="title">
            <div className="title-text">评语</div>
          </div>
          <div>{props.grade?.evaluateContent}</div>
        </Col>
      </Row>
    </Fragment>
  )
}

 gz-customerSystem/src/views/register/matterDetail/RegisInfoModule.jsx

New file
@@ -0,0 +1,38 @@
import React, { Fragment } from 'react';
import { Row, Col, Space } from 'antd';
import { register } from '@/assets/images';

export default function RegisInfoModule(props) {
  return (
    <Fragment>
      <Col span={24} style={{ display: 'flex', alignItems: 'center', margin: '12px 0px 4px 0px' }}>
        <Space size='small'>
          <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>登记信息</h4>
        </Space>
      </Col>
      <Row gutter={[16, 16]} >
        <Col span={8}>
          <div className="title">
            <div className="title-text">登记机构</div>
          </div>
          <div>{props.caseInfo?.inputUnitName || '-'}</div>
        </Col>
        <Col span={8}>
          <div className="title">
            <div className="title-text">登记人</div>
          </div>
          <div>
            {props.caseInfo?.inputUserName}
            <img src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '-4px' }} />
          </div>
        </Col>
        <Col span={8}>
          <div className="title">
            <div className="title-text">登记时间</div>
          </div>
          <div>{props.caseInfo?.visitTime || '-'}</div>
        </Col>
      </Row>
    </Fragment>
  )
}

 gz-customerSystem/src/views/register/matterDetail/fileMessage.jsx

@@ -1,18 +1,18 @@
import React, { useEffect, useState } from 'react';
import NewPage from '@/components/NewPage';
import { Row, Col, Space } from 'antd';
import { Steps, Tabs, Typography, Rate, Button } from '@arco-design/web-react';
import { apply,floating } from '@/assets/images';
import { Steps, Tabs, Button, Badge } from '@arco-design/web-react';
import { apply, floating } from '@/assets/images';
import { result } from '@/assets/images/icon';
import * as $$ from '@/utils/utility';
import TableView from '../../../components/TableView';
import { register, fold, down, empty, link } from '@/assets/images';
import { Space } from 'antd';
import ProgressStep from '@/components/ProgressStep/VisitStep';
import { ApplyDialog, AgentDialog, Respondent, Company } from '../visit/component/previewTable';
import ApplyInfo from './ApplyInfo';
import Preview from '../visit/preview';
import HandleRecord from './HandleRecord';
import { useParams } from 'react-router-dom';
import ApplyInfo from './ApplyInfo'

import { Scrollbars } from "react-custom-scrollbars";
import RateModule from './RateModule';
import RegisInfoModule from './RegisInfoModule';
import SupervisingView from "./Supervising";

const Step = Steps.Step;
const TabPane = Tabs.TabPane;
@@ -33,19 +33,18 @@
  return $$.ax.request({ url: `caseFeedback/listFeedback?id=` + id, type: 'get', service: 'mediate' });
}

function getListCaseFlow(data) {
  return $$.ax.request({ url: `caseTask/listCaseFlow`, type: 'get', service: 'mediate', data });
function getListCaseFlow(caseId) {
  return $$.ax.request({ url: `caseTask/listCaseFlow?caseId=` + caseId, type: 'get', service: 'mediate' });
}


const FileMessage = (props) => {
    const routeData = useParams();
  const caseTaskId = $$.getQueryString('caseTaskId')
  const caseId = $$.getQueryString('caseId')
  const [tabsActive, setTabsActive] = useState('1');
  const [current, setCurrent] = useState(7);
  const [grade, setGrade] = useState(0);
  const [grade, setGrade] = useState(null);
  const [caseInfo, setCaseInfo] = useState({})
  const [TransactResult, setTransactResult] = useState({})
  const [filesCheck, setFilesCheck] = useState(false);
  const [tabsList, setTabList] = useState([
    {
      img: result,
@@ -64,88 +63,42 @@
      key: '3',
    },
  ])
  const [selectedTab, setSelectedTab] = useState('1'); // 默认选中第一个 tab
  const [list, setList] = useState([])
  const [progressData, setProgressData] = useState({})
  const [progressData, setProgressData] = useState({});

  useEffect(() => {
    console.log(caseId, 'caseId')
    getByCaseId(caseId);
    getTransactResult(caseId);
    getCaseInfo(caseId);
    listFeedback(caseId);
    getData(caseId)
  }, [])

  const tabs = [
    { index: '1', label: '承办部门' },
    { index: '2', label: '配合部门' },
  ];
  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: '李晓明'
    },
  ];

  const handleTabChange = (newTabIndex) => {
    setSelectedTab(newTabIndex);
  };

  const getTransactResult = async () => {
    const res = await getTransactResultApi('24083010062110001')
  const getTransactResult = async (id) => {
    const res = await getTransactResultApi(id)
    if (res.type) {
      setTransactResult({ ...res.data, fileName: res.data.fileInfoBaseDTOList.map(item => item.trueName) })
    }
  }

  const getByCaseId = async () => {
    const res = await getByCaseIdApi('24083010062110001')
    setGrade(res.data)
    console.log(res, 'resrs')
  const getByCaseId = async (id) => {
    const res = await getByCaseIdApi(id)
    if (res.type) {
      setGrade(res.data)
    }
  }

  const getCaseInfo = async () => {
    const res = await getCaseInfoApi('24083010062110001')
  const getCaseInfo = async (id) => {
    const res = await getCaseInfoApi(id)
    if (res.type) {
      setCaseInfo(res.data)
      const { agentList, personList, ...rest } = res.data
      const parList = agentList.concat(personList)
      const obj = {
        ...rest,
        fakeData: parList,
      }
      setCaseInfo(obj)
    }
  }

@@ -157,594 +110,116 @@
    }
  }

  const getData = async () => {
    const res = await getListCaseFlow({
      caseId: routeData.caseId
    })
  const getData = async (id) => {
    const res = await getListCaseFlow(id)
    if (res.type) {
      setProgressData(res.data)
    }
  }

  const fakeColumns = [
    {
      title: '序号',
      dataIndex: 'caseNo',
      key: 'caseNo',
      width: 100,
      render: (text, record, index) => <span>{index + 1}</span>,
    },
    {
      title: '材料类型',
      dataIndex: 'judicNo',
      key: 'judicNo',
      width: 60,

    },
    {
      title: '材料数量',
      dataIndex: 'inputUserName',
      key: 'perClassName',
      width: 180,
      render: (text) => (
        <>
          {text}份
        </>
      )

    },
    {
      title: '最新上传时间',
      dataIndex: 'perClassName',
      key: 'perClassName',
      width: 180,

    },
    {
      title: '操作',
      dataIndex: 'perClassName',
      key: 'perClassName',
      width: 200,
      render: (text) => (
        <div style={{ display: 'flex', color: '#1A6FB8', gap: '16px' }}>
          <div onClick={() => setFilesCheck(true)}>查看</div>
          <div>下载</div>
        </div>
      )
    },
    // 更多列配置...
  ];
  const fakeData1 = [
    {
      id: 1,
      caseNo: 'A20230101',
      judicNo: '申请材料',
      perClassName: '李晓明的纠纷化解申请表、身份证...',
      inputUserName: '0',
      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: '李晓明的纠纷化解申请表、身份证...',
      inputUserName: '0',
      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 [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) => {
    setRecords(records.map(record => {
      if (record.id === id) {
        return {
          ...record,
          showView: !record.showView,
        };
      }
      return record;
    }));
  };


  useEffect(() => {
    getByCaseId();
    getTransactResult();
    getCaseInfo();
    listFeedback('24083010062110001');
    getData()
  }, [])


  const applyData = caseInfo?.personList?.filter(item => item.perTypeName === "申请方当事人" && item.perClassName === "自然人");
  const agentData = caseInfo?.personList?.filter(item => item.perTypeName === "申请方代理人");
  const company = caseInfo?.personList?.filter(item => item.perTypeName === "申请方当事人" && item.perClassName === "非法人组织");
  const respondentData = caseInfo?.personList?.filter(item => item.perTypeName === "申请方当事人" && item.perClassName === "法人");

  const applyData1 = caseInfo?.personList?.filter(item => item.perTypeName === "被申请方当事人" && item.perClassName === "自然人");
  const agentData1 = caseInfo?.personList?.filter(item => item.perTypeName === "被申请方代理人");
  const company1 = caseInfo?.personList?.filter(item => item.perTypeName === "被申请方当事人" && item.perClassName === "非法人组织");
  const respondentData1 = caseInfo?.personList?.filter(item => item.perTypeName === "被申请方当事人" && item.perClassName === "法人");




  return (
    <>
      <NewPage
        pageHead={
          { breadcrumbData: [{ title: '工作台' }, { title: '事件中心' }], title: '详情' }
        }
    <NewPage
      pageHead={
        { breadcrumbData: [{ title: '工作台' }, { title: '事件中心' }], title: '详情' }
      }
    >
      <Tabs
        defaultActiveTab='1'
        onChange={(v) => setTabsActive(v)}
        className='myTabContent'
      >
        <Tabs
          defaultActiveTab='1'
          onChange={(v) => setTabsActive(v)}
          className='myTabContent'
        >
          {tabsList?.map(item => {
            return <TabPane
              key={item.key}
              title={
                <span>
                  {tabsActive === item.key && <img src={item.img} alt="" style={{ width: '16px', height: '16px', margin: '-5px 12px 0px 0px' }} />}
                  <span style={{ fontSize: '16px' }}>{item.label}</span>
                </span>
              }
            >
              {
                item.isNeedStep && <div style={{ backgroundColor: '#fff', margin: '12px 16px 0px 16px', paddingTop: '16px', paddingLeft: '91px' }}>
                  <Steps type='navigation' current={current}>
                    <Step title='来访登记' disabled />
                    <Step title='事件流转' disabled />
                    <Step title='办理反馈' disabled />
                    <Step title='结案审核' disabled />
                    <Step title='当事人评价' disabled />
                    <Step title='结案归档' disabled />
                  </Steps>
        {tabsList?.map(item => {
          return <TabPane
            key={item.key}
            title={
              <span>
                {tabsActive === item.key && <img src={item.img} alt="" style={{ width: '16px', height: '16px', margin: '-5px 12px 0px 0px' }} />}
                <span style={{ fontSize: '16px' }}>{item.label}</span>
              </span>
            }
          >
            {
              item.isNeedStep && <div style={{ backgroundColor: '#fff', margin: '0 16px', paddingTop: '16px', paddingLeft: '91px' }}>
                <Steps type='navigation' current={current}>
                  <Step title='来访登记' disabled />
                  <Step title='事件流转' disabled />
                  <Step title='办理反馈' disabled />
                  <Step title='结案审核' disabled />
                  <Step title='当事人评价' disabled />
                  <Step title='结案归档' disabled />
                </Steps>
              </div>
            }
            {
              tabsActive === '1' &&
              <>
                <Scrollbars style={{ height: 'calc(100vh - 291px)', marginTop: '8px' }} autoHide>
                  <div style={{ backgroundColor: '#ffff', margin: '0 16px 0px 16px', padding: '12px' }}>
                    <Preview mainId={caseId} data={caseInfo} transactResult={TransactResult} isDoc={true} />
                  </div>
                  {list.length != 0 &&
                    <div style={{ backgroundColor: '#ffff', margin: '8px 16px 0px 16px', padding: '12px' }}>
                      <Space size='small'>
                        <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>办理记录（{list.length}）</h4>
                      </Space>
                      <HandleRecord isReview={true} data={list} />
                    </div>
                  }
                  {grade &&
                    <div style={{ backgroundColor: '#ffff', margin: '8px 16px 0px 16px', padding: '12px' }}>
                      <RateModule grade={grade} />
                    </div>
                  }
                  <div style={{ backgroundColor: '#ffff', margin: '8px 16px 65px 16px', padding: '12px' }}>
                    <RegisInfoModule caseInfo={caseInfo} />
                  </div>
                </Scrollbars>
                <div className="dataSync-excel">
                  <Space size="large" style={{ margin: '4px 14px' }}>
                    <Button type='primary' >导出</Button>
                    <Button type='secondary' >返回上级页面</Button>
                  </Space>
                </div>
              }
              {tabsActive === '1' &&
                <>
                  <div style={{ backgroundColor: '#ffff', margin: '8px 8px 0px 16px', padding: '12px 18px 16px 16px', height: 'calc(100vh - 278px)', overflowY: 'scroll' }}>
                    <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}>
                      <Space size='small'>
                        <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>当事人信息</h4>
                      </Space>
                    </Col>
                    <div style={{ marginBottom: '8px' }}>申请方</div>
                    <div className="line-container" style={{ marginBottom: '20px' }}>
                      <div className="line left-line"></div>
                      <div className="line middle-line"></div>
                      <div className="line right-line"></div>
              </>
            }
            {
              tabsActive === '2' &&
              <div className='dataSync-hasTabPage' style={{ marginTop: '-8px' }}>
                <Tabs defaultActiveTab='1' >
                  <TabPane
                    key='1'
                    title={
                      <span style={{ fontSize: '15px' }}>
                        流转进度
                      </span>
                    }
                  >
                    <ProgressStep progressData={progressData} hasTab={true} />
                  </TabPane>
                  <TabPane
                    key='2'
                    title={
                      <span style={{ fontSize: '15px' }}>
                        督办信息
                        <Badge maxCount={99} count={1000} />
                      </span>
                    }
                  >
                    <div style={{ marginBottom: '20px' }}>
                      <SupervisingView id={''} />
                    </div>
                    {/* ApplyDialog 只有在 applyData 存在且不为空时才渲染 */}
                    {applyData && applyData.length > 0 ? (
                      <ApplyDialog applyDialog={applyData} />
                    ) : null}

                    {/* AgentDialog 只有在 agentData 存在且不为空时才渲染 */}
                    {agentData && agentData.length > 0 ? (
                      <AgentDialog agentDialog={agentData} />
                    ) : null}

                    {/* Respondent 只有在 respondentData 存在且不为空时才渲染 */}
                    {respondentData && respondentData.length > 0 ? (
                      <Respondent respondent={respondentData} />
                    ) : null}

                    {company && company.length > 0 ? (
                      <Company company={company} />
                    ) : null}

                    <div style={{ marginBottom: '8px' }}>被申请方</div>
                    <div className="line-container" style={{ marginBottom: '20px' }}>
                      <div className="line left-line"></div>
                      <div className="line middle-line"></div>
                      <div className="line right-line"></div>
                    </div>
                    {applyData1 && applyData1.length > 0 ? (
                      <ApplyDialog applyDialog={applyData1} />
                    ) : null}

                    {agentData1 && agentData1.length > 0 ? (
                      <AgentDialog agentDialog={agentData1} />
                    ) : null}

                    {respondentData1 && respondentData1.length > 0 ? (
                      <Respondent respondent={respondentData1} />
                    ) : null}

                    {company1 && company1.length > 0 ? (
                      <Company company={company1} />
                    ) : null}
                    <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '4px' }}>
                      <Space size='small'>
                        <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>纠纷基本情况</h5>
                      </Space>
                    </Col>
                    <Row gutter={[16, 16]}>
                      <Col span={8}>
                        <div><div className="title-text">事项状态</div></div>
                        <div style={{ color: '#1A6FB8' }}>{caseInfo?.statusName || '-'}</div>
                      </Col>
                      <Col span={16}>
                        <div><div className="title-text">事项编号</div></div>
                        <div>{caseInfo?.caseRef || '-'}</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' }}>{caseInfo?.caseLevel || '-'}</div></div>级</div>
                      </Col>
                      <Col span={8}>
                        <div><div className="title-text">来访时间</div></div>
                        <div>{caseInfo?.visitTime || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div ><div className="title-text">来访人数（人）</div></div>
                        <div>{caseInfo?.visitPeopleNum || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div ><div className="title-text">纠纷类型</div></div>
                        <div>{caseInfo?.caseType || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div ><div className="title-text">纠纷发生时间</div></div>
                        <div>{caseInfo?.occurTime || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div ><div className="title-text">纠纷发生地点</div></div>
                        <div>{caseInfo?.addr || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div ><div className="title-text">问题属地</div></div>
                        <div>{caseInfo?.questionName || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div ><div className="title-text">涉及人数（人）</div></div>
                        <div>{caseInfo?.peopleNum || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div ><div className="title-text">涉及金额（元）</div></div>
                        <div>{$$.thousands(caseInfo?.amount) || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div ><div className="title-text">事项来源</div></div>
                        <div>{caseInfo?.canalName || '-'}</div>
                      </Col>
                      <Col span={16}>
                        <div ><div className="title-text">来访形式</div></div>
                        <div>{caseInfo?.visitWayName || '-'}</div>
                      </Col>
                      <Col span={24}>
                        <div className="title"><div className="title-text">事项概况</div></div>
                        <div>{caseInfo?.caseDes || '-'}</div>
                      </Col>
                      <Col span={24}>
                        <div className="title"><div className="title-text">事项申请</div></div>
                        <div>{caseInfo?.caseClaim || '-'}</div>
                      </Col>
                      <Col span={16}>
                        <div className="title"><div className="title-text">是否重大矛盾纠纷</div></div>
                        <div>{caseInfo?.majorStatus === '0' ? '否' : '是'}</div>
                      </Col>
                    </Row>
                    <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '16px', marginTop: '20px' }}>
                      <Space size='small'>
                        <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>办理结果</h4>
                      </Space>
                    </Col>
                    <table border="1" align="center" cellpadding="8" className="table" >
                      <tr>
                        <th bgcolor="#F7F8FA" className="table-title" width="120">化解结果</th>
                        <td width='380'>{TransactResult.mediResultName || '-'}</td>
                        <th bgcolor="#F7F8FA" className="table-title" width="120">经办人</th>
                        <td width='380'>{TransactResult.mediator || '-'}</td>
                      </tr>
                      <tr>
                        <th bgcolor="#F7F8FA" className="table-title">承办部门</th>
                        <td>{TransactResult.mediateUnitName || '-'}</td>
                        <th bgcolor="#F7F8FA" className="table-title">配合部门</th>
                        <td>{TransactResult.applyAssistUnitName || '-'}</td>
                      </tr>
                      <tr>
                        <th bgcolor="#F7F8FA" className="table-title" width="120">受理时间</th>
                        <td width='380'>2024-7-1 10:00</td>
                        <th bgcolor="#F7F8FA" className="table-title" width="120">办结时间</th>
                        <td width='380'>{TransactResult?.fileTime || '-'}</td>
                      </tr>
                      <tr>
                        <th bgcolor="#F7F8FA" className="table-title" width="120">办理意见</th>
                        <td width='380' colspan='3'>{TransactResult?.windupContent || '-'}</td>
                      </tr>
                      <tr>
                        <th bgcolor="#F7F8FA" className="table-title" width="120">协议要点</th>
                        <td width='380' colspan='3'>{TransactResult?.agreeContent || '-'}</td>
                      </tr>
                      <tr>
                        <th bgcolor="#F7F8FA" className="table-title" width="120">结案意见</th>
                        <td width='380' colspan='3'>{TransactResult?.windupContent || '-'}</td>
                      </tr>
                      <tr>
                        <th bgcolor="#F7F8FA" className="table-title" width="120">协议文书</th>
                        <td colspan='3'>
                          <a href="your-link-here.html" target="_blank">
                            <img src={link} alt="" className="title-file" />申请人张三丰的人民调解协议书.pdf
                          </a>
                        </td>
                      </tr>
                    </table>
                    <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '16px', marginTop: '20px' }}>
                      <Space size='small'>
                        <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>事件材料</h4>
                      </Space>
                    </Col>
                    <TableView
                      columns={fakeColumns}
                      dataSource={fakeData1}
                      size="small"
                      rowKey="id"
                      bordered={true}
                      style={{ marginBottom: '16px' }}
                    />
                    <div className='gap'></div>
                    <Col span={24} style={{ marginTop: '12px' }}>
                      <div style={{ color: 'rgb(134, 144, 156)' }}>办理记录</div>
                      <HandleRecord isReview={false} data={list} />

                      {/* <div>
                        {records.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.date} ${record.location}`}</div>
                              <div className={`container-bottom-left-record-top-${record.remark === '配合部门' ? 'remark' : 'hostOrg'}`}>{record.remark}</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'>
                                {record.details.map(detail => (
                                  <tr key={detail.title}>
                                    <th bgcolor="#F7F8FA" className="table-title" width="120">{detail.title}</th>
                                    <td>{detail.content}</td>
                                  </tr>
                                ))}
                              </table>
                            </div>
                          </div>
                        ))}
                      </div> */}
                    </Col>
                    <div className='gap'></div>
                    <div style={{ marginLeft: '-16px' }}>
                      <Tabs defaultActiveTab='1'>
                        <TabPane
                          key='1'
                          title={
                            <span style={{ fontSize: '15px' }}>
                              流转进度
                            </span>
                          }
                        >
                          <Typography.Paragraph>
                            <div style={{ display: 'flex', marginLeft: '16px', gap: '16px' }}>
                              {tabs.map((tab) => (
                                <div
                                  key={tab.index}
                                  style={{
                                    color: selectedTab === tab.index ? 'rgba(26,111,184,1)' : 'rgba(0,0,0,0.45)',
                                    padding: '6px 12px',
                                    border: `1px solid ${selectedTab === tab.index ? 'rgba(26,111,184,1)' : 'rgba(229,230,235,1)'}`,
                                    borderRadius: '4px',
                                    cursor: 'pointer',
                                  }}
                                  onClick={() => handleTabChange(tab.index)}
                                >
                                  {tab.label}
                                </div>
                              ))}
                            </div>
                            {selectedTab === '1' &&
                              <div className='progress'>
                                <ProgressStep progressData={fakeData} />
                              </div>
                            }
                          </Typography.Paragraph>
                        </TabPane>
                        <TabPane
                          key='2'
                          title={
                            <span style={{ fontSize: '15px' }}>
                              督办信息
                            </span>
                          }
                        >
                          <Typography.Paragraph>Content of Tab Panel 2</Typography.Paragraph>
                        </TabPane>
                      </Tabs>

                    </div>
                    <div className='gap'></div>
                    <Col span={24} style={{ display: 'flex', alignItems: 'center', margin: '12px 0px 4px 0px' }}>
                      <Space size='small'>
                        <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>当事人评价</h4>
                      </Space>
                    </Col>
                    <Row gutter={[16, 16]}>
                      <Col span={8}>
                        <div className="title">
                          <div className="title-text">评价等级</div>
                        </div>
                        <div style={{ display: 'flex' }}><Rate value={grade?.evaluateGrade} disabled /></div>
                      </Col>
                      <Col span={8}>
                        <div className="title">
                          <div className="title-text">评价时间</div>
                        </div>
                        <div>{grade?.createTime || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div className="title">
                          <div className="title-text">评价人</div>
                        </div>
                        <div>{grade?.evaluateUserName || '-'}</div>
                      </Col>
                      <Col span={12}>
                        <div className="title">
                          <div className="title-text">评语</div>
                        </div>
                        <div>{grade?.evaluateContent}</div>
                      </Col>
                    </Row>
                    <div className='gap'></div>
                    <Col span={24} style={{ display: 'flex', alignItems: 'center', margin: '12px 0px 4px 0px' }}>
                      <Space size='small'>
                        <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>登记信息</h4>
                      </Space>
                    </Col>
                    <Row gutter={[16, 16]} style={{ marginBottom: '90px' }}>
                      <Col span={8}>
                        <div className="title">
                          <div className="title-text">登记机构</div>
                        </div>
                        <div>{caseInfo?.inputUnitName || '-'}</div>
                      </Col>
                      <Col span={8}>
                        <div className="title">
                          <div className="title-text">登记人</div>
                        </div>
                        <div>
                          {caseInfo.inputUserName}
                          <img src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '4px' }} />
                        </div>
                      </Col>
                      <Col span={8}>
                        <div className="title">
                          <div className="title-text">登记时间</div>
                        </div>
                        <div>{caseInfo?.visitTime || '-'}</div>
                      </Col>
                    </Row>
                  </div>
                  <div className="dataSync-excel">
                    <Space size="large" style={{ margin: '4px 14px' }}>
                      <Button type="primary" style={{ backgroundColor: '#1A6FB8' }} >导出</Button>
                      <Button type='secondary'>返回上级页面</Button>
                    </Space>
                  </div>
                </>
              }
              {
                tabsActive === '2' &&
                <ProgressStep progressData={progressData} />
              }
              {tabsActive === '3' &&
                <ApplyInfo />
              }
            </TabPane>
          })}
        </Tabs>


      </NewPage>
    </>
                  </TabPane>
                </Tabs>
              </div>
            }
            {
              tabsActive === '3' &&
              <ApplyInfo />
            }
          </TabPane>
        })}
      </Tabs>
    </NewPage>
  )
}


 gz-customerSystem/src/views/register/matterDetail/index.jsx

@@ -7,7 +7,7 @@
import FileTable from "./FileTable";

function getCaseInfoApi(id) {
  return $$.ax.request({ url: 'caseInfo/getCaseInfo?id=' + id, type: 'get', service: 'mediate' });
  return $$.ax.request({ url: '/caseInfo/getCaseInfo?id=' + id, type: 'get', service: 'mediate' });
}


@@ -23,13 +23,13 @@

  //获取id
  const getCaseInfo = async (id) => {
    const res = await getCaseInfoApi(id)
    const res = await getCaseInfoApi(props.caseId)
    if (res.type) {
      let data = res.data
      const partyList = data.personList.concat(data.agentList)
      setInfoData({
        ...data,
        questionName: data.queProvName === null ? '-' : data.queProvName + '/' + data.queCityName + '/' + data.queAreaName + '/' + data.queRoadName + '/' + data.queVillageName,
        questionName: data.queProvName === null ? '-' : data.queProvName + '/' + data.queCityName + '/' + data.queAreaName + '/' + data.queRoadName,
        caseType: data.caseTypeFirstName === null ? '-' : data.caseTypeFirstName + '/' + data.caseTypeName
      })
      setFakeData(partyList.map(item => {

 gz-customerSystem/src/views/register/visit/component/previewTable.jsx

@@ -1,4 +1,4 @@
import React from 'react';
import React, { useEffect, useState } from 'react';
import { person, link } from '@/assets/images'


@@ -45,9 +45,18 @@
              <td>{item.workUnit || '-'}</td>
              <th bgcolor="#F7F8FA" className="table-title">身份证明材料</th>
              <td>
                <a href="your-link-here.html" target="_blank">
                  <img src={link} alt="" className="title-file" />李晓明身份证明材料.pdf
                </a>
                {
                  item.fileInfoList?.map(res => {
                    if (res.ownerType == "22_00018-202") {
                      return res.fileList.map((result, resIndex) => {
                        return <a href="your-link-here.html" target="_blank">
                          <img src={link} alt="" className="title-file" />{result.trueName}
                          {resIndex !== res.fileList.length - 1 && <>，</>}
                        </a>
                      })
                    }
                  })
                }
              </td>
            </tr>
          </table>
@@ -106,15 +115,33 @@
            <td>{item.personId || '-'}</td>
            <th bgcolor="#F7F8FA" className="table-title">身份证明材料</th>
            <td>
              <a href="your-link-here.html" target="_blank">
                <img src={link} alt="" className="title-file" />李巧凤身份证明材料.pdf
              </a>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == "22_00018-202") {
                    return res.fileList?.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                  }
                })
              }
            </td>
            <th bgcolor="#F7F8FA" className="table-title">代理人授权委托书</th>
            <td>
              <a href="your-link-here.html" target="_blank">
                <img src={link} alt="" className="title-file" />李晓明身份证明材料.pdf
              </a>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-207') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                  }
                })
              }
            </td>
          </tr>

@@ -151,15 +178,33 @@
            <td>{item.placeAddr || '-'}</td>
            <th bgcolor="#F7F8FA" className="table-title">企业登记材料</th>
            <td>
              <a href="your-link-here.html" target="_blank">
                <img src={link} alt="" className="title-file" />广东好又多贸易有限公司营业执照副本.pdf
              </a>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-203') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                  }
                })
              }
            </td>
            <th bgcolor="#F7F8FA" className="table-title" >法定代表人身份证明材料</th>
            <td>
              <a href="your-link-here.html" target="_blank">
                <img src={link} alt="" className="title-file" />江照月法人身份证明.pdf
              </a>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-204') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                  }
                })
              }
            </td>
          </tr>
        </table>
@@ -197,15 +242,33 @@
            <td>{item.placeAddr || '-'}</td>
            <th bgcolor="#F7F8FA" className="table-title">机构登记材料</th>
            <td>
              <a href="your-link-here.html" target="_blank">
                <img src={link} alt="" className="title-file" />广东好又多贸易有限公司营业执照副本.pdf
              </a>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-203') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                  }
                })
              }
            </td>
            <th bgcolor="#F7F8FA" className="table-title" >机构代表人身份证明材料</th>
            <td>
              <a href="your-link-here.html" target="_blank">
                <img src={link} alt="" className="title-file" />江照月法人身份证明.pdf
              </a>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-204') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                  }
                })
              }
            </td>
          </tr>
        </table>

 gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx

@@ -391,8 +391,9 @@
          <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>事件材料</h4>
        </Space>
      </Col>
      <FileTable mainId={props.mainId} fileInfoList={props.fileInfoList} isReview={false} />

      <div style={{ marginBottom: '65px' }}>
        <FileTable mainId={props.mainId} fileInfoList={props.fileInfoList} isReview={false} />
      </div>
      <DocumentScanner
        visible={scanFile}
        onConfirm={handleConfirm}

 gz-customerSystem/src/views/register/visit/index.jsx

@@ -2,13 +2,13 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-08-09 09:59:43
 * @LastEditors: lwh
 * @LastEditTime: 2024-09-10 11:20:47
 * @LastEditTime: 2024-09-10 16:59:07
 * @FilePath: \gzDyh\gz-customerSystem\src\views\basicInformation\organization\index.jsx
 * @Description: 来访登记
 */

import React, { useState, useRef, Fragment, useEffect } from "react";
import { useSearchParams, useNavigate } from 'react-router-dom';
import { useParams, useNavigate } from 'react-router-dom';
import NewPage from '@/components/NewPage';
import * as $$ from '@/utils/utility';
import "@arco-themes/react-gzzz/css/arco.css";
@@ -17,7 +17,6 @@
import { Button, Steps, Message } from '@arco-design/web-react';
import VisitorRegister from './component/visitorRegister';
import Preview from './preview';
import { useParams } from 'react-router-dom';

const Step = Steps.Step;

@@ -102,7 +101,6 @@
              })
            },
          });

        }
      });
    }
@@ -200,7 +198,9 @@
              <Step title='结案归档' disabled />
            </Steps>
          </div>
          <Preview style={{ display: isReview ? '' : 'none' }} data={formRef?.current?.getFields()} />
          <div style={{ backgroundColor: '#ffff', margin: '8px 8px 0px 16px', padding: '12px 18px 16px 16px', height: 'calc(100vh - 228px)', overflowY: 'scroll', display: isReview ? '' : 'none' }}>
            <Preview style={{ display: isReview ? '' : 'none' }} data={formRef?.current?.getFields()} mainId={id} />
          </div>
          <VisitorRegister
            formRef={formRef}
            style={{ display: isReview ? 'none' : '' }}

 gz-customerSystem/src/views/register/visit/preview.jsx

@@ -6,126 +6,18 @@
 * @FilePath: \gzDyh\gz-customerSystem\src\views\basicInformation\organization\preview.jsx
 * @Description: 预览信息
 */
import React, { useState } from "react";
import React, { useState, useEffect } from "react";
import { Row, Col, Space } from 'antd';
import { person, question, link } from '../../../assets/images'
import '../index.less';
import TableView from '../../../components/TableView';
import { Modal } from '@arco-design/web-react';
import NewFileCheck from '../matterDetail/NewFileCheck';
import * as $$ from '../../../utils/utility';
import { ApplyDialog, AgentDialog, Respondent, Company } from './component/previewTable'
import FileTable from "../matterDetail/FileTable";
import { link } from '@/assets/images';

const Preview = (props) => {
    const [filesCheck, setFilesCheck] = useState(false);
    const [apply, setApply] = useState(false);
    const [visible, setVisible] = useState(false);
  const [data, setData] = useState({})

    const fakeData1 = [
        {
            id: 1,
            caseNo: 'A20230101',
            judicNo: '申请材料',
            perClassName: '李晓明的纠纷化解申请表、身份证...',
            inputUserName: '0',
            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: '李晓明的纠纷化解申请表、身份证...',
            inputUserName: '0',
            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 fakeColumns = [
        {
            title: '序号',
            dataIndex: 'caseNo',
            key: 'caseNo',
            width: 100,
            render: (text, record, index) => <span>{index + 1}</span>,
        },
        {
            title: '材料类型',
            dataIndex: 'judicNo',
            key: 'judicNo',
            width: 60,

        },
        {
            title: '材料数量',
            dataIndex: 'inputUserName',
            key: 'perClassName',
            width: 180,
            render: (text) => (
                <>
                    {text}份
                </>
            )

        },
        {
            title: '材料名称',
            dataIndex: 'perClassName',
            key: 'perClassName',
            width: 180,

        },
        {
            title: '上传时间',
            dataIndex: 'mediateUserName',
            key: 'mediateUserName',
            width: 180,

        },
        {
            title: '操作',
            dataIndex: 'perClassName',
            key: 'perClassName',
            width: 200,
            render: (text) => (
                <div style={{ display: 'flex', color: '#1A6FB8', gap: '16px' }}>
                    <div onClick={() => setFilesCheck(true)}>查看</div>
                    <div>下载</div>
                </div>
            )
        },
        // 更多列配置...
    ];


  useEffect(() => {
    console.log(props.data);
    const applyData = props.data?.fakeData?.filter(item => item.perTypeName === "申请方当事人" && item.perClassName === "自然人");
    const agentData = props.data?.fakeData?.filter(item => item.perTypeName === "申请方代理人");
    const company = props.data?.fakeData?.filter(item => item.perTypeName === "申请方当事人" && item.perClassName === "非法人组织");
@@ -136,168 +28,216 @@
    const company1 = props.data?.fakeData?.filter(item => item.perTypeName === "被申请方当事人" && item.perClassName === "非法人组织");
    const respondentData1 = props.data?.fakeData?.filter(item => item.perTypeName === "被申请方当事人" && item.perClassName === "法人");

    console.log(props.data, 'props.data')
    setData({
      applyData,
      agentData,
      company,
      respondentData,
      applyData1,
      agentData1,
      company1,
      respondentData1
    })
  }, [props.data])

  return (
    <div style={{ ...props.style }}>
      <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}>
        <Space size='small'>
          <div className='MediationInfo-subTitle' style={{ marginTop: '-7px' }}></div><h4>当事人信息</h4>
        </Space>
      </Col>
      <div style={{ marginBottom: '8px' }}>申请方</div>
      <div className="line-container" style={{ marginBottom: '20px' }}>
        <div className="line left-line"></div>
        <div className="line middle-line"></div>
        <div className="line right-line"></div>
      </div>
      {/* ApplyDialog 只有在 applyData 存在且不为空时才渲染 */}
      {data.applyData && data.applyData.length > 0 ? (
        <ApplyDialog applyDialog={data.applyData} />
      ) : null}

      {/* AgentDialog 只有在 agentData 存在且不为空时才渲染 */}
      {data.agentData && data.agentData.length > 0 ? (
        <AgentDialog agentDialog={data.agentData} />
      ) : null}

      {/* Respondent 只有在 respondentData 存在且不为空时才渲染 */}
      {data.respondentData && data.respondentData.length > 0 ? (
        <Respondent respondent={data.respondentData} />
      ) : null}

      {data.company && data.company.length > 0 ? (
        <Company company={data.company} />
      ) : null}

    return (
        <div style={{ backgroundColor: '#ffff', margin: '8px 8px 0px 16px', padding: '12px 18px 16px 16px', height: 'calc(100vh - 228px)', overflowY: 'scroll', ...props.style }}>
            <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}>
                <Space size='small'>
                    <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>当事人信息</h4>
                </Space>
      <div style={{ marginBottom: '8px' }}>被申请方</div>
      <div className="line-container" style={{ marginBottom: '20px' }}>
        <div className="line left-line"></div>
        <div className="line middle-line"></div>
        <div className="line right-line"></div>
      </div>
      {data.applyData1 && data.applyData1.length > 0 ? (
        <ApplyDialog applyDialog={data.applyData1} />
      ) : null}

      {data.agentData1 && data.agentData1.length > 0 ? (
        <AgentDialog agentDialog={data.agentData1} />
      ) : null}

      {data.respondentData1 && data.respondentData1.length > 0 ? (
        <Respondent respondent={data.respondentData1} />
      ) : null}

      {data.company1 && data.company1.length > 0 ? (
        <Company company={data.company1} />
      ) : null}
      <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}>
        <Space size='small'>
          <div className='MediationInfo-subTitle' style={{ marginTop: '-7px' }}></div><h4>纠纷基本情况</h4>
        </Space>
      </Col>
      <Row gutter={[16, 16]}>
        {props.isDoc &&
          <>
            <Col span={8}>
              <div><div className="title-text">事项状态</div></div>
              <div style={{ color: '#1A6FB8' }}>{props.data?.statusName || '-'}</div>
            </Col>
            <div style={{ marginBottom: '8px' }}>申请方</div>
            <div className="line-container" style={{ marginBottom: '20px' }}>
                <div className="line left-line"></div>
                <div className="line middle-line"></div>
                <div className="line right-line"></div>
            </div>
            {/* ApplyDialog 只有在 applyData 存在且不为空时才渲染 */}
            {applyData && applyData.length > 0 ? (
                <ApplyDialog applyDialog={applyData} />
            ) : null}

            {/* AgentDialog 只有在 agentData 存在且不为空时才渲染 */}
            {agentData && agentData.length > 0 ? (
                <AgentDialog agentDialog={agentData} />
            ) : null}

            {/* Respondent 只有在 respondentData 存在且不为空时才渲染 */}
            {respondentData && respondentData.length > 0 ? (
                <Respondent respondent={respondentData} />
            ) : null}

            {company && company.length > 0 ? (
                <Company company={company} />
            ) : null}

            <div style={{ marginBottom: '8px' }}>被申请方</div>
            <div className="line-container" style={{ marginBottom: '20px' }}>
                <div className="line left-line"></div>
                <div className="line middle-line"></div>
                <div className="line right-line"></div>
            </div>
            {applyData1 && applyData1.length > 0 ? (
                <ApplyDialog applyDialog={applyData1} />
            ) : null}

            {agentData1 && agentData1.length > 0 ? (
                <AgentDialog agentDialog={agentData1} />
            ) : null}

            {respondentData1 && respondentData1.length > 0 ? (
                <Respondent respondent={respondentData1} />
            ) : null}

            {company1 && company1.length > 0 ? (
                <Company company={company1} />
            ) : null}
            <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}>
                <Space size='small'>
                    <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>纠纷基本情况</h4>
                </Space>
            <Col span={16}>
              <div><div className="title-text">事项编号</div></div>
              <div>{props.data?.caseRef || '-'}</div>
            </Col>
            <Row gutter={[16, 16]}>
                <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' }}>{props.data?.caseLevel || '-'}</div></div>级</div>
                </Col>
                <Col span={8}>
                    <div><div className="title-text">来访时间</div></div>
                    <div>{props.data?.visitTime || '-'}</div>
                </Col>
                <Col span={8}>
                    <div ><div className="title-text">来访人数（人）</div></div>
                    <div>{props.data?.visitPeopleNum || '-'}</div>
                </Col>
                <Col span={8}>
                    <div ><div className="title-text">纠纷类型</div></div>
                    <div>
                        {props.data?.caseTypeFirstName ?
                            `${props.data.caseTypeFirstName}/${props.data.caseTypeName}`
                            : '-'
                        }
                    </div>
                </Col>
                <Col span={8}>
                    <div ><div className="title-text">纠纷发生时间</div></div>
                    <div>{props.data?.occurTime || '-'}</div>
                </Col>
                <Col span={8}>
                    <div ><div className="title-text">纠纷发生地点</div></div>
                    <div>{props.data?.addr || '-'}</div>
                </Col>
                <Col span={8}>
                    <div ><div className="title-text">问题属地</div></div>
                    <div>
                        {props.data?.queProvName ?
                            `${props.data.queProvName}/${props.data.queCityName}/${props.data.queAreaName}/${props.data.queRoadName}`
                            : '-'
                        }
                    </div>
                </Col>
                <Col span={8}>
                    <div ><div className="title-text">涉及人数（人）</div></div>
                    <div>{props.data?.peopleNum || '-'}</div>
                </Col>
                <Col span={8}>
                    <div ><div className="title-text">涉及金额（元）</div></div>
                    <div>{$$.thousands(props.data?.amount) || '-'}</div>
                </Col>
                <Col span={8}>
                    <div ><div className="title-text">事项来源</div></div>
                    <div>大厅来访</div>
                </Col>
                <Col span={16}>
                    <div ><div className="title-text">来访形式</div></div>
                    <div>来访</div>
                </Col>
                <Col span={24}>
                    <div className="title"><div className="title-text">事项概况</div></div>
                    <div>{props.data?.caseDes || '-'} </div>
                </Col>
                <Col span={24}>
                    <div className="title"><div className="title-text">事项申请</div></div>
                    <div>{props.data?.caseClaim || '-'}</div>
                </Col>
                <Col span={16}>
                    <div className="title"><div className="title-text">是否重大矛盾纠纷</div></div>
                    <div>{props.data?.majorStatus === 1 ? '是' : '否'}</div>
                </Col>
            </Row>
            <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px', marginTop: '20px' }}>
                <Space size='small'>
                    <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h4>事件材料</h4>
                </Space>
            </Col>

            <TableView
                columns={fakeColumns}
                dataSource={fakeData1}
                size="small"
                rowKey="id"
                bordered={true}
                style={{ marginBottom: '65px' }}
            />

            <Modal style={{ width: '1200px' }} visible={filesCheck} onCancel={() => setFilesCheck(false)} footer={null} title='查看事件材料' centered>
                {/* <div className="mediationWindow-modal-main" style={{ display: 'flex' }}> */}
                <div style={{ marginTop: '-16px' }}>
                    <NewFileCheck />
                </div>

                {/* </div> */}
            </Modal>



        </div>
    )
          </>
        }
        <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' }}>{props.data?.caseLevel || '-'}</div></div>级</div>
        </Col>
        <Col span={8}>
          <div><div className="title-text">来访时间</div></div>
          <div>{props.data?.visitTime || '-'}</div>
        </Col>
        <Col span={8}>
          <div ><div className="title-text">来访人数（人）</div></div>
          <div>{props.data?.visitPeopleNum || '-'}</div>
        </Col>
        <Col span={8}>
          <div ><div className="title-text">纠纷类型</div></div>
          <div>
            {props.data?.caseTypeFirstName ?
              `${props.data.caseTypeFirstName}/${props.data.caseTypeName}`
              : '-'
            }
          </div>
        </Col>
        <Col span={8}>
          <div ><div className="title-text">纠纷发生时间</div></div>
          <div>{props.data?.occurTime || '-'}</div>
        </Col>
        <Col span={8}>
          <div ><div className="title-text">纠纷发生地点</div></div>
          <div>{props.data?.addr || '-'}</div>
        </Col>
        <Col span={8}>
          <div ><div className="title-text">问题属地</div></div>
          <div>
            {props.data?.queProvName ?
              `${props.data.queProvName}/${props.data.queCityName}/${props.data.queAreaName}/${props.data.queRoadName}`
              : '-'
            }
          </div>
        </Col>
        <Col span={8}>
          <div ><div className="title-text">涉及人数（人）</div></div>
          <div>{props.data?.peopleNum || '-'}</div>
        </Col>
        <Col span={8}>
          <div ><div className="title-text">涉及金额（元）</div></div>
          <div>{$$.thousands(props.data?.amount) || '-'}</div>
        </Col>
        <Col span={8}>
          <div ><div className="title-text">事项来源</div></div>
          <div>大厅来访</div>
        </Col>
        <Col span={16}>
          <div ><div className="title-text">来访形式</div></div>
          <div>来访</div>
        </Col>
        <Col span={24}>
          <div className="title"><div className="title-text">事项概况</div></div>
          <div>{props.data?.caseDes || '-'} </div>
        </Col>
        <Col span={24}>
          <div className="title"><div className="title-text">事项申请</div></div>
          <div>{props.data?.caseClaim || '-'}</div>
        </Col>
        <Col span={16}>
          <div className="title"><div className="title-text">是否重大矛盾纠纷</div></div>
          <div>{props.data?.majorStatus === 1 ? '是' : '否'}</div>
        </Col>
      </Row>
      {props.transactResult && <>
        <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '16px', marginTop: '20px' }}>
          <Space size='small'>
            <div className='MediationInfo-subTitle' style={{ marginTop: '-7px' }}></div><h4>办理结果</h4>
          </Space>
        </Col>
        <table border="1" align="center" cellpadding="8" className="table" >
          <tr>
            <th bgcolor="#F7F8FA" className="table-title" width="120">化解结果</th>
            <td width='380'>{props.transactResult.mediResultName || '-'}</td>
            <th bgcolor="#F7F8FA" className="table-title" width="120">经办人</th>
            <td width='380'>{props.transactResult.mediator || '-'}</td>
          </tr>
          <tr>
            <th bgcolor="#F7F8FA" className="table-title">承办部门</th>
            <td>{props.transactResult.mediateUnitName || '-'}</td>
            <th bgcolor="#F7F8FA" className="table-title">配合部门</th>
            <td>{props.transactResult.applyAssistUnitName || '-'}</td>
          </tr>
          <tr>
            <th bgcolor="#F7F8FA" className="table-title" width="120">受理时间</th>
            <td width='380'>2024-7-1 10:00</td>
            <th bgcolor="#F7F8FA" className="table-title" width="120">办结时间</th>
            <td width='380'>{props.transactResult?.fileTime || '-'}</td>
          </tr>
          <tr>
            <th bgcolor="#F7F8FA" className="table-title" width="120">办理意见</th>
            <td width='380' colspan='3'>{props.transactResult?.windupContent || '-'}</td>
          </tr>
          <tr>
            <th bgcolor="#F7F8FA" className="table-title" width="120">协议要点</th>
            <td width='380' colspan='3'>{props.transactResult?.agreeContent || '-'}</td>
          </tr>
          <tr>
            <th bgcolor="#F7F8FA" className="table-title" width="120">结案意见</th>
            <td width='380' colspan='3'>{props.transactResult?.windupContent || '-'}</td>
          </tr>
          <tr>
            <th bgcolor="#F7F8FA" className="table-title" width="120">协议文书</th>
            <td colspan='3'>
              {props.transactResult?.fileInfoBaseDTOList?.map((item, index) => {
                return <a href="your-link-here.html" target="_blank">
                  <img src={link} alt="" className="title-file" />{item.trueName}
                  {index !== props.transactResult.fileInfoBaseDTOList.length - 1 && <>，</>}
                </a>
              })}
            </td>
          </tr>
        </table>
      </>}
      <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px', marginTop: '20px' }}>
        <Space size='small'>
          <div className='MediationInfo-subTitle' style={{ marginTop: '-7px' }}></div><h4>事件材料</h4>
        </Space>
      </Col>
      <FileTable mainId={props.mainId} fileInfoList={props.data?.fileInfoList} isReview={true} />
    </div>
  )
}

export default Preview