From 7143b29fb3b7a1b1e7d38143eae612553d0bf37f Mon Sep 17 00:00:00 2001 From: LiuJiaNan <15703339975@163.com> Date: Tue, 28 Oct 2025 15:16:58 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9EHeaderBack=EF=BC=8C=E7=94=A8?= =?UTF-8?q?=E4=BA=8E=E4=B8=8B=E7=BA=A7=E9=A1=B5=E9=9D=A2=E8=BF=94=E5=9B=9E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/HeaderBack/index.d.ts | 18 ++++++++++++++ components/HeaderBack/index.js | 35 +++++++++++++++++++++++++++ components/HeaderBack/index.less | 21 ++++++++++++++++ components/Map/MapSelector.js | 19 +++++++++------ components/Map/index.js | 3 +++ components/Pdf/index.js | 3 +++ components/PreviewImg/index.js | 4 +++ components/PreviewPdf/index.js | 3 +++ components/Table/index.js | 1 + components/TooltipPreviewImg/index.js | 3 +++ 10 files changed, 103 insertions(+), 7 deletions(-) create mode 100644 components/HeaderBack/index.d.ts create mode 100644 components/HeaderBack/index.js create mode 100644 components/HeaderBack/index.less diff --git a/components/HeaderBack/index.d.ts b/components/HeaderBack/index.d.ts new file mode 100644 index 0000000..9e3081a --- /dev/null +++ b/components/HeaderBack/index.d.ts @@ -0,0 +1,18 @@ +import type { FC, ReactNode } from "react"; + +export interface HeaderBackProps { + /** 标题 */ + title: ReactNode; + /** 历史记录对象，用于返回上一页，默认使用 window.history.back */ + history?: { + goBack?: () => void; + [key: string]: any; + }; + /** 是否显示返回按钮，默认为 true */ + previous?: boolean; +} + +/** 头部返回组件 */ +declare const HeaderBack: FC; + +export default HeaderBack; diff --git a/components/HeaderBack/index.js b/components/HeaderBack/index.js new file mode 100644 index 0000000..2d5913d --- /dev/null +++ b/components/HeaderBack/index.js @@ -0,0 +1,35 @@ +import { ArrowLeftOutlined } from "@ant-design/icons"; +import { Divider } from "antd"; +import "./index.less"; + +/** + * 头部返回组件 + */ +function HeaderBack(props) { + const { title, history, previous = true } = props; + + return ( +
+
+ { + previous + && ( + <> +
history?.goBack?.() || window.history.back()} + > + + 返回 +
+ + + ) + } +
{title}
+
+
+ ); +} + +export default HeaderBack; diff --git a/components/HeaderBack/index.less b/components/HeaderBack/index.less new file mode 100644 index 0000000..8157a3d --- /dev/null +++ b/components/HeaderBack/index.less @@ -0,0 +1,21 @@ +.header-back { + padding: 10px 20px; + border-bottom: 1px solid #dcdfe6; + + .action { + display: flex; + align-items: center; + + .back { + display: flex; + align-items: center; + gap: 10px; + cursor: pointer; + font-size: 14px; + } + + .title { + font-size: 17px; + } + } +} diff --git a/components/Map/MapSelector.js b/components/Map/MapSelector.js index c948373..385215f 100644 --- a/components/Map/MapSelector.js +++ b/components/Map/MapSelector.js @@ -1,13 +1,18 @@ import { Button, Col, Form, Input, Modal, Row, Spin } from "antd"; import { useEffect, useRef, useState } from "react"; -const MapSelector = ({ - visible, - onClose, - longitude, - latitude, - onConfirm, // 新增确认回调 - }) => { +/** + * 定位组件弹窗 + */ +const MapSelector = (props) => { + const { + visible, + onClose, + longitude, + latitude, + onConfirm, + } = props; + const mapContainerRef = useRef(null); const mapInstanceRef = useRef(null); const [loading, setLoading] = useState(false); diff --git a/components/Map/index.js b/components/Map/index.js index b9205c3..8e09cc7 100644 --- a/components/Map/index.js +++ b/components/Map/index.js @@ -2,6 +2,9 @@ import { Button, Col, Form, Input, Row } from "antd"; import { useState } from "react"; import MapSelector from "./MapSelector"; +/** + * 定位组件 + */ const Map = (props) => { const { longitudeProps = "longitude", diff --git a/components/Pdf/index.js b/components/Pdf/index.js index a8c7621..19f27b7 100644 --- a/components/Pdf/index.js +++ b/components/Pdf/index.js @@ -3,6 +3,9 @@ import { useState } from "react"; import { Document, Page, pdfjs } from "react-pdf"; import { getFileUrl } from "../../utils/index"; +/** + * PDF查看组件 + */ function Pdf(props) { const { visible = false, diff --git a/components/PreviewImg/index.js b/components/PreviewImg/index.js index dd6c4d2..01da748 100644 --- a/components/PreviewImg/index.js +++ b/components/PreviewImg/index.js @@ -1,8 +1,12 @@ import { Image } from "antd"; import { getFileUrl } from "../../utils/index"; +/** + * 在查看页面中图片预览组件 + */ const PreviewImg = (props) => { const { files = [], fileUrlKey = "filePath" } = props; + const fileUrl = getFileUrl(); return ( diff --git a/components/PreviewPdf/index.js b/components/PreviewPdf/index.js index b7a57f9..0ffee69 100644 --- a/components/PreviewPdf/index.js +++ b/components/PreviewPdf/index.js @@ -2,6 +2,9 @@ import { Button, Space } from "antd"; import { useState } from "react"; import Pdf from "../Pdf"; +/** + * 在查看页面中PDF查看组件 + */ const PreviewPdf = (props) => { const { files = [], diff --git a/components/Table/index.js b/components/Table/index.js index 9acc08c..28da486 100644 --- a/components/Table/index.js +++ b/components/Table/index.js @@ -9,6 +9,7 @@ function TablePro(props) { rowKey = 'id', ...restProps } = props; + const storeIndex = props.storeIndex || `${window.process.env.app.antd["ant-prefix"]}_${Math.random().toString(36).substring(2)}`; function calcColumns() { showIndex && columns.unshift(getIndexColumn(props.pagination)); diff --git a/components/TooltipPreviewImg/index.js b/components/TooltipPreviewImg/index.js index d78662e..5834dc7 100644 --- a/components/TooltipPreviewImg/index.js +++ b/components/TooltipPreviewImg/index.js @@ -1,6 +1,9 @@ import { Tag, Tooltip } from "antd"; import PreviewImg from "~/components/PreviewImg"; +/** + * 在表格组件中图片查看组件 + */ const TooltipPreviewImg = (props) => { const { files = [], fileUrlKey = "filePath" } = props;