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;