新增HeaderBack，用于下级页面返回

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<HeaderBackProps>;
+
+export default HeaderBack;

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 (
+    <div className="header-back">
+      <div className="action">
+        {
+          previous
+          && (
+            <>
+              <div
+                className="back"
+                onClick={() => history?.goBack?.() || window.history.back()}
+              >
+                <ArrowLeftOutlined style={{ fontSize: 14 }} />
+                <span>返回</span>
+              </div>
+              <Divider type="vertical" style={{ backgroundColor: "#dcdfe6", marginLeft: 15, marginRight: 15 }} />
+            </>
+          )
+        }
+        <div className="title">{title}</div>
+      </div>
+    </div>
+  );
+}
+
+export default HeaderBack;

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;
+    }
+  }
+}

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,
+const MapSelector = (props) => {
-                       latitude,
+  const {
-                       onConfirm, // 新增确认回调
+    visible,
-                     }) => {
+    onClose,
+    longitude,
+    latitude,
+    onConfirm,
+  } = props;
+
   const mapContainerRef = useRef(null);
   const mapInstanceRef = useRef(null);
   const [loading, setLoading] = useState(false);

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",

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,

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 (

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 = [],

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));

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;