事件材料查看+ai页面

dminyi

2024-09-07 80e40362a760c5c53c51e8a1e79c9a11c6a0f5fe

事件材料查看+ai页面

 gz-customerSystem/src/assets/images/aiPerson.png

 gz-customerSystem/src/assets/images/caselogo.png

 gz-customerSystem/src/assets/images/index.js

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: lwh
 * @Date: 2023-04-24 16:12:00
 * @LastEditTime: 2024-08-30 10:47:30
 * @LastEditTime: 2024-09-07 14:08:18
 * @LastEditors: dminyi 1301963064@qq.com
 * @Version: 1.0.0
 * @Description:
@@ -61,7 +61,9 @@
import applyRecord from "./applyRecord.png";
import downO from "./downO.png";
import up from "./up.png";
import Audit from "./Audit.png"
import Audit from "./Audit.png";
import aiPerson from "./aiPerson.png";
import caselogo from "./caselogo.png";

export {
  ledger_1,
@@ -118,5 +120,7 @@
  applyRecord,
  downO,
  up,
  Audit
  Audit,
  aiPerson,
  caselogo
};

 gz-customerSystem/src/views/filesCheck/newFileCheck.jsx

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: ldh
 * @Date: 2022-03-11 11:03:44
 * @LastEditTime: 2024-09-05 20:46:47
 * @LastEditTime: 2024-09-07 11:55:54
 * @LastEditors: dminyi 1301963064@qq.com
 * @Version: 1.0.0
 * @Description: 大厅来访材料附件查看
@@ -19,376 +19,377 @@
    POWERPOINT("22_00017-9", "PowerPoint"),
    UNKNOWN("22_00017-99", "其它文件");
 */
import React, { useState, useEffect, useRef } from 'react';
import { Button, Menu, Tooltip, Row, Col, Form, Space } from 'antd';
import { Select, DatePicker } from '@arco-design/web-react';
import { useSearchParams } from 'react-router-dom';
import {
    CaretRightOutlined,
    CaretDownOutlined,
    FileOutlined,
    FileImageOutlined,
    FilePdfOutlined,
    FileWordOutlined,
    FileExcelOutlined,
    RotateRightOutlined,
    RotateLeftOutlined,
    DownloadOutlined,
    LeftOutlined,
    RightOutlined,
} from '@ant-design/icons';
import * as $$ from '../../utils/utility';


const { SubMenu } = Menu;
const FormItem = Form.Item;
const Option = Select.Option;

// http://localhost:9002/dyh-sys/api/web/fileInfo/listFileByCat?mainId=10001&ownerCat=&createStart=&createEnd=&uploaderType=
// 获取附件
function getFileListDataApi(submitData) {
    return $$.ax.request({ url: `fileInfo/listFileByCat?mainId=${submitData}`, type: 'get', service: 'mediate' });
}

const NewFileCheck = ({ caseId }) => {
    let appUrl = $$.appUrl;

    const [searchParams] = useSearchParams();

    const fileId = searchParams.get('fileId');

    const [data, setData] = useState([]);

    const [openKeys, setOpenKeys] = useState([]);

    // files数组
    const [files, setFiles] = useState([{}]);

    // 当前点击的file的index
    const [fileIndex, setFileIndex] = useState(0);

    const imgBgRef = useRef();

    const imgRef = useRef();
    const formRef = useRef();


    // 图片旋转
    function handleRotateImg(type) {
        if (!imgRef || !imgRef.current) {
            return false;
        }
        let transform = imgRef.current.style.transform,
            reg = /(-)?[0-9][0-9]*/g,
            arr = transform.split('rotate'),
            rotate = Number(transform.match(reg)[4] || 0),
            num = 0;
        if (type === 'right') {
            num = rotate + 90;
        } else {
            num = rotate + -90;
        }
        imgRef.current.style.transform = `${arr[0]}rotate(${num}deg)`;
    import React, { useState, useEffect, useRef } from 'react';
    import { Button, Menu, Tooltip, Row, Col, Form, Space } from 'antd';
    import { Select, DatePicker } from '@arco-design/web-react';
    import { useSearchParams } from 'react-router-dom';
    import {
        CaretRightOutlined,
        CaretDownOutlined,
        FileOutlined,
        FileImageOutlined,
        FilePdfOutlined,
        FileWordOutlined,
        FileExcelOutlined,
        RotateRightOutlined,
        RotateLeftOutlined,
        DownloadOutlined,
        LeftOutlined,
        RightOutlined,
    } from '@ant-design/icons';
    import * as $$ from '../../utils/utility';
	
	
    const { SubMenu } = Menu;
    const FormItem = Form.Item;
    const Option = Select.Option;
	
    // 获取附件
    function getFileListDataApi() {
        return $$.ax.request({ url: `fileInfo/listFileByCat?mainId=${'10001'}&ownerCat=&createStart=&createEnd=&uploaderType=`, type: 'get', service: 'sys', });
    }

    // 监听图片滚动事件放大，缩小
    function imgScrollFunc(e) {
        if (!imgRef || !imgRef.current) {
            return false;
        }
        let transform = imgRef.current.style.transform,
            reg = /\((.+?)\)/g,
            scale3d = transform.match(reg)[0],
            scale3dNum = scale3d.substring(1, 2);
        let num = Number(scale3dNum);
        if (e.wheelDelta) {
            //判断浏览器IE，谷歌滑轮事件
            if (e.wheelDelta > 0) {
                //当滑轮向上滚动时
                num = num + 1;
	
    const NewFileCheck = ({ caseId }) => {
        let appUrl = $$.appUrl;
	
        const [searchParams] = useSearchParams();
	
        const fileId = searchParams.get('fileId');
	
        const [data, setData] = useState([]);
	
        const [openKeys, setOpenKeys] = useState([]);
	
        // files数组
        const [files, setFiles] = useState([{}]);
	
        // 当前点击的file的index
        const [fileIndex, setFileIndex] = useState(0);
	
        const imgBgRef = useRef();
	
        const imgRef = useRef();
        const formRef = useRef();
	
	
        // 图片旋转
        function handleRotateImg(type) {
            if (!imgRef || !imgRef.current) {
                return false;
            }
            if (e.wheelDelta < 0) {
                //当滑轮向下滚动时
                num = num - 1;
            let transform = imgRef.current.style.transform,
                reg = /(-)?[0-9][0-9]*/g,
                arr = transform.split('rotate'),
                rotate = Number(transform.match(reg)[4] || 0),
                num = 0;
            if (type === 'right') {
                num = rotate + 90;
            } else {
                num = rotate + -90;
            }
        } else if (e.detail) {
            //Firefox滑轮事件
            if (e.detail > 0) {
                //当滑轮向上滚动时
                num = num + 1;
            imgRef.current.style.transform = `${arr[0]}rotate(${num}deg)`;
        }
	
        // 监听图片滚动事件放大，缩小
        function imgScrollFunc(e) {
            if (!imgRef || !imgRef.current) {
                return false;
            }
            if (e.detail < 0) {
                //当滑轮向下滚动时
                num = num - 1;
            }
        }
        let res = `scale3d(${num < 1 ? 1 : num},${num < 1 ? 1 : num},1) rotate${transform.match(reg)[1]}`;
        imgRef.current.style.transform = res;
    }

    // 判断文件的icon
    function iconType(fileType) {
        let result = <FileOutlined />;
        if (fileType === '22_00017-3') {
            result = <FileImageOutlined />;
        }
        if (fileType === '22_00017-5') {
            result = <FileExcelOutlined />;
        }
        if (fileType === '22_00017-4') {
            result = <FileWordOutlined />;
        }
        if (fileType === '22_00017-6') {
            result = <FilePdfOutlined />;
        }
        return result;
    }

    // 切换下一个，上一个
    async function handleNext(type) {
        global.setSpinning(true);
        let index = fileIndex + (type === 'next' ? 1 : -1);
        if (files[index]) {
            setFileIndex(index);
        } else {
            global.setSpinning(false);
            if (index < 0) {
                setFileIndex(files.length - 1);
                return;
            }
            setFileIndex(0);
        }
    }

    // 获取附件数据
    async function getFileListData() {
        global.setSpinning(true);
        const res = await getFileListDataApi(caseId || searchParams.get('caseId'));
        global.setSpinning(false);
        if (res.type) {
            let resData = res.data?.dataList || [];
            let arr = [];
            let filesArr = [];
            let index = 0;
            resData.forEach((x, t) => {
                arr.push(x.ownerTypeName);
                filesArr = filesArr.concat(x.fileList || []);
            });
            forEach: for (let i = 0; i < filesArr.length - 1; i++) {
                if (filesArr[i].id === fileId) {
                    index = i;
                    break forEach;
            let transform = imgRef.current.style.transform,
                reg = /\((.+?)\)/g,
                scale3d = transform.match(reg)[0],
                scale3dNum = scale3d.substring(1, 2);
            let num = Number(scale3dNum);
            if (e.wheelDelta) {
                //判断浏览器IE，谷歌滑轮事件
                if (e.wheelDelta > 0) {
                    //当滑轮向上滚动时
                    num = num + 1;
                }
                if (e.wheelDelta < 0) {
                    //当滑轮向下滚动时
                    num = num - 1;
                }
            } else if (e.detail) {
                //Firefox滑轮事件
                if (e.detail > 0) {
                    //当滑轮向上滚动时
                    num = num + 1;
                }
                if (e.detail < 0) {
                    //当滑轮向下滚动时
                    num = num - 1;
                }
            }
            setData({ data: resData, caseNo: res.data?.caseNo });
            setFileIndex(index);
            setFiles(filesArr);
            setOpenKeys(arr);
            let res = `scale3d(${num < 1 ? 1 : num},${num < 1 ? 1 : num},1) rotate${transform.match(reg)[1]}`;
            imgRef.current.style.transform = res;
        }
    }

    useEffect(() => {
        getFileListData();
    }, []);

    // 监听鼠标滚动事件
    useEffect(() => {
        if (imgRef.current) {
            imgRef.current.onload = () => {
                imgBgRef.current.onmousewheel = imgScrollFunc;
            };
	
        // 判断文件的icon
        function iconType(fileType) {
            let result = <FileOutlined />;
            if (fileType === '22_00017-3') {
                result = <FileImageOutlined />;
            }
            if (fileType === '22_00017-5') {
                result = <FileExcelOutlined />;
            }
            if (fileType === '22_00017-4') {
                result = <FileWordOutlined />;
            }
            if (fileType === '22_00017-6') {
                result = <FilePdfOutlined />;
            }
            return result;
        }
    }, [files]);

    // 切换文件加载
    useEffect(() => {
        if (imgRef.current) {
            imgRef.current.src = `${appUrl.fileUrl}${appUrl.fileShowUrl}${files[fileIndex]?.id}`;
            imgRef.current.onload = () => {
	
        // 切换下一个，上一个
        async function handleNext(type) {
            global.setSpinning(true);
            let index = fileIndex + (type === 'next' ? 1 : -1);
            if (files[index]) {
                setFileIndex(index);
            } else {
                global.setSpinning(false);
                if (index < 0) {
                    setFileIndex(files.length - 1);
                    return;
                }
                setFileIndex(0);
            }
        }
	
        // 获取附件数据
        async function getFileListData() {
            global.setSpinning(true);
            const res = await getFileListDataApi(caseId || searchParams.get('caseId'));
            global.setSpinning(false);
            if (res.type) {
                let resData = res.data || [];
                let arr = [];
                let filesArr = [];
                let index = 0;
                resData.forEach((x, t) => {
                    arr.push(x.ownerCatName);
                    filesArr = filesArr.concat(x.fileList || []);
                });
                forEach: for (let i = 0; i < filesArr.length - 1; i++) {
                    if (filesArr[i].id === fileId) {
                        index = i;
                        break forEach;
                    }
                }
                setData({ data: resData, caseNo: res.data?.caseNo });
                setFileIndex(index);
                setFiles(filesArr);
                setOpenKeys(arr);
            }
        }
	
        useEffect(() => {
            getFileListData();
        }, []);
	
        // 监听鼠标滚动事件
        useEffect(() => {
            if (imgRef.current) {
                imgRef.current.onload = () => {
                    imgBgRef.current.onmousewheel = imgScrollFunc;
                };
            }
        }, [files]);
	
        // 切换文件加载
        useEffect(() => {
            if (imgRef.current) {
                imgRef.current.src = `${appUrl.fileUrl}${appUrl.fileShowUrl}${files[fileIndex]?.id}`;
                imgRef.current.onload = () => {
                    global.setSpinning(false, 'only');
                };
            } else {
                global.setSpinning(false, 'only');
            };
        } else {
            global.setSpinning(false, 'only');
        }
    }, [appUrl.fileShowUrl, fileIndex, appUrl.baseUrl, files]);

    return (
        <>
            <nav className="filesCheck-nav" style={{ borderRight: '1px solid transparent' }}>
                <Form
                    ref={formRef}
                    layout='horizontal'
                    style={{ marginTop: '24px', marginBottom: '20px' }}
                    requiredSymbol={false}
                    scrollToFirstError={true}
                    initialValues={{
                        level: '三级',
                        isSerious: '否',
                    }}//默认值
                >
                    <Row gutter={24} style={{ marginRight: '0px' }}>
                        <Col span={7}>
                            <FormItem label='材料类型：' field='level'>
                                <Select placeholder='Select city' allowClear>
                                    {['一级', '二级', '三级', '四级'].map((option, index) => (
                                        <Option key={option} value={option}>
                                            {option}
                                        </Option>
                                    ))}
                                </Select>
                            </FormItem>
                        </Col>
                        <Col span={7}>
                            <FormItem
                                label='上传时间：'
                                field='name'
                                onChange={(e) => console.log(e.target.value, 'vvv')}
                            >
                                <DatePicker.RangePicker
                                    defaultValue={['2020-08-08', '2020-08-18']}
                                    separator='~'
                                    style={{ width: '100%' }}
                                />
                            </FormItem>
                        </Col>
                        <Col span={7}>
                            <FormItem
                                label='上传人类型：'
                                field='name'
                                onChange={(e) => console.log(e.target.value, 'vvv')}
                            >
                                <Select placeholder='Select city' allowClear style={{ width: '100%' }}>
                                    {['一级', '二级', '三级', '四级'].map((option, index) => (
                                        <Option key={option} value={option}>
                                            {option}
                                        </Option>
                                    ))}
                                </Select>
                            </FormItem>

                        </Col>
                        <Col span={3}>
                            <Space>
                                <Button size="middle " type='primary'>查询</Button>
                                <Button size="middle ">查询</Button>
                            </Space>
                        </Col>

                    </Row>

                </Form>

                <Menu
                    className="filesCheck-nav-menu"
                    style={{ width: '200px' }}
                    onOpenChange={(openKeys) => setOpenKeys(openKeys)}
                    mode="inline"
                    selectedKeys={[files[fileIndex]?.id]}
                    openKeys={openKeys}
                >
                    {data.data?.map((x, t) => {
                        return (
                            <SubMenu
                                key={x.ownerTypeName}
                                expandIcon={openKeys.includes(x.ownerTypeName) ? <CaretRightOutlined /> : <CaretDownOutlined />}
                                title={x.ownerTypeName}
                            >
                                {x.fileList?.map((y, z) => {
                                    return (
                                        <Menu.Item
                                            onClick={async () => {
                                                global.setSpinning(true);
                                                for (let i = 0; i < files.length; i++) {
                                                    if (files[i].id === y.id) {
                                                        setFileIndex(i);
                                                        break;
            }
        }, [appUrl.fileShowUrl, fileIndex, appUrl.baseUrl, files]);
	
        return (
            <>
                <nav className="filesCheck-nav" style={{ borderRight: '1px solid transparent' }}>
                    <Form
                        ref={formRef}
                        layout='horizontal'
                        style={{ marginTop: '24px', marginBottom: '20px' }}
                        requiredSymbol={false}
                        scrollToFirstError={true}
                        initialValues={{
                            level: '三级',
                            isSerious: '否',
                        }}//默认值
                    >
                        <Row gutter={24} style={{ marginRight: '0px' }}>
                            <Col span={7}>
                                <FormItem label='材料类型：' field='level'>
                                    <Select placeholder='Select city' allowClear>
                                        {['一级', '二级', '三级', '四级'].map((option, index) => (
                                            <Option key={option} value={option}>
                                                {option}
                                            </Option>
                                        ))}
                                    </Select>
                                </FormItem>
                            </Col>
                            <Col span={7}>
                                <FormItem
                                    label='上传时间：'
                                    field='name'
                                    onChange={(e) => console.log(e.target.value, 'vvv')}
                                >
                                    <DatePicker.RangePicker
                                        defaultValue={['2020-08-08', '2020-08-18']}
                                        separator='~'
                                        style={{ width: '100%' }}
                                    />
                                </FormItem>
                            </Col>
                            <Col span={7}>
                                <FormItem
                                    label='上传人类型：'
                                    field='name'
                                    onChange={(e) => console.log(e.target.value, 'vvv')}
                                >
                                    <Select placeholder='Select city' allowClear style={{ width: '100%' }}>
                                        {['一级', '二级', '三级', '四级'].map((option, index) => (
                                            <Option key={option} value={option}>
                                                {option}
                                            </Option>
                                        ))}
                                    </Select>
                                </FormItem>
	
                            </Col>
                            <Col span={3}>
                                <Space>
                                    <Button size="middle " type='primary'>查询</Button>
                                    <Button size="middle ">查询</Button>
                                </Space>
                            </Col>
	
                        </Row>
	
                    </Form>
	
                    <Menu
                        className="filesCheck-nav-menu"
                        style={{ width: '200px' }}
                        onOpenChange={(openKeys) => setOpenKeys(openKeys)}
                        mode="inline"
                        selectedKeys={[files[fileIndex]?.id]}
                        openKeys={openKeys}
                    >
                        {data.data?.map((x, t) => {
                            return (
                                <SubMenu
                                    key={x.ownerCatName}
                                    expandIcon={openKeys.includes(x.ownerCatName) ? <CaretRightOutlined /> : <CaretDownOutlined />}
                                    title={x.ownerCatName}
                                >
                                    {x.fileList?.map((y, z) => {
                                        return (
                                            <Menu.Item
                                                onClick={async () => {
                                                    global.setSpinning(true);
                                                    for (let i = 0; i < files.length; i++) {
                                                        if (files[i].id === y.id) {
                                                            setFileIndex(i);
                                                            break;
                                                        }
                                                    }
                                                }
                                            }}
                                            icon={iconType(y.cat)}
                                            key={y.id}
                                                }}
                                                icon={iconType(y.cat)}
                                                key={y.id}
                                            >
                                                {y.name}
                                            </Menu.Item>
                                        );
                                    })}
                                </SubMenu>
                            );
                        })}
                    </Menu>
                </nav>
                {/*图片查看*/}
                {files[fileIndex] ? (
                    <main className="filesCheck-main">
                        {/* 头部操作区 */}
                        <div className="filesCheck-main-action">
                            <div className="filesCheck-main-action-title">
                                <h3>{files[fileIndex]?.name}</h3>
                            </div>
                            {files[fileIndex]?.cat === '22_00017-3' && (
                                <>
                                    <div className="filesCheck-main-action-item">
                                        <Tooltip title="左转">
                                            <RotateLeftOutlined onClick={() => handleRotateImg('left')} />
                                        </Tooltip>
                                    </div>
                                    <div className="filesCheck-main-action-item">
                                        <Tooltip title="右转">
                                            <RotateRightOutlined onClick={() => handleRotateImg('right')} />
                                        </Tooltip>
                                    </div>
                                </>
                            )}
                            <div className="filesCheck-main-action-item">
                                <Tooltip title="下载">
                                    <a href={`${appUrl.fileUrl}${appUrl.fileDownUrl}${files[fileIndex]?.id}`}>
                                        <DownloadOutlined />
                                    </a>
                                </Tooltip>
                            </div>
                        </div>
                        {files[fileIndex]?.cat === '22_00017-3' ? (
                            <div className="filesCheck-main-imgBg" ref={imgBgRef}>
                                <img
                                    ref={imgRef}
                                    style={{ transform: 'scale3d(1,1,1) rotate(0deg)' }}
                                    className="filesCheck-main-img"
                                    src={`${appUrl.fileUrl}${appUrl.fileShowUrl}${files[fileIndex]?.id}`}
                                    alt="图片加载中..."
                                />
                            </div>
                        ) : (
                            <div className="filesCheck-main-other">
                                <div className="filesCheck-main-other-icon">{iconType(files[fileIndex]?.cat)}</div>
                                <div className="filesCheck-main-other-text">
                                    您所查看的附件不支持预览，请下载查看{files[fileIndex]?.cat === '22_00017-6' ? '或跳转预览' : ''}。
                                </div>
                                <div>
                                    {files[fileIndex]?.cat === '22_00017-6' && (
                                        <Button
                                            className="public-buttonMargin"
                                            onClick={() => window.open(`${appUrl.fileUrl}${appUrl.fileShowUrl}${files[fileIndex]?.id}`)}
                                        >
                                            {y.name}
                                        </Menu.Item>
                                    );
                                })}
                            </SubMenu>
                        );
                    })}
                </Menu>
            </nav>
            {files[fileIndex] ? (
                <main className="filesCheck-main">
                    {/* 头部操作区 */}
                    <div className="filesCheck-main-action">
                        <div className="filesCheck-main-action-title">
                            <h3>{files[fileIndex]?.name}</h3>
                        </div>
                        {files[fileIndex]?.cat === '22_00017-3' && (
                            <>
                                <div className="filesCheck-main-action-item">
                                    <Tooltip title="左转">
                                        <RotateLeftOutlined onClick={() => handleRotateImg('left')} />
                                    </Tooltip>
                                            跳转查看
                                        </Button>
                                    )}
                                    <a href={`${appUrl.fileUrl}${appUrl.fileDownUrl}${files[fileIndex]?.id}`}>
                                        <Button type="primary">下载</Button>
                                    </a>
                                </div>
                                <div className="filesCheck-main-action-item">
                                    <Tooltip title="右转">
                                        <RotateRightOutlined onClick={() => handleRotateImg('right')} />
                                    </Tooltip>
                                </div>
                            </>
                            </div>
                        )}
                        <div className="filesCheck-main-action-item">
                            <Tooltip title="下载">
                                <a href={`${appUrl.fileUrl}${appUrl.fileDownUrl}${files[fileIndex]?.id}`}>
                                    <DownloadOutlined />
                                </a>
                            </Tooltip>
                        <div className="filesCheck-imgLeft" onClick={() => handleNext('back')}>
                            <LeftOutlined />
                        </div>
                    </div>
                    {files[fileIndex]?.cat === '22_00017-3' ? (
                        <div className="filesCheck-main-imgBg" ref={imgBgRef}>
                            <img
                                ref={imgRef}
                                style={{ transform: 'scale3d(1,1,1) rotate(0deg)' }}
                                className="filesCheck-main-img"
                                src={`${appUrl.fileUrl}${appUrl.fileShowUrl}${files[fileIndex]?.id}`}
                                alt="图片加载中..."
                            />
                        <div className="filesCheck-imgRight" onClick={() => handleNext('next')}>
                            <RightOutlined />
                        </div>
                    ) : (
                        <div className="filesCheck-main-other">
                            <div className="filesCheck-main-other-icon">{iconType(files[fileIndex]?.cat)}</div>
                            <div className="filesCheck-main-other-text">
                                您所查看的附件不支持预览，请下载查看{files[fileIndex]?.cat === '22_00017-6' ? '或跳转预览' : ''}。
                            </div>
                            <div>
                                {files[fileIndex]?.cat === '22_00017-6' && (
                                    <Button
                                        className="public-buttonMargin"
                                        onClick={() => window.open(`${appUrl.fileUrl}${appUrl.fileShowUrl}${files[fileIndex]?.id}`)}
                                    >
                                        跳转查看
                                    </Button>
                                )}
                                <a href={`${appUrl.fileUrl}${appUrl.fileDownUrl}${files[fileIndex]?.id}`}>
                                    <Button type="primary">下载</Button>
                                </a>
                            </div>
                        </div>
                    )}
                    <div className="filesCheck-imgLeft" onClick={() => handleNext('back')}>
                        <LeftOutlined />
                    </div>
                    <div className="filesCheck-imgRight" onClick={() => handleNext('next')}>
                        <RightOutlined />
                    </div>
                </main>
            ) : (
                <div style={{ width: '100%', paddingTop: '20%' }}>{$$.MyEmpty()}</div>
            )}
        </>
    );
};

export default NewFileCheck;
                    </main>
                ) : (
                    <div style={{ width: '100%', paddingTop: '20%' }}>{$$.MyEmpty()}</div>
                )}
            </>
        );
    };
	
    export default NewFileCheck;
	

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

@@ -8,7 +8,7 @@

const FormItem = Form.Item;
const appUrl = $$.appUrl;
const RadioGroup = Radio.Group;// 根据调解案号获取纠纷登记信息
const RadioGroup = Radio.Group;


function delFile(id) {

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

@@ -1,6 +1,6 @@
import React, { useState, useRef, useEffect } from 'react';
import { Col, Space, Row, Tooltip } from 'antd';
import { register, } from '@/assets/images';
import { register, aiPerson } from '@/assets/images';
import { Form, Input, Tabs, Typography, Button, Modal, Select } from '@arco-design/web-react';
import { question1, } from '@/assets/images';
import ProgressStep from '@/components/ProgressStep/VisitStep';
@@ -13,7 +13,8 @@
import ArcoUpload from '@/components/ArcoUpload';
import HandleRecord from '../../matterDetail/HandleRecord';
import SupervisingView from '../../matterDetail/Supervising'
import UniteHandle from '../../matterDetail/UniteHandle'
import UniteHandle from '../../matterDetail/UniteHandle';


const Option = Select.Option;
const FormItem = Form.Item;
@@ -99,7 +100,13 @@
  return $$.ax.request({ url: `caseFeedback/updateFeedback`, type: 'post', service: 'mediate', data });
}

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

function getByIdRoleApi(id) {
  return $$.ax.request({ url: `ctUser/getByIdRole?id=` + id, type: 'get', service: 'cust' });
}



@@ -112,6 +119,8 @@
  const [personView, setPersonView] = useState(false);
  const [supervising, setSupervising] = useState(false)
  const [data, setData] = useState({})
  const [feedbackInfoData, setFeedbackInfoData] = useState({})
  const [personData, setPersonData] = useState({})
  const [caseResult, SetCaseResult] = useState(false);
  const [list, setList] = useState([]);
  const [mode, SetMode] = useState(false);
@@ -175,6 +184,12 @@

  }

  const getByIdRole = async () => {
    const res = await getByIdRoleApi('2105180249501982')
    setPersonData(res.data)

  }


  //删除文件
  const handleDelFile = async (id) => {
@@ -201,7 +216,7 @@
    } else {
      const res = await saveFeedbackApi({
        ...submitData,
        caseId: '24083010062110001',
        caseId: "24083010062110001",
        id: id,
        caseTaskId: '',
      })
@@ -210,6 +225,12 @@
        listFeedback('24083010062110001')
      }
    }
  }

  const getFeedbackInfo = async () => {
    const res = await getFeedbackInfoApi('24083010062110001')
    setFeedbackInfoData(res.data)
    console.log(res.data, 'res.data')
  }

  //获取办理记录接口
@@ -277,10 +298,16 @@
    setSupervising(!supervising)
  }

  const handlePersonView = () => {
    setPersonView(!personView)

  }


  useEffect(() => {
    listFeedback('24083010062110001');
    // getByIdRole()
    getFeedbackInfo();
    getByIdRole();
  }, [])


@@ -296,22 +323,22 @@
          <Row gutter={[16, 16]}>
            <Col span={8} style={{ display: 'flex' }}>
              <div><div className="title-text">承办部门：</div></div>
              <div>天河区棠下街综治中心</div>
              <div>{feedbackInfoData?.handleUnitName}</div>
            </Col>
            <Col span={8} style={{ display: 'flex' }}>
              <div><div className="title-text">经办人：</div></div>
              <div style={{ display: 'flex' }}>
                <div>王一顺</div>
                <img onClick={() => setPersonView(!personView)} src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '4px' }} />
                <div>{feedbackInfoData?.handleUserName}</div>
                <img onClick={() => handlePersonView()} src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '4px' }} />
              </div>
            </Col>
            <Col span={8} style={{ display: 'flex' }}>
              <div><div className="title-text">配合部门：</div></div>
              <div>-</div>
              <div>{feedbackInfoData?.assistUnitName}</div>
            </Col>
            <Col span={8} style={{ display: 'flex' }}>
              <div><div className="title-text">受理时间：</div></div>
              <div>2024-7-5 11:45</div>
              <div>{feedbackInfoData?.acceptTime}</div>
            </Col>
          </Row>

@@ -395,7 +422,7 @@
                          >
                            <ArcoUpload
                              params={{
                                action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId='24083010062110001'&&ownerId=${id}&ownerType=22_00018-102`,
                                action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${'24083010062110001'}&ownerId=${id}&ownerType=${'22_00018-501'}`,
                              }}
                              field='file1'
                              // handleChangeFile={handleChangeFile}
@@ -499,21 +526,21 @@
          <table border="1" align="center" cellpadding="5" className="table">
            <tr>
              <th bgcolor="#F7F8FA" className="table-title" width="120">姓名</th>
              <td width='380'><div style={{ display: 'flex' }}><div>{data.trueName}</div></div></td>
              <td width='380'><div style={{ display: 'flex' }}><div>{personData?.trueName}</div></div></td>
              <th bgcolor="#F7F8FA" className="table-title" width="120">登录账号</th>
              <td width='380'>{data.acc}</td>
              <td width='380'>{personData?.acc}</td>
            </tr>
            <tr>
              <th bgcolor="#F7F8FA" className="table-title">手机号码</th>
              <td>{data.mobile}</td>
              <td>{personData?.mobile}</td>
              <th bgcolor="#F7F8FA" className="table-title">工作电话</th>
              <td>020-83002020</td>
              <td>-</td>
            </tr>
            <tr>
              <th bgcolor="#F7F8FA" className="table-title">所属部门</th>
              <td>{data.deptName}</td>
              <td>{personData?.deptName}</td>
              <th bgcolor="#F7F8FA" className="table-title">职务</th>
              <td>主任</td>
              <td>{personData?.userRoles}</td>
            </tr>
          </table>
        </Modal>

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

@@ -3,22 +3,22 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-08-09 09:59:43
 * @LastEditors: dminyi 1301963064@qq.com
 * @LastEditTime: 2024-09-06 12:03:54
 * @LastEditTime: 2024-09-06 17:43:15
 * @FilePath: \gzDyh\gz-customerSystem\src\views\basicInformation\organization\index.jsx
 * @Description: 来访登记
 * 
 */

import React, { useState, useRef, Fragment } from "react";
import React, { useState } from "react";
import NewPage from '@/components/NewPage';
import * as $$ from '@/utils/utility';
import "@arco-themes/react-gzzz/css/arco.css";
import '../index.less';
import { Typography, Steps, Tabs } from '@arco-design/web-react';
import { Audit, Matter, transfer } from '@/assets/images'
import { Audit, Matter, transfer, aiPerson } from '@/assets/images'
import MatterDetail from '../matterDetail';
import Handle from './component/handle';
import AuditView from './component/AuditView'
import AuditView from './component/AuditView';
import {AiQuestion} from '../visit/component/levelDetail'

const Step = Steps.Step;
const TabPane = Tabs.TabPane;
@@ -31,6 +31,7 @@
const Organization = () => {
    const [current, setCurrent] = useState(3);
    const [tabsActive, setTabsActive] = useState('1');
    const [AiQuestionView, setAiQuestionView] = useState(false)
    const [tabsList, setTabList] = useState([
        {
            img: Matter,
@@ -102,6 +103,14 @@
                    })}
                </Tabs>
            </NewPage>
            <div className="gradient-box" onClick={() => setAiQuestionView(true)}>
                <div><img src={aiPerson} alt='' style={{ width: '24px', height: '24px', marginRight: '6px' }} /></div>
                <div style={{ color: '#FFFFFF' }}>智能调解助理</div>
            </div>
            <AiQuestion
        visible={AiQuestionView}
        onClose={() => setAiQuestionView(false)}
      />
        </div>
    )
}

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

@@ -696,4 +696,16 @@
    align-items: center;
    margin-bottom: 4px;

}

.gradient-box {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: linear-gradient(to right, #6a1b9a, #e040fb);
    display: flex;
    align-items: center;
    padding: 12px 8px;
    border-radius: 12px 0px 0px 12px;
}

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

@@ -35,7 +35,6 @@
  const handleScaned = () => {
    setScaned(true)
    const content = fileView.response.data.ocrResult.wordsResult.join('\n')
    
    setTimeout(() => {
      console.log(formRef.current, content);
      formRef.current.setFieldValue('scanContent', content)

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

@@ -2,12 +2,14 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-08-27 16:47:12
 * @LastEditors: dminyi 1301963064@qq.com
 * @LastEditTime: 2024-09-05 17:03:04
 * @LastEditTime: 2024-09-07 14:20:23
 * @FilePath: \gzDyh\gz-customerSystem\src\views\register\visit\component\levelDetail.jsx
 * @Description: 右抽屉提示
 */
import React from 'react';
import MyDrawer from '@/components/MyDrawer';
import { caselogo } from '@/assets/images';


const EventLevelDrawer = ({ visible, onClose }) => {
    return (
@@ -102,6 +104,32 @@

}

const AiQuestion = ({ visible, onClose }) => {
    return (
        <MyDrawer
            visible={visible}
            onClose={onClose}
            title="事项概况指南"
            width={1000}
            style={{ position: 'absolute' }}
            bodyStyle={{ marginTop: '-8px' }}
            titleBefore={true}
        >
            <div style={{ display: 'flex' }}>

                <div style={{ width: '100px' }}>111</div>
                <div style={{ flex: 1, backgroundColor: '#F2F3F5', height: '100vh' }}>
                    <div>
                        <img src={caselogo} alt='' style={{ width: '30px', height: '30px' }} />
                        <span>刘家健入职吴昆物流公司工作6天，因不适应工作内容、环境等，向吴昆物流公司提出离职申请，但公司称入职1周内因个人原因辞职不予支付工资。刘家健因此向社区调委会申请调解。刘家健希望吴昆物流公司支付6天的工资。经调解，双方达成一致意见，吴昆物流公司同意支付刘家健6天的工资共计1575元。基于这个案件生成合理的调解策略.</span>
                    </div>
                </div>
            </div>
        </MyDrawer>

    )
}


export { EventLevelDrawer, MattersDetail, NoHandleReason };

export { EventLevelDrawer, MattersDetail, NoHandleReason, AiQuestion };

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

@@ -57,6 +57,32 @@
  const [evidenceNumber, setEvidenceNumber] = useState('');
  const [applyFile, setApplyFile] = useState([]);
  const [evidenceFile, setEvidenceFile] = useState([]);
  const [fakeData1, setFakeData1] = useState([
    {
      ownerTyp: "22_00018-101",
      ownerTypeName: "申请材料",
      size: '0',
      ownerId: null,
      ownerName: null,
      perType: null,
      agentStatus: null,
      fileNames: "-",
      fileList: []
    },
    {
      ownerType: "22_00018-102",
      ownerTypeName: "证据材料",
      size: '0',
      ownerId: null,
      ownerName: null,
      perType: null,
      agentStatus: null,
      fileNames: "-",
      fileList: []
    },

  ]);

  const peopleMap = {
    '15_020008-1': '申请方',
    '15_020008-2': '被申请方',
@@ -109,13 +135,19 @@

  const listIdTypeInfo = async () => {
    const res = await listIdTypeInfoApi({
      mainId: "2409061125411006", //事项ID
      ownerIdList: ["2409061125411006"], //具体所属编号
      mainId: props.mainId, //事项ID
      ownerIdList: [props.mainId], //具体所属编号
      typeList: []
    })
    if (res.type) {
      console.log(res,'resres')
      let data = res.data?.[0]?.fileList
      if (res.data.length > 0) {
        setFakeData1(data)
      }
    }
  }

  // console.log(fakeData1,'fakeData1')



@@ -166,52 +198,6 @@
    }
  }

  const fakeData1 = [
    {
      id: 1,
      caseNo: 'A20230101',
      judicNo: '申请材料',
      perClassName: '李晓明的纠纷化解申请表、身份证...',
      inputUserName: '0',
      mediateUserName: '2024-7-12 12:00',
      judgeName: '王五',
      mediator: '赵六',
      handlerUserName: '钱七',
      returnUserName: '孙八',
      expireTime: '2023-08-10T08:00:00.000Z',
      processName: '进行中',
      otherMediator: '周九',
      canalName: '网络',
      judicResult: '通过',
      assistName: '吴十',
      mediTypeName: '民事调解',
      serieStatus: '1', // 1 表示非系列案，2 表示系列案
      // 更多字段...
    },
    {
      id: 2,
      caseNo: 'A20230101',
      judicNo: '证据材料',
      perClassName: '李晓明的纠纷化解申请表、身份证...',
      inputUserName: '0',
      mediateUserName: '2024-7-12 12:00',
      judgeName: '王五',
      mediator: '赵六',
      handlerUserName: '钱七',
      returnUserName: '孙八',
      expireTime: '2023-08-10T08:00:00.000Z',
      processName: '进行中',
      otherMediator: '周九',
      canalName: '网络',
      judicResult: '通过',
      assistName: '吴十',
      mediTypeName: '民事调解',
      serieStatus: '1', // 1 表示非系列案，2 表示系列案
      // 更多字段...
    },

    // 更多数据...
  ];

  // 列配置
  const fakeColumns = [
@@ -224,36 +210,30 @@
    },
    {
      title: '材料类型',
      dataIndex: 'judicNo',
      key: 'judicNo',
      dataIndex: 'ownerTypeName',
      key: 'ownerTypeName',
      width: 60,

    },
    {
      title: '材料数量',
      dataIndex: 'inputUserName',
      key: 'perClassName',
      dataIndex: 'size',
      key: 'size',
      width: 180,
      render: (text, index) => (
        <div onClick={() => console.log(text, index)}>
          1
          {/* {sourceType === '1' ? matterNumber : sourceType === '2' ? evidenceNumber : 0}份 */}
        </div>
      )

      render: (text) => <span>{text}份</span>,

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

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

    },
@@ -304,6 +284,11 @@

  };

  const handleUpload = () => {
    listIdTypeInfo()
    setUpLoad(false);
  };

  const handleCancel = () => {
    // 处理取消逻辑
    setScanFile(false);
@@ -350,10 +335,17 @@
    setEditData(value)
  }

  const uploadQuery = {
    mainId: props.mainId,
    ownerCat: null,
    createStart: null,
    createEnd: null,
    uploaderType:null
  }

  // console.log(sourceType, 'sourceType')
  // console.log(props.formRef?.current?.getFields(),'formRef.current.getFields()')
  useEffect(() => {
    listIdTypeInfo()
  }, [])

  return (
@@ -597,7 +589,7 @@
        columns={fakeColumns}
        dataSource={fakeData1}
        size="small"
        rowKey="id"
        rowKey="ownerType"
        bordered={true}
        style={{ marginBottom: '65px' }}
      />
@@ -642,7 +634,7 @@
                <Row gutter={[32, 0]}>{formType(sourceType)}</Row>
              </Form>
            </Col>
            <Button type="primary" style={{ marginTop: '-20px', marginLeft: '16px' }} onClick={() => { setMatterNumber(fileLength?.length); setEvidenceNumber(evidenceLength?.length); setUpLoad(false) }}>上传完成</Button>
            <Button type="primary" style={{ marginTop: '-20px', marginLeft: '16px' }} onClick={() => handleUpload()}>上传完成</Button>
          </Row>
        </div>

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