From d2280c384e4b8f6acef1e01f400e3c61c97d82d9 Mon Sep 17 00:00:00 2001
From: dminyi <1301963064@qq.com>
Date: Sat, 07 Sep 2024 16:56:54 +0800
Subject: [PATCH] Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh into master
---
gz-customerSystem/src/views/filesCheck/newFileCheck.jsx | 325 +++++++++++++++++++++++++++++++++--------------------
1 files changed, 201 insertions(+), 124 deletions(-)
diff --git a/gz-customerSystem/src/views/filesCheck/newFileCheck.jsx b/gz-customerSystem/src/views/filesCheck/newFileCheck.jsx
index d83cb84..8636736 100644
--- a/gz-customerSystem/src/views/filesCheck/newFileCheck.jsx
+++ b/gz-customerSystem/src/views/filesCheck/newFileCheck.jsx
@@ -2,29 +2,30 @@
* @Company: hugeInfo
* @Author: ldh
* @Date: 2022-03-11 11:03:44
- * @LastEditTime: 2024-08-17 17:42:03
+ * @LastEditTime: 2024-09-07 16:11:58
* @LastEditors: dminyi 1301963064@qq.com
* @Version: 1.0.0
* @Description: 大厅来访材料附件查看
* 附件类型对照
- NULL("22_00017-0","未分类"),
- AUDIO("22_00017-1", "音频"),
- VIDEO("22_00017-2", "视频"),
- IMAGE("22_00017-3", "图片"),
- WORD("22_00017-4", "Word文档"),
- EXCEL("22_00017-5", "Excel表格"),
- PDF("22_00017-6", "PDF"),
- TXT("22_00017-7", "txt文本"),
- ZIP("22_00017--8", "压缩文件"),
- POWERPOINT("22_00017-9", "PowerPoint"),
- UNKNOWN("22_00017-99", "其它文件");
+ NULL("22_00017-0","未分类"),
+ AUDIO("22_00017-1", "音频"),
+ VIDEO("22_00017-2", "视频"),
+ IMAGE("22_00017-3", "图片"),
+ WORD("22_00017-4", "Word文档"),
+ EXCEL("22_00017-5", "Excel表格"),
+ PDF("22_00017-6", "PDF"),
+ TXT("22_00017-7", "txt文本"),
+ ZIP("22_00017--8", "压缩文件"),
+ POWERPOINT("22_00017-9", "PowerPoint"),
+ UNKNOWN("22_00017-99", "其它文件");
*/
import React, { useState, useEffect, useRef } from 'react';
-import { Button, Menu, Tooltip } from 'antd';
+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 {
- FolderOpenOutlined,
- FolderOutlined,
+ CaretRightOutlined,
+ CaretDownOutlined,
FileOutlined,
FileImageOutlined,
FilePdfOutlined,
@@ -38,11 +39,14 @@
} from '@ant-design/icons';
import * as $$ from '../../utils/utility';
+
const { SubMenu } = Menu;
+const FormItem = Form.Item;
+const Option = Select.Option;
// 获取附件
-function getFileListDataApi(submitData) {
- return $$.ax.request({ url: `caseInfo/listCaseFile?caseId=${submitData}`, type: 'get', service: 'mediate' });
+function getFileListDataApi() {
+ return $$.ax.request({ url: `fileInfo/listFileByCat?mainId=${'10001'}&ownerCat=&createStart=&createEnd=&uploaderType=`, type: 'get', service: 'sys', });
}
const NewFileCheck = ({ caseId }) => {
@@ -65,6 +69,8 @@
const imgBgRef = useRef();
const imgRef = useRef();
+ const formRef = useRef();
+
// 图片旋转
function handleRotateImg(type) {
@@ -159,12 +165,12 @@
const res = await getFileListDataApi(caseId || searchParams.get('caseId'));
global.setSpinning(false);
if (res.type) {
- let resData = res.data?.dataList || [];
+ let resData = res.data || [];
let arr = [];
let filesArr = [];
let index = 0;
resData.forEach((x, t) => {
- arr.push(x.ownerTypeName);
+ arr.push(x.ownerCatName);
filesArr = filesArr.concat(x.fileList || []);
});
forEach: for (let i = 0; i < filesArr.length - 1; i++) {
@@ -179,6 +185,7 @@
setOpenKeys(arr);
}
}
+ console.log(files,'filesfiles')
useEffect(() => {
getFileListData();
@@ -207,116 +214,186 @@
return (
<>
- <nav className="filesCheck-nav">
- <Menu
- className="filesCheck-nav-menu"
- style={{ width: '200px' }}
- onOpenChange={(openKeys) => setOpenKeys(openKeys)}
- mode="inline"
- selectedKeys={[files[fileIndex]?.id]}
- openKeys={openKeys}
+ <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: '否',
+ }}//默认值
>
- {data.data?.map((x, t) => {
- return (
- <SubMenu
- key={x.ownerTypeName}
- icon={openKeys.includes(x.ownerTypeName) ? <FolderOpenOutlined /> : <FolderOutlined />}
- title={x.ownerTypeName}
+ <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')}
>
- {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}
- >
- {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}`)}
+ <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>
+ <div style={{ display: 'flex' }}>
+ <div style={{ width: '200px' }}>
+ <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}
>
- 跳转查看
- </Button>
+ {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}
+ >
+ {y.name}
+ </Menu.Item>
+ );
+ })}
+ </SubMenu>
+ );
+ })}
+ </Menu>
+
+ </div>
+ <div style={{ flex: 1 }}>
+ {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]?.ownerCat === '22_00014_1' ? (
+ <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}`)}
+ >
+ 跳转查看
+ </Button>
+ )}
+ <a href={`${appUrl.fileUrl}${appUrl.fileDownUrl}${files[fileIndex]?.id}`}>
+ <Button type="primary">下载</Button>
+ </a>
+ </div>
+ </div>
)}
- <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 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>
+ )}
</div>
- <div className="filesCheck-imgRight" onClick={() => handleNext('next')}>
- <RightOutlined />
- </div>
- </main>
- ) : (
- <div style={{ width: '100%', paddingTop: '20%' }}>{$$.MyEmpty()}</div>
- )}
+ </div>
+ </nav>
+ {/*图片查看*/}
</>
);
};
--
Gitblit v1.8.0