fix:市平台项目更新

xusd

7 days ago 544148eddae96db824423cd059ebecb9d13c392e

fix:市平台项目更新

 package.json

@@ -19,6 +19,7 @@
    "axios": "^0.26.0",
    "craco-less": "^2.0.0",
    "crypto-js": "^4.1.1",
    "docx-preview": "^0.3.5",
    "echarts": "^5.4.2",
    "html2canvas": "^1.4.1",
    "import": "0.0.6",

 src/api/appUrl.js

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: ldh
 * @Date: 2022-02-16 11:25:57
 * @LastEditTime: 2025-05-26 15:03:51
 * @LastEditTime: 2025-06-10 17:33:34
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description: api地址
@@ -71,15 +71,44 @@
};

// 测试
// export const test = {
//     // web服务
//     baseUrl: 'http://10.202.1.71:80',
// //   baseUrl: 'https://zfw-dyh.by.gov.cn',
//     // baseUrl: 'http://146.4.99.61:8088/byzfw',

//     // 附件服务
//     fileUrl: 'http://10.202.1.71:80',
// //   fileUrl: 'https://zfw-dyh.by.gov.cn',

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

//     // 不同服务接口type
//     mediate: 'gzdyh-test-mediate', // dyh-mediate
//     cust: 'gzdyh-test-cust', // dyh-cust
//     oper: 'gzdyh-test-oper', // dyh-oper
//     sys: 'gzdyh-test-sys', // dyh-sys
//     disp: 'gzdyh-test-disp', //dyh-disp
//     utils: 'gzdyh-test-utils',
//     know: 'gzdyh-test-know',
// };


// 测试
export const test = {
    // web服务
    baseUrl: 'http://10.202.1.71:80',
//   baseUrl: 'https://zfw-dyh.by.gov.cn',
    // baseUrl: 'http://146.4.99.61:8088/byzfw',

    // 附件服务
    fileUrl: 'http://10.202.1.71:80',
//   fileUrl: 'https://zfw-dyh.by.gov.cn',

    // 文件查看url 后面接附件编号
    fileShowUrl: '/gzdyh-test-sys/api/web/fileInfo/show/',
@@ -98,4 +127,4 @@
    disp: 'gzdyh-test-disp', //dyh-disp
    utils: 'gzdyh-test-utils',
    know: 'gzdyh-test-know',
};
};

 src/components/ArcoUpload/index.jsx

@@ -2,7 +2,7 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-09-02 19:56:05
 * @LastEditors: lwh
 * @LastEditTime: 2024-12-10 15:46:19
 * @LastEditTime: 2025-06-10 16:23:39
 * @FilePath: \gzDyh\gz-customerSystem\src\components\ArcoUpload\index.jsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
@@ -70,7 +70,7 @@
          drag
          multiple
          style={{ ...props.style }}
          accept='.png,.jpg,.pdf'
          accept='.png,.jpg,.pdf,.doc,.docx'
          onDrop={(e) => {
          }}
          tip='支持png、jpg、pdf格式的图片上传，每次上传大小不超过10M'

 src/components/MyDOCX/index.jsx

New file
@@ -0,0 +1,127 @@
import React, { Fragment, useState, useEffect, useRef } from 'react';
import PropTypes from 'prop-types';
import { Button, Space } from 'antd';
import { Modal } from '@arco-design/web-react';
import { CloseCircleFilled, DownloadOutlined } from '@ant-design/icons';
import { IconAttachment } from '@arco-design/web-react/icon';
import { Document, Page, pdfjs } from 'react-pdf';
import * as $$ from '@/utils/utility';
import './index.less';

// 设置pdf.js工作器路径
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;

const appUrl = $$.appUrl;
const MyPDF = ({ name, fileUrl }) => {
    const [visible, setVisible] = useState(false);
    const [numPages, setNumPages] = useState(null);
    const [pageNumber, setPageNumber] = useState(1);

    // 成功加载PDF文件时的回调
    function onDocumentLoadSuccess({ numPages }) {
        setNumPages(numPages);
        setPageNumber(1);
    }

    function changePage(offset) {
        setPageNumber((prevPageNumber) => prevPageNumber + offset);
    }

    function previousPage() {
        changePage(-1);
    }

    function nextPage() {
        changePage(1);
    }

    return (
        <div>
            {fileUrl ? (
                <div
                    onClick={() => {
                        setVisible(true);
                    }}
                    className="pdf-title"
                >
                    <IconAttachment style={{ color: '#1A6FB8' }} />
                    <div className="pdf-name">{name}</div>
                </div>
            ) : (
                '-'
            )}

            <Modal
                style={{ width: '80%' }}
                closable={false}
                title={name}
                footer={
                    <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', gap: '10px' }}>
                        <button
                            type="button"
                            disabled={pageNumber <= 1}
                            onClick={previousPage}
                            style={{ padding: '4px 15px', cursor: pageNumber <= 1 ? 'not-allowed' : 'pointer' }}
                        >
                            上一页
                        </button>
                        <p style={{ margin: 0 }}>
                            第 {pageNumber} 页 / 共 {numPages || '--'} 页
                        </p>
                        <button
                            type="button"
                            disabled={pageNumber >= numPages}
                            onClick={nextPage}
                            style={{ padding: '4px 15px', cursor: pageNumber >= numPages ? 'not-allowed' : 'pointer' }}
                        >
                            下一页
                        </button>
                        <Button
                            type="primary"
                            icon={<DownloadOutlined />}
                            onClick={() => {
                                window.open(`${appUrl.fileUrl}${appUrl.fileDownUrl}${fileUrl.split('/').pop()}`);
                            }}
                            style={{ marginLeft: '10px' }}
                        >
                            下载
                        </Button>
                    </div>
                }
                centered
                unmountOnExit={true}
                visible={visible}
                onCancel={() => {
                    setVisible(false);
                }}
            >
                <div style={{ width: '100%', height: 'calc(100vh - 200px)', display: 'flex', justifyContent: 'center', overflow: 'auto' }}>
                    <Document
                        file={`${appUrl.fileUrl}/${appUrl.sys}${fileUrl}`}
                        onLoadSuccess={onDocumentLoadSuccess}
                        loading={<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}>PDF加载中...</div>}
                        error={<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}>PDF加载失败，请稍后重试</div>}
                    >
                        <Page pageNumber={pageNumber} renderTextLayer={false} renderAnnotationLayer={false} scale={1.2} />
                    </Document>
                </div>
            </Modal>
        </div>
    );
};

MyPDF.propTypes = {
    title: PropTypes.any,
    visible: PropTypes.bool,
    onCancel: PropTypes.func,
    onOk: PropTypes.func,
    footer: PropTypes.any,
    onText: PropTypes.string,
    cancelText: PropTypes.string,
    zIndex: PropTypes.number,
    bodyStyle: PropTypes.object,
    closable: PropTypes.bool,
    centered: PropTypes.bool,
};

export default MyPDF;

 src/components/MyDOCX/index.less

New file
@@ -0,0 +1,13 @@
@import '../../styles/theme.less';

.pdf {
    &-title {
        display: flex;
        align-items: center;
        gap: 4px;
        cursor: pointer;
    }
    &-name {
    color: @main-color;
    }
}

 src/components/MyPDF/index.jsx

@@ -5,17 +5,20 @@
import { CloseCircleFilled, DownloadOutlined } from '@ant-design/icons';
import { IconAttachment } from '@arco-design/web-react/icon';
import { Document, Page, pdfjs } from 'react-pdf';
import * as docx from 'docx-preview';
import * as $$ from '@/utils/utility';
import PreviewImage from '@/components/PreviewImage';
import './index.less';

// 设置pdf.js工作器路径
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;

const appUrl = $$.appUrl;
const MyPDF = ({ name, fileUrl }) => {
const MyPDF = ({ name, fileUrl, fileType }) => {
    const [visible, setVisible] = useState(false);
    const [numPages, setNumPages] = useState(null);
    const [pageNumber, setPageNumber] = useState(1);
    const containerRef = useRef(null);

    // 成功加载PDF文件时的回调
    function onDocumentLoadSuccess({ numPages }) {
@@ -36,77 +39,101 @@
    }

    return (
        <div>
            {fileUrl ? (
                <div
                    onClick={() => {
                        setVisible(true);
                    }}
                    className="pdf-title"
                >
                    <IconAttachment style={{ color: '#1A6FB8' }} />
                    <div className="pdf-name">{name}</div>
                </div>
        <>
            {fileType === 'jpg' || fileType === 'png' ? (
                <PreviewImage name={name} src={fileUrl} />
            ) : (
                '-'
            )}

            <Modal
                style={{ width: '80%' }}
                closable={false}
                title={name}
                footer={
                    <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', gap: '10px' }}>
                        <button
                            type="button"
                            disabled={pageNumber <= 1}
                            onClick={previousPage}
                            style={{ padding: '4px 15px', cursor: pageNumber <= 1 ? 'not-allowed' : 'pointer' }}
                        >
                            上一页
                        </button>
                        <p style={{ margin: 0 }}>
                            第 {pageNumber} 页 / 共 {numPages || '--'} 页
                        </p>
                        <button
                            type="button"
                            disabled={pageNumber >= numPages}
                            onClick={nextPage}
                            style={{ padding: '4px 15px', cursor: pageNumber >= numPages ? 'not-allowed' : 'pointer' }}
                        >
                            下一页
                        </button>
                        <Button
                            type="primary"
                            icon={<DownloadOutlined />}
                <div>
                    {fileUrl ? (
                        <div
                            onClick={() => {
                                window.open(`${appUrl.fileUrl}${appUrl.fileDownUrl}${fileUrl.split('/').pop()}`);
                                setVisible(true);
                                if (fileType === 'docx' || fileType === 'doc') {
                                    const renderDocx = async () => {
                                        try {
                                            const response = await fetch(`${appUrl.fileUrl}/${appUrl.sys}${fileUrl}`);
                                            const blob = await response.blob();
                                            await docx.renderAsync(blob, containerRef.current);
                                        } catch (error) {
                                            console.error('文档加载失败', error);
                                        }
                                    };
                                    renderDocx();
                                }
                            }}
                            style={{ marginLeft: '10px' }}
                            className="pdf-title"
                        >
                            下载
                        </Button>
                    </div>
                }
                centered
                unmountOnExit={true}
                visible={visible}
                onCancel={() => {
                    setVisible(false);
                }}
            >
                <div style={{ width: '100%', height: 'calc(100vh - 200px)', display: 'flex', justifyContent: 'center', overflow: 'auto' }}>
                    <Document
                        file={`${appUrl.fileUrl}/${appUrl.sys}${fileUrl}`}
                        onLoadSuccess={onDocumentLoadSuccess}
                        loading={<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}>PDF加载中...</div>}
                        error={<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}>PDF加载失败，请稍后重试</div>}
                            <IconAttachment style={{ color: '#1A6FB8' }} />
                            <div className="pdf-name">{name}</div>
                        </div>
                    ) : (
                        '-'
                    )}

                    <Modal
                        style={{ width: '80%' }}
                        closable={false}
                        title={name}
                        footer={
                            <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', gap: '10px' }}>
                                <button
                                    type="button"
                                    disabled={pageNumber <= 1}
                                    onClick={previousPage}
                                    style={{ padding: '4px 15px', cursor: pageNumber <= 1 ? 'not-allowed' : 'pointer' }}
                                >
                                    上一页
                                </button>
                                <p style={{ margin: 0 }}>
                                    第 {pageNumber} 页 / 共 {numPages || '--'} 页
                                </p>
                                <button
                                    type="button"
                                    disabled={pageNumber >= numPages}
                                    onClick={nextPage}
                                    style={{ padding: '4px 15px', cursor: pageNumber >= numPages ? 'not-allowed' : 'pointer' }}
                                >
                                    下一页
                                </button>
                                <Button
                                    type="primary"
                                    icon={<DownloadOutlined />}
                                    onClick={() => {
                                        window.open(`${appUrl.fileUrl}${appUrl.fileDownUrl}${fileUrl.split('/').pop()}`);
                                    }}
                                    style={{ marginLeft: '10px' }}
                                >
                                    下载
                                </Button>
                            </div>
                        }
                        centered
                        unmountOnExit={true}
                        visible={visible}
                        onCancel={() => {
                            setVisible(false);
                        }}
                    >
                        <Page pageNumber={pageNumber} renderTextLayer={false} renderAnnotationLayer={false} scale={1.2} />
                    </Document>
                        <div style={{ width: '100%', height: 'calc(100vh - 200px)', display: 'flex', justifyContent: 'center', overflow: 'auto' }}>
                            {fileType === 'pdf' && (
                                <Document
                                    file={`${appUrl.fileUrl}/${appUrl.sys}${fileUrl}`}
                                    onLoadSuccess={onDocumentLoadSuccess}
                                    loading={<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}>PDF加载中...</div>}
                                    error={
                                        <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}>PDF加载失败，请稍后重试</div>
                                    }
                                >
                                    <Page pageNumber={pageNumber} renderTextLayer={false} renderAnnotationLayer={false} scale={1.2} />
                                </Document>
                            )}
                            {fileType === 'docx' && <div ref={containerRef} className="docx-container" />}
                            {fileType === 'doc' && <div ref={containerRef} className="docx-container" />}
                        </div>
                    </Modal>
                </div>
            </Modal>
        </div>
            )}
        </>
    );
};


 src/components/NewPage/index.jsx

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: ldh
 * @Date: 2022-03-04 14:29:11
 * @LastEditTime: 2024-10-24 10:25:23
 * @LastEditTime: 2025-06-12 17:24:36
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description: 页面框架
@@ -13,26 +13,42 @@
import './index.less';
import * as $$ from '../../utils/utility';
import RegisterChooseModal from '../RegisterChooseModal';
import { Watermark } from '@arco-design/web-react';

const NewPage = ({ children, pageHead, registerChooseModalVisible }) => {
  if (!$$.getSessionStorage('customerSystemToken')) {
    $$.catchApiError({ content: '抱歉！登录状态已失效请重新登录', loginStatus: 'lose' });
    return null;
  }
    if (!$$.getSessionStorage('customerSystemToken')) {
        $$.catchApiError({ content: '抱歉！登录状态已失效请重新登录', loginStatus: 'lose' });
        return null;
    }

  return (
    <>
      {!!pageHead && <PageHead {...pageHead} />}
      {children}
      {/* 纠纷登录入口modal */}
      {!!registerChooseModalVisible && <RegisterChooseModal visible={registerChooseModalVisible} />}
    </>
  );
    let customerSystemUser = $$.getSessionStorage('customerSystemUser');

    const getCurrentTime = () => {
        const now = new Date();
        const year = now.getFullYear();
        const month = String(now.getMonth() + 1).padStart(2, '0');
        const day = String(now.getDate()).padStart(2, '0');
        const hours = String(now.getHours()).padStart(2, '0');
        const minutes = String(now.getMinutes()).padStart(2, '0');
        const seconds = String(now.getSeconds()).padStart(2, '0');
        return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    };

    const watermarkContent = `${customerSystemUser.trueName} ${getCurrentTime()}`;

    return (
        <Watermark style={{ height: '100%' }} gap={[200, 200]} content={watermarkContent}>
            {!!pageHead && <PageHead {...pageHead} />}
            {children}
            {/* 纠纷登录入口modal */}
            {!!registerChooseModalVisible && <RegisterChooseModal visible={registerChooseModalVisible} />}
        </Watermark>
    );
};

NewPage.propTypes = {
  pageHead: PropTypes.any,
  registerChooseModalVisible: PropTypes.any,
    pageHead: PropTypes.any,
    registerChooseModalVisible: PropTypes.any,
};

export default NewPage;

 src/components/SelectObjModal/selectJudge.jsx

@@ -10,7 +10,7 @@

// 获取法官数据
function getDataApi(searchData) {
  return $$.ax.request({ url: 'ctUserole/listJudge', type: 'get', data: searchData, service: 'cust' });
    return $$.ax.request({ url: 'ctUserole/listJudge', type: 'get', data: searchData, service: 'cust' });
}

/**
@@ -22,94 +22,99 @@
 * onOk, // 点击确定的回调
 */
const SelectObjModal = ({ visible = false, courtId, checkKeys = [], nameStr, isCheckbox = false, searchData = {}, onClose, onOk }) => {
  const [data, setData] = useState([]);
    const [data, setData] = useState([]);

  const [checkedKeys, setCheckedKeys] = useState({ keys: [], items: [] });
    const [checkedKeys, setCheckedKeys] = useState({ keys: [], items: [] });

  const [expandedKeys, setExpandedKeys] = useState([]);
    const [expandedKeys, setExpandedKeys] = useState([]);

  const [searchValue, setSearchValue] = useState('');
    const [searchValue, setSearchValue] = useState('');

  const [autoExpandParent, setAutoExpandParent] = useState(true);
    const [autoExpandParent, setAutoExpandParent] = useState(true);

  const [dataList, setDataList] = useState([]);
    const [dataList, setDataList] = useState([]);

  // tree复选框选择
  function handleCheck(checkedKeys, e) {
    if (!isCheckbox && checkedKeys.checked.length > 1) {
      $$.info({ type: 'warning', content: '当前选择只可单选' });
      return;
    }
    let checkedNodes = e.checkedNodes;
    checkedNodes.forEach((x) => delete x.children);
    setCheckedKeys({ keys: checkedKeys.checked, items: checkedNodes });
  }
    // tree复选框选择
    function handleCheck(checkedKeys, e) {
        if (!isCheckbox && checkedKeys.checked.length > 1) {
            $$.info({ type: 'warning', content: '当前选择只可单选' });
            return;
        }
        let checkedNodes = e.checkedNodes;
        checkedNodes.forEach((x) => delete x.children);
        setCheckedKeys({ keys: checkedKeys.checked, items: checkedNodes });
    }

  // 删除选项
  function handleDelete(t) {
    checkedKeys.keys.splice(t, 1);
    checkedKeys.items.splice(t, 1);
    setCheckedKeys({ ...checkedKeys });
  }
    // 删除选项
    function handleDelete(t) {
        checkedKeys.keys.splice(t, 1);
        checkedKeys.items.splice(t, 1);
        setCheckedKeys({ ...checkedKeys });
    }

  // 搜索
  useEffect(() => {
    if (!visible) return;
    const arr = [];
    const generateList = (data) => {
      for (let i = 0; i < data.length; i++) {
        const node = data[i];
        const { value, label } = node;
        arr.push({ value, label });
        if (node.children) {
          generateList(node.children);
        }
      }
    };
    generateList(data);
    setDataList(arr);
    handleSearch('', arr);
  }, [data]);
  
    // 搜索
    useEffect(() => {
        if (!visible) return;
        const arr = [];
        const generateList = (data) => {
            for (let i = 0; i < data.length; i++) {
                const node = data[i];
                const { value, label } = node;
                arr.push({ value, label });
                if (node.children) {
                    generateList(node.children);
                }
            }
        };
        generateList(data);
        setDataList(arr);
        handleSearch('', arr);
    }, [data]);

  const getParentKey = (key, tree) => {
    let parentKey;
    for (let i = 0; i < tree.length; i++) {
      const node = tree[i];
      if (node.children) {
        if (node.children.some((item) => item.value === key)) {
          parentKey = node.value;
        } else if (getParentKey(key, node.children)) {
          parentKey = getParentKey(key, node.children);
        }
      }
    }
    return parentKey;
  };
    const getParentKey = (key, tree) => {
        let parentKey;
        for (let i = 0; i < tree.length; i++) {
            const node = tree[i];
            if (node.children) {
                if (node.children.some((item) => item.value === key)) {
                    parentKey = node.value;
                } else if (getParentKey(key, node.children)) {
                    parentKey = getParentKey(key, node.children);
                }
            }
        }
        return parentKey;
    };

  function handleSearch(value, dataList) {
    function handleSearch(value, dataList) {
        console.log('value, dataList', value, dataList);
        const newExpandedKeys = dataList
            .map((item) => {
                if (item.label.indexOf(value) > -1) {
                    return getParentKey(item.value, data);
                }
                return null;
            })
            .filter((item, i, self) => item && self.indexOf(item) === i);

    console.log('value, dataList', value, dataList);
    const newExpandedKeys = dataList
      .map((item) => {
        if (item.label.indexOf(value) > -1) {
          return getParentKey(item.value, data);
        }
        return null;
      })
      .filter((item, i, self) => item && self.indexOf(item) === i);

    console.log('newExpandedKeys', newExpandedKeys);
    setExpandedKeys(newExpandedKeys);
    setSearchValue(value);
    setAutoExpandParent(true);
  }
        console.log('newExpandedKeys', newExpandedKeys);
        setExpandedKeys(newExpandedKeys);
        setSearchValue(value);
        setAutoExpandParent(true);
    }

  const treeData = useMemo(() => {
    const loop = (data) =>
      data.map((item) => {
    const loop = (data) => {
      const copiedData = JSON.parse(JSON.stringify(data));
      return copiedData.map((item, idx) => {
        const strTitle = item.label;
        const index = strTitle.indexOf(searchValue);

        // 只保留包含 searchValue 的项
        if (index <= -1 && !item.children) {
          return null; // 返回 null 表示不包含在最终结果中
        }

        const beforeStr = strTitle.substring(0, index);
        const afterStr = strTitle.slice(index + searchValue.length);
        const label =
@@ -122,113 +127,122 @@
          ) : (
            <span>{strTitle}</span>
          );

        if (item.children) {
          const filteredChildren = loop(item.children).filter(Boolean); // 递归处理子项并过滤掉 null
          return {
            label,
            name: strTitle,
            value: item.value,
            checkable: item.checkable,
            children: loop(item.children),
            children: filteredChildren.length > 0 ? filteredChildren : undefined,
          };
        }

        return {
          label,
          name: strTitle,
          checkable: item.checkable,
          value: item.value,
        };
      });
    // data = data.filter(i => i.label?.indexOf(searchValue) > -1);
    // console.log('data.filter',data.filter(i => i.label?.indexOf(searchValue) > -1));
    console.log('loop(data)', loop(data));
      }).filter(Boolean); // 过滤掉 null
    };

    return loop(data);

  }, [searchValue, data]);

    useEffect(() => {
        if (!visible) return;
        // 获取数据
        async function getData() {
            global.setSpinning(true);
            const res = await getDataApi({ courtId });
            global.setSpinning(false);
            if (res.type) {
                setData(res.data || []);
            }
        }
        if (checkKeys.length !== 0) {
            let keys = [];
            checkKeys.forEach((x) => keys.push(x.value));
            setCheckedKeys({ keys, items: checkKeys });
        } else {
            setCheckedKeys({ keys: [], items: [] });
        }
        getData();
    }, [visible]);

  useEffect(() => {
    if (!visible) return;
    // 获取数据
    async function getData() {
      global.setSpinning(true);
      const res = await getDataApi({ courtId });
      global.setSpinning(false);
      if (res.type) {
        setData(res.data || []);
      }
    }
    if (checkKeys.length !== 0) {
      let keys = [];
      checkKeys.forEach((x) => keys.push(x.value));
      setCheckedKeys({ keys, items: checkKeys });
    } else {
      setCheckedKeys({ keys: [], items: [] });
    }
    getData();
  }, [visible]);

  return (
    <MyModal visible={!!visible} title={`选择${nameStr}`} width={560} footer={false} onCancel={onClose}>
      <div className="selectObjModal-main">
        <div className="selectObjModal-left">
          <div className="selectObjModal-left-search">
            <Search placeholder={`查询${nameStr}名称`} onChange={(e) => handleSearch(e.target.value, dataList)} />
          </div>
          <div className="selectObjModal-left-main">
            {data.length > 0 ? (
              <Tree
                checkable
                checkStrictly
                defaultExpandAll
                onExpand={(newExpandedKeys) => {
                  setExpandedKeys(newExpandedKeys);
                  setAutoExpandParent(false);
                }}
                expandedKeys={expandedKeys}
                autoExpandParent={autoExpandParent}
                selectable={false}
                onCheck={(checkedKeys, e) => handleCheck(checkedKeys, e)}
                checkedKeys={checkedKeys.keys}
                treeData={treeData}
                fieldNames={{ title: 'label', key: 'value' }}
              />
            ) : (
              $$.MyEmpty()
            )}
          </div>
        </div>
        <div className="selectObjModal-right">
          {checkedKeys.items.map((x, t) => (
            <div className="selectObjModal-right-item" key={x.value}>
              <span className="selectObjModal-right-item-name">{x.label}</span>
              <CloseOutlined onClick={() => handleDelete(t)} className="selectObjModal-right-item-icon" />
            </div>
          ))}
          {checkedKeys.items.length === 0 && <div className="selectObjModal-none">{$$.MyEmpty({ description: '尚未选择' + nameStr })}</div>}
        </div>
      </div>
      <div className="selectObjModal-footer">
        <div>已选中：{checkedKeys.keys.length}人</div>
        <Space size="middle">
          <Button onClick={onClose}>取消</Button>
          <Button type="primary" onClick={() => onOk && onOk(checkedKeys)}>
            确定
          </Button>
        </Space>
      </div>
    </MyModal>
  );
    return (
        <MyModal visible={!!visible} title={`选择${nameStr}`} width={560} footer={false} onCancel={onClose}>
            <div className="selectObjModal-main">
                <div className="selectObjModal-left">
                    <div className="selectObjModal-left-search">
                        <Search
                            placeholder={`查询${nameStr}名称`}
                            onSearch={(e) => {
                                // handleSearch('', dataList)
                                if (!e) {
                                    handleSearch('', dataList);
                                } else {
                                    handleSearch(e, dataList);
                                }
                            }}
                        />
                    </div>
                    <div className="selectObjModal-left-main">
                        {data.length > 0 ? (
                            <Tree
                                checkable
                                checkStrictly
                                defaultExpandAll
                                onExpand={(newExpandedKeys) => {
                                    setExpandedKeys(newExpandedKeys);
                                    setAutoExpandParent(false);
                                }}
                                expandedKeys={expandedKeys}
                                autoExpandParent={autoExpandParent}
                                selectable={false}
                                onCheck={(checkedKeys, e) => handleCheck(checkedKeys, e)}
                                checkedKeys={checkedKeys.keys}
                                treeData={treeData}
                                fieldNames={{ title: 'label', key: 'value' }}
                            />
                        ) : (
                            $$.MyEmpty()
                        )}
                    </div>
                </div>
                <div className="selectObjModal-right">
                    {checkedKeys.items.map((x, t) => (
                        <div className="selectObjModal-right-item" key={x.value}>
                            <span className="selectObjModal-right-item-name">{x.label}</span>
                            <CloseOutlined onClick={() => handleDelete(t)} className="selectObjModal-right-item-icon" />
                        </div>
                    ))}
                    {checkedKeys.items.length === 0 && <div className="selectObjModal-none">{$$.MyEmpty({ description: '尚未选择' + nameStr })}</div>}
                </div>
            </div>
            <div className="selectObjModal-footer">
                <div>已选中：{checkedKeys.keys.length}人</div>
                <Space size="middle">
                    <Button onClick={onClose}>取消</Button>
                    <Button type="primary" onClick={() => onOk && onOk(checkedKeys)}>
                        确定
                    </Button>
                </Space>
            </div>
        </MyModal>
    );
};

SelectObjModal.propTypes = {
  visible: PropTypes.any,
  checkKeys: PropTypes.array,
  type: PropTypes.string,
  isCheckbox: PropTypes.bool,
  searchData: PropTypes.object,
  onClose: PropTypes.func,
  onOk: PropTypes.func,
    visible: PropTypes.any,
    checkKeys: PropTypes.array,
    type: PropTypes.string,
    isCheckbox: PropTypes.bool,
    searchData: PropTypes.object,
    onClose: PropTypes.func,
    onOk: PropTypes.func,
};

export default SelectObjModal;

 src/components/SelectObjModal/selectPerson.jsx

@@ -19,6 +19,7 @@
const txtMap = {
  supUnit: '组织',
  dept: '部门',
  dept_union: '部门',
  person: '人',
  unit: '组织'
}
@@ -30,6 +31,9 @@
    case 'dept':
      url = `ctUnit/unitChoose`
      break;
    case 'dept_union':
      url = `ctUnit/unitChoose4Union`
      break;
    case 'person':
      url = 'ctUser/userChoose'
      break

 src/components/personCard/DetailDialog.jsx

@@ -1,510 +1,523 @@
import React, { useEffect, useState } from 'react'
import KeyVisits from "./KeyVisits";
import React, { useEffect, useState } from 'react';
import KeyVisits from './KeyVisits';
import { majorStatus_1 } from '@/assets/images';
import { Scrollbars } from "react-custom-scrollbars";
import { Scrollbars } from 'react-custom-scrollbars';
import PreviewImage from '../PreviewImage';
import MyPDF from '../MyPDF';
import { checkIdCard } from "../../utils/utility";
import { checkIdCard } from '../../utils/utility';
import { Tooltip } from '@arco-design/web-react';
import * as $$ from '@/utils/utility';
const appUrl = $$.appUrl;

// 重点人员信息
function getLabelInfoApi(data) {
  return $$.ax.request({ url: `special/getLabelInfo`, type: 'post', serviceType: 'thrid', service: 'sys', data });
    return $$.ax.request({ url: `special/getLabelInfo`, type: 'post', serviceType: 'thrid', service: 'sys', data });
}

// 个人案件统计
function countPersonApi(data) {
  return $$.ax.request({ url: `caseInfo/countPerson`, type: 'get', service: 'mediate', data });
    return $$.ax.request({ url: `caseInfo/countPerson`, type: 'get', service: 'mediate', data });
}
// 个人案件查询
function pagePersonApi(data) {
  return $$.ax.request({ url: `/caseInfo/pagePerson`, type: 'get', service: 'mediate', data });
    return $$.ax.request({ url: `/caseInfo/pagePerson`, type: 'get', service: 'mediate', data });
}

export default function DetailDialog(props) {
  const nuturalList = [
    [
      {
        label: '姓名',
        perClass: '',
        value: '',
        isName: true,//判断是否是姓名标签
        field: 'trueName',
      },
      {
        label: '联系方式',
        value: '',
        field: 'mobile',
      },
    ],
    [
      {
        label: '证件类型',
        value: '',
        field: 'certiTypeName',
      },
      {
        label: '证件号码',
        value: '',
        field: 'certiNo',
      },
    ],
    [
      {
        label: '联系地址',
        value: '',
        field: 'addr',
      },
      {
        label: '户籍地址',
        value: '',
        field: 'placeAddr',
      },
    ],
    [
      {
        label: '工作单位',
        value: '',
        field: 'workUnit',
      },
      {
        label: '民族',
        value: '',
        field: 'nationName',
      },
    ],
    [
      {
        label: '性别',
        value: '',
        field: 'sexName',
      },
      {
        label: '年龄',
        value: '',
        field: 'age',
      },
    const nuturalList = [
        [
            {
                label: '姓名',
                perClass: '',
                value: '',
                isName: true, //判断是否是姓名标签
                field: 'trueName',
            },
            {
                label: '联系方式',
                value: '',
                field: 'mobile',
            },
        ],
        [
            {
                label: '证件类型',
                value: '',
                field: 'certiTypeName',
            },
            {
                label: '证件号码',
                value: '',
                field: 'certiNo',
            },
        ],
        [
            {
                label: '联系地址',
                value: '',
                field: 'addr',
            },
            {
                label: '户籍地址',
                value: '',
                field: 'placeAddr',
            },
        ],
        [
            {
                label: '工作单位',
                value: '',
                field: 'workUnit',
            },
            {
                label: '民族',
                value: '',
                field: 'nationName',
            },
        ],
        [
            {
                label: '性别',
                value: '',
                field: 'sexName',
            },
            {
                label: '年龄',
                value: '',
                field: 'age',
            },
        ],
        [
            {
                label: '身份证明材料',
                value: '',
                isFile: true,
                field: 'file',
            },
            {
                label: '是否有个人极端倾向',
                value: '',
                field: 'extreme',
            },
        ],
    ];
    const legalList = [
        [
            {
                label: '企业名称',
                perClass: '',
                value: '',
                isName: true, //判断是否是姓名标签
                field: 'trueName',
            },
            {
                label: '联系方式',
                value: '',
                field: 'mobile',
            },
        ],
        [
            {
                label: '企业所在地',
                value: '',
                field: 'addr',
            },
            {
                label: '统一社会信用代码',
                value: '',
                field: 'orgaCode',
            },
        ],
        [
            {
                label: '法定代表人',
                value: '',
                field: 'deputy',
            },
            {
                label: '企业类型',
                value: '',
                field: 'orgaTypeName',
            },
        ],
        [
            {
                label: '住所',
                value: '',
                field: 'placeAddr',
                isRow: true,
            },
        ],
        [
            {
                label: '登记企业材料',
                value: '',
                isFile: true,
                field: 'file',
            },
            {
                label: '法定代表人身份证明材料',
                value: '',
                isFile: true,
                field: 'file1',
            },
        ],
    ];
    const organizationList = [
        [
            {
                label: '机构名称',
                perClass: '',
                value: '',
                isName: true, //判断是否是姓名标签
                field: 'trueName',
            },
            {
                label: '联系方式',
                value: '',
                field: 'mobile',
            },
        ],
        [
            {
                label: '机构所在地',
                value: '',
                field: 'addr',
            },
            {
                label: '机构组织代码',
                value: '',
                field: 'orgaCode',
            },
        ],
        [
            {
                label: '机构代表人',
                value: '',
                field: 'deputy',
            },
            {
                label: '机构类型',
                value: '',
                field: 'orgaTypeName',
            },
        ],
        [
            {
                label: '住所',
                value: '',
                field: 'placeAddr',
                isRow: true,
            },
        ],
        [
            {
                label: '机构登记材料',
                value: '',
                isFile: true,
                field: 'file',
            },
            {
                label: '机构代表人身份证明材料',
                value: '',
                isFile: true,
                field: 'file1',
            },
        ],
    ];
    const agentList = [
        [
            {
                label: '姓名',
                perClass: '',
                value: '',
                isName: true, //判断是否是姓名标签
                field: 'trueName',
            },
            {
                label: '联系方式',
                value: '',
                field: 'mobile',
            },
        ],
        [
            {
                label: '证件类型',
                value: '',
                field: 'certiTypeName',
            },
            {
                label: '证件号码',
                value: '',
                field: 'certiNo',
            },
        ],
        [
            {
                label: '联系地址',
                value: '',
                field: 'addr',
            },
            {
                label: '户籍地址',
                value: '',
                field: 'placeAddr',
            },
        ],
        [
            {
                label: '工作单位',
                value: '',
                field: 'workUnit',
            },
            {
                label: '民族',
                value: '',
                field: 'nationName',
            },
        ],
        [
            {
                label: '性别',
                value: '',
                field: 'sexName',
            },
            {
                label: '是否有个人极端倾向',
                value: '',
                field: 'extreme',
            },
        ],
        [
            {
                label: '委托关系',
                value: '',
                field: 'agentRelateName',
            },
            {
                label: '委托类型',
                value: '',
                field: 'agentTypeName',
            },
        ],
        [
            {
                label: '代理对象',
                value: '',
                field: 'personId',
                isRow: true,
            },
        ],
        [
            {
                label: '身份证明材料',
                value: '',
                isFile: true,
                field: 'file',
            },
            {
                label: '代理人授权委托书',
                value: '',
                isFile: true,
                field: 'file1',
            },
        ],
    ];
    const [tableList, setTableList] = useState([]);
    const [certiNo, setCertiNo] = useState('');
    const [certiShow, setCertiShow] = useState(false);
    // 反应诉求记录
    const [hisData, setHisData] = useState({});
    const [labelInfo, setLabelInfo] = useState([]);
    const [fakeData, setFakeData] = useState({ tableData: [] });
    const [search, setSearch] = useState({ page: 1, size: 5 });

    ],
    [
      {
        label: '身份证明材料',
        value: '',
        isFile: true,
        field: 'file',
      },
      {
        label: '是否有个人极端倾向',
        value: '',
        field: 'extreme',
      },
    ],
  ]
  const legalList = [
    [
      {
        label: '企业名称',
        perClass: '',
        value: '',
        isName: true,//判断是否是姓名标签
        field: 'trueName',
      },
      {
        label: '联系方式',
        value: '',
        field: 'mobile',
      },
    ],
    [
      {
        label: '企业所在地',
        value: '',
        field: 'addr',
      },
      {
        label: '统一社会信用代码',
        value: '',
        field: 'orgaCode',
      },
    ],
    [
      {
        label: '法定代表人',
        value: '',
        field: 'deputy',
      },
      {
        label: '企业类型',
        value: '',
        field: 'orgaTypeName',
      },
    ],
    [
      {
        label: '住所',
        value: '',
        field: 'placeAddr',
        isRow: true
      },
    ],
    [
      {
        label: '登记企业材料',
        value: '',
        isFile: true,
        field: 'file',
      },
      {
        label: '法定代表人身份证明材料',
        value: '',
        isFile: true,
        field: 'file1',
      },
    ],
  ]
  const organizationList = [
    [
      {
        label: '机构名称',
        perClass: '',
        value: '',
        isName: true,//判断是否是姓名标签
        field: 'trueName',
      },
      {
        label: '联系方式',
        value: '',
        field: 'mobile',
      },
    ],
    [
      {
        label: '机构所在地',
        value: '',
        field: 'addr',
      },
      {
        label: '机构组织代码',
        value: '',
        field: 'orgaCode',
      },
    ],
    [
      {
        label: '机构代表人',
        value: '',
        field: 'deputy',
      },
      {
        label: '机构类型',
        value: '',
        field: 'orgaTypeName',
      },
    ],
    [
      {
        label: '住所',
        value: '',
        field: 'placeAddr',
        isRow: true
      },
    ],
    [
      {
        label: '机构登记材料',
        value: '',
        isFile: true,
        field: 'file',
      },
      {
        label: '机构代表人身份证明材料',
        value: '',
        isFile: true,
        field: 'file1',
      },
    ],
  ]
  const agentList = [
    [
      {
        label: '姓名',
        perClass: '',
        value: '',
        isName: true,//判断是否是姓名标签
        field: 'trueName',
      },
      {
        label: '联系方式',
        value: '',
        field: 'mobile',
      },
    ],
    [
      {
        label: '证件类型',
        value: '',
        field: 'certiTypeName',
      },
      {
        label: '证件号码',
        value: '',
        field: 'certiNo',
      },
    ],
    [
      {
        label: '联系地址',
        value: '',
        field: 'addr',
      },
      {
        label: '户籍地址',
        value: '',
        field: 'placeAddr',
      },
    ],
    [
      {
        label: '工作单位',
        value: '',
        field: 'workUnit',
      },
      {
        label: '民族',
        value: '',
        field: 'nationName',
      },
    ],
    [
      {
        label: '性别',
        value: '',
        field: 'sexName',
      },
      {
        label: '是否有个人极端倾向',
        value: '',
        field: 'extreme',
      },
    ],
    [
      {
        label: '委托关系',
        value: '',
        field: 'agentRelateName',
      },
      {
        label: '委托类型',
        value: '',
        field: 'agentTypeName',
      },
    ],
    [
      {
        label: '代理对象',
        value: '',
        field: 'personId',
        isRow: true
      },
    ],
    [
      {
        label: '身份证明材料',
        value: '',
        isFile: true,
        field: 'file',
      },
      {
        label: '代理人授权委托书',
        value: '',
        isFile: true,
        field: 'file1',
      },
    ],
  ]
  const [tableList, setTableList] = useState([])
  const [certiNo, setCertiNo] = useState('');
  const [certiShow, setCertiShow] = useState(false);
  // 反应诉求记录
  const [hisData, setHisData] = useState({});
  const [labelInfo, setLabelInfo] = useState([]);
  const [fakeData, setFakeData] = useState({ tableData: [] });
  const [search, setSearch] = useState({ page: 1, size: 5 });
    function getAllApi(num) {
        countPerson(num);
        pagePerson({ ...search, certiNo: num });
    }

  function getAllApi(num) {
    countPerson(num)
    pagePerson({ ...search, certiNo: num })
  }
    // 根据个人身份证号查询重点人员信息
    async function getLabelInfo(idCard) {
        const res = await getLabelInfoApi({ idNumber: idCard });
        if (res.type) {
            let data = res.data || {};
            console.log('res.data', res.data);
            setLabelInfo(data?.labelList);
        }
    }

  // 根据个人身份证号查询重点人员信息
  async function getLabelInfo(idCard) {
    const res = await getLabelInfoApi({ idNumber: idCard })
    if (res.type) {
      let data = res.data || {};
      console.log('res.data', res.data);
      setLabelInfo(data?.labelList)
    }
  }
    // 个人案件统计
    async function countPerson(idCard) {
        const res = await countPersonApi({ certiNo: idCard });
        if (res.type) {
            setHisData(res.data || {});
        }
    }

  // 个人案件统计
  async function countPerson(idCard) {
    const res = await countPersonApi({ certiNo: idCard })
    if (res.type) {
      setHisData(res.data || {})
    }
  }
    // 个人案件查询
    async function pagePerson(submitData) {
        global.setSpinning(true);
        const res = await pagePersonApi(submitData);
        global.setSpinning(false);
        if (res.type) {
            setSearch(submitData);
            setFakeData({
                total: res?.data?.totalElements || 0,
                tableData: res?.data?.content || [],
            });
        }
    }

  // 个人案件查询
  async function pagePerson(submitData) {
    global.setSpinning(true);
    const res = await pagePersonApi(submitData);
    global.setSpinning(false);
    if (res.type) {
      setSearch(submitData);
      setFakeData({
        total: res?.data?.totalElements || 0,
        tableData: res?.data?.content || [],
      });
    }
  }
    // 页码修改
    function handleChangePage(page, pageSize, field, order) {
        let paramsObj = Object.assign(search, { page, size: pageSize });
        paramsObj = { ...paramsObj };
        setSearch(paramsObj);

  // 页码修改
  function handleChangePage(page, pageSize, field, order) {
    let paramsObj = Object.assign(search, { page, size: pageSize });
    paramsObj = { ...paramsObj }
    setSearch(paramsObj);
        pagePerson(paramsObj);
    }

    pagePerson(paramsObj);
  }
    useEffect(() => {
        if (checkIdCard(props.editData?.certiNo)) {
            setCertiShow(true);
            setCertiNo(props.editData?.certiNo);
            getAllApi(props.editData?.certiNo);
        }
        const data = props.editData;
        let newList;
        let mapList = [];
        if (data.perClass === '09_01001-1') {
            //自然人
            mapList = nuturalList;
        }
        if (data.perClass === '09_01001-2') {
            //法人组织
            mapList = legalList;
        }
        if (data.perClass === '09_01001-3') {
            //非法人组织
            mapList = organizationList;
        }
        if (data.perType === '24_00006-1' || data.perType === '24_00006-2') {
            //代理人
            mapList = agentList;
        }
        newList = mapList.map((item) => {
            return item.map((res) => {
                if (res.isFile) {
                    return {
                        ...res,
                        value: (
                            <>
                                {data[res.field]?.map((item, index) => {
                                    if (item.response) {
                                        //新上传的，前端数据
                                        const newData = item.response.data[0];
                                        return (
                                            <div style={{ display: 'inline-block' }}>
                                                <MyPDF key={index} name={newData.name} fileUrl={newData.showUrl} fileType={newData.suffix} />
                                                {index !== data[res.field].length - 1 && <>，</>}
                                            </div>
                                        );
                                    } else {
                                        return (
                                            <div style={{ display: 'inline-block' }}>
                                                <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                {index !== data[res.field].length - 1 && <>，</>}
                                            </div>
                                        );
                                    }
                                })}
                            </>
                        ),
                    };
                }
                if (res.isName) {
                    return {
                        ...res,
                        value: data[res.field],
                        perClass: data.perClassName || data.perTypeName,
                    };
                } else {
                    if (res.field === 'personId') {
                        const filterValue = props.personData
                            .filter((result) => data[res.field].indexOf(result.id) != -1)
                            .map((result) => result.trueName)
                            .join(',');
                        return {
                            ...res,
                            value: filterValue,
                        };
                    } else if (res.field === 'extreme') {
                        return {
                            ...res,
                            label: (
                                <div
                                    style={{
                                        padding: '8px',
                                        display: 'flex',
                                        gap: '8px',
                                        alignItems: 'center',
                                        color: data[res.field] === 1 ? '#F53F3F' : 'inherit',
                                    }}
                                    className="title-text-red"
                                >
                                    {data[res.field] === 1 && <img src={majorStatus_1} alt="" srcset="" />}
                                    <Tooltip content="是否有个人极端倾向">{$$.ellipsis('是否有个人极端倾向', 6)}</Tooltip>
                                </div>
                            ),
                            value: data[res.field] === 1 ? '是' : data[res.field] === 0 ? '否' : '-',
                        };
                    } else {
                        return {
                            ...res,
                            value: data[res.field],
                        };
                    }
                }
            });
        });

  useEffect(() => {
    if (checkIdCard(props.editData?.certiNo)) {
      setCertiShow(true)
      setCertiNo(props.editData?.certiNo)
      getAllApi(props.editData?.certiNo)
    }
    const data = props.editData
    let newList
    let mapList = []
    if (data.perClass === "09_01001-1") {
      //自然人
      mapList = nuturalList
    }
    if (data.perClass === "09_01001-2") {
      //法人组织
      mapList = legalList
    }
    if (data.perClass === "09_01001-3") {
      //非法人组织
      mapList = organizationList
    }
    if (data.perType === "24_00006-1" || data.perType === "24_00006-2") {
      //代理人
      mapList = agentList
    }
    newList = mapList.map(item => {
      return item.map(res => {
        if (res.isFile) {
          return {
            ...res,
            value: <>
              {data[res.field]?.map((item, index) => {
                if (item.response) {
                  //新上传的，前端数据
                  const newData = item.response.data[0]
                  return <div style={{ display: 'inline-block' }}>
                    {newData.suffix === 'pdf' ? <MyPDF name={newData.name} fileUrl={newData.showUrl} /> : <PreviewImage name={newData.name} src={newData.showUrl} />}
                    {index !== data[res.field].length - 1 && <>，</>}
                  </div>
                } else {
                  return <div style={{ display: 'inline-block' }}>
                    {item.suffix === 'pdf' ? <MyPDF name={item.name} fileUrl={item.showUrl} /> : <PreviewImage name={item.name} src={item.showUrl} />}
                    {index !== data[res.field].length - 1 && <>，</>}
                  </div>
                }
              })}
            </>
          }
        }
        if (res.isName) {
          return {
            ...res,
            value: data[res.field],
            perClass: data.perClassName || data.perTypeName
          }
        } else {
          if (res.field === 'personId') {
            const filterValue = props.personData.filter(result => data[res.field].indexOf(result.id) != -1).map(result => result.trueName).join(',')
            return {
              ...res,
              value: filterValue
            }
          } else if (res.field === 'extreme') {
            return {
              ...res,
              label: <div style={{ 
                padding: '8px', 
                display: 'flex', 
                gap: '8px', 
                alignItems: 'center',
                color: data[res.field] === 1 ? '#F53F3F' : 'inherit'
              }} className='title-text-red'>
                {data[res.field] === 1 && <img src={majorStatus_1} alt="" srcset="" />}
                <Tooltip content='是否有个人极端倾向'>{$$.ellipsis('是否有个人极端倾向', 6)}</Tooltip>
              </div>,
              value: data[res.field] === 1 ? '是' : data[res.field] === 0 ? '否' : '-'
            }
          } else {
            return {
              ...res,
              value: data[res.field]
            }
          }
        }
      })
    })
        setTableList(newList);
    }, []);

    setTableList(newList)
  }, [])


  return (
    <Scrollbars
      autoHide
      autoHeight
      autoHeightMin={200} // 最小高度为300px
      autoHeightMax={590}
    >
      <table border="1" align="center" cellpadding="8" className="table" style={{ marginBottom: '20px' }}>
        {
          tableList?.map((item, index) => {
            return <tr key={'tableList' + index}>
              {
                item?.map(res => {
                  return <>
                    <th bgcolor="#F7F8FA" className="table-title" width={150}>{res.label}</th>
                    <td width={320} colspan={res.isRow ? '3' : '1'}>
                      <div style={{ display: 'flex', minHeight: '22px' }}>
                        <div>{res.value}</div>
                        {res.isName && <div className="title-personRemark1">{res.perClass}</div>}
                      </div>
                    </td>
                  </>
                })
              }
            </tr>
          })
        }
      </table>
      {/* 重复来访重点人员 */}
      {
        certiShow &&
        <div style={{ width: 'calc(100% - 9px)', background: '#f2f3f5', marginBottom: '20px', padding: '12px' }}>
          <KeyVisits labelInfo={labelInfo} data={hisData} fakeData={fakeData} search={search} handleChangePage={handleChangePage} />
        </div>
      }
    </Scrollbars>
  )
    return (
        <Scrollbars
            autoHide
            autoHeight
            autoHeightMin={200} // 最小高度为300px
            autoHeightMax={590}
        >
            <table border="1" align="center" cellpadding="8" className="table" style={{ marginBottom: '20px' }}>
                {tableList?.map((item, index) => {
                    return (
                        <tr key={'tableList' + index}>
                            {item?.map((res) => {
                                return (
                                    <>
                                        <th bgcolor="#F7F8FA" className="table-title" width={150}>
                                            {res.label}
                                        </th>
                                        <td width={320} colspan={res.isRow ? '3' : '1'}>
                                            <div style={{ display: 'flex', minHeight: '22px' }}>
                                                <div>{res.value}</div>
                                                {res.isName && <div className="title-personRemark1">{res.perClass}</div>}
                                            </div>
                                        </td>
                                    </>
                                );
                            })}
                        </tr>
                    );
                })}
            </table>
            {/* 重复来访重点人员 */}
            {certiShow && (
                <div style={{ width: 'calc(100% - 9px)', background: '#f2f3f5', marginBottom: '20px', padding: '12px' }}>
                    <KeyVisits labelInfo={labelInfo} data={hisData} fakeData={fakeData} search={search} handleChangePage={handleChangePage} />
                </div>
            )}
        </Scrollbars>
    );
}

 src/utils/selectOption.js

@@ -496,10 +496,6 @@
        label: '待分派',
    },
    {
        value: '2',
        label: '待签收',
    },
    {
        value: '3',
        label: '待受理',
    },
@@ -1512,7 +1508,20 @@
    },
]


const systemSource = [
    {
        value: '0',
        label: '市平台',
    },
    {
        value: '1',
        label: '白云区平台',
    },
]

const obj = {
    systemSource,
    caseCanal,
    visitWay,
    personType,

 src/utils/utility.js

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: ldh
 * @Date: 2022-02-16 11:57:54
 * @LastEditTime: 2025-05-30 16:51:32
 * @LastEditTime: 2025-06-10 17:40:29
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description: 公共模块方法
@@ -18,7 +18,7 @@
import { empty } from '@/assets/images';

export const isDebug = false; // 是否开发环境
export const isTest = false; // 是否测试环境
export const isTest = true; // 是否测试环境

export const appUrl = isDebug ? debug : isTest ? test : web; // api


 src/views/comprehensive/index.jsx

@@ -289,13 +289,14 @@
              { type: 'RangePicker', name: 'fileTime', label: '归档时间', shortcutsPlacementLeft: true, shortcuts: $$.shortcutsList(), span: 8 },
              { type: 'Cascader', name: 'caseType', label: '纠纷类型', placeholder: '请选择', span: 8, changeSelect: true, treedata: $$.caseTypeSelect.caseTypeSelect },
              { type: 'Select', name: 'mediResult', label: '化解结果', placeholder: '请选择', span: 8, selectdata: $$.options.mediResult },
              { type: 'Input', name: 'caseRef', label: '事项编号' },
              { type: 'Select', name: 'canal', label: '事项来源', placeholder: '请选择', span: 8, selectdata: $$.options.caseCanal },
              { type: 'Select', name: 'status', label: '事项状态', placeholder: '请选择', span: 8, selectdata: $$.options.caseStatus },
              { type: 'Select', name: 'caseLevel', label: '事项等级', placeholder: '请选择', span: 8, selectdata: $$.options.caseLevelList },
              { type: 'Select', name: 'systemSource', label: '系统来源', placeholder: '请选择', span: 8, selectdata: $$.options.systemSource },
              { type: 'Input', name: 'inputUnitName', label: '登记机构' },
              { type: 'searchButton', name: 'mediateUnitId', maxLength: 0, onClear: () => { console.log('clear'); setSelectObjModalData({ ...selectObjModalData, mediateUnitId: {} }); form.setFieldValue('mediateUnitId', '') }, onSearch: () => { onChange('mediateUnitId') }, searchButton: '选择', placeholder: '请选择', label: '承办部门' },
              { type: 'searchButton', name: 'assistUnitId', maxLength: 0, onClear: () => { setSelectObjModalData({ ...selectObjModalData, assistUnitId: {} }); form.setFieldValue('assistUnitId', '') }, onSearch: () => { onChange('assistUnitId') }, searchButton: '选择', placeholder: '请选择', label: '配合部门' },
              { type: 'Input', name: 'caseRef', label: '事项编号' },
              { type: 'Input', name: 'plaintiffs', label: '申请方', labelStyle: { width: '56px' } },
              { type: 'Input', name: 'defendants', label: '被申请方' },
              { type: 'Select', name: 'peopleNum', placeholder: '请选择', label: '涉及人数', selectdata: $$.options.peopleNum },
@@ -306,6 +307,7 @@
              { type: 'Select', name: 'isRisk', placeholder: '请选择', label: '是否扬言极端', selectdata: [{ label: '是', value: '1' }, { label: '否', value: '0' }] },
              { type: 'Select', name: 'agreeType', placeholder: '请选择', label: '结案协议类型', selectdata: $$.options.caseAgreeType },
              { type: 'Select', name: 'repeatCase', placeholder: '请选择', label: '合并事项', selectdata: $$.options.repeatCase },
              { type: 'Input', name: 'caseCityCode', label: '市民编号' },
            ]}
            handleReset={() => {
              form.resetFields();

 src/views/disputeLedger/index.jsx

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: lwh
 * @Date: 2024-09-14 15:59:17
 * @LastEditTime: 2025-06-04 21:18:43
 * @LastEditTime: 2025-06-14 11:35:43
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description:
@@ -383,17 +383,10 @@
                            >
                                <div>
                                    <div className="disputeLedger-card-content">
                                        <div className={`disputeLedger-card-content-t`}>
                                            {item.title}
                                        </div>
                                        <div className={`disputeLedger-card-content-t`}>{item.title}</div>
                                        <div>
                                            <span className={`disputeLedger-card-title`}>
                                                {item.value}
                                            </span>{' '}
                                            <span className={`disputeLedger-unit`}>件</span>{' '}
                                            {item.per && (
                                                <span className={`disputeLedger-unit `}>| {item.per}</span>
                                            )}
                                            <span className={`disputeLedger-card-title`}>{item.value}</span> <span className={`disputeLedger-unit`}>件</span>{' '}
                                            {item.per && <span className={`disputeLedger-unit `}>| {item.per}</span>}
                                        </div>
                                    </div>
                                    <img src={item.icon} style={{ width: activeKey === index && '52px', height: activeKey === index && '52px' }} alt="" />
@@ -443,9 +436,10 @@
                                <div style={{ paddingBottom: '12px' }}>
                                    <MyLTopChartPie1
                                        data={[
                                            { value: data.data4.value1, name: '化解中' },
                                            { value: data.data4.value2, name: '化解成功' },
                                            { value: data.data4.value3, name: '化解不成功' },
                                            { value: data.rejectNum, name: '不予受理' },
                                            { value: data.processNum, name: '化解中' },
                                            { value: data.finishNum, name: '化解成功' },
                                            { value: data.failNum, name: '化解不成功' },
                                        ]}
                                        allNum={allNum}
                                    />
@@ -688,6 +682,10 @@
                },
                data: [
                    {
                        name: '不予受理',
                        icon: 'circle', // 图例标记的形状
                    },
                    {
                        name: '化解中',
                        icon: 'circle', // 图例标记的形状
                    },
@@ -707,7 +705,7 @@
                    type: 'pie',
                    radius: ['60%', '90%'], // 设置饼图的内半径和外半径，实现扇形区域
                    center: ['30%', '50%'],
                    color: ['#B6DDF1', '#3A8AC6', '#094282'],
                    color: ['#B6DDF1', '#5BA8E5', '#3A8AC6', '#094282'],
                    data: data,
                    label: {
                        show: true,

 src/views/gridDetail/ApplyInfo.jsx

@@ -5,7 +5,7 @@
 * @LastEditTime: 2025-01-02 10:50:04
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description: 
 * @Description:
 */
import React, { useEffect, useState } from 'react';
import { downO, up, link } from '@/assets/images';
@@ -17,577 +17,653 @@
import NameCard2 from '../../components/NameCard2';
import MyPDF from '../../components/MyPDF';
import PersonCard from '../register/matterDetail/personCard';
import { Scrollbars } from "react-custom-scrollbars";
import { Scrollbars } from 'react-custom-scrollbars';
import TranferReviewProgress from '@/components/ReviewProgress/ReviewProgress.jsx';

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

export default function ApplyInfo(props) {
  const [list, setList] = useState([]);
  const [loading, setLoading] = useState(false);
  const [personView, setPersonView] = useState(false)
  const [personId, setPersonId] = useState('')
    const [list, setList] = useState([]);
    const [loading, setLoading] = useState(false);
    const [personView, setPersonView] = useState(false);
    const [personId, setPersonId] = useState('');

    const map = {
        '上报申请': [
            [
                {
                    value: 'subTitle',
                    label: '申请信息',
                },
                {
                    value: 'auditUnitName',
                    label: '上报至',
                },
                {
                    value: 'appearContent',
                    label: '上报意见',
                },
                {
                    value: 'fileInfo',
                    label: '附件材料',
                    fileKey: '22_00018-512',
                },
                {
                    value: 'applyTime',
                    label: '申请时间',
                },
                {
                    value: 'applyPeople',
                    label: '申请人',
                    unitName: 'applyUnitName',
                    peopleName: 'applyUserName',
                },
            ],
            [
                {
                    value: 'subTitle',
                    label: '审核信息',
                },
                {
                    value: 'auditResultName',
                    label: '审核结果',
                },
                {
                    value: 'auditContent',
                    label: '理由说明',
                },
                {
                    value: 'fileInfo',
                    label: '附件材料',
                    fileKey: '22_00018-513',
                },
                {
                    value: 'auditTime',
                    label: '审核时间',
                },
                {
                    value: 'auditPeople',
                    label: '审核人',
                    unitName: 'auditUnitName',
                    peopleName: 'auditUserName',
                },
            ],
        ],
        '回退申请': [
            [
                {
                    value: 'subTitle',
                    label: '申请信息',
                },
                {
                    value: 'returnContent',
                    label: '回退理由',
                },
                {
                    value: 'fileInfo',
                    label: '附件材料',
                    fileKey: '22_00018-510',
                },
                {
                    value: 'returnTime',
                    label: '申请时间',
                },
                {
                    value: 'applyPeople',
                    label: '申请人',
                    unitName: 'returnUnitName',
                    peopleName: 'returnUserName',
                },
            ],
            [
                {
                    value: 'subTitle',
                    label: '审核信息',
                },
                {
                    value: 'auditResultName',
                    label: '审核结果',
                },
                {
                    value: 'auditContent',
                    label: '理由说明',
                },
                {
                    value: 'fileInfo',
                    label: '附件材料',
                    fileKey: '22_00018-511',
                },
                {
                    value: 'auditTime',
                    label: '审核时间',
                },
                {
                    value: 'auditPeople',
                    label: '审核人',
                    unitName: 'auditUnitName',
                    peopleName: 'auditUserName',
                },
            ],
        ],
        '联合处置申请': [
            [
                {
                    value: 'subTitle',
                    label: '申请信息',
                },
                {
                    value: 'applyAssistUnitName',
                    label: '添加配合部门',
                },
                {
                    value: 'applyContent',
                    label: '添加理由',
                },
                {
                    value: 'fileInfo',
                    label: '附件材料',
                    fileKey: '22_00018-508',
                },
                {
                    value: 'applyTime',
                    label: '申请时间',
                },
                {
                    value: 'applyPeople',
                    label: '申请人',
                    unitName: 'applyUnitName',
                    peopleName: 'applyUserName',
                },
            ],
            [
                {
                    value: 'subTitle',
                    label: '审核信息',
                },
                {
                    value: 'auditResultName',
                    label: '审核结果',
                },
                {
                    value: 'auditContent',
                    label: '理由说明',
                },
                {
                    value: 'fileInfo',
                    label: '附件材料',
                    fileKey: '22_00018-509',
                },
                {
                    value: 'auditTime',
                    label: '审核时间',
                },
                {
                    value: 'auditPeople',
                    label: '审核人',
                    unitName: 'auditUnitName',
                    peopleName: 'auditUserName',
                },
            ],
        ],
        '结案申请': [
            [
                {
                    value: 'subTitle',
                    label: '申请信息',
                },
                {
                    value: 'mediResultName',
                    label: '化解结果',
                },
                {
                    value: 'failReason',
                    label: '无法化解理由',
                },
                {
                    value: 'windupContent',
                    label: '协议履行情况',
                },
                {
                    value: 'applyTime',
                    label: '申请时间',
                },
                {
                    value: 'applyPeople',
                    label: '申请人',
                    unitName: 'applyUnitName',
                    peopleName: 'applyUserName',
                },
            ],
            [
                {
                    value: 'subTitle',
                    label: '审核信息',
                },
                {
                    value: 'auditResultName',
                    label: '审核结果',
                },
                {
                    value: 'auditContent',
                    label: '理由说明',
                },
                {
                    value: 'fileInfo',
                    label: '附件材料',
                    fileKey: '22_00018-514',
                },
                {
                    value: 'auditTime',
                    label: '审核时间',
                },
                {
                    value: 'auditPeople',
                    label: '审核人',
                    unitName: 'auditUnitName',
                    peopleName: 'auditUserName',
                },
            ],
        ],
        '结案申请1': [
            [
                {
                    value: 'subTitle',
                    label: '申请信息',
                },
                {
                    value: 'mediResultName',
                    label: '化解结果',
                },
                {
                    value: 'failReason',
                    label: '无法化解理由',
                },
                {
                    value: 'windupContent',
                    label: '协议履行情况',
                },
                {
                    value: 'applyTime',
                    label: '申请时间',
                },
                {
                    value: 'applyPeople',
                    label: '申请人',
                    unitName: 'applyUnitName',
                    peopleName: 'applyUserName',
                },
            ],
            [
                {
                    value: 'subTitle',
                    label: '审核信息',
                },
                {
                    value: 'reviewProgress',
                },
            ],
        ], //这个是1、2事件的结案申请
        '转入人民调解系统申请': [
            [
                {
                    value: 'subTitle',
                    label: '申请信息',
                },
                {
                    value: 'applyTime',
                    label: '申请时间',
                },
                {
                    value: 'applyPeople',
                    label: '申请人',
                    unitName: 'applyUnitName',
                    peopleName: 'applyUserName',
                },
            ],
            [
                {
                    value: 'subTitle',
                    label: '审核信息',
                },
                {
                    value: 'tranferReviewProgress',
                },
            ],
        ],
        '司法确认申请': [
            [
                {
                    value: 'subTitle',
                    label: '申请信息',
                },
                {
                    value: 'courtName',
                    label: '司法确认部门',
                },
                {
                    value: 'applyContent',
                    label: '申请理由',
                },
                {
                    value: 'filePDF',
                    label: '调解协议书',
                    fileKey: '22_00018-302',
                },
                {
                    value: 'filePDF',
                    label: '非诉讼调解协议司法确认申请书',
                    fileKey: '22_00018-402',
                },
                {
                    value: 'filePDF',
                    label: '诉前联调协议案件移送函',
                    fileKey: '22_00018-403',
                },
                {
                    value: 'filePDF',
                    label: '送达地址确认书',
                    fileKey: '22_00018-108',
                },
                {
                    value: 'applyTime',
                    label: '申请时间',
                },
                {
                    value: 'applyPeople',
                    label: '申请人',
                    unitName: 'applyUnitName',
                    peopleName: 'applyUserName',
                },
            ],
        ],
    };

  const map = {
    '上报申请': [
      [{
        value: 'subTitle',
        label: '申请信息',
      },
      {
        value: 'auditUnitName',
        label: '上报至',
      },
      {
        value: 'appearContent',
        label: '上报意见',
      },
      {
        value: 'fileInfo',
        label: '附件材料',
        fileKey: '22_00018-512'
      },
      {
        value: 'applyTime',
        label: '申请时间',
      },
      {
        value: 'applyPeople',
        label: '申请人',
        unitName: 'applyUnitName',
        peopleName: 'applyUserName'
      },
      ],
      [
        {
          value: 'subTitle',
          label: '审核信息',
        },
        {
          value: 'auditResultName',
          label: '审核结果',
        },
        {
          value: 'auditContent',
          label: '理由说明',
        },
        {
          value: 'fileInfo',
          label: '附件材料',
          fileKey: '22_00018-513'
        },
        {
          value: 'auditTime',
          label: '审核时间',
        },
        {
          value: 'auditPeople',
          label: '审核人',
          unitName: 'auditUnitName',
          peopleName: 'auditUserName'
        },
      ]
    ],
    '回退申请': [
      [{
        value: 'subTitle',
        label: '申请信息',
      },
      {
        value: 'returnContent',
        label: '回退理由',
      },
      {
        value: 'fileInfo',
        label: '附件材料',
        fileKey: '22_00018-510'
      },
      {
        value: 'returnTime',
        label: '申请时间',
      },
      {
        value: 'applyPeople',
        label: '申请人',
        unitName: 'returnUnitName',
        peopleName: 'returnUserName'
      },
      ],
      [
        {
          value: 'subTitle',
          label: '审核信息',
        },
        {
          value: 'auditResultName',
          label: '审核结果',
        },
        {
          value: 'auditContent',
          label: '理由说明',
        },
        {
          value: 'fileInfo',
          label: '附件材料',
          fileKey: '22_00018-511'
        },
        {
          value: 'auditTime',
          label: '审核时间',
        },
        {
          value: 'auditPeople',
          label: '审核人',
          unitName: 'auditUnitName',
          peopleName: 'auditUserName'
        },
      ]
    ],
    '联合处置申请': [
      [{
        value: 'subTitle',
        label: '申请信息',
      },
      {
        value: 'applyAssistUnitName',
        label: '添加配合部门',
      },
      {
        value: 'applyContent',
        label: '添加理由',
      },
      {
        value: 'fileInfo',
        label: '附件材料',
        fileKey: '22_00018-508'
      },
      {
        value: 'applyTime',
        label: '申请时间',
      },
      {
        value: 'applyPeople',
        label: '申请人',
        unitName: 'applyUnitName',
        peopleName: 'applyUserName'
      },
      ],
      [
        {
          value: 'subTitle',
          label: '审核信息',
        },
        {
          value: 'auditResultName',
          label: '审核结果',
        },
        {
          value: 'auditContent',
          label: '理由说明',
        },
        {
          value: 'fileInfo',
          label: '附件材料',
          fileKey: '22_00018-509'
        },
        {
          value: 'auditTime',
          label: '审核时间',
        },
        {
          value: 'auditPeople',
          label: '审核人',
          unitName: 'auditUnitName',
          peopleName: 'auditUserName'
        },
      ]
    ],
    '结案申请': [
      [{
        value: 'subTitle',
        label: '申请信息',
      },
      {
        value: 'mediResultName',
        label: '化解结果',
      },
      {
        value: 'failReason',
        label: '无法化解理由',
      },
      {
        value: 'windupContent',
        label: '协议履行情况',
      },
      {
        value: 'applyTime',
        label: '申请时间',
      },
      {
        value: 'applyPeople',
        label: '申请人',
        unitName: 'applyUnitName',
        peopleName: 'applyUserName'
      },
      ],
      [
        {
          value: 'subTitle',
          label: '审核信息',
        },
        {
          value: 'auditResultName',
          label: '审核结果',
        },
        {
          value: 'auditContent',
          label: '理由说明',
        },
        {
          value: 'fileInfo',
          label: '附件材料',
          fileKey: '22_00018-514'
        },
        {
          value: 'auditTime',
          label: '审核时间',
        },
        {
          value: 'auditPeople',
          label: '审核人',
          unitName: 'auditUnitName',
          peopleName: 'auditUserName'
        },
      ]
    ],
    '结案申请1': [
      [{
        value: 'subTitle',
        label: '申请信息',
      },
      {
        value: 'mediResultName',
        label: '化解结果',
      },
      {
        value: 'failReason',
        label: '无法化解理由',
      },
      {
        value: 'windupContent',
        label: '协议履行情况',
      },
      {
        value: 'applyTime',
        label: '申请时间',
      },
      {
        value: 'applyPeople',
        label: '申请人',
        unitName: 'applyUnitName',
        peopleName: 'applyUserName'
      },
      ],
      [
        {
          value: 'subTitle',
          label: '审核信息',
        },
        {
          value: 'reviewProgress',
        },
      ]
    ],//这个是1、2事件的结案申请
    '转入人民调解系统申请': [
      [{
        value: 'subTitle',
        label: '申请信息',
      },
      {
        value: 'applyTime',
        label: '申请时间',
      },
      {
        value: 'applyPeople',
        label: '申请人',
        unitName: 'applyUnitName',
        peopleName: 'applyUserName'
      },
      ],
      [
        {
          value: 'subTitle',
          label: '审核信息',
        },
        {
          value: 'tranferReviewProgress',
        },
      ]
    ],
    '司法确认申请': [
      [{
        value: 'subTitle',
        label: '申请信息',
      },
      {
        value: 'courtName',
        label: '司法确认部门',
      },
      {
        value: 'applyContent',
        label: '申请理由',
      },
      {
        value: 'filePDF',
        label: '调解协议书',
        fileKey: '22_00018-302'
      },
      {
        value: 'filePDF',
        label: '非诉讼调解协议司法确认申请书',
        fileKey: '22_00018-402'
      },
      {
        value: 'filePDF',
        label: '诉前联调协议案件移送函',
        fileKey: '22_00018-403'
      },
      {
        value: 'filePDF',
        label: '送达地址确认书',
        fileKey: '22_00018-108'
      },
      {
        value: 'applyTime',
        label: '申请时间',
      },
      {
        value: 'applyPeople',
        label: '申请人',
        unitName: 'applyUnitName',
        peopleName: 'applyUserName'
      },
      ]
    ],
  }
    useEffect(() => {
        getData(props.caseId);
    }, []);

  useEffect(() => {
    getData(props.caseId)
  }, [])
    const getData = async (caseId) => {
        setLoading(true);
        const res = await listMyApplyRecord({
            caseId,
        });
        if (res.type) {
            setLoading(false);
            setList(res.data);
        }
    };

  const getData = async (caseId) => {
    setLoading(true)
    const res = await listMyApplyRecord({
      caseId
    })
    if (res.type) {
      setLoading(false)
      setList(res.data)
    }
  }
    const toggleView = (id) => {
        setList(
            list.map((record, index) => {
                if (index === id) {
                    return {
                        ...record,
                        showView: !record.showView,
                    };
                }
                return record;
            })
        );
    };

  const toggleView = (id) => {
    setList(list.map((record, index) => {
      if (index === id) {
        return {
          ...record,
          showView: !record.showView,
        };
      }
      return record;
    }));
  };
    const handlePersonDetail = (id) => {
        setPersonId(id);
        setPersonView(true);
    };

  const handlePersonDetail = (id) => {
    setPersonId(id)
    setPersonView(true)
  }
    const handleDom = (data, item) => {
        console.log('111111111111', data, item);
        const { object, fileList } = item;
        if (data.value === 'subTitle') {
            //标题
            return (
                <Col span={24} key={data.value}>
                    <Space size="small">
                        <div className="MediationInfo-subTitle" style={{ marginTop: '-8px' }}></div>
                        <h5>{data.label}</h5>
                    </Space>
                </Col>
            );
        } else if (data.value === 'fileInfo') {
            //文件
            let fileData = {};
            if (fileList && fileList.length != 0) {
                fileData = fileList.find((item) => data.fileKey == item.ownerType) || {};
            }
            return (
                <Col span={24} key={data.value}>
                    <div>
                        <div className="title-text">{data.label}</div>
                    </div>
                    <div style={{ color: '#1A6FB8' }}>
                        {fileData.fileList?.map((result, resIndex) => {
                            return (
                                <div style={{ display: 'inline-block' }}>
                                    <PreviewImage name={result.name} src={result.showUrl} />
                                    {resIndex !== fileData.fileList?.length - 1 && <>，</>}
                                </div>
                            );
                        }) || '-'}
                    </div>
                </Col>
            );
        } else if (data.value === 'filePDF') {
            //文件
            let fileData = {};
            if (fileList && fileList.length != 0) {
                fileData = fileList.find((item) => data.fileKey == item.ownerType) || {};
            }
            console.log('fileData', fileData);

  const handleDom = (data, item) => {
    console.log('111111111111', data, item);
    const { object, fileList } = item
    if (data.value === 'subTitle') {
      //标题
      return <Col span={24} key={data.value}>
        <Space size='small'>
          <div className='MediationInfo-subTitle' style={{ marginTop: '-8px' }}></div><h5>{data.label}</h5>
        </Space>
      </Col>
    } else if (data.value === 'fileInfo') {
      //文件
      let fileData = {}
      if (fileList && fileList.length != 0) {
        fileData = fileList.find(item => data.fileKey == item.ownerType) || {}
      }
      return <Col span={24} key={data.value}>
        <div><div className="title-text">{data.label}</div></div>
        <div style={{ color: '#1A6FB8' }}>
          {fileData.fileList?.map((result, resIndex) => {
            return <div style={{ display: 'inline-block' }}>
              <PreviewImage name={result.name} src={result.showUrl} />
              {resIndex !== fileData.fileList?.length - 1 && <>，</>}
            </div>
          }) || '-'}
        </div>
      </Col>
    } else if (data.value === 'filePDF') {
      //文件
      let fileData = {}
      if (fileList && fileList.length != 0) {
        fileData = fileList.find(item => data.fileKey == item.ownerType) || {}
      }
      console.log('fileData', fileData);
            return (
                <Col span={24} key={data.value}>
                    <div>
                        <div className="title-text">{data.label}</div>
                    </div>
                    <div style={{ color: '#1A6FB8' }}>
                        {fileData.fileList?.map((result, resIndex) => {
                            return (
                                <div style={{ display: 'inline-block' }}>
                                    <MyPDF name={result.name} fileUrl={result.showUrl} fileType={result.suffix} />
                                    {resIndex !== fileData.fileList?.length - 1 && <>，</>}
                                </div>
                            );
                        }) || '-'}
                    </div>
                </Col>
            );
        } else if (data.value === 'applyPeople' || data.value === 'auditPeople') {
            //申请人
            return (
                <Col span={24} key={data.value}>
                    <div>
                        <div className="title-text">{data.label}</div>
                    </div>
                    <span>
                        <span style={{ color: '#86909C' }}></span>
                        <span>{object[data.unitName]}</span>
                    </span>
                    <span>
                        <span className="public-infoSubTitle">
                            <span className="public-nameCard">
                                &nbsp;&nbsp;
                                <NameCard2
                                    name={data.value === 'auditPeople' ? object.auditUserName : object.applyUserName}
                                    userId={data.value === 'auditPeople' ? object.auditUserId : object.applyUserId}
                                />
                            </span>
                        </span>
                    </span>
                </Col>
            );
        } else if (data.value === 'applyTime' || data.value == 'auditTime' || data.value == 'returnTime') {
            //时间格式化
            return (
                <Col span={24} key={data.value}>
                    <div>
                        <div className="title-text">{data.label}</div>
                    </div>
                    <div>{$$.minuteFormat(object[data.value]) || '-'}</div>
                </Col>
            );
        } else if (data.value == 'auditResultName') {
            //审核结果
            return (
                <Col span={24} key={data.value}>
                    <div>
                        <div className="title-text">{data.label}</div>
                    </div>
                    <div style={{ color: object.auditResult == '24_00004-1' ? '#00b42a' : '#f53f3f' }}>{object[data.value] || '-'}</div>
                </Col>
            );
        } else if (data.value === 'reviewProgress') {
            //这个是1、2级事件，结案申请的时候显示
            //注意：暂时还没做12级的流程，还没得数据
            return (
                <Col span={24} key={data.value}>
                    <ReviewProgress progressData={object.progressData || { handleCaseFlowList: [] }} />
                </Col>
            );
        } else if (data.value === 'mediResultName') {
            //化解结果
            return (
                <Col span={24} key={data.value}>
                    <div>
                        <div className="title-text">{data.label}</div>
                    </div>
                    <div style={{ color: object.mediResult == '22_00025-1' ? '#00b42a' : '#f53f3f' }}>{object[data.value] || '-'}</div>
                </Col>
            );
        } else if (data.value === 'failReason') {
            //化解不成功原因
            return object.mediResult == '22_00025-1' ? (
                ''
            ) : (
                <Col span={24} key={data.value}>
                    <div>
                        <div className="title-text">{data.label}</div>
                    </div>
                    <div>{object[data.value] || '-'}</div>
                </Col>
            );
        } else if (data.value === 'tranferReviewProgress') {
            //转入人民调解申请
            return (
                <Col span={24} key={data.value}>
                    <TranferReviewProgress progressData={object.applyList || []} />
                </Col>
            );
        } else {
            return (
                <Col span={24} key={data.value}>
                    <div>
                        <div className="title-text">{data.label}</div>
                    </div>
                    <div>{object[data.value] || '-'}</div>
                </Col>
            );
        }
    };

      return <Col span={24} key={data.value}>
        <div><div className="title-text">{data.label}</div></div>
        <div style={{ color: '#1A6FB8' }}>
          {fileData.fileList?.map((result, resIndex) => {
            return <div style={{ display: 'inline-block' }}>
              {result.suffix === 'pdf' ?
                <MyPDF name={result.name} fileUrl={result.showUrl} /> :
                <PreviewImage name={result.name} src={result.showUrl} />
              }
              {resIndex !== fileData.fileList?.length - 1 && <>，</>}
            </div>
          }) || '-'}
        </div>
      </Col>
    } else if (data.value === 'applyPeople' || data.value === 'auditPeople') {
      //申请人
      return <Col span={24} key={data.value}>
        <div><div className="title-text">{data.label}</div></div>
        <span>
          <span style={{ color: '#86909C' }}></span><span>{object[data.unitName]}</span>
        </span>
        <span>
          <span className='public-infoSubTitle'><span className='public-nameCard'>&nbsp;&nbsp;<NameCard2 name={data.value === 'auditPeople' ? object.auditUserName : object.applyUserName} userId={data.value === 'auditPeople' ? object.auditUserId : object.applyUserId} /></span></span>
        </span>
      </Col>
    } else if (data.value === 'applyTime' || data.value == 'auditTime' || data.value == 'returnTime') {
      //时间格式化
      return <Col span={24} key={data.value}>
        <div><div className="title-text">{data.label}</div></div>
        <div>{$$.minuteFormat(object[data.value]) || '-'}</div>
      </Col>
    } else if (data.value == 'auditResultName') {
      //审核结果
      return <Col span={24} key={data.value}>
        <div><div className="title-text">{data.label}</div></div>
        <div style={{ color: object.auditResult == '24_00004-1' ? '#00b42a' : '#f53f3f' }}>
          {object[data.value] || '-'}
        </div>
      </Col>
    } else if (data.value === 'reviewProgress') {
      //这个是1、2级事件，结案申请的时候显示
      //注意：暂时还没做12级的流程，还没得数据
      return <Col span={24} key={data.value}>
        <ReviewProgress progressData={object.progressData || { handleCaseFlowList: [] }} />
      </Col>
    } else if (data.value === 'mediResultName') {
      //化解结果
      return <Col span={24} key={data.value}>
        <div><div className="title-text">{data.label}</div></div>
        <div style={{ color: object.mediResult == '22_00025-1' ? '#00b42a' : '#f53f3f' }}>
          {object[data.value] || '-'}
        </div>
      </Col>
    } else if (data.value === 'failReason') {
      //化解不成功原因
      return object.mediResult == '22_00025-1' ? '' :
        <Col span={24} key={data.value}>
          <div><div className="title-text">{data.label}</div></div>
          <div>{object[data.value] || '-'}</div>
        </Col>
    } else if (data.value === 'tranferReviewProgress') {
      //转入人民调解申请
      return <Col span={24} key={data.value}>
        <TranferReviewProgress progressData={object.applyList || []} />
      </Col>
    } else {
      return <Col span={24} key={data.value}>
        <div><div className="title-text">{data.label}</div></div>
        <div>{object[data.value] || '-'}</div>
      </Col>
    }
  }

  return (
    <div style={{ margin: '0 16px' }}>
      <Spin loading={loading} style={{ width: '100%', height: '100%', minHeight: '200px' }}>
        <Scrollbars style={{ height: 'calc(100vh - 156px)',backgroundColor: '#ffff' }} autoHide>
          {list && list.length !== 0 ? list?.map((item, listIndex) => {
            const object = item.object || item
            if (item.type == '回退申请') {
              object.applyStatus = object.returnStatus
              object.applyTime = object.returnTime
              object.applyUnitName = object.returnUnitName
              object.applyUserName = object.returnUserName
              object.applyUserId = object.returnUserId
            }
            if (item.type == '上报申请') {
              object.applyStatus = object.applyStatus
              object.applyTime = object.appearTime
              object.applyUnitName = object.appearUnitName
              object.applyUserName = object.appearUserName
              object.applyUserId = object.appearUserId
            }
            if (item.type == '司法确认申请') {
              object.applyStatus = object.judicAudit === "24_00004-0" ? 0 : 1
              object.auditResult = object.judicAudit
            }
            return <div className='applyInfoClass' style={{ border: item.showView ? '1px solid #1a6fb8' : '' }} key={listIndex}>
              <div className='applyInfoClass-img' onClick={() => { toggleView(listIndex) }}>
                <img src={item.showView ? up : downO} alt="" className="title-downUp" />
              </div>
              <div className='applyInfoClass-title'>
                <div className='applyInfoClass-title-txt'>{item.type}</div>
                <div className={`applyInfoClass-title-tag-${object.applyStatus === 0 ? '2' : object.auditResult == '24_00004-1' ? '1' : '3'}`} >
                  {object.applyStatus === 0 ? '审核中' : object.auditResult == '24_00004-1' ? '审核通过' : '审核不通过'}
                </div>
              </div>
              {item.showView ? <div>
                {
                  map[(object.caseLevel && object.caseLevel != 3) ? item.type + '1' : item.type]?.filter((fil, filIndex) => {
                    //如果是审核中就不需要审核栏
                    if (object.applyStatus === 0) {
                      return filIndex === 0
                    } else {
                      return true
                    }
                  }).map((res, index) => {
                    return <Row gutter={[16, 16]} key={index}>
                      {res.map(data => {
                        if (item.type == '转入人民调解系统申请') {
                          return handleDom(data, { object: item })
                        } else {
                          return handleDom(data, item)
                        }
                      })}
                    </Row>
                  })
                }
              </div> : <div>
                <span style={{ marginRight: '32px' }}>
                  <span style={{ color: '#86909C' }}>申请时间：</span><span>{$$.minuteFormat(object.applyTime)}</span>
                </span>
                <span style={{ marginRight: '8px' }}>
                  <span style={{ color: '#86909C' }}>申请人：</span>
                </span>
                <span>
                  <span className='public-infoSubTitle'><span className='public-nameCard'>{(object?.applyUnitName)}&nbsp;&nbsp;<NameCard2 name={object.applyUserName} userId={object.applyUserId} /></span></span>
                </span>
              </div>}

            </div>
          }) : <div className='handle-content-empty' style={{ marginTop: '10%' }}>
            {$$.MyNewEmpty()}
          </div>}
        </Scrollbars>
      </Spin>
      <PersonCard personView={personView} handleCancel={() => setPersonView(false)} personId={personId} />
    </div>
  )
    return (
        <div style={{ margin: '0 16px' }}>
            <Spin loading={loading} style={{ width: '100%', height: '100%', minHeight: '200px' }}>
                <Scrollbars style={{ height: 'calc(100vh - 156px)', backgroundColor: '#ffff' }} autoHide>
                    {list && list.length !== 0 ? (
                        list?.map((item, listIndex) => {
                            const object = item.object || item;
                            if (item.type == '回退申请') {
                                object.applyStatus = object.returnStatus;
                                object.applyTime = object.returnTime;
                                object.applyUnitName = object.returnUnitName;
                                object.applyUserName = object.returnUserName;
                                object.applyUserId = object.returnUserId;
                            }
                            if (item.type == '上报申请') {
                                object.applyStatus = object.applyStatus;
                                object.applyTime = object.appearTime;
                                object.applyUnitName = object.appearUnitName;
                                object.applyUserName = object.appearUserName;
                                object.applyUserId = object.appearUserId;
                            }
                            if (item.type == '司法确认申请') {
                                object.applyStatus = object.judicAudit === '24_00004-0' ? 0 : 1;
                                object.auditResult = object.judicAudit;
                            }
                            return (
                                <div className="applyInfoClass" style={{ border: item.showView ? '1px solid #1a6fb8' : '' }} key={listIndex}>
                                    <div
                                        className="applyInfoClass-img"
                                        onClick={() => {
                                            toggleView(listIndex);
                                        }}
                                    >
                                        <img src={item.showView ? up : downO} alt="" className="title-downUp" />
                                    </div>
                                    <div className="applyInfoClass-title">
                                        <div className="applyInfoClass-title-txt">{item.type}</div>
                                        <div className={`applyInfoClass-title-tag-${object.applyStatus === 0 ? '2' : object.auditResult == '24_00004-1' ? '1' : '3'}`}>
                                            {object.applyStatus === 0 ? '审核中' : object.auditResult == '24_00004-1' ? '审核通过' : '审核不通过'}
                                        </div>
                                    </div>
                                    {item.showView ? (
                                        <div>
                                            {map[object.caseLevel && object.caseLevel != 3 ? item.type + '1' : item.type]
                                                ?.filter((fil, filIndex) => {
                                                    //如果是审核中就不需要审核栏
                                                    if (object.applyStatus === 0) {
                                                        return filIndex === 0;
                                                    } else {
                                                        return true;
                                                    }
                                                })
                                                .map((res, index) => {
                                                    return (
                                                        <Row gutter={[16, 16]} key={index}>
                                                            {res.map((data) => {
                                                                if (item.type == '转入人民调解系统申请') {
                                                                    return handleDom(data, { object: item });
                                                                } else {
                                                                    return handleDom(data, item);
                                                                }
                                                            })}
                                                        </Row>
                                                    );
                                                })}
                                        </div>
                                    ) : (
                                        <div>
                                            <span style={{ marginRight: '32px' }}>
                                                <span style={{ color: '#86909C' }}>申请时间：</span>
                                                <span>{$$.minuteFormat(object.applyTime)}</span>
                                            </span>
                                            <span style={{ marginRight: '8px' }}>
                                                <span style={{ color: '#86909C' }}>申请人：</span>
                                            </span>
                                            <span>
                                                <span className="public-infoSubTitle">
                                                    <span className="public-nameCard">
                                                        {object?.applyUnitName}&nbsp;&nbsp;
                                                        <NameCard2 name={object.applyUserName} userId={object.applyUserId} />
                                                    </span>
                                                </span>
                                            </span>
                                        </div>
                                    )}
                                </div>
                            );
                        })
                    ) : (
                        <div className="handle-content-empty" style={{ marginTop: '10%' }}>
                            {$$.MyNewEmpty()}
                        </div>
                    )}
                </Scrollbars>
            </Spin>
            <PersonCard personView={personView} handleCancel={() => setPersonView(false)} personId={personId} />
        </div>
    );
}

 src/views/judicialSubmit/courtAuditDetail.jsx

@@ -203,11 +203,7 @@
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    {item.suffix === 'pdf' ? (
                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                    ) : (
                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                    )}
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
@@ -223,11 +219,7 @@
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    {item.suffix === 'pdf' ? (
                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                    ) : (
                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                    )}
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
@@ -243,11 +235,7 @@
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    {item.suffix === 'pdf' ? (
                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                    ) : (
                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                    )}
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
@@ -263,11 +251,7 @@
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    {item.suffix === 'pdf' ? (
                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                    ) : (
                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                    )}
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
@@ -359,11 +343,7 @@
                                                    ?.fileList?.map((item, index) => {
                                                        return (
                                                            <>
                                                                {item.suffix === 'pdf' ? (
                                                                    <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                                ) : (
                                                                    <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                                )}
                                                                <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                            </>
                                                        );
                                                    })

 src/views/judicialSubmit/courtAuditEdit.jsx

@@ -316,11 +316,7 @@
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    {item.suffix === 'pdf' ? (
                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                    ) : (
                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                    )}
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
@@ -336,11 +332,7 @@
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    {item.suffix === 'pdf' ? (
                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                    ) : (
                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                    )}
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
@@ -356,11 +348,7 @@
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    {item.suffix === 'pdf' ? (
                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                    ) : (
                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                    )}
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
@@ -376,11 +364,7 @@
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    {item.suffix === 'pdf' ? (
                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                    ) : (
                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                    )}
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
@@ -623,11 +607,7 @@
                                                        ?.fileList?.map((item, index) => {
                                                            return (
                                                                <>
                                                                    {item.suffix === 'pdf' ? (
                                                                        <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} />
                                                                    ) : (
                                                                        <PreviewImage key={index} name={item.name} src={item.showUrl} />
                                                                    )}
                                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                                </>
                                                            );
                                                        })

 src/views/judicialSubmit/courtEdit.jsx

@@ -11,7 +11,7 @@
import { Row, Col, Space, Typography, Empty } from 'antd';
import { Input, Select, Radio, Modal, Button, Form, Divider, DatePicker, Alert } from '@arco-design/web-react';
import { IconInfoCircleFill } from '@arco-design/web-react/icon';
import { Scrollbars } from "react-custom-scrollbars";
import { Scrollbars } from 'react-custom-scrollbars';
import * as $$ from '../../utils/utility';
import { useNavigate } from 'react-router-dom';
import ArcoUpload from '@/components/ArcoUpload';
@@ -33,803 +33,946 @@
const appUrl = $$.appUrl;
// 司法确认详情接口
function getJudicInfoApi(submitData) {
  return $$.ax.request({ url: 'judicInfo/getJudicInfo', type: 'get', data: submitData, service: 'mediate' });
    return $$.ax.request({ url: 'judicInfo/getJudicInfo', type: 'get', data: submitData, service: 'mediate' });
}

// 根据judicId获取案件信息
function getCaseDataApi(submitData) {
  return $$.ax.request({ url: `caseInfo/getCaseInfo`, data: submitData, type: 'get', service: 'mediate' });
    return $$.ax.request({ url: `caseInfo/getCaseInfo`, data: submitData, type: 'get', service: 'mediate' });
}

function delFile(id) {
  return $$.ax.request({ url: `fileInfo/deleteFileById`, type: 'get', service: 'sys', data: { id } });
    return $$.ax.request({ url: `fileInfo/deleteFileById`, type: 'get', service: 'sys', data: { id } });
}
// 提交审核
function judicConfirmApi(submitData) {
  return $$.ax.request({ url: `judicInfo/judicConfirm`, type: 'post', service: 'mediate', data: submitData, });
    return $$.ax.request({ url: `judicInfo/judicConfirm`, type: 'post', service: 'mediate', data: submitData });
}
// 获取助理列表
function listAssistApi(submitData) {
  return $$.ax.request({ url: `ctUserole/listAssist`, type: 'get', service: 'cust', data: submitData });
    return $$.ax.request({ url: `ctUserole/listAssist`, type: 'get', service: 'cust', data: submitData });
}

// 删除预约
function delMeetInfoApi(data) {
  return $$.ax.request({ url: `meetJudic/delMeetInfo`, type: 'get', service: 'mediate', data });
    return $$.ax.request({ url: `meetJudic/delMeetInfo`, type: 'get', service: 'mediate', data });
}

//添加预约
function addMeetInfoApi(data) {
  return $$.ax.request({ url: `meetJudic/addMeetInfo`, type: 'post', service: 'mediate', data });
    return $$.ax.request({ url: `meetJudic/addMeetInfo`, type: 'post', service: 'mediate', data });
}

//添加会议号
function addRoomInfoApi(data) {
  return $$.ax.request({ url: `meetJudic/addRoomInfo`, type: 'post', service: 'mediate', data });
    return $$.ax.request({ url: `meetJudic/addRoomInfo`, type: 'post', service: 'mediate', data });
}

//会议查询
function getMeetInfoApi(data) {
  return $$.ax.request({ url: `meetJudic/getMeetInfo`, type: 'get', service: 'mediate', data });
    return $$.ax.request({ url: `meetJudic/getMeetInfo`, type: 'get', service: 'mediate', data });
}

// 办理结果（化解结果、协议文书等结案信息）
function getTransactResultApi(caseId) {
  return $$.ax.request({ url: `caseInfoUnfold/getTransactResult?caseId=${caseId}`, type: 'get', service: 'mediate' });
    return $$.ax.request({ url: `caseInfoUnfold/getTransactResult?caseId=${caseId}`, type: 'get', service: 'mediate' });
}

function saveVideoApi(data) {
  return $$.ax.request({ url: `meetJudic/saveVideo`, type: 'post', service: 'mediate', data });
    return $$.ax.request({ url: `meetJudic/saveVideo`, type: 'post', service: 'mediate', data });
}


const CourtAuditEdit = () => {
  const formRef = useRef();
  const form = useRef();
  const formVideo = useRef();
  let navigate = useNavigate();
  const judicId = $$.getQueryString('judicId')
  const caseId = $$.getQueryString('caseId')
  const caseTaskId = $$.getQueryString('caseTaskId')
    const formRef = useRef();
    const form = useRef();
    const formVideo = useRef();
    let navigate = useNavigate();
    const judicId = $$.getQueryString('judicId');
    const caseId = $$.getQueryString('caseId');
    const caseTaskId = $$.getQueryString('caseTaskId');

  const [caseCheckModal, setCaseCheckModal] = useState(false);
    const [caseCheckModal, setCaseCheckModal] = useState(false);

  // 回显数据
  const [data, setData] = useState([]);
  // 数据
  const [formData, setFormData] = useState({});
  const [caseData, setCaseData] = useState({});
    // 回显数据
    const [data, setData] = useState([]);
    // 数据
    const [formData, setFormData] = useState({});
    const [caseData, setCaseData] = useState({});

    const [filesList, setFilesList] = useState([]);
    // 司法确认部门单位
    const [listCourt, setListCourt] = useState([]);

  const [filesList, setFilesList] = useState([]);
  // 司法确认部门单位
  const [listCourt, setListCourt] = useState([]);
    const [stepsNum, setStepsNum] = useState(0);

  const [stepsNum, setStepsNum] = useState(0);
    const [transactResult, setTransactResult] = useState(null);

  const [transactResult, setTransactResult] = useState(null);
    // 预添加预约
    const [preBookData, setPreBookData] = useState({});
    const [preBookVisible, setPreBookVisible] = useState(false);
    const [radioVisible, setRadioVisible] = useState(false);

  // 预添加预约
  const [preBookData, setPreBookData] = useState({});
  const [preBookVisible, setPreBookVisible] = useState(false);
  const [radioVisible, setRadioVisible] = useState(false);
    // 选择法官弹窗
    const [isModalVisible, setIsModalVisible] = useState(false);
    const [selectObjModalData, setSelectObjModalData] = useState({});
    // 司法确认结果是否同意
    const [agree, setAgree] = useState('');

  // 选择法官弹窗
  const [isModalVisible, setIsModalVisible] = useState(false);
  const [selectObjModalData, setSelectObjModalData] = useState({})
  // 司法确认结果是否同意
  const [agree, setAgree] = useState('')
    function handleChangeFile(type, info, apiResult) {
        console.log('handleChangeFile', type, info, apiResult);
        let list = info.fileList ? info.fileList : [];
        // .map(item => ({ ...item, name: item.trueName }))
        setFilesList(list);
        // setResult(apiResult)
        console.log('list', list);
        if (list.length >= 1) {
            setStepsNum(1);
        } else {
            setStepsNum(0);
        }
    }

  function handleChangeFile(type, info, apiResult) {
    console.log('handleChangeFile', type, info, apiResult);
    let list = info.fileList ? info.fileList : [];
    // .map(item => ({ ...item, name: item.trueName }))
    setFilesList(list)
    // setResult(apiResult)
    console.log('list', list);
    if (list.length >= 1) {
      setStepsNum(1)
    } else {
      setStepsNum(0)
    }
  }
    //删除文件
    const handleDelFile = async (id) => {
        const res = await delFile(id);
        if (res.type) {
            $$.infoSuccess({ content: '删除成功！' });
        }
    };

  //删除文件
  const handleDelFile = async (id) => {
    const res = await delFile(id)
    if (res.type) {
      $$.infoSuccess({ content: '删除成功！' });
    }
  }
    // 修改
    function handleChangeValue(key, value) {
        formData[key] = value;
        setFormData({ ...formData });
    }

    // 提交申请
    function handleApply(type) {
        if (type === 'submit') {
            if (formRef.current) {
                formRef.current.validate(undefined, (errors, values) => {
                    if (!errors) {
                        const data = formRef?.current.getFields();
                        console.log('data', data);

  // 修改
  function handleChangeValue(key, value) {
    formData[key] = value;
    setFormData({ ...formData });
  }
                        $$.arcoModalInfo({
                            icon: <IconInfoCircleFill style={{ color: '#1A6FB8' }} />,
                            title: '提醒',
                            closable: false,
                            style: { borderRadius: '8px' },
                            content: <span>确定办结该司法确认吗？</span>,
                            okText: '确定',
                            cancelText: '我再想想',
                            onOk: () => {
                                applyJudicial({ ...data, judicId, submitType: '1' }, type);
                                saveVideo(caseId);
                            },
                        });
                    }
                });
            }
        }
        if (type === 'draft') {
            const data = formRef?.current.getFields();
            applyJudicial({ ...data, judicId, submitType: '2' }, type);
        }
    }

  // 提交申请
  function handleApply(type) {
    if (type === 'submit') {
      if (formRef.current) {
        formRef.current.validate(undefined, (errors, values) => {
          if (!errors) {
            const data = formRef?.current.getFields()
            console.log('data', data);
    // 保存调解视频
    async function saveVideo(caseId) {
        const res = await saveVideoApi({ caseId });
        if (res.type) {
        }
    }

            $$.arcoModalInfo({
              icon: <IconInfoCircleFill style={{ color: '#1A6FB8' }} />,
              title: '提醒',
              closable: false,
              style: { borderRadius: '8px' },
              content: <span>确定办结该司法确认吗？</span>,
              okText: '确定',
              cancelText: '我再想想',
              onOk: () => {
                applyJudicial({ ...data, judicId, submitType: '1' }, type)
                saveVideo(caseId)
              },
            });
    // 提交审核
    async function applyJudicial(data, type) {
        global.setSpinning(true);
        const res = await judicConfirmApi(data);
        global.setSpinning(false);
        if (res.type) {
            navigate(-1);
            type === 'draft' && $$.infoSuccess({ content: '保存成功' });
        }
    }

          }
        })
      }
    }
    if (type === 'draft') {
      const data = formRef?.current.getFields();
      applyJudicial({ ...data, judicId, submitType: '2' }, type)
    }
  }
    // 助理列表字典值选择
    async function gatListCourt(data) {
        global.setSpinning(true);
        const res = await listAssistApi({ courtId: data?.courtId });
        global.setSpinning(false);
        if (res.type) {
            setListCourt(res.data || []);
        }
    }

  // 保存调解视频
  async function saveVideo(caseId) {
    const res = await saveVideoApi({ caseId })
    if (res.type) {
    }
  }
    // 回显数据
    async function getJudicialApply() {
        global.setSpinning(true);
        const res = await getJudicInfoApi({ judicId });
        global.setSpinning(false);
        if (res.type) {
            setData(res.data);
            gatListCourt(res.data || {});
            formRef.current.setFieldsValue(res.data || {});
            setAgree(res.data?.judicResult || '');
        }
    }
    async function getCaseData() {
        global.setSpinning(true);
        const res = await getCaseDataApi({ id: caseId });
        global.setSpinning(false);
        if (res.type) {
            const { agentList, personList, ...rest } = res.data;
            const parList = agentList.concat(personList);
            const newParList =
                parList?.map((item) => {
                    const fileInfoList = item.fileInfoList;
                    let file = []; //身份证明材料、企业登记材料
                    let file1 = []; //法人、机构身份证明材料、代理人授权委托书
                    if (fileInfoList && fileInfoList.length != 0) {
                        fileInfoList.forEach((item) => {
                            if (item.ownerType == '22_00018-202' || item.ownerType == '22_00018-203') {
                                item.fileList.forEach((res) => {
                                    file.push({
                                        ...res,
                                        uid: res.id,
                                    });
                                });
                            }
                            if (item.ownerType == '22_00018-204' || item.ownerType == '22_00018-207') {
                                item.fileList.forEach((res) => {
                                    file1.push({
                                        ...res,
                                        uid: res.id,
                                    });
                                });
                            }
                        });
                    }
                    return {
                        ...item,
                        file,
                        file1,
                    };
                }) || [];
            const obj = {
                ...rest,
                fakeData: newParList,
            };
            setCaseData(obj);
        }
    }

  // 提交审核
  async function applyJudicial(data, type) {
    global.setSpinning(true);
    const res = await judicConfirmApi(data);
    global.setSpinning(false);
    if (res.type) {
      navigate(-1);
      type === 'draft' && $$.infoSuccess({ content: '保存成功' });
    }
  }
    // 视频调解部分
    // 添加预约重置
    function resetClick() {
        form.current.resetFields();
        form.current.setFieldValue();
    }

    function submitClick() {
        if (form.current) {
            form.current.validate(undefined, (errors, values) => {
                if (!errors) {
                    let submitData = form.current.getFields();
                    submitData.orderStartTime = submitData.time[0];
                    submitData.orderEndTime = submitData.time[1];
                    delete submitData.time;
                    console.log('submitData', submitData);
                    // submitData.
                    $$.modalInfo({
                        title: '添加预约调解确认',
                        content: (
                            <div>
                                确认添加预约<span className="public-color">{submitData.orderStartTime}</span>-
                                <span className="public-color">{submitData.orderEndTime}</span>的调解吗？
                            </div>
                        ),
                        okText: '确定添加',
                        cancelText: '我再想想',
                        onOk: () => addMeetInfo({ caseId, ...submitData }),
                    });
                }
            });
        }
    }
    // 添加预约提交
    async function addMeetInfo(submitData) {
        global.setSpinning(true);
        const res = await addMeetInfoApi(submitData);
        global.setSpinning(false);
        if (res.type) {
            setPreBookVisible(false);
            form.current.resetFields();
            getMeetInfo(caseId);
        }
    }
    function radioSubmitClick() {
        if (formVideo.current) {
            formVideo.current.validate(undefined, (errors, values) => {
                if (!errors) {
                    let submitData = formVideo.current.getFields();
                    submitData.orderStartTime = submitData.time[0];
                    submitData.orderEndTime = submitData.time[1];
                    delete submitData.time;
                    console.log('submitData', submitData);
                    $$.modalInfo({
                        title: '创建视频号确认',
                        content: (
                            <div>
                                确认创建<span className="public-color">{submitData.orderStartTime}</span>-
                                <span className="public-color">{submitData.orderEndTime}</span>的视频号吗？
                            </div>
                        ),
                        okText: '确定创建',
                        cancelText: '我再想想',
                        onOk: () => addRoomInfo({ caseId, ...submitData }),
                    });
                }
            });
        }
    }

  // 助理列表字典值选择
  async function gatListCourt(data) {
    global.setSpinning(true);
    const res = await listAssistApi({ courtId: data?.courtId });
    global.setSpinning(false);
    if (res.type) {
      setListCourt(res.data || [])
    }
  }
    // 添加预约提交
    async function addRoomInfo(submitData) {
        global.setSpinning(true);
        const res = await addRoomInfoApi(submitData);
        global.setSpinning(false);
        if (res.type) {
            setRadioVisible(false);
            formVideo.current.resetFields();
            getMeetInfo(caseId);
        }
    }

  // 回显数据
  async function getJudicialApply() {
    global.setSpinning(true);
    const res = await getJudicInfoApi({ judicId });
    global.setSpinning(false);
    if (res.type) {
      setData(res.data);
      gatListCourt(res.data || {});
      formRef.current.setFieldsValue(res.data || {});
      setAgree(res.data?.judicResult || '')
    }
  }
  async function getCaseData() {
    global.setSpinning(true);
    const res = await getCaseDataApi({ id: caseId });
    global.setSpinning(false);
    if (res.type) {
      const { agentList, personList, ...rest } = res.data
      const parList = agentList.concat(personList)
      const newParList = parList?.map(item => {
        const fileInfoList = item.fileInfoList
        let file = [];//身份证明材料、企业登记材料
        let file1 = [];//法人、机构身份证明材料、代理人授权委托书
        if (fileInfoList && fileInfoList.length != 0) {
          fileInfoList.forEach(item => {
            if (item.ownerType == '22_00018-202' || item.ownerType == '22_00018-203') {
              item.fileList.forEach(res => {
                file.push({
                  ...res,
                  uid: res.id,
                })
              })
            }
            if (item.ownerType == '22_00018-204' || item.ownerType == '22_00018-207') {
              item.fileList.forEach(res => {
                file1.push({
                  ...res,
                  uid: res.id,
                })
              })
            }
          })
        }
        return {
          ...item,
          file,
          file1
        }
      }) || []
      const obj = {
        ...rest,
        fakeData: newParList,
      }
      setCaseData(obj)
    }
  }
    function radioResetClick() {
        formVideo.current.resetFields();
    }

  // 视频调解部分
  // 添加预约重置
  function resetClick() {
    form.current.resetFields()
    form.current.setFieldValue()
  }
    function delClick() {
        $$.modalInfo({
            title: '删除预约确认',
            content: <div>确定删除该预约吗？</div>,
            okText: '确定删除',
            cancelText: '我再想想',
            onOk: () => delMeetInfo({ id: preBookData.id }),
        });
    }

  function submitClick() {
    if (form.current) {
      form.current.validate(undefined, (errors, values) => {
        if (!errors) {
          let submitData = form.current.getFields();
          submitData.orderStartTime = submitData.time[0];
          submitData.orderEndTime = submitData.time[1];
          delete submitData.time
          console.log('submitData', submitData);
          // submitData.
          $$.modalInfo({
            title: '添加预约调解确认',
            content: <div>确认添加预约<span className='public-color'>{submitData.orderStartTime}</span>-<span className='public-color'>{submitData.orderEndTime}</span>的调解吗？</div>,
            okText: '确定添加',
            cancelText: '我再想想',
            onOk: () => addMeetInfo({ caseId, ...submitData }),
          });
        }
      });
    }
  }
  // 添加预约提交
  async function addMeetInfo(submitData) {
    global.setSpinning(true);
    const res = await addMeetInfoApi(submitData);
    global.setSpinning(false);
    if (res.type) {
      setPreBookVisible(false)
      form.current.resetFields()
      getMeetInfo(caseId);
    }
  }
  function radioSubmitClick() {
    if (formVideo.current) {
      formVideo.current.validate(undefined, (errors, values) => {
        if (!errors) {
          let submitData = formVideo.current.getFields()
          submitData.orderStartTime = submitData.time[0];
          submitData.orderEndTime = submitData.time[1];
          delete submitData.time
          console.log('submitData', submitData);
          $$.modalInfo({
            title: '创建视频号确认',
            content: <div>确认创建<span className='public-color'>{submitData.orderStartTime}</span>-<span className='public-color'>{submitData.orderEndTime}</span>的视频号吗？</div>,
            okText: '确定创建',
            cancelText: '我再想想',
            onOk: () => addRoomInfo({ caseId, ...submitData }),
          });
        }
      });
    }
  }
    async function delMeetInfo(submitData) {
        global.setSpinning(true);
        const res = await delMeetInfoApi(submitData);
        global.setSpinning(false);
        if (res.type) {
            $$.infoSuccess({ content: '删除成功' });
            setPreBookData({});
        }
    }

  // 添加预约提交
  async function addRoomInfo(submitData) {
    global.setSpinning(true);
    const res = await addRoomInfoApi(submitData);
    global.setSpinning(false);
    if (res.type) {
      setRadioVisible(false)
      formVideo.current.resetFields()
      getMeetInfo(caseId);
    }
  }
    // 获取预约调解记录
    async function getMeetInfo(id) {
        global.setSpinning(true);
        const res = await getMeetInfoApi({ caseId: id });
        global.setSpinning(false);
        if (res.type) {
            let list = res.data || [];
            if (list?.length > 0) {
                setPreBookData(list[0]);
            }
        }
    }

  function radioResetClick() {
    formVideo.current.resetFields()
  }
    function checkTimeRange(startTime, endTime, currentTime) {
        if (currentTime < new Date(startTime)) {
            return <div className="public-color">未开始</div>; // 当前时间在时间范围之前
        } else if (currentTime >= new Date(startTime) && currentTime <= new Date(endTime)) {
            return <div style={{ color: '#EF6C24' }}>进行中</div>; // 当前时间在时间范围内
        } else {
            return <div className="public-orange">已结束</div>; // 当前时间在时间范围之后
        }
    }

  function delClick() {
    $$.modalInfo({
      title: '删除预约确认',
      content: <div>确定删除该预约吗？</div>,
      okText: '确定删除',
      cancelText: '我再想想',
      onOk: () => delMeetInfo({ id: preBookData.id }),
    });
  }
    async function getTransactResult(id) {
        const res = await getTransactResultApi(id);
        if (res.type) {
            if (res.data) {
                setTransactResult({ ...res.data });
            } else {
                setTransactResult(null);
            }
        }
    }

  async function delMeetInfo(submitData) {
    global.setSpinning(true);
    const res = await delMeetInfoApi(submitData);
    global.setSpinning(false);
    if (res.type) {
      $$.infoSuccess({ content: '删除成功' });
      setPreBookData({})
    }
  }
    //初始化
    useEffect(() => {
        if (caseId) {
            getMeetInfo(caseId);
            getTransactResult(caseId);
        }
        if (judicId) {
            getCaseData();
            getJudicialApply();
        }
    }, []);

  // 获取预约调解记录
  async function getMeetInfo(id) {
    global.setSpinning(true);
    const res = await getMeetInfoApi({ caseId: id });
    global.setSpinning(false);
    if (res.type) {
      let list = res.data || [];
      if (list?.length > 0) {
        setPreBookData(list[0])
      }
    }
  }
    return (
        <NewPage pageHead={{ breadcrumbData: [{ title: '工作台' }, { title: '司法确认' }], title: '司法确认' }}>
            <Fragment>
                <Scrollbars style={{ height: 'calc(100vh - 219px)' }} autoHide>
                    <div className=" dataSync-noScrollPage">
                        <Row gutter={[16, 16]}>
                            <Col span={24}>
                                <Space>
                                    <div className="MediationInfo-subTitle"></div>
                                    <span style={{ fontSize: '16px', lineHeight: '24px' }}>申请信息</span>
                                </Space>
                            </Col>
                            <Col span={24}>
                                <div className="public-infoTitle">案件信息</div>
                                {/* <div className='judicialSubmit-audit-case' onClick={() => setCaseCheckModal(true)}> */}

  function checkTimeRange(startTime, endTime, currentTime) {
    if (currentTime < new Date(startTime)) {
      return <div className='public-color'>未开始</div>; // 当前时间在时间范围之前
    } else if (currentTime >= new Date(startTime) && currentTime <= new Date(endTime)) {
      return <div style={{ color: '#EF6C24' }}>进行中</div>; // 当前时间在时间范围内
    } else {
      return <div className='public-orange'>已结束</div>; // 当前时间在时间范围之后
    }
  }

  async function getTransactResult(id) {
    const res = await getTransactResultApi(id)
    if (res.type) {
      if (res.data) {
        setTransactResult({ ...res.data })
      } else {
        setTransactResult(null)
      }
    }
  }

  //初始化
  useEffect(() => {
    if (caseId) {
      getMeetInfo(caseId);
      getTransactResult(caseId)
    }
    if (judicId) {
      getCaseData();
      getJudicialApply();
    }
  }, []);



  return (
    <NewPage pageHead={{ breadcrumbData: [{ title: '工作台' }, { title: '司法确认' }], title: '司法确认' }}>
      <Fragment>
        <Scrollbars style={{ height: 'calc(100vh - 219px)' }} autoHide>
          <div className=' dataSync-noScrollPage'>
            <Row gutter={[16, 16]}>
              <Col span={24}>
                <Space>
                  <div className='MediationInfo-subTitle'></div><span style={{ fontSize: '16px', lineHeight: '24px' }}>申请信息</span>
                </Space>
              </Col>
              <Col span={24}>
                <div className='public-infoTitle'>案件信息</div>
                {/* <div className='judicialSubmit-audit-case' onClick={() => setCaseCheckModal(true)}> */}
                
                <div className='judicialSubmit-audit-case' onClick={() => window.open(`${$$.windowUrl}/windowDetail?caseTaskId=${caseTaskId}&caseId=${caseId}`)}>
                  <div style={{ display: 'flex', gap: '16px', alignItems: 'center' }}>
                    <div><img src={judicial_5} alt="" srcset="" /></div>
                    <div>
                      <div className='judicialSubmit-audit-case-flex'>
                        <div>承办部门：{transactResult?.mediateUnitName || '-'}</div>
                        <div className='judicialSubmit-audit-case-subTitle'>申请方：{caseData.fakeData?.filter(i => i.perType === '15_020008-1')?.length === 1 ? caseData.fakeData?.filter(i => i.perType === '15_020008-1')[0].trueName : caseData.fakeData?.filter(i => i.perType === '15_020008-1')?.length > 1 ? `${caseData.fakeData?.filter(i => i.perType === '15_020008-1')[0].trueName}...等共${caseData.fakeData?.filter(i => i.perType === '15_020008-1')?.length}人` : '-'} | 被申请方：{caseData.fakeData?.filter(i => i.perType === '15_020008-2')?.length === 1 ? caseData.fakeData?.filter(i => i.perType === '15_020008-1')[0].trueName : caseData.fakeData?.filter(i => i.perType === '15_020008-2')?.length > 1 ? `${caseData.fakeData?.filter(i => i.perType === '15_020008-2')[0].trueName}...等共${caseData.fakeData?.filter(i => i.perType === '15_020008-2')?.length}人` : '-'}</div>
                      </div>
                      <div className='judicialSubmit-audit-case-subTitle'>办结时间：{$$.minuteFormat(transactResult?.closeTime)} | {transactResult?.mediResultName || '-'}</div>
                    </div>
                  </div>
                  <div><img src={judicial_6} alt="" srcset="" /></div>
                </div>
              </Col>
              <Col span={24}>
                <div className='public-infoTitle'>申请理由</div>
                <div className='public-infoSubTitle'>{data?.applyContent || '-'}</div>
              </Col>
              <Col span={24}>
                <div className='public-infoTitle'>调解协议书</div>
                {
                  data?.fileList?.find(i => i.ownerType === '22_00018-302')?.fileList?.length ?
                    data?.fileList?.find(i => i.ownerType === '22_00018-302')?.fileList?.map((item, index) => {
                      return <>{item.suffix === 'pdf' ? <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} /> : <PreviewImage key={index} name={item.name} src={item.showUrl} />}</>
                    })
                    : <div className='public-infoSubTitle'>-</div>
                }
              </Col>
              <Col span={24}>
                <div className='public-infoTitle'>非诉讼调解协议司法确认申请书</div>
                {
                  data?.fileList?.find(i => i.ownerType === '22_00018-402')?.fileList?.length ?
                    data?.fileList?.find(i => i.ownerType === '22_00018-402')?.fileList?.map((item, index) => {
                      return <>{item.suffix === 'pdf' ? <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} /> : <PreviewImage key={index} name={item.name} src={item.showUrl} />}</>
                    })
                    : <div className='public-infoSubTitle'>-</div>
                }
              </Col>
              <Col span={24}>
                <div className='public-infoTitle'>诉前联调协议案件移送函</div>
                {
                  data?.fileList?.find(i => i.ownerType === '22_00018-403')?.fileList?.length ?
                    data?.fileList?.find(i => i.ownerType === '22_00018-403')?.fileList?.map((item, index) => {
                      return <>{item.suffix === 'pdf' ? <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} /> : <PreviewImage key={index} name={item.name} src={item.showUrl} />}</>
                    })
                    : <div className='public-infoSubTitle'>-</div>
                }
              </Col>
              <Col span={24}>
                <div className='public-infoTitle'>送达地址确认书</div>
                {
                  data?.fileList?.find(i => i.ownerType === '22_00018-108')?.fileList?.length ?
                    data?.fileList?.find(i => i.ownerType === '22_00018-108')?.fileList?.map((item, index) => {
                      return <>{item.suffix === 'pdf' ? <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} /> : <PreviewImage key={index} name={item.name} src={item.showUrl} />}</>
                    })
                    : <div className='public-infoSubTitle'>-</div>
                }
              </Col>
              <Col span={24}>
                <div className='public-infoTitle'>申请时间</div>
                <div className='public-infoSubTitle'>{$$.minuteFormat(data?.applyTime)}</div>
              </Col>
              <Col span={24}>
                <div className='public-infoTitle'>申请人</div>
                <div className='public-infoSubTitle'><span className='public-nameCard2'>{(data?.applyUnitName)}&nbsp;&nbsp;<NameCard2 name={data.applyUserName} userId={data.applyUserId} /></span></div>
              </Col>
            </Row>
          </div>
          <div style={{ height: '16px' }}></div>
          <div className=' dataSync-noScrollPage'>
            <Row gutter={[20, 20]}>
              <Col span={24}>
                <Space>
                  <div className='MediationInfo-subTitle'></div><span style={{ fontSize: '16px', lineHeight: '24px' }}>司法确认信息</span>
                </Space>
              </Col>
              <Col span={24}>
                <table style={{ marginBottom: '0px' }} border="1" align="center" cellpadding="6" className="table">
                  <tr>
                    <th bgcolor="#F7F8FA" className="table-title" width="120" >承办法官</th>
                    <td width='380'><div className='public-infoSubTitle'><NameCard2 name={data.judgeName} userId={data.judicId} /></div></td>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">助理/书记员</th>
                    <td width='380'><div style={{ display: 'flex', gap: '16px', flexWrap: 'wrap' }} className='public-infoSubTitle'>{data?.judicAssistList?.map(i => (<NameCard2 name={i.assUserName} userId={i.assUserId} />))}</div></td>
                  </tr>
                </table>
              </Col>
              <Col span={24}>
                <div className='judicial-item' style={{ marginTop: '0', marginRight: '0' }}>
                  <div className='handle-content-empty judicial-item-left' >
                    <div className='judicial-item-title'><img src={judicial_1} alt="" srcset="" />预约信息</div>
                    {
                      preBookData?.orderStartTime ?
                        <div className='judicial-item-content'>
                          <div className='judicial-item-content-left'>
                            <div onClick={() => delClick()} className='judicial-item-content-left-del public-a'><img src={judicial_3} alt="" srcset="" /></div>
                            <div className='judicial-item-content-left-t'>
                              <div className='judicial-item-content-left-t-l'><div className='judicial-item-content-left-bigTitle public-color'>{$$.myTimeFormat(preBookData?.orderStartTime, 'HH:mm')}</div><div className='public-color'>{$$.myTimeFormat(preBookData?.orderStartTime, 'YYYY年MM月DD日')}</div></div>
                              <div className='judicial-item-content-left-t-l'>
                                <Space size='small'>
                                  <div className='judicial-item-content-left-inline'></div>
                                  <div style={{ display: 'flex', flexDirection: 'column', gap: '4px', alignItems: 'center', justifyContent: 'center' }}>{checkTimeRange(preBookData?.orderStartTime, preBookData?.orderEndTime, new Date())}<div className='public-color judicial-item-content-left-time'>{$$.calculateTimeDifference(preBookData?.orderStartTime, preBookData?.orderEndTime)}</div></div>
                                  <div className='judicial-item-content-left-inline'></div>
                                </Space>
                              </div>
                              <div className='judicial-item-content-left-t-l'><div className='judicial-item-content-left-bigTitle public-color'>{$$.myTimeFormat(preBookData?.orderEndTime, 'HH:mm')}</div><div className='public-color'>{$$.myTimeFormat(preBookData?.orderEndTime, 'YYYY年MM月DD日')}</div></div>
                            </div>
                            <Divider />
                            <div className='judicial-item-content-left-c-flex'>
                              <div className='judicial-item-content-left-c'>
                                <div className='judicial-item-content-left-c-title'>司法确认方式</div>
                                <div className='judicial-item-content-left-c-content'>{preBookData?.meetWayName || '-'}</div>
                              </div>
                              <div className='judicial-item-content-left-c'>
                                <div className='judicial-item-content-left-c-title'>远程视频司法确认号</div>
                                <div className='judicial-item-content-left-c-content'><span style={{ fontSize: '16px', lineHeight: '24px' }}>{preBookData?.roomNo || '-'}</span>&nbsp;&nbsp;{preBookData?.roomNo && <span onClick={() => {
                                  navigator.clipboard.writeText(preBookData?.roomNo).then(() => {
                                    $$.infoSuccess({ content: '复制成功' });
                                  }).catch(err => {
                                    $$.catchApiError('复制失败', err);
                                  });
                                }} className='public-color public-a'>复制</span>}</div>
                              </div>
                              <div className='judicial-item-content-left-c'>
                                <div className='judicial-item-content-left-c-title'>司法确认地点</div>
                                <div className='judicial-item-content-left-c-content'>{preBookData?.meetAddr || '-'}</div>
                              </div>
                            </div>
                          </div>
                        </div> :
                        <Empty description={<span className='empty-text'>暂无数据</span>} image={empty}><Button onClick={() => setPreBookVisible(true)} type='outline'>添加预约</Button></Empty>
                    }
                  </div>
                  <div className='handle-content-empty judicial-item-left'>
                    <div className='judicial-item-title'><img src={judicial_2} alt="" srcset="" />远程视频司法确认</div>
                    {
                      preBookData?.orderStartTime ?
                        <div className='judicial-item-video'>
                          <div className='judicial-item-video-flex'>
                            <div className='judicial-item-video-img'><img src={judicial_4} alt="" srcset="" /></div>
                            <div>
                              <div className='judicial-item-content-left-c-content'><span style={{ fontSize: '16px', lineHeight: '24px' }}>{preBookData?.roomNo || '-'}</span>&nbsp;&nbsp;{preBookData?.roomNo && <span onClick={() => {
                                navigator.clipboard.writeText(preBookData?.roomNo).then(() => { $$.infoSuccess({ content: '复制成功' }) }).catch(err => { $$.catchApiError('复制失败', err) })
                              }} className='public-color public-a'>复制</span>}</div>
                              <div style={{ color: "#4E5969", marginTop: '4px' }}>{$$.myTimeFormat(preBookData?.orderStartTime, 'YYYY年MM月DD日')}&nbsp;{$$.myTimeFormat(preBookData?.orderStartTime, 'HH:mm')}-{$$.myTimeFormat(preBookData?.orderEndTime, 'HH:mm')}</div>
                            </div>
                          </div>
                          <Alert type='info' content={<span>请使用小鱼易连客户端加入该号码连线</span>} />
                        </div> :
                        <Empty description={<span className='empty-text'>暂无数据</span>} image={empty}><Button onClick={() => setRadioVisible(true)} type='outline'>创建视频号</Button></Empty>}
                  </div>
                </div>
              </Col>

            </Row>

          </div>
          <div className=' dataSync-noScrollPage'>
            <Form
              ref={formRef}
              layout='vertical'
              requiredSymbol={false}
              scrollToFirstError={true}
              onChange={(first, allValues) => {
                if (first?.judicResult) {
                  setAgree(first?.judicResult)
                  formRef.current.clearFields()
                  formRef.current.setFieldsValue({
                    judicResult: first.judicResult,
                  });
                }
              }}
              initialValues={{
              }}//默认值
            >
              <Row>
                <Col span={24}>
                  <FormItem
                    label={(<div style={{ display: 'flex' }}>司法确认结果</div>)}
                    field='judicResult'
                    rules={[{ required: true, message: '请选择司法确认结果' }]}
                  >
                    <Radio.Group>
                      <Space direction="vertical">
                        {[{ value: '22_00028-1', label: '已达成', }, { value: '22_00028-2', label: '未达成' }].map((x) => (
                          <Radio value={x.value} key={x.value} label={x.label}>
                            {x.label}
                          </Radio>
                        ))}
                      </Space>
                    </Radio.Group>
                  </FormItem>
                </Col>
                {/* 未达成 */}
                {agree === '22_00028-2' && (
                  <>
                    <Col span={24}>
                      <FormItem
                        label={(<div style={{ display: 'flex' }}>未达成原因<div className="must">必填</div></div>)}
                        field='judicFalseCause'
                        rules={[{ required: true, message: '未达成原因不能为空' }]}
                      >
                        <TextArea
                          rows={5}
                          maxLength={256}
                          autoSize={{ minRows: 4, maxRows: 8 }}
                          placeholder='请填写'
                        />
                      </FormItem>
                    </Col>
                  </>
                )}
                {agree === '22_00028-1' && (
                  <>
                    <Col span={24} className="doubleFile">
                      <div style={{ display: 'flex', marginBottom: '8px' }}>裁定文书<div className="must">必填</div></div>
                      <ArcoUpload
                        params={{
                          action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${caseId}&&ownerId=${judicId}&ownerType=22_00018-405`,
                        }}
                        formItemParams={{
                          rules: [{ message: '请上传裁定文书', required: true }]
                        }}
                        field='filesList'
                        label=''
                        editData={{
                          filesList: filesList || []
                        }}
                        handleDelFile={handleDelFile}
                        onFileListChange={(v) => {
                          let newList = v?.map(item => {
                            if (item.response) {
                              return item.response.data[0]
                            } else {
                              return item
                            }
                          })
                          setFilesList(newList)
                        }}
                      />
                    </Col>
                    <Col span={24} className="doubleFile">
                      <div style={{ display: 'flex', marginBottom: '8px' }}>询问笔录</div>
                      <ArcoUpload
                        params={{
                          action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${caseId}&&ownerId=${judicId}&ownerType=22_00018-401`,
                        }}
                        field='filesList1'
                        label=''
                        editData={{
                          filesList1: filesList || []
                        }}
                        handleDelFile={handleDelFile}
                        onFileListChange={(v) => {
                          let newList = v?.map(item => {
                            if (item.response) {
                              return item.response.data[0]
                            } else {
                              return item
                            }
                          })
                          setFilesList(newList)
                        }}
                      />
                    </Col>
                    <Col span={24}>
                      <FormItem
                        label={(<div style={{ display: 'flex' }}>诉前调确号</div>)}
                        field='mediateJudicNo'
                      >
                        <Input style={{ width: '450px' }} placeholder='请填写审判系统中的诉前调确号（如有）' allowClear />
                      </FormItem>
                    </Col>
                    <Col span={24}>
                      <FormItem
                        label={(<div style={{ display: 'flex' }}>结案说明</div>)}
                        field='judicContent'
                      >
                        <TextArea
                          rows={5}
                          maxLength={256}
                          autoSize={{ minRows: 4, maxRows: 8 }}
                          placeholder='请填写'
                        />
                      </FormItem>
                    </Col>
                  </>
                )}


              </Row>
            </Form >
          </div>
        </Scrollbars>
        <div className="dataSync-excel">
          <Space size="large" style={{ margin: '4px 14px' }}>
            <Button onClick={() => handleApply('submit')} type="primary" className="dialogPrimary">办结</Button>
            <Button onClick={() => handleApply('draft')} type="outline" className="dialogPrimary">保存</Button>
            <Button type='secondary' onClick={() => navigate(-1)}>返回上级页面</Button>
          </Space>
        </div>
      </Fragment>
      <MyModal width={1200} visible={caseCheckModal} onCancel={() => setCaseCheckModal(false)} footer={false}>
        <CaseDetail caseId={caseId} caseData={caseData} />
      </MyModal>
      <Modal
        title='添加预约'
        style={{ width: '40%' }}
        className='judicial-handle-modal'
        onCancel={() => setPreBookVisible(false)}
        visible={preBookVisible}
        footer={null}
      >
        <Row style={{ height: '480px', position: 'relative' }}>
          <Col span={24} >
            <Form
              ref={form}
              layout='vertical'
              requiredSymbol={false}
              initialValues={{
                meetWay: '22_00021-3',
                meetWayName: '线上 + 线下'
              }}//默认值
              scrollToFirstError
            >
              <Row>
                <Col span={24}>
                  <Form.Item rules={[{ required: true, message: '请选择预约调解时间' }]} label={(<div style={{ display: 'flex' }}>预约调解时间<div className="must">必填</div></div>)} field="time">
                    <RangePicker
                      showTime={{ format: 'HH:mm' }}
                      allowClear={true}
                      style={{ width: '100%' }}
                    />
                  </Form.Item>
                </Col>
                <Col span={24}>
                  <FormItem
                    label='纠纷化解方式'
                    field='meetWay'
                  >
                    <Select
                      placeholder='请选择'
                      allowClear={false}
                      options={$$.options.meetWay}
                      onChange={(value, options) => {
                        form.current.setFieldValue('meetWayName', options && options.children)
                      }}
                    />
                  </FormItem>
                </Col>
                <Col span={24}>
                  <FormItem label='纠纷化解地点' field='meetAddr'>
                    <Input placeholder='请填写' />
                  </FormItem>
                </Col>
              </Row>
            </Form>
            <div style={{ display: 'flex', alignItems: 'center', gap: '16px', position: 'absolute', bottom: '0' }}>
              <Button type="primary" onClick={() => submitClick()}>提交</Button>
              <Button onClick={() => resetClick()} danger>重置</Button>
            </div>
          </Col>
        </Row>
      </Modal>
      <Modal
        title='创建远程调解视频号'
        style={{ width: '40%' }}
        className='judicial-handle-modal'
        onCancel={() => setRadioVisible(false)}
        visible={radioVisible}
        footer={null}
      >
        <Row style={{ height: '480px', position: 'relative' }}>
          <Col span={24} >
            <Form
              ref={formVideo}
              layout='vertical'
              requiredSymbol={false}
              scrollToFirstError
            >
              <Row>
                <Col span={24}>
                  <Form.Item style={{ marginBottom: '8px' }} rules={[{ required: true, message: '请选择有效期' }]} label={(<div style={{ display: 'flex' }}>有效期<div className="must">必填</div></div>)} field="time">
                    <RangePicker
                      showTime={{ format: 'HH:mm' }}
                      allowClear={true}
                      style={{ width: '100%' }}
                    />
                  </Form.Item>
                  <Alert type='info' content={<span>创建成功后请在有效期内使用小鱼易连客户端加入该号码连线</span>} />
                </Col>
              </Row>
            </Form>
            <div style={{ display: 'flex', alignItems: 'center', gap: '16px', position: 'absolute', bottom: '0' }}>
              <Button type="primary" onClick={() => radioSubmitClick()}>提交</Button>
              <Button onClick={() => radioResetClick()} danger>重置</Button>
            </div>
          </Col>
        </Row>
      </Modal>
    </NewPage >
  );
                                <div
                                    className="judicialSubmit-audit-case"
                                    onClick={() => window.open(`${$$.windowUrl}/windowDetail?caseTaskId=${caseTaskId}&caseId=${caseId}`)}
                                >
                                    <div style={{ display: 'flex', gap: '16px', alignItems: 'center' }}>
                                        <div>
                                            <img src={judicial_5} alt="" srcset="" />
                                        </div>
                                        <div>
                                            <div className="judicialSubmit-audit-case-flex">
                                                <div>承办部门：{transactResult?.mediateUnitName || '-'}</div>
                                                <div className="judicialSubmit-audit-case-subTitle">
                                                    申请方：
                                                    {caseData.fakeData?.filter((i) => i.perType === '15_020008-1')?.length === 1
                                                        ? caseData.fakeData?.filter((i) => i.perType === '15_020008-1')[0].trueName
                                                        : caseData.fakeData?.filter((i) => i.perType === '15_020008-1')?.length > 1
                                                        ? `${caseData.fakeData?.filter((i) => i.perType === '15_020008-1')[0].trueName}...等共${
                                                                caseData.fakeData?.filter((i) => i.perType === '15_020008-1')?.length
                                                          }人`
                                                        : '-'}{' '}
                                                    | 被申请方：
                                                    {caseData.fakeData?.filter((i) => i.perType === '15_020008-2')?.length === 1
                                                        ? caseData.fakeData?.filter((i) => i.perType === '15_020008-1')[0].trueName
                                                        : caseData.fakeData?.filter((i) => i.perType === '15_020008-2')?.length > 1
                                                        ? `${caseData.fakeData?.filter((i) => i.perType === '15_020008-2')[0].trueName}...等共${
                                                                caseData.fakeData?.filter((i) => i.perType === '15_020008-2')?.length
                                                          }人`
                                                        : '-'}
                                                </div>
                                            </div>
                                            <div className="judicialSubmit-audit-case-subTitle">
                                                办结时间：{$$.minuteFormat(transactResult?.closeTime)} | {transactResult?.mediResultName || '-'}
                                            </div>
                                        </div>
                                    </div>
                                    <div>
                                        <img src={judicial_6} alt="" srcset="" />
                                    </div>
                                </div>
                            </Col>
                            <Col span={24}>
                                <div className="public-infoTitle">申请理由</div>
                                <div className="public-infoSubTitle">{data?.applyContent || '-'}</div>
                            </Col>
                            <Col span={24}>
                                <div className="public-infoTitle">调解协议书</div>
                                {data?.fileList?.find((i) => i.ownerType === '22_00018-302')?.fileList?.length ? (
                                    data?.fileList
                                        ?.find((i) => i.ownerType === '22_00018-302')
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
                                ) : (
                                    <div className="public-infoSubTitle">-</div>
                                )}
                            </Col>
                            <Col span={24}>
                                <div className="public-infoTitle">非诉讼调解协议司法确认申请书</div>
                                {data?.fileList?.find((i) => i.ownerType === '22_00018-402')?.fileList?.length ? (
                                    data?.fileList
                                        ?.find((i) => i.ownerType === '22_00018-402')
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
                                ) : (
                                    <div className="public-infoSubTitle">-</div>
                                )}
                            </Col>
                            <Col span={24}>
                                <div className="public-infoTitle">诉前联调协议案件移送函</div>
                                {data?.fileList?.find((i) => i.ownerType === '22_00018-403')?.fileList?.length ? (
                                    data?.fileList
                                        ?.find((i) => i.ownerType === '22_00018-403')
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
                                ) : (
                                    <div className="public-infoSubTitle">-</div>
                                )}
                            </Col>
                            <Col span={24}>
                                <div className="public-infoTitle">送达地址确认书</div>
                                {data?.fileList?.find((i) => i.ownerType === '22_00018-108')?.fileList?.length ? (
                                    data?.fileList
                                        ?.find((i) => i.ownerType === '22_00018-108')
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
                                ) : (
                                    <div className="public-infoSubTitle">-</div>
                                )}
                            </Col>
                            <Col span={24}>
                                <div className="public-infoTitle">申请时间</div>
                                <div className="public-infoSubTitle">{$$.minuteFormat(data?.applyTime)}</div>
                            </Col>
                            <Col span={24}>
                                <div className="public-infoTitle">申请人</div>
                                <div className="public-infoSubTitle">
                                    <span className="public-nameCard2">
                                        {data?.applyUnitName}&nbsp;&nbsp;
                                        <NameCard2 name={data.applyUserName} userId={data.applyUserId} />
                                    </span>
                                </div>
                            </Col>
                        </Row>
                    </div>
                    <div style={{ height: '16px' }}></div>
                    <div className=" dataSync-noScrollPage">
                        <Row gutter={[20, 20]}>
                            <Col span={24}>
                                <Space>
                                    <div className="MediationInfo-subTitle"></div>
                                    <span style={{ fontSize: '16px', lineHeight: '24px' }}>司法确认信息</span>
                                </Space>
                            </Col>
                            <Col span={24}>
                                <table style={{ marginBottom: '0px' }} border="1" align="center" cellpadding="6" className="table">
                                    <tr>
                                        <th bgcolor="#F7F8FA" className="table-title" width="120">
                                            承办法官
                                        </th>
                                        <td width="380">
                                            <div className="public-infoSubTitle">
                                                <NameCard2 name={data.judgeName} userId={data.judicId} />
                                            </div>
                                        </td>
                                        <th bgcolor="#F7F8FA" className="table-title" width="120">
                                            助理/书记员
                                        </th>
                                        <td width="380">
                                            <div style={{ display: 'flex', gap: '16px', flexWrap: 'wrap' }} className="public-infoSubTitle">
                                                {data?.judicAssistList?.map((i) => (
                                                    <NameCard2 name={i.assUserName} userId={i.assUserId} />
                                                ))}
                                            </div>
                                        </td>
                                    </tr>
                                </table>
                            </Col>
                            <Col span={24}>
                                <div className="judicial-item" style={{ marginTop: '0', marginRight: '0' }}>
                                    <div className="handle-content-empty judicial-item-left">
                                        <div className="judicial-item-title">
                                            <img src={judicial_1} alt="" srcset="" />
                                            预约信息
                                        </div>
                                        {preBookData?.orderStartTime ? (
                                            <div className="judicial-item-content">
                                                <div className="judicial-item-content-left">
                                                    <div onClick={() => delClick()} className="judicial-item-content-left-del public-a">
                                                        <img src={judicial_3} alt="" srcset="" />
                                                    </div>
                                                    <div className="judicial-item-content-left-t">
                                                        <div className="judicial-item-content-left-t-l">
                                                            <div className="judicial-item-content-left-bigTitle public-color">
                                                                {$$.myTimeFormat(preBookData?.orderStartTime, 'HH:mm')}
                                                            </div>
                                                            <div className="public-color">{$$.myTimeFormat(preBookData?.orderStartTime, 'YYYY年MM月DD日')}</div>
                                                        </div>
                                                        <div className="judicial-item-content-left-t-l">
                                                            <Space size="small">
                                                                <div className="judicial-item-content-left-inline"></div>
                                                                <div style={{ display: 'flex', flexDirection: 'column', gap: '4px', alignItems: 'center', justifyContent: 'center' }}>
                                                                    {checkTimeRange(preBookData?.orderStartTime, preBookData?.orderEndTime, new Date())}
                                                                    <div className="public-color judicial-item-content-left-time">
                                                                        {$$.calculateTimeDifference(preBookData?.orderStartTime, preBookData?.orderEndTime)}
                                                                    </div>
                                                                </div>
                                                                <div className="judicial-item-content-left-inline"></div>
                                                            </Space>
                                                        </div>
                                                        <div className="judicial-item-content-left-t-l">
                                                            <div className="judicial-item-content-left-bigTitle public-color">
                                                                {$$.myTimeFormat(preBookData?.orderEndTime, 'HH:mm')}
                                                            </div>
                                                            <div className="public-color">{$$.myTimeFormat(preBookData?.orderEndTime, 'YYYY年MM月DD日')}</div>
                                                        </div>
                                                    </div>
                                                    <Divider />
                                                    <div className="judicial-item-content-left-c-flex">
                                                        <div className="judicial-item-content-left-c">
                                                            <div className="judicial-item-content-left-c-title">司法确认方式</div>
                                                            <div className="judicial-item-content-left-c-content">{preBookData?.meetWayName || '-'}</div>
                                                        </div>
                                                        <div className="judicial-item-content-left-c">
                                                            <div className="judicial-item-content-left-c-title">远程视频司法确认号</div>
                                                            <div className="judicial-item-content-left-c-content">
                                                                <span style={{ fontSize: '16px', lineHeight: '24px' }}>{preBookData?.roomNo || '-'}</span>&nbsp;&nbsp;
                                                                {preBookData?.roomNo && (
                                                                    <span
                                                                        onClick={() => {
                                                                            navigator.clipboard
                                                                                .writeText(preBookData?.roomNo)
                                                                                .then(() => {
                                                                                    $$.infoSuccess({ content: '复制成功' });
                                                                                })
                                                                                .catch((err) => {
                                                                                    $$.catchApiError('复制失败', err);
                                                                                });
                                                                        }}
                                                                        className="public-color public-a"
                                                                    >
                                                                        复制
                                                                    </span>
                                                                )}
                                                            </div>
                                                        </div>
                                                        <div className="judicial-item-content-left-c">
                                                            <div className="judicial-item-content-left-c-title">司法确认地点</div>
                                                            <div className="judicial-item-content-left-c-content">{preBookData?.meetAddr || '-'}</div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        ) : (
                                            <Empty description={<span className="empty-text">暂无数据</span>} image={empty}>
                                                <Button onClick={() => setPreBookVisible(true)} type="outline">
                                                    添加预约
                                                </Button>
                                            </Empty>
                                        )}
                                    </div>
                                    <div className="handle-content-empty judicial-item-left">
                                        <div className="judicial-item-title">
                                            <img src={judicial_2} alt="" srcset="" />
                                            远程视频司法确认
                                        </div>
                                        {preBookData?.orderStartTime ? (
                                            <div className="judicial-item-video">
                                                <div className="judicial-item-video-flex">
                                                    <div className="judicial-item-video-img">
                                                        <img src={judicial_4} alt="" srcset="" />
                                                    </div>
                                                    <div>
                                                        <div className="judicial-item-content-left-c-content">
                                                            <span style={{ fontSize: '16px', lineHeight: '24px' }}>{preBookData?.roomNo || '-'}</span>&nbsp;&nbsp;
                                                            {preBookData?.roomNo && (
                                                                <span
                                                                    onClick={() => {
                                                                        navigator.clipboard
                                                                            .writeText(preBookData?.roomNo)
                                                                            .then(() => {
                                                                                $$.infoSuccess({ content: '复制成功' });
                                                                            })
                                                                            .catch((err) => {
                                                                                $$.catchApiError('复制失败', err);
                                                                            });
                                                                    }}
                                                                    className="public-color public-a"
                                                                >
                                                                    复制
                                                                </span>
                                                            )}
                                                        </div>
                                                        <div style={{ color: '#4E5969', marginTop: '4px' }}>
                                                            {$$.myTimeFormat(preBookData?.orderStartTime, 'YYYY年MM月DD日')}&nbsp;
                                                            {$$.myTimeFormat(preBookData?.orderStartTime, 'HH:mm')}-{$$.myTimeFormat(preBookData?.orderEndTime, 'HH:mm')}
                                                        </div>
                                                    </div>
                                                </div>
                                                <Alert type="info" content={<span>请使用小鱼易连客户端加入该号码连线</span>} />
                                            </div>
                                        ) : (
                                            <Empty description={<span className="empty-text">暂无数据</span>} image={empty}>
                                                <Button onClick={() => setRadioVisible(true)} type="outline">
                                                    创建视频号
                                                </Button>
                                            </Empty>
                                        )}
                                    </div>
                                </div>
                            </Col>
                        </Row>
                    </div>
                    <div className=" dataSync-noScrollPage">
                        <Form
                            ref={formRef}
                            layout="vertical"
                            requiredSymbol={false}
                            scrollToFirstError={true}
                            onChange={(first, allValues) => {
                                if (first?.judicResult) {
                                    setAgree(first?.judicResult);
                                    formRef.current.clearFields();
                                    formRef.current.setFieldsValue({
                                        judicResult: first.judicResult,
                                    });
                                }
                            }}
                            initialValues={{}} //默认值
                        >
                            <Row>
                                <Col span={24}>
                                    <FormItem
                                        label={<div style={{ display: 'flex' }}>司法确认结果</div>}
                                        field="judicResult"
                                        rules={[{ required: true, message: '请选择司法确认结果' }]}
                                    >
                                        <Radio.Group>
                                            <Space direction="vertical">
                                                {[
                                                    { value: '22_00028-1', label: '已达成' },
                                                    { value: '22_00028-2', label: '未达成' },
                                                ].map((x) => (
                                                    <Radio value={x.value} key={x.value} label={x.label}>
                                                        {x.label}
                                                    </Radio>
                                                ))}
                                            </Space>
                                        </Radio.Group>
                                    </FormItem>
                                </Col>
                                {/* 未达成 */}
                                {agree === '22_00028-2' && (
                                    <>
                                        <Col span={24}>
                                            <FormItem
                                                label={
                                                    <div style={{ display: 'flex' }}>
                                                        未达成原因<div className="must">必填</div>
                                                    </div>
                                                }
                                                field="judicFalseCause"
                                                rules={[{ required: true, message: '未达成原因不能为空' }]}
                                            >
                                                <TextArea rows={5} maxLength={256} autoSize={{ minRows: 4, maxRows: 8 }} placeholder="请填写" />
                                            </FormItem>
                                        </Col>
                                    </>
                                )}
                                {agree === '22_00028-1' && (
                                    <>
                                        <Col span={24} className="doubleFile">
                                            <div style={{ display: 'flex', marginBottom: '8px' }}>
                                                裁定文书<div className="must">必填</div>
                                            </div>
                                            <ArcoUpload
                                                params={{
                                                    action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${caseId}&&ownerId=${judicId}&ownerType=22_00018-405`,
                                                }}
                                                formItemParams={{
                                                    rules: [{ message: '请上传裁定文书', required: true }],
                                                }}
                                                field="filesList"
                                                label=""
                                                editData={{
                                                    filesList: filesList || [],
                                                }}
                                                handleDelFile={handleDelFile}
                                                onFileListChange={(v) => {
                                                    let newList = v?.map((item) => {
                                                        if (item.response) {
                                                            return item.response.data[0];
                                                        } else {
                                                            return item;
                                                        }
                                                    });
                                                    setFilesList(newList);
                                                }}
                                            />
                                        </Col>
                                        <Col span={24} className="doubleFile">
                                            <div style={{ display: 'flex', marginBottom: '8px' }}>询问笔录</div>
                                            <ArcoUpload
                                                params={{
                                                    action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${caseId}&&ownerId=${judicId}&ownerType=22_00018-401`,
                                                }}
                                                field="filesList1"
                                                label=""
                                                editData={{
                                                    filesList1: filesList || [],
                                                }}
                                                handleDelFile={handleDelFile}
                                                onFileListChange={(v) => {
                                                    let newList = v?.map((item) => {
                                                        if (item.response) {
                                                            return item.response.data[0];
                                                        } else {
                                                            return item;
                                                        }
                                                    });
                                                    setFilesList(newList);
                                                }}
                                            />
                                        </Col>
                                        <Col span={24}>
                                            <FormItem label={<div style={{ display: 'flex' }}>诉前调确号</div>} field="mediateJudicNo">
                                                <Input style={{ width: '450px' }} placeholder="请填写审判系统中的诉前调确号（如有）" allowClear />
                                            </FormItem>
                                        </Col>
                                        <Col span={24}>
                                            <FormItem label={<div style={{ display: 'flex' }}>结案说明</div>} field="judicContent">
                                                <TextArea rows={5} maxLength={256} autoSize={{ minRows: 4, maxRows: 8 }} placeholder="请填写" />
                                            </FormItem>
                                        </Col>
                                    </>
                                )}
                            </Row>
                        </Form>
                    </div>
                </Scrollbars>
                <div className="dataSync-excel">
                    <Space size="large" style={{ margin: '4px 14px' }}>
                        <Button onClick={() => handleApply('submit')} type="primary" className="dialogPrimary">
                            办结
                        </Button>
                        <Button onClick={() => handleApply('draft')} type="outline" className="dialogPrimary">
                            保存
                        </Button>
                        <Button type="secondary" onClick={() => navigate(-1)}>
                            返回上级页面
                        </Button>
                    </Space>
                </div>
            </Fragment>
            <MyModal width={1200} visible={caseCheckModal} onCancel={() => setCaseCheckModal(false)} footer={false}>
                <CaseDetail caseId={caseId} caseData={caseData} />
            </MyModal>
            <Modal
                title="添加预约"
                style={{ width: '40%' }}
                className="judicial-handle-modal"
                onCancel={() => setPreBookVisible(false)}
                visible={preBookVisible}
                footer={null}
            >
                <Row style={{ height: '480px', position: 'relative' }}>
                    <Col span={24}>
                        <Form
                            ref={form}
                            layout="vertical"
                            requiredSymbol={false}
                            initialValues={{
                                meetWay: '22_00021-3',
                                meetWayName: '线上 + 线下',
                            }} //默认值
                            scrollToFirstError
                        >
                            <Row>
                                <Col span={24}>
                                    <Form.Item
                                        rules={[{ required: true, message: '请选择预约调解时间' }]}
                                        label={
                                            <div style={{ display: 'flex' }}>
                                                预约调解时间<div className="must">必填</div>
                                            </div>
                                        }
                                        field="time"
                                    >
                                        <RangePicker showTime={{ format: 'HH:mm' }} allowClear={true} style={{ width: '100%' }} />
                                    </Form.Item>
                                </Col>
                                <Col span={24}>
                                    <FormItem label="纠纷化解方式" field="meetWay">
                                        <Select
                                            placeholder="请选择"
                                            allowClear={false}
                                            options={$$.options.meetWay}
                                            onChange={(value, options) => {
                                                form.current.setFieldValue('meetWayName', options && options.children);
                                            }}
                                        />
                                    </FormItem>
                                </Col>
                                <Col span={24}>
                                    <FormItem label="纠纷化解地点" field="meetAddr">
                                        <Input placeholder="请填写" />
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        <div style={{ display: 'flex', alignItems: 'center', gap: '16px', position: 'absolute', bottom: '0' }}>
                            <Button type="primary" onClick={() => submitClick()}>
                                提交
                            </Button>
                            <Button onClick={() => resetClick()} danger>
                                重置
                            </Button>
                        </div>
                    </Col>
                </Row>
            </Modal>
            <Modal
                title="创建远程调解视频号"
                style={{ width: '40%' }}
                className="judicial-handle-modal"
                onCancel={() => setRadioVisible(false)}
                visible={radioVisible}
                footer={null}
            >
                <Row style={{ height: '480px', position: 'relative' }}>
                    <Col span={24}>
                        <Form ref={formVideo} layout="vertical" requiredSymbol={false} scrollToFirstError>
                            <Row>
                                <Col span={24}>
                                    <Form.Item
                                        style={{ marginBottom: '8px' }}
                                        rules={[{ required: true, message: '请选择有效期' }]}
                                        label={
                                            <div style={{ display: 'flex' }}>
                                                有效期<div className="must">必填</div>
                                            </div>
                                        }
                                        field="time"
                                    >
                                        <RangePicker showTime={{ format: 'HH:mm' }} allowClear={true} style={{ width: '100%' }} />
                                    </Form.Item>
                                    <Alert type="info" content={<span>创建成功后请在有效期内使用小鱼易连客户端加入该号码连线</span>} />
                                </Col>
                            </Row>
                        </Form>
                        <div style={{ display: 'flex', alignItems: 'center', gap: '16px', position: 'absolute', bottom: '0' }}>
                            <Button type="primary" onClick={() => radioSubmitClick()}>
                                提交
                            </Button>
                            <Button onClick={() => radioResetClick()} danger>
                                重置
                            </Button>
                        </div>
                    </Col>
                </Row>
            </Modal>
        </NewPage>
    );
};



export default CourtAuditEdit;

 src/views/register/closeCaseEdit/preview.jsx

@@ -329,10 +329,10 @@
          <div ><div className="title-text">事项来源</div></div>
          <div>{props.data?.canalName || '大厅来访'}</div>
        </Col>
        <Col span={16}>
        {/* <Col span={16}>
          <div ><div className="title-text">来访形式</div></div>
          <div>来访</div>
        </Col>
        </Col> */}
        <Col span={24}>
          <div className="title"><div className="title-text">事项概况</div></div>
          <div>{props.data?.caseDes || '-'} </div>
@@ -341,6 +341,10 @@
          <div className="title"><div className="title-text">事项申请</div></div>
          <div>{props.data?.caseClaim || '-'}</div>
        </Col>
        <Col span={24}>
          <div className="title"><div className="title-text">事项备注</div></div>
          <div>{props.data?.caseRemark || '-'}</div>
        </Col>
        <Col span={8}>
          <div className="title title-gap">
            {props.data?.majorStatus === 1 && <img src={majorStatus_1} alt="" srcset="" />}

 src/views/register/eventFlow/component/AssignedModel.jsx

@@ -54,7 +54,7 @@
        if (type === 1) {
            formRef.current.setFieldValue(
                'assignContent',
                '本事项经初步核实，认为属于贵部门职责范围内的矛盾纠纷化解工作。请组织专门人员负责此事，尽快查明事实真相，依法依规进行处理，并在处理过程中充分考虑当事人的合理诉求，确保公平公正，维护当事人的合法权益。同时，请务必保持与当事人的沟通畅通，及时反馈办理进展，以增强矛盾纠纷化解工作的透明度和公信力。'
                '经核查，本矛盾纠纷事项属于贵单位职能管辖范围，请组织专人跟进化解，并及时反馈化解进展情况。'
            );
        } else {
            formRef.current.setFieldValue('assignContent', '');

 src/views/register/eventFlow/component/EscalationModel.jsx

@@ -75,9 +75,9 @@

  const handleTemplate = (type) => {
    if (type === 1) {
      formRef.current.setFieldValue('appearContent', '经初步核查，该事项较为复杂，且涉及多个相关部门的协调配合，为确保能够高效、妥善地解决当事人的问题，特此请求上级给予指导和支持。')
      formRef.current.setFieldValue('appearContent', '经我部门核查，该矛盾纠纷涉及XX业务，化解事权应由XX部门牵头，特请求上级协调交办XX部门牵头办理。')
    } else {
      formRef.current.setFieldValue('appearContent', '')
      formRef.current.setFieldValue('appearContent', '经综合研判，该纠纷事权在XX区/镇街，特请移交XX区/镇街牵头办理。')
    }
  }

@@ -123,7 +123,8 @@
            </Col>
            <Col span={24} style={{ position: 'relative' }}>
              <div style={{ position: 'absolute', display: 'flex ', top: '28px', zIndex: 1 }}>
                <div className='myTag' style={{ marginRight: '22px' }} onClick={() => { handleTemplate(1) }}>公共模板1：通用上报意见范本</div>
                <div className='myTag' style={{ marginRight: '22px' }} onClick={() => { handleTemplate(1) }}>公共模板1：申请移交上级职能部门范本</div>
                <div className='myTag' style={{ marginRight: '22px' }} onClick={() => { handleTemplate(2) }}>公共模板2：跨区域纠纷移交上报范本</div>
              </div>
              <FormItem
                label={(<div style={{ display: 'flex' }}>上报意见<div className="must">必填</div></div>)}

 src/views/register/handleFeedback/component/CaseResult.jsx

@@ -87,25 +87,40 @@
  const handleTemplate = (type) => {
    setSelectedTemplate(type);
    if (type === 1) {
      formRef.current.setFieldValue('windupContent', '双方当事人于xx时间xx地址已达成xx协议，纠纷已化解。')
    } else {
      formRef.current.setFieldValue('windupContent', '')
      formRef.current.setFieldValue('windupContent', '当事人XXX已于XX年X月X日支付赔偿金XX元，纠纷已化解。')
    } else if (type === 2) {
      formRef.current.setFieldValue('windupContent', '用人单位已于XX年X月X日补发劳动者工资差额人民币XX元整，纠纷已化解。')
    } else if (type === 3) {
      formRef.current.setFieldValue('windupContent', '双方当事人已达成协议，纠纷不涉及赔偿问题，纠纷已化解。')
    }
  }

  const handleTemplate1 = (type) => {
    setSelectedTemplate1(type);
    if (type === 1) {
      formRef.current.setFieldValue('agreeContent', '根据纠纷化解人员的协调，当事人双方同意如下调解协议：[简要说明协议第一条][简要说明协议第二条][……]本口头调解协议由纠纷化解人员记录，并已告知双方当事人。双方当事人确认无误。')
      formRef.current.setFieldValue('agreeContent', '据工作人员协调，当事人双方达成一致调解意见：\n1.被申请方一次性向申请方支付人民币 XX 元，于协议达成后XX日内付清；\n2.双方就此次纠纷不再追究任何法律责任。\n本口头调解协议由纠纷化解人员记录，并已告知双方当事人。双方当事人确认无误。')
    } else if (type === 2) {
      formRef.current.setFieldValue('agreeContent', '据工作人员协调，当事人双方达成一致调解意见：\n1.被申请方承诺每日XX时间段不得产生明显噪音；\n2.双方就此次纠纷不再追究任何法律责任。\n本口头调解协议由纠纷化解人员记录，并已告知双方当事人。双方当事人确认无误。')
    } else if (type === 3) {
      formRef.current.setFieldValue('agreeContent', '据工作人员协调，当事人双方达成一致调解意见：\n1.被申请方自即日起停止在公共区域堆放杂物；\n2.双方就此次纠纷不再追究任何法律责任。\n本口头调解协议由纠纷化解人员记录，并已告知双方当事人。双方当事人确认无误。')
    } else if (type === 4) {
      formRef.current.setFieldValue('agreeContent', '据工作人员协调，当事人双方达成一致调解意见：\n1.用人单位于XX时间补发劳动者工资XX元；\n2.双方就此次纠纷不再追究任何法律责任。\n本口头调解协议由纠纷化解人员记录，并已告知双方当事人。双方当事人确认无误。')
    }
  }

  const handleTemplate2 = (type) => {
    setSelectedTemplate2(type);
    // if (type === 1) {
    //   formRefWrite.current.setFieldValue('windupContent', '双方当事人于xx时间xx地址已达成xx协议，纠纷已化解。')
    // } else {
    //   formRefWrite.current.setFieldValue('windupContent', '')
    // }
    if (type === 1) {
      formRefWrite.current.setFieldValue('windupContent', '双方当事人于xx时间xx地址已达成xx协议，纠纷已化解。')
    } else {
      formRefWrite.current.setFieldValue('windupContent', '')
      formRefWrite.current.setFieldValue('windupContent', '当事人XXX已于XX年X月X日支付赔偿金XX元，纠纷已化解。')
    } else if (type === 2) {
      formRefWrite.current.setFieldValue('windupContent', '用人单位已于XX年X月X日补发劳动者工资差额人民币XX元整，纠纷已化解。')
    } else if (type === 3) {
      formRefWrite.current.setFieldValue('windupContent', '双方当事人已达成协议，纠纷不涉及赔偿问题，纠纷已化解。')
    }
  }

@@ -277,7 +292,28 @@
                                  style={{ marginRight: '22px' }}
                                  onClick={() => handleTemplate1(1)}
                                >
                                  公共模板:调解成功口头协议
                                  口头协议范本(经济纠纷)
                                </div>
                                <div
                                  className={`myTag ${selectedTemplate1 === 1 ? 'highlighted' : ''}`} // 条件样式
                                  style={{ marginRight: '22px' }}
                                  onClick={() => handleTemplate1(2)}
                                >
                                  口头协议范本(邻里纠纷-噪音)
                                </div>
                                <div
                                  className={`myTag ${selectedTemplate1 === 1 ? 'highlighted' : ''}`} // 条件样式
                                  style={{ marginRight: '22px' }}
                                  onClick={() => handleTemplate1(3)}
                                >
                                  口头协议范本(邻里纠纷-公共区域)
                                </div>
                                <div
                                  className={`myTag ${selectedTemplate1 === 1 ? 'highlighted' : ''}`} // 条件样式
                                  style={{ marginRight: '22px' }}
                                  onClick={() => handleTemplate1(4)}
                                >
                                  口头协议范本(劳资纠纷)
                                </div>
                              </div>
                            </>
@@ -299,7 +335,21 @@
                            style={{ marginRight: '22px' }}
                            onClick={() => handleTemplate(1)}
                          >
                            公共模板：化解成功协议履行情况范本
                            公共模板：赔偿纠纷和解协议
                          </div>
                          <div
                            className={`myTag ${selectedTemplate === 1 ? 'highlighted' : ''}`} // 条件样式
                            style={{ marginRight: '22px' }}
                            onClick={() => handleTemplate(2)}
                          >
                            公共模板：劳资纠纷和解协议
                          </div>
                          <div
                            className={`myTag ${selectedTemplate === 1 ? 'highlighted' : ''}`} // 条件样式
                            style={{ marginRight: '22px' }}
                            onClick={() => handleTemplate(3)}
                          >
                            公共模板：邻里纠纷和解协议
                          </div>
                        </div>
                        <FormItem
@@ -363,7 +413,21 @@
                            style={{ marginRight: '22px' }}
                            onClick={() => handleTemplate2(1)}
                          >
                            公共模板：化解成功协议履行情况范本
                            公共模板：赔偿纠纷和解协议
                          </div>
                          <div
                            className={`myTag ${selectedTemplate2 === 1 ? 'highlighted' : ''}`} // 条件样式
                            style={{ marginRight: '22px' }}
                            onClick={() => handleTemplate2(2)}
                          >
                            公共模板：劳资纠纷和解协议
                          </div>
                          <div
                            className={`myTag ${selectedTemplate2 === 1 ? 'highlighted' : ''}`} // 条件样式
                            style={{ marginRight: '22px' }}
                            onClick={() => handleTemplate2(3)}
                          >
                            公共模板：邻里纠纷和解协议
                          </div>
                        </div>


 src/views/register/index.jsx

@@ -10,6 +10,7 @@
import { useNavigate } from 'react-router-dom';
import { tab0, tab1, tab2, tab3, tab4, tab5, tab6, allSign, tab1bg } from '@/assets/images';
import TableView from '../../components/TableView';
import NewPage from '../../components/NewPage';
import TableDraftSearch from '../../components/TableDraftSearch';
import TableSearch from '../../components/TableSearch';
import MyTabsNew from '../../components/MyTabsNew';
@@ -499,7 +500,12 @@
            title: '事项来源',
            dataIndex: 'caseSource',
            key: 'caseSource',
            width: 120,
            width: 150,
            render: (text, record) => {
                return record.caseSecondSource && record.caseSecondSource !== null 
                    ? `${text}/${record.caseSecondSource}` 
                    : text;
            },
        },
        {
            title: '问题属地',
@@ -2863,7 +2869,7 @@
                sortColmn: 2,
                status: '1',
            });
        }else {
        } else {
            setSearchData({
                sortType: 2,
                sortColmn: 1,
@@ -3570,603 +3576,619 @@
    console.log('tableTab', tableTab, tabActivekey, tableData);

    return (
        <div className="VisitWorkBench">
            <div className="VisitWorkBench-top">
                <span style={{ fontWeight: 600 }}>工作总览</span>
                <div className="VisitWorkBench-top-list">
                    {Object.keys(tabsMap).map((key) => (
                        <div
                            key={key}
                            className="VisitWorkBench-top-list-tabsItem"
                            style={{
                                ...(tabActivekey !== key ? { backgroundColor: tabsMap[key].workTotal.bgColor } : {}),
                                ...(tabActivekey === key
                                    ? {
                                            backgroundImage: `url(${require(`../../assets/images/${tabsMap[key].workTotal.bgImage}`)})`,
                                            border: `1px solid ${tabsMap[key].workTotal.borderColor}`,
                                            backgroundRepeat: 'no-repeat',
                                            backgroundSize: 'cover',
                                            maxWidth: '100%',
                                            height: 'auto',
                                      }
                                    : {}),
                            }}
                            onClick={() => tabActive(key, tabsMap[key])}
                        >
                            <div>
                                <div>{tabsMap[key].workTotal.label}</div>
                                <span className="VisitWorkBench-top-list-tabsItem-title">{countData[tabsMap[key].workTotal.value] || 0}</span>件
                            </div>
                            <div>
                                <img src={tabsMap[key].workTotal.img} alt="" className="VisitWorkBench-top-list-tabsItem-imgView" />
                            </div>
                        </div>
                    ))}
                </div>
            </div>
            <div
                className="VisitWorkBench-middle"
                onKeyUp={(e) => {
                    if (e.key === 'Enter') {
                        handleSubmit();
                    }
                }}
            >
                <Tabs activeTab={searchData.status} onChange={handleColumnType} destroyOnHide>
                    {tableTab?.map((item) => {
                        return (
                            <TabPane
                                key={item.value}
                                title={
                                    <span style={{ fontSize: '15px' }}>
                                        {item.label}
                                        {item.numberKey ? `（${countData[item.numberKey] || 0}）` : ''}
                                    </span>
                                }
                            >
                                <Typography.Paragraph key={tabActivekey + item.value}>
                                    {tabActivekey == '5' && searchData.status != '2' && (
                                        <Radio.Group
                                            type="button"
                                            value={searchData.type}
                                            onChange={(value) => {
                                                setSearchData({
                                                    ...searchData,
                                                    type: value,
                                                });
                                            }}
                                            style={{ marginBottom: 16 }}
                                            options={[
                                                {
                                                    label: `回退审核${searchData.status === '0' ? `（${countData.returnReview || 0}）` : ''}`,
                                                    value: 1,
                                                },
                                                {
                                                    label: `上报审核${searchData.status === '0' ? `（${countData.appearReview || 0}）` : ''}`,
                                                    value: 2,
                                                },
                                                {
                                                    label: `结案申请审核${searchData.status === '0' ? `（${countData.windupReview || 0}）` : ''}`,
                                                    value: 3,
                                                },
                                                {
                                                    label: `联合处置审核${searchData.status === '0' ? `（${countData.assistReview || 0}）` : ''}`,
                                                    value: 4,
                                                },
                                            ]}
                                        />
                                    )}
                                    {tabActivekey == '4' && (
                                        <Radio.Group
                                            type="button"
                                            value={searchData.caseTaskType}
                                            onChange={(value) => {
                                                setSearchData({
                                                    ...searchData,
                                                    caseTaskType: value,
                                                });
                                            }}
                                            style={{ marginBottom: 16 }}
                                            options={[
                                                {
                                                    label: '我承办的',
                                                    value: 1,
                                                },
                                                {
                                                    label: '我配合的',
                                                    value: 2,
                                                },
                                            ]}
                                        />
                                    )}
                                    <TableView
                                        rowSelection={tabActivekey == '2' && item.value === '1' ? rowSelection : null}
                                        columns={item.columnsMap ? item.columnsMap[tabActivekey == '4' ? searchData.caseTaskType : searchData.type] : item.columns}
                                        dataSource={tableData}
                                        // tableHeight={'100%'}
                                        size="small"
                                        rowKey="ownerId"
                                        bordered={true}
                                        isScroll={true} //兼容以前的，当需要表格竖向滚动，请设置这个
                                        scroll={{
                                            x: 1300,
                                        }}
                                        offsetHeight={165}
                                        loading={loading}
                                        pagination={{
                                            current: pageData.page,
                                            pageSize: pageData.size,
                                            total: total,
                                            onChange: (page, pageSize) => {
                                                setPageData({
                                                    ...pageData,
                                                    page,
                                                    size: pageSize,
                                                });
                                            },
                                        }}
                                        onChange={(pagination, filters, sorter) => {
                                            handleSort(sorter);
                                        }}
                                    />
                                </Typography.Paragraph>
                                {tabActivekey == '2' && item.value === '1' && selectedRowKeys.length != 0 && (
                                    <div className="VisitWorkBench-middle-select">
                                        <span>已选{selectedRowKeys.length}项</span>
                                        <span
                                            className="linkBtnColor"
                                            onClick={() => {
                                                setSelectedRowKeys([]);
                                                setSelectedRows([]);
                                            }}
                                        >
                                            取消
                                        </span>
                                        <span className="linkBtnColor" onClick={handleBatchQs}>
                                            批量签收
                                        </span>
                                    </div>
                                )}
                            </TabPane>
                        );
                    })}
                </Tabs>
                <div className="VisitWorkBench-middle-search">
                    <Form ref={formRef} layout="vertical">
                        <div style={{ display: 'flex' }}>
                            {tabActivekey == '2' && searchData.status === '1' && selectedRowKeys.length != 0 && (
                                <div
                                    onClick={handleAllSign}
                                    style={{ color: '#1a6fb8', cursor: 'pointer', marginRight: '16px', width: '85px', textAlign: 'center', paddingTop: '3px' }}
                                >
                                    <img src={allSign} alt="" className="title-file" />
                                    全部签收
                                </div>
                            )}
                            {tabActivekey == '0' && (
                                <FormItem label=" " field="caseStatus" style={{ width: '160px' }}>
                                    <Select allowClear placeholder="请选择">
                                        {[
                                            { value: '1', label: '未办结' },
                                            { value: '2', label: '已办结' },
                                            { value: '3', label: '不予受理' },
                                        ]?.map((y) => (
                                            <Option value={y.value}>事项状态：{y.label}</Option>
                                        ))}
                                    </Select>
                                </FormItem>
                            )}
                            <FormItem label=" " field="time" style={{ width: '300px' }}>
                                <RangePicker
                                    style={{ width: '100%' }}
                                    shortcutsPlacementLeft={true}
                                    shortcuts={$$.shortcutsList()}
                                    format="YYYY-MM-DD HH:mm"
                                    showTime={true}
                                    placeholder={getPlaceholder()}
                                />
                            </FormItem>
                            <FormItem label=" " field="partyName" style={{ width: '250px' }}>
                                <Input allowClear placeholder="查询申请方/被申请方关键词" />
                            </FormItem>
                            <Button type="primary" className="dialogPrimary" onClick={handleSubmit}>
                                查询
                            </Button>
                        </div>
                    </Form>
                </div>
            </div>
            <div className="VisitWorkBench-bottom">
                <div className="VisitWorkBench-bottom-list">
                    <div style={{ backgroundColor: '#fff', padding: '12px 16px 16px 16px', flex: '1' }}>
                        <div className="VisitWorkBench-bottom-head">
                            <span>事项登记</span>
                            <span
                                onClick={() => modalClick('his')}
                                style={{ cursor: 'pointer', display: 'flex', alignItems: 'center', gap: '4px' }}
                                className="public-color"
                            >
                                <img style={{ width: '18px' }} src={workDash_15} alt="" srcset="" /> 登记历史
                            </span>
                        </div>
                        <div className="VisitWorkBench-bottom-list-l">
        <NewPage>
            <div className="VisitWorkBench">
                <div className="VisitWorkBench-top">
                    <span style={{ fontWeight: 600 }}>工作总览</span>
                    <div className="VisitWorkBench-top-list">
                        {Object.keys(tabsMap).map((key) => (
                            <div
                                className="bottomTab3"
                                onClick={() => {
                                    navigate(`/mediate/visit`);
                                    // let userInfo = $$.getSessionStorage('customerSystemUser');
                                    // if (userInfo?.unit.endsWith('综治中心')) {
                                    //     navigate(`/mediate/visit`);
                                    // } else {
                                    //     // 提示您所在的机构无法使用大厅来访
                                    //     $$.info({ type: 'error', content: '您所在的机构无法使用大厅来访' });
                                    // }
                                key={key}
                                className="VisitWorkBench-top-list-tabsItem"
                                style={{
                                    ...(tabActivekey !== key ? { backgroundColor: tabsMap[key].workTotal.bgColor } : {}),
                                    ...(tabActivekey === key
                                        ? {
                                                backgroundImage: `url(${require(`../../assets/images/${tabsMap[key].workTotal.bgImage}`)})`,
                                                border: `1px solid ${tabsMap[key].workTotal.borderColor}`,
                                                backgroundRepeat: 'no-repeat',
                                                backgroundSize: 'cover',
                                                maxWidth: '100%',
                                                height: 'auto',
                                          }
                                        : {}),
                                }}
                                onClick={() => tabActive(key, tabsMap[key])}
                            >
                                <div className="VisitWorkBench-bottom-title" style={{ color: '#206BCD' }}>
                                    大厅来访
                                </div>
                                {/* <img src={visitInto} alt='' className='VisitWorkBench-bottom-img' /> */}
                            </div>
                            <div
                                className="bottomTab4"
                                onClick={() => {
                                    setInspectionVisible(true);
                                }}
                            >
                                <div className="VisitWorkBench-bottom-title" style={{ color: '#D46B08' }}>
                                    自行排查
                                </div>
                                {/* <img src={checkInto} alt='' className='VisitWorkBench-bottom-img' /> */}
                            </div>
                        </div>
                    </div>
                    <div className="VisitWorkBench-bottom-list-r">
                        <div className="VisitWorkBench-bottom-list-r-item">
                            <div className="VisitWorkBench-bottom-head">已办事项</div>
                            <div onClick={() => modalClick('done')} className="VisitWorkBench-bottom-list-r-item-content">
                                <img src={visitWorkBench_1} alt="" srcset="" />
                                <div>
                                    <div className="VisitWorkBench-bottom-list-r-item-content-title">全部已办</div>
                                    <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                        {countData.alreadyDone || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                                    </div>
                                    <div>{tabsMap[key].workTotal.label}</div>
                                    <span className="VisitWorkBench-top-list-tabsItem-title">{countData[tabsMap[key].workTotal.value] || 0}</span>件
                                </div>
                            </div>
                        </div>
                        <div className="VisitWorkBench-bottom-list-r-item">
                            <div className="VisitWorkBench-bottom-head">效能分析</div>
                            <div
                                onClick={() => {
                                    navigate(`/mediate/workEfficiency`);
                                }}
                                className="VisitWorkBench-bottom-list-r-item-content VisitWorkBench-bottom-list-r-item-content-red"
                            >
                                <img src={efficiency} alt="" srcset="" />
                                <div>
                                    <div className="VisitWorkBench-bottom-list-r-item-content-title">超时任务</div>
                                    <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                        {countData.timeOut || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                                    </div>
                                    <img src={tabsMap[key].workTotal.img} alt="" className="VisitWorkBench-top-list-tabsItem-imgView" />
                                </div>
                            </div>
                        </div>
                        <div className="VisitWorkBench-bottom-list-r-item">
                            <div className="VisitWorkBench-bottom-head">草稿箱</div>
                            <div
                                onClick={() => modalClick('draft')}
                                className="VisitWorkBench-bottom-list-r-item-content VisitWorkBench-bottom-list-r-item-content-orange"
                            >
                                <img src={visitWorkBench_2} alt="" srcset="" />
                                <div>
                                    <div className="VisitWorkBench-bottom-list-r-item-content-title">事项草稿</div>
                                    <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                        {countData.caseDraft || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        ))}
                    </div>
                </div>
            </div>
            <Modal
                title={<div style={{ textAlign: 'left' }}>{modalData.title}</div>}
                style={{ width: '80%' }}
                onCancel={() => {
                    setModalData({ ...modalData, visible: false, list: [], title: '', type: '' });
                }}
                closable={true}
                visible={modalData.visible}
                footer={null}
            >
                {modalData.type === 'draft' && (
                    <div>
                        <TableDraftSearch
                            labelLength={4}
                            exportButtonShow={false}
                            handleText={'重置'}
                            form={form}
                            itemData={[
                                { type: 'RangePicker', name: 'updateTime', label: '保存时间', shortcutsPlacementLeft: true, shortcuts: $$.shortcutsList(), span: 6 },
                                { type: 'Input', name: 'plaintiffs', placeholder: '查询关键词', label: '申请方', span: 6 },
                                { type: 'Input', name: 'defendants', placeholder: '查询关键词', label: '被申请方', span: 6 },
                            ]}
                            handleReset={() => handleSearch('draft', 'reset')}
                            handleSearch={() => handleSearch('draft', 'search')}
                        />
                        <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', marginBottom: '12px' }}></div>
                        <div style={{ marginTop: '0px' }}>
                            <TableView
                                showHeader
                                title="查询结果"
                                columns={columns()}
                                dataSource={data.tableData}
                                onChange={(pagination, filters, sorter) => {
                                    handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                                    // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                                }}
                                pagination={{
                                    current: search.page,
                                    pageSize: search.size,
                                    total: data.total,
                                    // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                                }}
                            />
                        </div>
                    </div>
                )}
                {modalData.type === 'his' && (
                    <div>
                        <TableSearch
                            labelLength={4}
                            exportButtonShow={false}
                            displayShow={false}
                            textAlign={{ textAlign: 'left' }}
                            form={form}
                            itemData={[
                                { type: 'RangePicker', name: 'createTime', label: '登记时间', shortcutsPlacementLeft: true, shortcuts: $$.shortcutsList(), span: 6 },
                                { type: 'Input', name: 'plaintiffs', placeholder: '查询关键词', label: '申请方', span: 6 },
                                { type: 'Input', name: 'defendants', placeholder: '查询关键词', label: '被申请方', span: 6 },
                                {
                                    type: 'Select',
                                    name: 'status',
                                    label: '事项状态',
                                    placeholder: '请选择',
                                    span: 8,
                                    selectdata: $$.options.caseStatus,
                                },
                                {
                                    type: 'Cascader',
                                    name: 'caseType',
                                    label: '纠纷类型',
                                    placeholder: '请选择',
                                    span: 8,
                                    treedata: $$.caseTypeSelect.caseTypeSelect,
                                },
                                {
                                    type: 'Select',
                                    name: 'canal',
                                    label: '事项来源',
                                    placeholder: '请选择',
                                    span: 8,
                                    selectdata: $$.options.caseCanal,
                                },
                                {
                                    type: 'Select',
                                    name: 'caseLevel',
                                    label: '事项等级',
                                    placeholder: '请选择',
                                    span: 8,
                                    selectdata: $$.options.caseLevelList,
                                },
                                {
                                    type: 'Select',
                                    name: 'mediResult',
                                    label: '化解结果',
                                    placeholder: '请选择',
                                    span: 8,
                                    selectdata: $$.options.mediResult,
                                },
                            ]}
                            handleReset={() => handleSearch('his', 'reset')}
                            handleSearch={() => handleSearch('his', 'search')}
                        />
                        <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', margin: '12px 0' }}></div>
                        <div style={{ marginTop: '0px' }}>
                            <TableView
                                showHeader
                                title="查询结果"
                                columns={columnsHis()}
                                dataSource={data.tableData}
                                onChange={(pagination, filters, sorter) => {
                                    handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                                    // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                                }}
                                pagination={{
                                    current: search.page,
                                    pageSize: search.size,
                                    total: data.total,
                                    // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                                }}
                            />
                        </div>
                    </div>
                )}
                {modalData.type === 'done' && (
                    <div>
                        <TableSearch
                            labelLength={4}
                            exportButtonShow={false}
                            displayShow={false}
                            textAlign={{ textAlign: 'left' }}
                            form={form}
                            itemData={[
                                {
                                    type: 'RangePicker',
                                    name: 'handleTime',
                                    label: '统计时间',
                                    allowClear: false,
                                    shortcutsPlacementLeft: true,
                                    shortcuts: $$.shortcutsList(),
                                    span: 6,
                                },
                                {
                                    type: 'Cascader',
                                    name: 'caseType',
                                    label: '纠纷类型',
                                    placeholder: '请选择',
                                    span: 8,
                                    changeSelect: true,
                                    allowClear: false,
                                    treedata: $$.caseTypeSelect.caseTypeSelect,
                                },
                                { type: 'Select', name: 'caseLevel', label: '事项等级', placeholder: '请选择', span: 8, selectdata: $$.options.caseLevelList },
                                { type: 'Select', name: 'canal', label: '事项来源', placeholder: '请选择', span: 8, selectdata: $$.options.caseCanal },
                                { type: 'Select', name: 'mediResult', label: '化解结果', placeholder: '请选择', span: 8, selectdata: $$.options.mediResult },
                                { type: 'Select', name: 'status', label: '事项状态', placeholder: '请选择', span: 8, selectdata: $$.options.caseStatus },
                            ]}
                            handleReset={() => handleSearch('done', 'reset')}
                            handleSearch={() => handleSearch('done', 'search')}
                        />
                        <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', margin: '12px 0' }}></div>
                        <div style={{ marginTop: '0px' }}>
                            <div style={{ fontSize: '16px' }}>查询结果</div>
                            <div style={{ width: '100%', position: 'relative' }}>
                                <MyTabsNew
                                    // 1-已受理，2-已交办，3-已上报，4已回退
                                    tabs={[
                                        { label: <div style={{ height: '24px' }}>全部（{data?.totalData?.totalNum || 0}）</div>, key: '' },
                                        { label: <div style={{ height: '24px' }}>已受理（{data?.totalData?.acceptNum || 0}）</div>, key: '1' },
                                        { label: <div style={{ height: '24px' }}>已交办（{data?.totalData?.assignedNum || 0}）</div>, key: '2' },
                                        { label: <div style={{ height: '24px' }}>已上报（{data?.totalData?.reportNUm || 0}）</div>, key: '3' },
                                        { label: <div style={{ height: '24px' }}>已回退（{data?.totalData?.backNUm || 0}）</div>, key: '4' },
                                    ]}
                                    activeKey={tabKey}
                                    onChange={(activeKey) => tabsOnchange(activeKey)}
                                />
                                <div style={{ borderBottom: '1px solid #E5E6EB', position: 'absolute', width: '100%' }}></div>
                            </div>
                            <div style={{ margin: '12px 0' }}>
                                <Alert
                                    type="success"
                                    content={
                                        <span>
                                            已为您生成
                                            {tabKey !== '' && (
                                                <span>
                                                    <span className="public-color">
                                                        {tabKey === '1'
                                                            ? '受理时间'
                                                            : tabKey === '2'
                                                            ? '交办时间'
                                                            : tabKey === '3'
                                                            ? '上报时间'
                                                            : tabKey === '4'
                                                            ? '回退时间'
                                                            : ''}
                                                    </span>
                                                    在
                                                </span>
                                            )}
                                            {search.handleTimeStart && (
                                                <span className="public-color">
                                                    {$$.myTimeFormat(search.handleTimeStart, 'YYYY.M.D')}-{$$.myTimeFormat(search.handleTimeEnd, 'YYYY.M.D')}
                                                </span>
                                            )}
                                            {/*{search.closeStart && <span className='public-color'>{search.createStart && '、'}办结时间({$$.myTimeFormat(search.createStart, 'YYYY.M.D')}-{$$.myTimeFormat(search.createEnd, 'YYYY.M.D')})</span>}
                    {search.caseType && <span className='public-color'>{(search.createStart || search.closeStart) && '、'}纠纷类型({caseTypeNames.join('/')})</span>} */}
                                            内的已办矛盾纠纷
                <div
                    className="VisitWorkBench-middle"
                    onKeyUp={(e) => {
                        if (e.key === 'Enter') {
                            handleSubmit();
                        }
                    }}
                >
                    <Tabs activeTab={searchData.status} onChange={handleColumnType} destroyOnHide>
                        {tableTab?.map((item) => {
                            return (
                                <TabPane
                                    key={item.value}
                                    title={
                                        <span style={{ fontSize: '15px' }}>
                                            {item.label}
                                            {item.numberKey ? `（${countData[item.numberKey] || 0}）` : ''}
                                        </span>
                                    }
                                >
                                    <Typography.Paragraph key={tabActivekey + item.value}>
                                        {tabActivekey == '5' && searchData.status != '2' && (
                                            <Radio.Group
                                                type="button"
                                                value={searchData.type}
                                                onChange={(value) => {
                                                    setSearchData({
                                                        ...searchData,
                                                        type: value,
                                                    });
                                                }}
                                                style={{ marginBottom: 16 }}
                                                options={[
                                                    {
                                                        label: `回退审核${searchData.status === '0' ? `（${countData.returnReview || 0}）` : ''}`,
                                                        value: 1,
                                                    },
                                                    {
                                                        label: `上报审核${searchData.status === '0' ? `（${countData.appearReview || 0}）` : ''}`,
                                                        value: 2,
                                                    },
                                                    {
                                                        label: `结案申请审核${searchData.status === '0' ? `（${countData.windupReview || 0}）` : ''}`,
                                                        value: 3,
                                                    },
                                                    {
                                                        label: `联合处置审核${searchData.status === '0' ? `（${countData.assistReview || 0}）` : ''}`,
                                                        value: 4,
                                                    },
                                                ]}
                                            />
                                        )}
                                        {tabActivekey == '4' && (
                                            <Radio.Group
                                                type="button"
                                                value={searchData.caseTaskType}
                                                onChange={(value) => {
                                                    setSearchData({
                                                        ...searchData,
                                                        caseTaskType: value,
                                                    });
                                                }}
                                                style={{ marginBottom: 16 }}
                                                options={[
                                                    {
                                                        label: '我承办的',
                                                        value: 1,
                                                    },
                                                    {
                                                        label: '我配合的',
                                                        value: 2,
                                                    },
                                                ]}
                                            />
                                        )}
                                        <TableView
                                            rowSelection={tabActivekey == '2' && item.value === '1' ? rowSelection : null}
                                            columns={item.columnsMap ? item.columnsMap[tabActivekey == '4' ? searchData.caseTaskType : searchData.type] : item.columns}
                                            dataSource={tableData}
                                            // tableHeight={'100%'}
                                            size="small"
                                            rowKey="ownerId"
                                            bordered={true}
                                            isScroll={true} //兼容以前的，当需要表格竖向滚动，请设置这个
                                            scroll={{
                                                x: 1300,
                                            }}
                                            offsetHeight={165}
                                            loading={loading}
                                            pagination={{
                                                current: pageData.page,
                                                pageSize: pageData.size,
                                                total: total,
                                                onChange: (page, pageSize) => {
                                                    setPageData({
                                                        ...pageData,
                                                        page,
                                                        size: pageSize,
                                                    });
                                                },
                                            }}
                                            onChange={(pagination, filters, sorter) => {
                                                handleSort(sorter);
                                            }}
                                        />
                                    </Typography.Paragraph>
                                    {tabActivekey == '2' && item.value === '1' && selectedRowKeys.length != 0 && (
                                        <div className="VisitWorkBench-middle-select">
                                            <span>已选{selectedRowKeys.length}项</span>
                                            <span
                                                className="linkBtnColor"
                                                onClick={() => {
                                                    setSelectedRowKeys([]);
                                                    setSelectedRows([]);
                                                }}
                                            >
                                                取消
                                            </span>
                                            <span className="linkBtnColor" onClick={handleBatchQs}>
                                                批量签收
                                            </span>
                                        </div>
                                    )}
                                </TabPane>
                            );
                        })}
                    </Tabs>
                    <div className="VisitWorkBench-middle-search">
                        <Form ref={formRef} layout="vertical">
                            <div style={{ display: 'flex' }}>
                                {tabActivekey == '2' && searchData.status === '1' && selectedRowKeys.length != 0 && (
                                    <div
                                        onClick={handleAllSign}
                                        style={{ color: '#1a6fb8', cursor: 'pointer', marginRight: '16px', width: '85px', textAlign: 'center', paddingTop: '3px' }}
                                    >
                                        <img src={allSign} alt="" className="title-file" />
                                        全部签收
                                    </div>
                                )}
                                {tabActivekey == '0' && (
                                    <FormItem label=" " field="caseStatus" style={{ width: '160px' }}>
                                        <Select allowClear placeholder="请选择">
                                            {[
                                                { value: '1', label: '未办结' },
                                                { value: '2', label: '已办结' },
                                                { value: '3', label: '不予受理' },
                                            ]?.map((y) => (
                                                <Option value={y.value}>事项状态：{y.label}</Option>
                                            ))}
                                        </Select>
                                    </FormItem>
                                )}
                                <FormItem label=" " field="time" style={{ width: '300px' }}>
                                    <RangePicker
                                        style={{ width: '100%' }}
                                        shortcutsPlacementLeft={true}
                                        shortcuts={$$.shortcutsList()}
                                        format="YYYY-MM-DD HH:mm"
                                        showTime={true}
                                        placeholder={getPlaceholder()}
                                    />
                                </FormItem>
                                <FormItem label=" " field="partyName" style={{ width: '250px' }}>
                                    <Input allowClear placeholder="查询申请方/被申请方关键词" />
                                </FormItem>
                                <Button type="primary" className="dialogPrimary" onClick={handleSubmit}>
                                    查询
                                </Button>
                            </div>
                        </Form>
                    </div>
                </div>
                <div className="VisitWorkBench-bottom">
                    <div className="VisitWorkBench-bottom-list">
                        <div style={{ backgroundColor: '#fff', padding: '12px 16px 16px 16px', flex: '1' }}>
                            <div className="VisitWorkBench-bottom-head">
                                <span>事项登记</span>
                                <span
                                    onClick={() => modalClick('his')}
                                    style={{ cursor: 'pointer', display: 'flex', alignItems: 'center', gap: '4px' }}
                                    className="public-color"
                                >
                                    <img style={{ width: '18px' }} src={workDash_15} alt="" srcset="" /> 登记历史
                                </span>
                            </div>
                            <div className="VisitWorkBench-bottom-list-l">
                                <div
                                    className="bottomTab3"
                                    onClick={() => {
                                        navigate(`/mediate/visit`);
                                        // let userInfo = $$.getSessionStorage('customerSystemUser');
                                        // if (userInfo?.unit.endsWith('综治中心')) {
                                        //     navigate(`/mediate/visit`);
                                        // } else {
                                        //     // 提示您所在的机构无法使用大厅来访
                                        //     $$.info({ type: 'error', content: '您所在的机构无法使用大厅来访' });
                                        // }
                                    }}
                                >
                                    <div className="VisitWorkBench-bottom-title" style={{ color: '#206BCD' }}>
                                        大厅来访
                                    </div>
                                    {/* <img src={visitInto} alt='' className='VisitWorkBench-bottom-img' /> */}
                                </div>
                                <div
                                    className="bottomTab4"
                                    onClick={() => {
                                        setInspectionVisible(true);
                                    }}
                                >
                                    <div className="VisitWorkBench-bottom-title" style={{ color: '#D46B08' }}>
                                        自行排查
                                    </div>
                                    {/* <img src={checkInto} alt='' className='VisitWorkBench-bottom-img' /> */}
                                </div>
                            </div>
                        </div>
                        <div className="VisitWorkBench-bottom-list-r">
                            <div className="VisitWorkBench-bottom-list-r-item">
                                <div className="VisitWorkBench-bottom-head">已办事项</div>
                                <div onClick={() => modalClick('done')} className="VisitWorkBench-bottom-list-r-item-content">
                                    <img src={visitWorkBench_1} alt="" srcset="" />
                                    <div>
                                        <div className="VisitWorkBench-bottom-list-r-item-content-title">全部已办</div>
                                        <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                            {countData.alreadyDone || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className="VisitWorkBench-bottom-list-r-item">
                                <div className="VisitWorkBench-bottom-head">效能分析</div>
                                <div
                                    onClick={() => {
                                        navigate(`/mediate/workEfficiency`);
                                    }}
                                    className="VisitWorkBench-bottom-list-r-item-content VisitWorkBench-bottom-list-r-item-content-red"
                                >
                                    <img src={efficiency} alt="" srcset="" />
                                    <div>
                                        <div className="VisitWorkBench-bottom-list-r-item-content-title">超时任务</div>
                                        <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                            {countData.timeOut || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className="VisitWorkBench-bottom-list-r-item">
                                <div className="VisitWorkBench-bottom-head">草稿箱</div>
                                <div
                                    onClick={() => modalClick('draft')}
                                    className="VisitWorkBench-bottom-list-r-item-content VisitWorkBench-bottom-list-r-item-content-orange"
                                >
                                    <img src={visitWorkBench_2} alt="" srcset="" />
                                    <div>
                                        <div className="VisitWorkBench-bottom-list-r-item-content-title">事项草稿</div>
                                        <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                            {countData.caseDraft || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <Modal
                    title={<div style={{ textAlign: 'left' }}>{modalData.title}</div>}
                    style={{ width: '80%' }}
                    onCancel={() => {
                        setModalData({ ...modalData, visible: false, list: [], title: '', type: '' });
                    }}
                    closable={true}
                    visible={modalData.visible}
                    footer={null}
                >
                    {modalData.type === 'draft' && (
                        <div>
                            <TableDraftSearch
                                labelLength={4}
                                exportButtonShow={false}
                                handleText={'重置'}
                                form={form}
                                itemData={[
                                    {
                                        type: 'RangePicker',
                                        name: 'updateTime',
                                        label: '保存时间',
                                        shortcutsPlacementLeft: true,
                                        shortcuts: $$.shortcutsList(),
                                        span: 6,
                                    },
                                    { type: 'Input', name: 'plaintiffs', placeholder: '查询关键词', label: '申请方', span: 6 },
                                    { type: 'Input', name: 'defendants', placeholder: '查询关键词', label: '被申请方', span: 6 },
                                ]}
                                handleReset={() => handleSearch('draft', 'reset')}
                                handleSearch={() => handleSearch('draft', 'search')}
                            />
                            <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', marginBottom: '12px' }}></div>
                            <div style={{ marginTop: '0px' }}>
                                <TableView
                                    showHeader
                                    title="查询结果"
                                    columns={columns()}
                                    dataSource={data.tableData}
                                    onChange={(pagination, filters, sorter) => {
                                        handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                                        // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                                    }}
                                    pagination={{
                                        current: search.page,
                                        pageSize: search.size,
                                        total: data.total,
                                        // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                                    }}
                                />
                            </div>
                            <TableView
                                // showHeader
                                // title="查询结果"
                                columns={columnsDone}
                                key={tabKey}
                                dataSource={data.tableData}
                                onChange={(pagination, filters, sorter) => {
                                    handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                                    // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                                }}
                                pagination={{
                                    current: search.page,
                                    pageSize: search.size,
                                    total: data.total,
                                    // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                                }}
                        </div>
                    )}
                    {modalData.type === 'his' && (
                        <div>
                            <TableSearch
                                labelLength={4}
                                exportButtonShow={false}
                                displayShow={false}
                                textAlign={{ textAlign: 'left' }}
                                form={form}
                                itemData={[
                                    {
                                        type: 'RangePicker',
                                        name: 'createTime',
                                        label: '登记时间',
                                        shortcutsPlacementLeft: true,
                                        shortcuts: $$.shortcutsList(),
                                        span: 6,
                                    },
                                    { type: 'Input', name: 'plaintiffs', placeholder: '查询关键词', label: '申请方', span: 6 },
                                    { type: 'Input', name: 'defendants', placeholder: '查询关键词', label: '被申请方', span: 6 },
                                    {
                                        type: 'Select',
                                        name: 'status',
                                        label: '事项状态',
                                        placeholder: '请选择',
                                        span: 8,
                                        selectdata: $$.options.caseStatus,
                                    },
                                    {
                                        type: 'Cascader',
                                        name: 'caseType',
                                        label: '纠纷类型',
                                        placeholder: '请选择',
                                        span: 8,
                                        treedata: $$.caseTypeSelect.caseTypeSelect,
                                    },
                                    {
                                        type: 'Select',
                                        name: 'canal',
                                        label: '事项来源',
                                        placeholder: '请选择',
                                        span: 8,
                                        selectdata: $$.options.caseCanal,
                                    },
                                    {
                                        type: 'Select',
                                        name: 'caseLevel',
                                        label: '事项等级',
                                        placeholder: '请选择',
                                        span: 8,
                                        selectdata: $$.options.caseLevelList,
                                    },
                                    {
                                        type: 'Select',
                                        name: 'mediResult',
                                        label: '化解结果',
                                        placeholder: '请选择',
                                        span: 8,
                                        selectdata: $$.options.mediResult,
                                    },
                                ]}
                                handleReset={() => handleSearch('his', 'reset')}
                                handleSearch={() => handleSearch('his', 'search')}
                            />
                            <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', margin: '12px 0' }}></div>
                            <div style={{ marginTop: '0px' }}>
                                <TableView
                                    showHeader
                                    title="查询结果"
                                    columns={columnsHis()}
                                    dataSource={data.tableData}
                                    onChange={(pagination, filters, sorter) => {
                                        handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                                        // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                                    }}
                                    pagination={{
                                        current: search.page,
                                        pageSize: search.size,
                                        total: data.total,
                                        // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                                    }}
                                />
                            </div>
                        </div>
                    </div>
                )}
            </Modal>
            <Response visible={response} handleOnCancel={() => setResponse(false)} responseId={responseId} data={superviseInfo} />
            <Modal title="督办信息" style={{ width: '938px' }} onCancel={() => setSupervisingList(false)} visible={supervisingList} footer={null}>
                <TableView
                    showHeader
                    title=""
                    columns={supervisingColumns}
                    dataSource={SuperviseListData || []}
                    rowKey="id"
                    tableHeight={500}
                    style={{ marginTop: '-40px' }}
                    )}
                    {modalData.type === 'done' && (
                        <div>
                            <TableSearch
                                labelLength={4}
                                exportButtonShow={false}
                                displayShow={false}
                                textAlign={{ textAlign: 'left' }}
                                form={form}
                                itemData={[
                                    {
                                        type: 'RangePicker',
                                        name: 'handleTime',
                                        label: '统计时间',
                                        allowClear: false,
                                        shortcutsPlacementLeft: true,
                                        shortcuts: $$.shortcutsList(),
                                        span: 6,
                                    },
                                    {
                                        type: 'Cascader',
                                        name: 'caseType',
                                        label: '纠纷类型',
                                        placeholder: '请选择',
                                        span: 8,
                                        changeSelect: true,
                                        allowClear: false,
                                        treedata: $$.caseTypeSelect.caseTypeSelect,
                                    },
                                    { type: 'Select', name: 'caseLevel', label: '事项等级', placeholder: '请选择', span: 8, selectdata: $$.options.caseLevelList },
                                    { type: 'Select', name: 'canal', label: '事项来源', placeholder: '请选择', span: 8, selectdata: $$.options.caseCanal },
                                    { type: 'Select', name: 'mediResult', label: '化解结果', placeholder: '请选择', span: 8, selectdata: $$.options.mediResult },
                                    { type: 'Select', name: 'status', label: '事项状态', placeholder: '请选择', span: 8, selectdata: $$.options.caseStatus },
                                ]}
                                handleReset={() => handleSearch('done', 'reset')}
                                handleSearch={() => handleSearch('done', 'search')}
                            />
                            <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', margin: '12px 0' }}></div>
                            <div style={{ marginTop: '0px' }}>
                                <div style={{ fontSize: '16px' }}>查询结果</div>
                                <div style={{ width: '100%', position: 'relative' }}>
                                    <MyTabsNew
                                        // 1-已受理，2-已交办，3-已上报，4已回退
                                        tabs={[
                                            { label: <div style={{ height: '24px' }}>全部（{data?.totalData?.totalNum || 0}）</div>, key: '' },
                                            { label: <div style={{ height: '24px' }}>已受理（{data?.totalData?.acceptNum || 0}）</div>, key: '1' },
                                            { label: <div style={{ height: '24px' }}>已交办（{data?.totalData?.assignedNum || 0}）</div>, key: '2' },
                                            { label: <div style={{ height: '24px' }}>已上报（{data?.totalData?.reportNUm || 0}）</div>, key: '3' },
                                            { label: <div style={{ height: '24px' }}>已回退（{data?.totalData?.backNUm || 0}）</div>, key: '4' },
                                        ]}
                                        activeKey={tabKey}
                                        onChange={(activeKey) => tabsOnchange(activeKey)}
                                    />
                                    <div style={{ borderBottom: '1px solid #E5E6EB', position: 'absolute', width: '100%' }}></div>
                                </div>
                                <div style={{ margin: '12px 0' }}>
                                    <Alert
                                        type="success"
                                        content={
                                            <span>
                                                已为您生成
                                                {tabKey !== '' && (
                                                    <span>
                                                        <span className="public-color">
                                                            {tabKey === '1'
                                                                ? '受理时间'
                                                                : tabKey === '2'
                                                                ? '交办时间'
                                                                : tabKey === '3'
                                                                ? '上报时间'
                                                                : tabKey === '4'
                                                                ? '回退时间'
                                                                : ''}
                                                        </span>
                                                        在
                                                    </span>
                                                )}
                                                {search.handleTimeStart && (
                                                    <span className="public-color">
                                                        {$$.myTimeFormat(search.handleTimeStart, 'YYYY.M.D')}-{$$.myTimeFormat(search.handleTimeEnd, 'YYYY.M.D')}
                                                    </span>
                                                )}
                                                {/*{search.closeStart && <span className='public-color'>{search.createStart && '、'}办结时间({$$.myTimeFormat(search.createStart, 'YYYY.M.D')}-{$$.myTimeFormat(search.createEnd, 'YYYY.M.D')})</span>}
                    {search.caseType && <span className='public-color'>{(search.createStart || search.closeStart) && '、'}纠纷类型({caseTypeNames.join('/')})</span>} */}
                                                内的已办矛盾纠纷
                                            </span>
                                        }
                                    />
                                </div>
                                <TableView
                                    // showHeader
                                    // title="查询结果"
                                    columns={columnsDone}
                                    key={tabKey}
                                    dataSource={data.tableData}
                                    onChange={(pagination, filters, sorter) => {
                                        handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                                        // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                                    }}
                                    pagination={{
                                        current: search.page,
                                        pageSize: search.size,
                                        total: data.total,
                                        // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                                    }}
                                />
                            </div>
                        </div>
                    )}
                </Modal>
                <Response visible={response} handleOnCancel={() => setResponse(false)} responseId={responseId} data={superviseInfo} />
                <Modal title="督办信息" style={{ width: '938px' }} onCancel={() => setSupervisingList(false)} visible={supervisingList} footer={null}>
                    <TableView
                        showHeader
                        title=""
                        columns={supervisingColumns}
                        dataSource={SuperviseListData || []}
                        rowKey="id"
                        tableHeight={500}
                        style={{ marginTop: '-40px' }}
                    />
                </Modal>
                <ResponseDetail visible={detail} handleOnCancel={() => setDetail(false)} data={responseDetail} />
                <SupervisingViews
                    visible={supervising}
                    handleOnCancel={() => setSupervising(false)}
                    caseId={supervisingAddId}
                    supervisingId={supervisingId}
                    getTableData={() => getTableData('1')}
                />
            </Modal>
            <ResponseDetail visible={detail} handleOnCancel={() => setDetail(false)} data={responseDetail} />
            <SupervisingViews
                visible={supervising}
                handleOnCancel={() => setSupervising(false)}
                caseId={supervisingAddId}
                supervisingId={supervisingId}
                getTableData={() => getTableData('1')}
            />
            <Modal title="自行排查" style={{ width: '512px' }} onCancel={() => setInspectionVisible(false)} visible={inspectionVisible} footer={null}>
                <div className="troubleshooting">
                    <div className="troubleshooting-left">
                        <img src={troubleshooting} alt="" srcset="" />
                        <div>
                            <div className="troubleshooting-left-top">部门排查</div>
                            <div className="troubleshooting-left-bottom">部门自行化解矛盾或提交纠纷至综治中心化解</div>
                <Modal title="自行排查" style={{ width: '512px' }} onCancel={() => setInspectionVisible(false)} visible={inspectionVisible} footer={null}>
                    <div className="troubleshooting">
                        <div className="troubleshooting-left">
                            <img src={troubleshooting} alt="" srcset="" />
                            <div>
                                <div className="troubleshooting-left-top">部门排查</div>
                                <div className="troubleshooting-left-bottom">部门自行化解矛盾或提交纠纷至综治中心化解</div>
                            </div>
                        </div>
                        <Button
                            type="primary"
                            onClick={() => {
                                navigate(`/mediate/selfInspection`);
                            }}
                        >
                            登记
                        </Button>
                    </div>
                    <Button
                        type="primary"
                        onClick={() => {
                            navigate(`/mediate/selfInspection`);
                        }}
                    >
                        登记
                    </Button>
                </div>
                <Divider />
                <div className="troubleshooting">
                    <div className="troubleshooting-left">
                        <img src={peopleMediation} alt="" srcset="" />
                        <div>
                            <div className="troubleshooting-left-top">调解组织录入</div>
                            <div className="troubleshooting-left-bottom">调解员或调解组织自行受理案件</div>
                    <Divider />
                    <div className="troubleshooting">
                        <div className="troubleshooting-left">
                            <img src={peopleMediation} alt="" srcset="" />
                            <div>
                                <div className="troubleshooting-left-top">调解组织录入</div>
                                <div className="troubleshooting-left-bottom">调解员或调解组织自行受理案件</div>
                            </div>
                        </div>
                        <Button
                            type="primary"
                            onClick={() => {
                                navigate(`/mediate/selfInspection?isOrganization=true`);
                            }}
                        >
                            登记
                        </Button>
                    </div>
                    <Button
                        type="primary"
                        onClick={() => {
                            navigate(`/mediate/selfInspection?isOrganization=true`);
                        }}
                    >
                        登记
                    </Button>
                </div>
            </Modal>
            <AiQuestion
                visible={AiQuestionView}
                onClose={() => setAiQuestionView(false)}
                aiData={aiData}
                aiLawData={aiLawData}
                caseDetailAi={caseDetailAi}
                caseClaim={caseClaim}
            />
        </div>
                </Modal>
                <AiQuestion
                    visible={AiQuestionView}
                    onClose={() => setAiQuestionView(false)}
                    aiData={aiData}
                    aiLawData={aiLawData}
                    caseDetailAi={caseDetailAi}
                    caseClaim={caseClaim}
                />
            </div>
        </NewPage>
    );
};


 src/views/register/matterDetail/ApplyInfo.jsx

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: lwh
 * @Date: 2024-11-26 15:49:14
 * @LastEditTime: 2025-04-21 19:01:28
 * @LastEditTime: 2025-06-14 11:18:59
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description:
@@ -461,11 +461,7 @@
                        {fileData.fileList?.map((result, resIndex) => {
                            return (
                                <div style={{ display: 'inline-block' }}>
                                    {result.suffix === 'pdf' ? (
                                        <MyPDF name={result.name} fileUrl={result.showUrl} />
                                    ) : (
                                        <PreviewImage name={result.name} src={result.showUrl} />
                                    )}
                                    <MyPDF name={result.name} fileUrl={result.showUrl} fileType={result.suffix} />
                                    {resIndex !== fileData.fileList?.length - 1 && <>，</>}
                                </div>
                            );
@@ -490,11 +486,7 @@
                        {fileData.fileList?.map((result, resIndex) => {
                            return (
                                <div style={{ display: 'inline-block' }}>
                                    {result.suffix === 'pdf' ? (
                                        <MyPDF name={result.name} fileUrl={result.showUrl} />
                                    ) : (
                                        <PreviewImage name={result.name} src={result.showUrl} />
                                    )}
                                    <MyPDF name={result.name} fileUrl={result.showUrl} fileType={result.suffix} />
                                    {resIndex !== fileData.fileList?.length - 1 && <>，</>}
                                </div>
                            );
@@ -517,7 +509,10 @@
                        <span className="public-infoSubTitle">
                            <span className="public-nameCard">
                                &nbsp;&nbsp;
                                <NameCard2 name={data.value === 'auditPeople' ? object.auditUserName : object.applyUserName} userId={data.value === 'auditPeople' ? object.auditUserId : object.applyUserId} />
                                <NameCard2
                                    name={data.value === 'auditPeople' ? object.auditUserName : object.applyUserName}
                                    userId={data.value === 'auditPeople' ? object.auditUserId : object.applyUserId}
                                />
                            </span>
                        </span>
                    </span>
@@ -602,11 +597,7 @@
                        {fileData.fileList?.map((result, resIndex) => {
                            return (
                                <div style={{ display: 'inline-block' }}>
                                    {result.suffix === 'pdf' ? (
                                        <MyPDF name={result.name} fileUrl={result.showUrl} />
                                    ) : (
                                        <PreviewImage name={result.name} src={result.showUrl} />
                                    )}
                                    <MyPDF name={result.name} fileUrl={result.showUrl} fileType={result.suffix} />
                                    {resIndex !== fileData.fileList?.length - 1 && <>，</>}
                                </div>
                            );

 src/views/register/matterDetail/DismissModule.jsx

@@ -5,7 +5,7 @@
 * @LastEditTime: 2025-04-21 19:02:53
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description: 
 * @Description:
 */
import React, { Fragment } from 'react';
import { Row, Col, Space } from 'antd';
@@ -36,11 +36,7 @@
                        {props.dismissData?.fileInfoList?.map((result, resIndex) => {
                            return (
                                <div style={{ display: 'inline-block' }}>
                                    {result.suffix === 'pdf' ? (
                                        <MyPDF name={result.name} fileUrl={result.showUrl} />
                                    ) : (
                                        <PreviewImage name={result.name} src={result.showUrl} />
                                    )}
                                    <MyPDF name={result.name} fileUrl={result.showUrl} fileType={result.suffix} />
                                    {/* <PreviewImage name={result.name} src={result.showUrl} /> */}
                                    {resIndex !== props.dismissData?.fileInfoList?.length - 1 && <>，</>}
                                </div>

 src/views/register/matterDetail/HandleRecord.jsx

@@ -2,7 +2,7 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-09-06 09:40:00
 * @LastEditors: lwh
 * @LastEditTime: 2025-05-10 17:26:00
 * @LastEditTime: 2025-06-14 11:16:06
 * @FilePath: \gzDyh\gz-customerSystem\src\views\register\matterDetail\HandleRecord.jsx
 * @Description: 办理记录
 */
@@ -143,11 +143,7 @@
                                                    <div>
                                                        {record?.fileInfoList?.map((result, index) => (
                                                            <>
                                                                {result.suffix === 'pdf' ? (
                                                                    <MyPDF name={result.name} fileUrl={result.showUrl} />
                                                                ) : (
                                                                    <PreviewImage name={result.name} src={result.showUrl} />
                                                                )}
                                                                <MyPDF name={result.name} fileUrl={result.showUrl} fileType={result.suffix} />
                                                            </>
                                                            // <div key={index} onClick={() => handleOpenFiles(item)} style={{ cursor: 'pointer' }}>
                                                            //     {item.name || '-'}

 src/views/register/matterDetail/Judicial.jsx

@@ -1,4 +1,4 @@
import React, { useState, useEffect } from "react";
import React, { useState, useEffect } from 'react';
import { Row, Col, Space, Typography } from 'antd';
import { Modal, Divider } from '@arco-design/web-react';
import * as $$ from '../../../utils/utility';
@@ -6,232 +6,343 @@
import NameCard2 from '../../../components/NameCard2';
import { judicial_3 } from '@/assets/images';
import MyPDF from '../../../components/MyPDF';
import { judicial_7 } from "../../../assets/images";
import { judicial_7 } from '../../../assets/images';

// 司法确认详情接口
function getJudicInfoApi(submitData) {
  return $$.ax.request({ url: '/judicInfo/getJudicCaseInfo', type: 'get', data: submitData, service: 'mediate' });
    return $$.ax.request({ url: '/judicInfo/getJudicCaseInfo', type: 'get', data: submitData, service: 'mediate' });
}

function getVideoApi(caseId) {
  return $$.ax.request({ url: `meetJudic/getVideo?caseId=${caseId}`, type: 'get', service: 'mediate' });
    return $$.ax.request({ url: `meetJudic/getVideo?caseId=${caseId}`, type: 'get', service: 'mediate' });
}

//会议查询
function getMeetInfoApi(data) {
  return $$.ax.request({ url: `meetJudic/getMeetInfo`, type: 'get', service: 'mediate', data });
    return $$.ax.request({ url: `meetJudic/getMeetInfo`, type: 'get', service: 'mediate', data });
}

const { Paragraph, Link, Text } = Typography;
const Judicial = (props) => {
  const [data, setData] = useState({});
  const [videoList, setVideoList] = useState([])
  // 预添加预约
  const [preBookData, setPreBookData] = useState({});
  const [radioVisible, setRadioVisible] = useState(false);
    const [data, setData] = useState({});
    const [videoList, setVideoList] = useState([]);
    // 预添加预约
    const [preBookData, setPreBookData] = useState({});
    const [radioVisible, setRadioVisible] = useState(false);

    function checkTimeRange(startTime, endTime, currentTime) {
        if (currentTime < new Date(startTime)) {
            return <div className="public-color">未开始</div>; // 当前时间在时间范围之前
        } else if (currentTime >= new Date(startTime) && currentTime <= new Date(endTime)) {
            return <div style={{ color: '#EF6C24' }}>进行中</div>; // 当前时间在时间范围内
        } else {
            return <div className="public-orange">已结束</div>; // 当前时间在时间范围之后
        }
    }
    // 初始化附件回显
    async function getJudicialApply(id) {
        global.setSpinning(true);
        const res = await getJudicInfoApi({ caseId: id });
        global.setSpinning(false);
        if (res.type) {
            setData(res.data);
        }
    }

  function checkTimeRange(startTime, endTime, currentTime) {
    if (currentTime < new Date(startTime)) {
      return <div className='public-color'>未开始</div>; // 当前时间在时间范围之前
    } else if (currentTime >= new Date(startTime) && currentTime <= new Date(endTime)) {
      return <div style={{ color: '#EF6C24' }}>进行中</div>; // 当前时间在时间范围内
    } else {
      return <div className='public-orange'>已结束</div>; // 当前时间在时间范围之后
    }
  }
  // 初始化附件回显
  async function getJudicialApply(id) {
    global.setSpinning(true);
    const res = await getJudicInfoApi({ caseId: id });
    global.setSpinning(false);
    if (res.type) {
      setData(res.data);
    }
  }
    // 获取预约调解记录
    async function getMeetInfo(id) {
        global.setSpinning(true);
        const res = await getMeetInfoApi({ caseId: id });
        global.setSpinning(false);
        if (res.type) {
            let list = res.data || [];
            if (list?.length > 0) {
                setPreBookData(list[0]);
            }
        }
    }

    const getVideo = async (id) => {
        const res = await getVideoApi(id);
        if (res.type) {
            if (res.data) {
                setVideoList(res.data || []);
            } else {
                setVideoList(null);
            }
        }
    };

  // 获取预约调解记录
  async function getMeetInfo(id) {
    global.setSpinning(true);
    const res = await getMeetInfoApi({ caseId: id });
    global.setSpinning(false);
    if (res.type) {
      let list = res.data || [];
      if (list?.length > 0) {
        setPreBookData(list[0])
      }
    }
  }
    useEffect(() => {
        getJudicialApply(props.caseId);
        getMeetInfo(props.caseId);
        getVideo(props.caseId);
    }, []);

    return (
        <div style={{ ...props.style, position: 'relative' }}>
            <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>
            <table border="1" align="center" cellpadding="8" className="table">
                <tr>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">
                        司法确认结果
                    </th>
                    <td width="380" style={{ color: data?.judicResult == '22_00028-1' ? '#00b42a' : '#f53f3f' }}>
                        {data?.judicResult == '22_00028-1' ? '已达成' : data?.judicResult == '22_00028-2' ? '未达成' : '-'}
                    </td>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">
                        预约信息
                    </th>
                    <td width="380">
                        {preBookData?.orderStartTime ? (
                            <span
                                className="public-a public-color"
                                onClick={() => {
                                    setRadioVisible(true);
                                }}
                            >
                                点击查看
                            </span>
                        ) : (
                            '-'
                        )}
                    </td>
                </tr>
                <tr>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">
                        司法确认部门
                    </th>
                    <td width="380">{data?.courtName || '-'}</td>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">
                        结案时间
                    </th>
                    <td width="380">{$$.minuteFormat(data?.judicEndTime)}</td>
                </tr>
                <tr>
                    <th bgcolor="#F7F8FA" className="table-title">
                        承办法官
                    </th>
                    <td width="380">
                        <div className="public-infoSubTitle">
                            <NameCard2 name={data.judgeName} userId={data.judgeNameId || ''} />
                        </div>
                    </td>
                    <th bgcolor="#F7F8FA" className="table-title">
                        助理/书记员
                    </th>
                    <td width="380">
                        <div style={{ display: 'flex', gap: '16px', flexWrap: 'wrap' }} className="public-infoSubTitle">
                            {data?.judicAssistList?.map((i) => (
                                <NameCard2 name={i.assUserName} userId={i.assUserId} />
                            ))}
                        </div>
                    </td>
                </tr>
                {data?.judicResult == '22_00028-1' && (
                    <tr>
                        <th bgcolor="#F7F8FA" className="table-title">
                            司法确认案号
                        </th>
                        <td width="380">{data?.judicNo || '-'}</td>
                        <th bgcolor="#F7F8FA" className="table-title">
                            诉前调确号
                        </th>
                        <td width="380">{data?.mediateJudicNo || '-'}</td>
                    </tr>
                )}
                <tr>
                    <th bgcolor="#F7F8FA" className="table-title">
                        申请时间
                    </th>
                    <td width="380">{$$.minuteFormat(data?.applyTime)}</td>
                    <th bgcolor="#F7F8FA" className="table-title">
                        申请部门
                    </th>
                    <td width="380">{data?.applyUnitName || '-'}</td>
                </tr>
                {data?.judicResult == '22_00028-1' && (
                    <>
                        <tr>
                            <th bgcolor="#F7F8FA" className="table-title">
                                裁定文书
                            </th>
                            <td width="380" colspan="3">
                                {data?.fileList?.find((i) => i.ownerType === '22_00018-405')?.fileList?.length ? (
                                    data?.fileList
                                        ?.find((i) => i.ownerType === '22_00018-405')
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
                                ) : (
                                    <div className="public-infoSubTitle">-</div>
                                )}
                            </td>
                        </tr>
                        <tr>
                            <th bgcolor="#F7F8FA" className="table-title">
                                询问笔录
                            </th>
                            <td width="380" colspan="3">
                                {data?.fileList?.find((i) => i.ownerType === '22_00018-401')?.fileList?.length ? (
                                    data?.fileList
                                        ?.find((i) => i.ownerType === '22_00018-401')
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
                                ) : (
                                    <div className="public-infoSubTitle">-</div>
                                )}
                            </td>
                        </tr>
                        <tr>
                            <th bgcolor="#F7F8FA" className="table-title">
                                送达地址确认书
                            </th>
                            <td width="380" colspan="3">
                                {data?.fileList?.find((i) => i.ownerType === '22_00018-108')?.fileList?.length ? (
                                    data?.fileList
                                        ?.find((i) => i.ownerType === '22_00018-108')
                                        ?.fileList?.map((item, index) => {
                                            return (
                                                <>
                                                    <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                                                </>
                                            );
                                        })
                                ) : (
                                    <div className="public-infoSubTitle">-</div>
                                )}
                            </td>
                        </tr>
                        {videoList?.length > 0 && (
                            <tr>
                                <th bgcolor="#F7F8FA" className="table-title" width="120">
                                    司法确认视频
                                </th>
                                <td colspan="3">
                                    {videoList?.map((item, index) => {
                                        return (
                                            <div key={'video' + index} style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
                                                <img src={judicial_7} alt="" srcset="" />
                                                <Link
                                                    onClick={() => {
                                                        window.open(item.playUrl);
                                                    }}
                                                >
                                                    {item.videoName}
                                                </Link>
                                            </div>
                                        );
                                    })}
                                </td>
                            </tr>
                        )}
                        <tr>
                            <th bgcolor="#F7F8FA" className="table-title">
                                结案说明
                            </th>
                            <td width="380" colspan="3">
                                {data?.judicContent || '-'}
                            </td>
                        </tr>
                    </>
                )}
                {data?.judicResult == '22_00028-2' && (
                    <tr>
                        <th bgcolor="#F7F8FA" className="table-title">
                            未达成原因
                        </th>
                        <td width="380" colspan="3">
                            {data?.judicFalseCause || '-'}
                        </td>
                    </tr>
                )}
            </table>
            <Modal
                title="预约信息"
                style={{ width: '40%' }}
                className="judicial-handle-modal"
                onCancel={() => setRadioVisible(false)}
                visible={radioVisible}
                footer={null}
            >
                <div style={{ marginBottom: '0' }} className="judicial-item-content">
                    <div className="judicial-item-content-left">
                        {/* <div className='judicial-item-content-left-del public-a'><img src={judicial_3} alt="" srcset="" /></div> */}
                        <div className="judicial-item-content-left-t">
                            <div className="judicial-item-content-left-t-l">
                                <div className="judicial-item-content-left-bigTitle public-color">{$$.myTimeFormat(preBookData?.orderStartTime, 'HH:mm')}</div>
                                <div className="public-color">{$$.myTimeFormat(preBookData?.orderStartTime, 'YYYY年MM月DD日')}</div>
                            </div>
                            <div className="judicial-item-content-left-t-l">
                                <Space size="small">
                                    <div className="judicial-item-content-left-inline"></div>
                                    <div style={{ display: 'flex', flexDirection: 'column', gap: '4px', alignItems: 'center', justifyContent: 'center' }}>
                                        {checkTimeRange(preBookData?.orderStartTime, preBookData?.orderEndTime, new Date())}
                                        <div className="public-color judicial-item-content-left-time">
                                            {$$.calculateTimeDifference(preBookData?.orderStartTime, preBookData?.orderEndTime)}
                                        </div>
                                    </div>
                                    <div className="judicial-item-content-left-inline"></div>
                                </Space>
                            </div>
                            <div className="judicial-item-content-left-t-l">
                                <div className="judicial-item-content-left-bigTitle public-color">{$$.myTimeFormat(preBookData?.orderEndTime, 'HH:mm')}</div>
                                <div className="public-color">{$$.myTimeFormat(preBookData?.orderEndTime, 'YYYY年MM月DD日')}</div>
                            </div>
                        </div>
                        <Divider />
                        <div className="judicial-item-content-left-c-flex">
                            <div className="judicial-item-content-left-c">
                                <div className="judicial-item-content-left-c-title">司法确认方式</div>
                                <div className="judicial-item-content-left-c-content">{preBookData?.meetWayName || '-'}</div>
                            </div>
                            <div className="judicial-item-content-left-c">
                                <div className="judicial-item-content-left-c-title">远程视频司法确认号</div>
                                <div className="judicial-item-content-left-c-content">
                                    <span style={{ fontSize: '16px', lineHeight: '24px' }}>{preBookData?.roomNo || '-'}</span>&nbsp;&nbsp;
                                    {preBookData?.roomNo && (
                                        <span
                                            onClick={() => {
                                                navigator.clipboard
                                                    .writeText(preBookData?.roomNo)
                                                    .then(() => {
                                                        $$.infoSuccess({ content: '复制成功' });
                                                    })
                                                    .catch((err) => {
                                                        $$.catchApiError('复制失败', err);
                                                    });
                                            }}
                                            className="public-color public-a"
                                        >
                                            复制
                                        </span>
                                    )}
                                </div>
                            </div>
                            <div className="judicial-item-content-left-c">
                                <div className="judicial-item-content-left-c-title">司法确认地点</div>
                                <div className="judicial-item-content-left-c-content">{preBookData?.meetAddr || '-'}</div>
                            </div>
                        </div>
                    </div>
                </div>
            </Modal>
        </div>
    );
};

  const getVideo = async (id) => {
    const res = await getVideoApi(id)
    if (res.type) {
      if (res.data) {
        setVideoList(res.data || [])
      } else {
        setVideoList(null)
      }
    }
  }

  useEffect(() => {
    getJudicialApply(props.caseId)
    getMeetInfo(props.caseId)
    getVideo(props.caseId)
  }, [])

  return (
    <div style={{ ...props.style, position: 'relative' }}>
      <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>
      <table border="1" align="center" cellpadding="8" className="table" >
        <tr>
          <th bgcolor="#F7F8FA" className="table-title" width="120">司法确认结果</th>
          <td width='380' style={{ color: data?.judicResult == '22_00028-1' ? '#00b42a' : '#f53f3f' }}>
            {data?.judicResult == '22_00028-1' ? '已达成' : data?.judicResult == '22_00028-2' ? '未达成' : '-'}
          </td>
          <th bgcolor="#F7F8FA" className="table-title" width="120">预约信息</th>
          <td width='380'>{preBookData?.orderStartTime ? <span className="public-a public-color" onClick={() => { setRadioVisible(true) }}>点击查看</span> : '-'}</td>
        </tr>
        <tr>
          <th bgcolor="#F7F8FA" className="table-title" width="120">司法确认部门</th>
          <td width='380'>{data?.courtName || '-'}</td>
          <th bgcolor="#F7F8FA" className="table-title" width="120">结案时间</th>
          <td width='380'>{$$.minuteFormat(data?.judicEndTime)}</td>
        </tr>
        <tr>
          <th bgcolor="#F7F8FA" className="table-title">承办法官</th>
          <td width='380'><div className='public-infoSubTitle'><NameCard2 name={data.judgeName} userId={data.judgeNameId || ''} /></div></td>
          <th bgcolor="#F7F8FA" className="table-title">助理/书记员</th>
          <td width='380'><div style={{ display: 'flex', gap: '16px', flexWrap: 'wrap' }} className='public-infoSubTitle'>{data?.judicAssistList?.map(i => (<NameCard2 name={i.assUserName} userId={i.assUserId} />))}</div></td>
        </tr>
        {
          data?.judicResult == '22_00028-1' &&
          <tr>
            <th bgcolor="#F7F8FA" className="table-title">司法确认案号</th>
            <td width='380'>{data?.judicNo || '-'}</td>
            <th bgcolor="#F7F8FA" className="table-title">诉前调确号</th>
            <td width='380'>{data?.mediateJudicNo || '-'}</td>
          </tr>
        }
        <tr>
          <th bgcolor="#F7F8FA" className="table-title">申请时间</th>
          <td width='380'>{$$.minuteFormat(data?.applyTime)}</td>
          <th bgcolor="#F7F8FA" className="table-title">申请部门</th>
          <td width='380'>{data?.applyUnitName || '-'}</td>
        </tr>
        {
          data?.judicResult == '22_00028-1' &&
          <>
            <tr>
              <th bgcolor="#F7F8FA" className="table-title">裁定文书</th>
              <td width='380' colspan='3'>{
                data?.fileList?.find(i => i.ownerType === '22_00018-405')?.fileList?.length ?
                  data?.fileList?.find(i => i.ownerType === '22_00018-405')?.fileList?.map((item, index) => {
                    return <>{item.suffix === 'pdf' ? <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} /> : <PreviewImage key={index} name={item.name} src={item.showUrl} />}</>
                  })
                  : <div className='public-infoSubTitle'>-</div>
              }</td>
            </tr>
            <tr>
              <th bgcolor="#F7F8FA" className="table-title">询问笔录</th>
              <td width='380' colspan='3'>{
                data?.fileList?.find(i => i.ownerType === '22_00018-401')?.fileList?.length ?
                  data?.fileList?.find(i => i.ownerType === '22_00018-401')?.fileList?.map((item, index) => {
                    return <>{item.suffix === 'pdf' ? <MyPDF name={item?.name} fileUrl={item?.showUrl} key={index} /> : <PreviewImage key={index} name={item.name} src={item.showUrl} />}</>
                  })
                  : <div className='public-infoSubTitle'>-</div>
              }</td>
            </tr>
            <tr>
              <th bgcolor="#F7F8FA" className="table-title">送达地址确认书</th>
              <td width='380' colspan='3'>{
                data?.fileList?.find(i => i.ownerType === '22_00018-108')?.fileList?.length ?
                  data?.fileList?.find(i => i.ownerType === '22_00018-108')?.fileList?.map((item, index) => {
                    return <>{item.suffix === 'pdf' ? <MyPDF name={item?.fileName} fileUrl={item?.showUrl} key={index} /> : <PreviewImage key={index} name={item.fileName} src={item.showUrl} />}</>
                  })
                  : <div className='public-infoSubTitle'>-</div>
              }</td>
            </tr>
            {
              videoList?.length > 0 && <tr>
                <th bgcolor="#F7F8FA" className="table-title" width="120">司法确认视频</th>
                <td colspan='3'>
                  {videoList?.map((item, index) => {
                    return <div key={'video' + index} style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
                      <img src={judicial_7} alt="" srcset="" /><Link onClick={() => { window.open(item.playUrl) }}>{item.videoName}</Link>
                    </div>
                  })}
                </td>
              </tr>
            }
            <tr>
              <th bgcolor="#F7F8FA" className="table-title">结案说明</th>
              <td width='380' colspan='3'>{data?.judicContent || '-'}</td>
            </tr>
          </>
        }
        {
          data?.judicResult == '22_00028-2' &&
          <tr>
            <th bgcolor="#F7F8FA" className="table-title">未达成原因</th>
            <td width='380' colspan='3'>{data?.judicFalseCause || '-'}</td>
          </tr>
        }
      </table>
      <Modal
        title='预约信息'
        style={{ width: '40%' }}
        className='judicial-handle-modal'
        onCancel={() => setRadioVisible(false)}
        visible={radioVisible}
        footer={null}
      >
        <div style={{ marginBottom: '0' }} className='judicial-item-content'>
          <div className='judicial-item-content-left'>
            {/* <div className='judicial-item-content-left-del public-a'><img src={judicial_3} alt="" srcset="" /></div> */}
            <div className='judicial-item-content-left-t'>
              <div className='judicial-item-content-left-t-l'><div className='judicial-item-content-left-bigTitle public-color'>{$$.myTimeFormat(preBookData?.orderStartTime, 'HH:mm')}</div><div className='public-color'>{$$.myTimeFormat(preBookData?.orderStartTime, 'YYYY年MM月DD日')}</div></div>
              <div className='judicial-item-content-left-t-l'>
                <Space size='small'>
                  <div className='judicial-item-content-left-inline'></div>
                  <div style={{ display: 'flex', flexDirection: 'column', gap: '4px', alignItems: 'center', justifyContent: 'center' }}>{checkTimeRange(preBookData?.orderStartTime, preBookData?.orderEndTime, new Date())}<div className='public-color judicial-item-content-left-time'>{$$.calculateTimeDifference(preBookData?.orderStartTime, preBookData?.orderEndTime)}</div></div>
                  <div className='judicial-item-content-left-inline'></div>
                </Space>
              </div>
              <div className='judicial-item-content-left-t-l'><div className='judicial-item-content-left-bigTitle public-color'>{$$.myTimeFormat(preBookData?.orderEndTime, 'HH:mm')}</div><div className='public-color'>{$$.myTimeFormat(preBookData?.orderEndTime, 'YYYY年MM月DD日')}</div></div>
            </div>
            <Divider />
            <div className='judicial-item-content-left-c-flex'>
              <div className='judicial-item-content-left-c'>
                <div className='judicial-item-content-left-c-title'>司法确认方式</div>
                <div className='judicial-item-content-left-c-content'>{preBookData?.meetWayName || '-'}</div>
              </div>
              <div className='judicial-item-content-left-c'>
                <div className='judicial-item-content-left-c-title'>远程视频司法确认号</div>
                <div className='judicial-item-content-left-c-content'><span style={{ fontSize: '16px', lineHeight: '24px' }}>{preBookData?.roomNo || '-'}</span>&nbsp;&nbsp;{preBookData?.roomNo && <span onClick={() => {
                  navigator.clipboard.writeText(preBookData?.roomNo).then(() => {
                    $$.infoSuccess({ content: '复制成功' });
                  }).catch(err => {
                    $$.catchApiError('复制失败', err);
                  });
                }} className='public-color public-a'>复制</span>}</div>
              </div>
              <div className='judicial-item-content-left-c'>
                <div className='judicial-item-content-left-c-title'>司法确认地点</div>
                <div className='judicial-item-content-left-c-content'>{preBookData?.meetAddr || '-'}</div>
              </div>
            </div>
          </div>
        </div>
      </Modal>
    </div>
  )
}

export default Judicial
export default Judicial;

 src/views/register/matterDetail/NewFileCheck.jsx

@@ -2,192 +2,204 @@
import { Row, Col, Space } from 'antd';
import { Select, DatePicker, Form, Button, Menu } from '@arco-design/web-react';
import * as $$ from '@/utils/utility';
import * as docx from 'docx-preview';

const FormItem = Form.Item;
const MenuItem = Menu.Item;
const SubMenu = Menu.SubMenu;
const appUrl = $$.appUrl;
const formItemLayout = {
  labelCol: {
    span: 8,
  },
  wrapperCol: {
    span: 16,
  },
    labelCol: {
        span: 8,
    },
    wrapperCol: {
        span: 16,
    },
};


const NewFileCheck = (props) => {
  const formRef = useRef();
  const [fileUrl, setFileUrl] = useState('')
  const [itemData, setItemData] = useState(null)
  const [list, setList] = useState([])
  const peopleTypeMap = {
    1: '工作人员',
    2: '当事人'
  }
    const formRef = useRef();
    const [fileUrl, setFileUrl] = useState('');
    const [itemData, setItemData] = useState(null);
    const [list, setList] = useState([]);
    const peopleTypeMap = {
        1: '工作人员',
        2: '当事人',
    };
    const containerRef = useRef(null);

  useEffect(() => {
    setList(props.menuList || [])
  }, [props.menuList])
    useEffect(() => {
        setList(props.menuList || []);
    }, [props.menuList]);

  //点击菜单
  const clickItem = (data) => {
    console.log(data);
    setItemData(data)
    setFileUrl(`${appUrl.fileUrl}/${appUrl.sys}${data.showUrl}`)
  }

  //查询
  const handleSUbmit = (type) => {
    const data = formRef.current.getFieldsValue();
    console.log('data', data);
    if (type === 'search') {
      let newList = props.menuList
      if (data.type) {
        newList = newList.filter(item => item.ownerType === data.type)
      }
      if (data.name) {
        newList = newList.map(item => ({ ...item, fileList: item.fileList?.filter(i => i.uploaderType === data.name) }))
      }
      if (data.time) {
        let timeStart = new Date(data.time[0]);
        let timeEnd = new Date(data.time[1]);
        newList = newList.map(item => ({ ...item, fileList: item.fileList?.filter(i => new Date(i.createTime) >= timeStart && new Date(i.createTime) <= timeEnd) }))
      }
      setList(newList)
      setItemData(null)
      setFileUrl('')
    //点击菜单
    const clickItem = (data) => {
        console.log(data);
        setItemData(data);
    if (data.suffix === 'docx' || data.suffix === 'doc') {
      const renderDocx = async () => {
        try {
          const response = await fetch(`${appUrl.fileUrl}/${appUrl.sys}${data.showUrl}`);
          const blob = await response.blob();
          await docx.renderAsync(blob, containerRef.current);
        } catch (error) {
          console.error('文档加载失败', error);
        }
      };
      renderDocx();
    }
    // 重置
    if (type === 'reset') {
      setList(props.menuList || [])
      setItemData(null)
      setFileUrl('')
    }
  }
        setFileUrl(`${appUrl.fileUrl}/${appUrl.sys}${data.showUrl}`);
    };

  console.log('list', list);
    //查询
    const handleSUbmit = (type) => {
        const data = formRef.current.getFieldsValue();
        console.log('data', data);
        if (type === 'search') {
            let newList = props.menuList;
            if (data.type) {
                newList = newList.filter((item) => item.ownerType === data.type);
            }
            if (data.name) {
                newList = newList.map((item) => ({ ...item, fileList: item.fileList?.filter((i) => i.uploaderType === data.name) }));
            }
            if (data.time) {
                let timeStart = new Date(data.time[0]);
                let timeEnd = new Date(data.time[1]);
                newList = newList.map((item) => ({
                    ...item,
                    fileList: item.fileList?.filter((i) => new Date(i.createTime) >= timeStart && new Date(i.createTime) <= timeEnd),
                }));
            }
            setList(newList);
            setItemData(null);
            setFileUrl('');
        }
        // 重置
        if (type === 'reset') {
            setList(props.menuList || []);
            setItemData(null);
            setFileUrl('');
        }
    };

    console.log('list', list);

  return (
    <nav className="filesCheck-nav" style={{ borderRight: '1px solid transparent' }}>
      <Form
        ref={formRef}
        layout='horizontal'
        style={{ marginTop: '24px' }}
        scrollToFirstError={true}
        {...formItemLayout}
      >
        <Row gutter={24} style={{ marginRight: '0px' }}>
          <Col span={6}>
            <FormItem label='材料类型：' field='type'>
              <Select
                placeholder='请选择'
                allowClear
                options={[
                  {
                    label: '申请材料',
                    value: '22_00018-101',
                  },
                  {
                    label: '证据材料',
                    value: '22_00018-102',
                  },
                ]}
              />
            </FormItem>
          </Col>
          <Col span={7}>
            <FormItem
              label='上传时间：'
              field='time'
            >
              <DatePicker.RangePicker
                showTime
                shortcutsPlacementLeft={true}
                shortcuts={$$.shortcutsList()}
                separator='~'
                style={{ width: '100%' }}
              />
            </FormItem>
          </Col>
          <Col span={7}>
            <FormItem
              label='上传人类型：'
              field='name'
              onChange={(e) => console.log(e.target.value, 'vvv')}
            >
              <Select
                placeholder='请选择'
                allowClear
                style={{ width: '100%' }}
                options={[
                  {
                    label: '工作人员',
                    value: 1
                  },
                  {
                    label: '当事人',
                    value: 2
                  }
                ]}
              />
            </FormItem>
          </Col>
          <Col span={4}>
            <Space>
              <Button className="dialogPrimary" type='primary' onClick={() => handleSUbmit('search')}>查询</Button>
              <Button onClick={() => {
                formRef.current.resetFields();
                handleSUbmit('reset')
              }}>重置</Button>
            </Space>
          </Col>
        </Row>

      </Form>
      <div style={{ display: 'flex', height: '550px' }}>
        <div style={{ width: '256px', borderRight: '1px solid #F0F0F0' }}>
          <Menu
            style={{ width: '100%', height: '100%' }}
          >
            {list?.map(item => {
              return <SubMenu
                key={item.id}
                title={item.ownerTypeName + `（${item.fileList && item.fileList.length || 0}）`}
              >
                {item.fileList?.map(res => {
                  return <MenuItem key={res.id} onClick={() => { clickItem(res) }}>{res.name}</MenuItem>
                })}
              </SubMenu>
            })}
          </Menu>
        </div>
        <div style={{ flex: 1 }}>
          {
            itemData ? <Fragment>
              <div style={{ background: '#e8f3ff', color: '#1A6FB8', padding: '5px 10px', marginBottom: '16px', marginLeft: '16px' }}>
                <span>材料名称：{itemData.name}</span>&nbsp;&nbsp;|&nbsp;&nbsp;
                <span>上传时间：{$$.timeFormat(itemData.updateTime)}</span>&nbsp;&nbsp;|&nbsp;&nbsp;
                <span>上传人：{itemData.uploaderName} {itemData.uploaderType && <span>（{peopleTypeMap[itemData.uploaderType]}）</span>}</span>
              </div>
              <div style={{ width: '100%', height: '470px', display: 'flex', justifyContent: 'center', alignItems: 'center', overflow: 'auto' }}>
                {
                  itemData.suffix === 'pdf' ?
                    <embed src={fileUrl} type="application/pdf" width="100%" height="100%"></embed>
                    :
                    <img src={fileUrl} alt="" style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'contain' }} />
                }
              </div>
            </Fragment> : <Fragment>
              <div style={{ padding: '100px 0' }}>{$$.MyEmpty()}</div>
            </Fragment>
          }
        </div>
      </div>
    </nav>
  );
    return (
        <nav className="filesCheck-nav" style={{ borderRight: '1px solid transparent' }}>
            <Form ref={formRef} layout="horizontal" style={{ marginTop: '24px' }} scrollToFirstError={true} {...formItemLayout}>
                <Row gutter={24} style={{ marginRight: '0px' }}>
                    <Col span={6}>
                        <FormItem label="材料类型：" field="type">
                            <Select
                                placeholder="请选择"
                                allowClear
                                options={[
                                    {
                                        label: '申请材料',
                                        value: '22_00018-101',
                                    },
                                    {
                                        label: '证据材料',
                                        value: '22_00018-102',
                                    },
                                ]}
                            />
                        </FormItem>
                    </Col>
                    <Col span={7}>
                        <FormItem label="上传时间：" field="time">
                            <DatePicker.RangePicker showTime shortcutsPlacementLeft={true} shortcuts={$$.shortcutsList()} separator="~" style={{ width: '100%' }} />
                        </FormItem>
                    </Col>
                    <Col span={7}>
                        <FormItem label="上传人类型：" field="name" onChange={(e) => console.log(e.target.value, 'vvv')}>
                            <Select
                                placeholder="请选择"
                                allowClear
                                style={{ width: '100%' }}
                                options={[
                                    {
                                        label: '工作人员',
                                        value: 1,
                                    },
                                    {
                                        label: '当事人',
                                        value: 2,
                                    },
                                ]}
                            />
                        </FormItem>
                    </Col>
                    <Col span={4}>
                        <Space>
                            <Button className="dialogPrimary" type="primary" onClick={() => handleSUbmit('search')}>
                                查询
                            </Button>
                            <Button
                                onClick={() => {
                                    formRef.current.resetFields();
                                    handleSUbmit('reset');
                                }}
                            >
                                重置
                            </Button>
                        </Space>
                    </Col>
                </Row>
            </Form>
            <div style={{ display: 'flex', height: '550px' }}>
                <div style={{ width: '256px', borderRight: '1px solid #F0F0F0' }}>
                    <Menu style={{ width: '100%', height: '100%' }}>
                        {list?.map((item) => {
                            return (
                                <SubMenu key={item.id} title={item.ownerTypeName + `（${(item.fileList && item.fileList.length) || 0}）`}>
                                    {item.fileList?.map((res) => {
                                        return (
                                            <MenuItem
                                                key={res.id}
                                                onClick={() => {
                                                    clickItem(res);
                                                }}
                                            >
                                                {res.name}
                                            </MenuItem>
                                        );
                                    })}
                                </SubMenu>
                            );
                        })}
                    </Menu>
                </div>
                <div style={{ flex: 1 }}>
                    {itemData ? (
                        <Fragment>
                            <div style={{ background: '#e8f3ff', color: '#1A6FB8', padding: '5px 10px', marginBottom: '16px', marginLeft: '16px' }}>
                                <span>材料名称：{itemData.name}</span>&nbsp;&nbsp;|&nbsp;&nbsp;
                                <span>上传时间：{$$.timeFormat(itemData.updateTime)}</span>&nbsp;&nbsp;|&nbsp;&nbsp;
                                <span>
                                    上传人：{itemData.uploaderName} {itemData.uploaderType && <span>（{peopleTypeMap[itemData.uploaderType]}）</span>}
                                </span>
                            </div>
                            <div style={{ width: '100%', height: '470px', display: 'flex', justifyContent: 'center', alignItems: 'center', overflow: 'auto' }}>
                                {itemData.suffix === 'pdf' ? (
                                    <embed src={fileUrl} type="application/pdf" width="100%" height="100%"></embed>
                                ) : itemData.suffix === 'docx' ? (
                                    <div ref={containerRef} style={{ width: '100%', height: '100%' }} className="docx-container" />
                                ) : (
                                    <img src={fileUrl} alt="" style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'contain' }} />
                                )}
                            </div>
                        </Fragment>
                    ) : (
                        <Fragment>
                            <div style={{ padding: '100px 0' }}>{$$.MyEmpty()}</div>
                        </Fragment>
                    )}
                </div>
            </div>
        </nav>
    );
};

export default NewFileCheck;

 src/views/register/matterDetail/UniteHandle.jsx

@@ -148,7 +148,7 @@
          setIsModalVisible(false)
        }}
        onClose={() => setIsModalVisible(false)}
        type='dept'
        type='dept_union'
        isCheckbox={true}
      />
    </Modal>

 src/views/register/matterDetail/index.jsx

@@ -245,10 +245,10 @@
              <div ><div className="title-text">事项来源</div></div>
              <div>{infoData.canalName || '-'}</div>
            </Col>
            <Col span={16}>
            {/* <Col span={16}>
              <div ><div className="title-text">来访形式</div></div>
              <div>{infoData.visitWayName || '-'}</div>
            </Col>
            </Col> */}
            <Col span={24}>
              <div className="title"><div className="title-text">事项概况</div></div>
              <div>{infoData.caseDes || '-'}</div>
@@ -257,6 +257,10 @@
              <div className="title"><div className="title-text">事项申请</div></div>
              <div>{infoData.caseClaim || '-'}</div>
            </Col>
            <Col span={24}>
              <div className="title"><div className="title-text">事项备注</div></div>
              <div>{infoData.caseRemark || '-'}</div>
            </Col>
            <Col span={8}>
          <div className="title title-gap">
            {props.data?.majorStatus === 1 && <img src={majorStatus_1} alt="" srcset="" />}

 src/views/register/visit/SelfPreview.jsx

@@ -128,10 +128,10 @@
          <div><div className="title-text">事项来源</div></div>
          <div>自行排查</div>
        </Col>
        <Col span={8}>
        {/* <Col span={8}>
          <div ><div className="title-text">来访形式</div></div>
          <div>排查</div>
        </Col>
        </Col> */}
        <Col span={8}>
          <div ><div className="title-text">纠纷类型</div></div>
          <div>
@@ -172,6 +172,10 @@
          <div className="title"><div className="title-text">事项申请</div></div>
          <div>{props.data?.caseClaim || '-'}</div>
        </Col>
        <Col span={24}>
              <div className="title"><div className="title-text">事项备注</div></div>
              <div>{props.data?.caseRemark || '-'}</div>
            </Col>
        <Col span={8}>
          <div className="title title-gap">
            {props.data?.majorStatus === 1 && <img src={majorStatus_1} alt="" srcset="" />}
@@ -230,7 +234,7 @@
              {props.transactResult?.fileInfoBaseDTOList?.map((item, index) => {
                console.log(item);
                return <div style={{ display: 'inline-block' }}>
                  {item.suffix === 'pdf' ? <MyPDF name={item.name} fileUrl={item.showUrl} key={index} /> : <PreviewImage name={item.name} src={item.showUrl} />}
                  <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                  {/* <PreviewImage name={item.name} src={item.showUrl} /> */}
                  {index !== props.transactResult?.fileInfoBaseDTOList.length - 1 && <>，</>}
                </div>

 src/views/register/visit/component/SelfVisitorRegister.jsx

@@ -400,6 +400,34 @@
                            />
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem
                            label={
                                <div style={{ display: 'flex' }}>
                                    备注
                                    <img src={scan} alt="" style={{ marginRight: '-2px', marginLeft: '8px' }} />
                                    <div
                                        style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }}
                                        onClick={() => {
                                            setScanFile(true);
                                            setOcrText('caseRemark');
                                        }}
                                    >
                                        识别材料
                                    </div>
                                </div>
                            }
                            field="caseRemark"
                        >
                            <Input.TextArea
                                maxLength={500}
                                showWordLimit
                                rows={7}
                                placeholder="请填写备注"
                                wrapperStyle={{ width: '100%' }}
                            />
                        </FormItem>
                    </Col>
                    <div style={{ padding: '0px 16px', borderRadius: '2px', display: 'flex', alignItems: 'center' }}>
                        <img src={majorStatus_1} alt="" srcset="" />
                        <FormItem

 src/views/register/visit/component/visitorRegister.jsx

@@ -411,6 +411,34 @@
                            />
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem
                            label={
                                <div style={{ display: 'flex' }}>
                                    备注
                                    <img src={scan} alt="" style={{ marginRight: '-2px', marginLeft: '8px' }} />
                                    <div
                                        style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }}
                                        onClick={() => {
                                            setScanFile(true);
                                            setOcrText('caseRemark');
                                        }}
                                    >
                                        识别材料
                                    </div>
                                </div>
                            }
                            field="caseRemark"
                        >
                            <Input.TextArea
                                maxLength={500}
                                showWordLimit
                                rows={7}
                                placeholder="请填写备注"
                                wrapperStyle={{ width: '100%' }}
                            />
                        </FormItem>
                    </Col>
                    <div style={{ padding: '0px 16px', borderRadius: '2px', display: 'flex', alignItems: 'center' }}>
                        <img src={majorStatus_1} alt="" srcset="" />
                        <FormItem

 src/views/register/visit/index.jsx

@@ -2,7 +2,7 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-08-09 09:59:43
 * @LastEditors: lwh
 * @LastEditTime: 2025-05-30 17:04:48
 * @LastEditTime: 2025-06-13 15:16:34
 * @FilePath: \gzDyh\gz-customerSystem\src\views\basicInformation\organization\index.jsx
 * @Description: 来访登记
 */
@@ -15,7 +15,6 @@
import '../index.less';
import { Space } from 'antd';
import { Button, Steps, Message } from '@arco-design/web-react';
import { visit_10 } from '../../../assets/images';
import { Modal } from 'antd';
import VisitorRegister from './component/visitorRegister';
import Preview from './preview';

 src/views/register/visit/preview.jsx

@@ -330,10 +330,10 @@
          <div ><div className="title-text">事项来源</div></div>
          <div>{props.data?.canalName || '大厅来访'}</div>
        </Col>
        <Col span={16}>
        {/* <Col span={16}>
          <div ><div className="title-text">来访形式</div></div>
          <div>来访</div>
        </Col>
        </Col> */}
        <Col span={24}>
          <div className="title"><div className="title-text">事项概况</div></div>
          <div>{props.data?.caseDes || '-'} </div>
@@ -341,6 +341,10 @@
        <Col span={24}>
          <div className="title"><div className="title-text">事项申请</div></div>
          <div>{props.data?.caseClaim || '-'}</div>
        </Col>
        <Col span={24}>
          <div className="title"><div className="title-text">事项备注</div></div>
          <div>{props.data?.caseRemark || '-'}</div>
        </Col>
        <Col span={8}>
          <div className="title title-gap">
@@ -358,34 +362,34 @@
        </Col>
        {
          props.data?.canalSecond === '22_00003-1' && <>
           <Col span={8}>
            <div className="title"><div className="title-text">上报民警</div></div>
            <div>{props.data?.tcqk?.split('--')?.[0] || '-'}</div>
          </Col>
          <Col span={8}>
            <div className="title"><div className="title-text">上报民警联系电话</div></div>
            <div>{props.data?.tcqk?.split('--')?.[1] || '-'}</div>
          </Col>
          <Col span={8}>
            <div className="title"><div className="title-text">责任民警</div></div>
            <div>{props.data?.tcqk?.split('--')?.[3] || '-'}</div>
          </Col>
          <Col span={8}>
            <div className="title"><div className="title-text">调处人</div></div>
            <div>{props.data?.tcqk?.split('--')?.[4] || '-'}</div>
          </Col>
          <Col span={8}>
            <div className="title"><div className="title-text">调处方案</div></div>
            <div>{props.data?.tcqk?.split('--')?.[5] || '-'}</div>
          </Col>
          <Col span={8}>
            <div className="title"><div className="title-text">风险等级</div></div>
            <div>{props.data?.tcqk?.split('--')?.[2] || '-'}</div>
          </Col>
          <Col span={24}>
            <div className="title"><div className="title-text">前期调处情况</div></div>
            <div>{props.data?.tcqk?.split('--')?.[6] || '-'}</div>
          </Col>
            <Col span={8}>
              <div className="title"><div className="title-text">上报民警</div></div>
              <div>{props.data?.tcqk?.split('--')?.[0] || '-'}</div>
            </Col>
            <Col span={8}>
              <div className="title"><div className="title-text">上报民警联系电话</div></div>
              <div>{props.data?.tcqk?.split('--')?.[1] || '-'}</div>
            </Col>
            <Col span={8}>
              <div className="title"><div className="title-text">责任民警</div></div>
              <div>{props.data?.tcqk?.split('--')?.[3] || '-'}</div>
            </Col>
            <Col span={8}>
              <div className="title"><div className="title-text">调处人</div></div>
              <div>{props.data?.tcqk?.split('--')?.[4] || '-'}</div>
            </Col>
            <Col span={8}>
              <div className="title"><div className="title-text">调处方案</div></div>
              <div>{props.data?.tcqk?.split('--')?.[5] || '-'}</div>
            </Col>
            <Col span={8}>
              <div className="title"><div className="title-text">风险等级</div></div>
              <div>{props.data?.tcqk?.split('--')?.[2] || '-'}</div>
            </Col>
            <Col span={24}>
              <div className="title"><div className="title-text">前期调处情况</div></div>
              <div>{props.data?.tcqk?.split('--')?.[6] || '-'}</div>
            </Col>
          </>
        }
      </Row>
@@ -428,10 +432,10 @@
              <td width='380' colspan='3'>{props.transactResult?.windupContent || '-'}</td>
            </tr>
          }
                  {
          {
            props.transactResult.mediResult == '22_00025-1' && <tr>
              <th bgcolor="#F7F8FA" className="table-title" width="120">协议类型</th>
              <td width='380' colspan='3'>{ props.transactResult.agreeType == '24_00003-2'? '书面协议' : '口头协议'}</td>
              <td width='380' colspan='3'>{props.transactResult.agreeType == '24_00003-2' ? '书面协议' : '口头协议'}</td>
            </tr>
          }
          {
@@ -447,7 +451,7 @@
                <div style={{ display: 'flex', gap: '8px' }}>
                  {props.transactResult?.fileInfoBaseDTOList?.map((item, index) => {
                    return <div style={{ display: 'inline-block' }}>
                      {item.suffix === 'pdf' ? <MyPDF name={item.name} fileUrl={item.showUrl} key={index} /> : <PreviewImage name={item.name} src={item.showUrl} />}
                      <MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
                      {/* <PreviewImage name={item.name} src={item.showUrl} /> */}
                      {/* {index !== props.transactResult?.fileInfoBaseDTOList.length - 1 && <>，</>} */}
                    </div>

 src/views/windowDetail/ApplyInfo.jsx

@@ -446,10 +446,7 @@
        <div style={{ color: '#1A6FB8' }}>
          {fileData.fileList?.map((result, resIndex) => {
            return <div style={{ display: 'inline-block' }}>
              {result.suffix === 'pdf' ?
                <MyPDF name={result.name} fileUrl={result.showUrl} /> :
                <PreviewImage name={result.name} src={result.showUrl} />
              }
              <MyPDF key={resIndex} name={result.name} fileUrl={result.showUrl} fileType={result.suffix} />
              {resIndex !== fileData.fileList?.length - 1 && <>，</>}
            </div>
          }) || '-'}

 src/views/windowDetail/index.jsx

@@ -199,6 +199,7 @@
      getCaseInfo(caseId);
      listFeedback(caseId);
      getData(caseId);
      getDismissData(caseId)
  }, [])

  //获取权限tab和按钮权限

 src/views/workDash/index.jsx

@@ -1024,6 +1024,7 @@
                                placeholder: '请选择',
                                label: '配合部门',
                            },
                            { type: 'Select', name: 'systemSource', label: '系统来源', placeholder: '请选择', span: 8, selectdata: $$.options.systemSource },
                        ]}
                        handleReset={() => {
                            form.resetFields();
@@ -1169,19 +1170,19 @@
                                            <div style={{ display: 'flex', alignItems: 'center' }}>
                                                <span className="workDash-item-title-green"></span>
                                                <span style={{ color: '#4E5969', fontSize: '14px', display: 'flex', alignItems: 'center' }}>
                                                    化解成功：{data?.resolveNum || 0}件 | 成功率：<span style={{ color: '#00B42A' }}>{data?.resolveRate || '0'}%</span>
                                                    化解成功：{data?.finishNum || 0}件 | 成功率：<span style={{ color: '#00B42A' }}>{((data?.finishNum*100)/(data?.finishNum+data?.failNum) || 0).toFixed(2)}%</span>
                                                    <img style={{ width: '14px', height: '14px', marginLeft: '8px' }} src={workDash_5} alt="" srcset="" />
                                                </span>
                                            </div>
                                        </Space>
                                    </div>
                                    <div className="workDash-item-value">
                                        <div style={{ width: '50px' }}>{data?.finishNum || 0}</div>
                                        <div style={{ width: '50px' }}>{data?.finishNum+data?.failNum || 0}</div>
                                        <div style={{ width: '36px' }}></div>
                                        <Space split={<Divider type="vertical" />}>
                                            <div>
                                                <span className="workDash-item-title-red"></span>
                                                <span style={{ color: '#4E5969', fontSize: '14px' }}>化解不成功：{data?.unResolveNum || 0}件</span>
                                                <span style={{ color: '#4E5969', fontSize: '14px' }}>化解不成功：{data?.failNum || 0}件</span>
                                            </div>
                                        </Space>
                                    </div>