新增dynamicLoadJs和dynamicLoadCss，优化Map

components/Map/MapSelector.js

@@ -1,5 +1,6 @@
 import { Button, Col, Form, Input, Modal, Row, Select, Spin } from "antd";
 import { useEffect, useRef, useState } from "react";
+import { dynamicLoadJs } from "../../utils";
 
 /**
  * 定位组件弹窗
@@ -33,6 +34,8 @@ const MapSelector = (props) => {
 
   // 初始化地图
   const initMap = async () => {
+    await dynamicLoadJs("https://api.map.baidu.com/api?v=1.0&type=webgl&ak=OElqFYoKiAH8KFtph8ftLKF5NlNrbCUr");
+
     if (!window.BMapGL) {
       console.error("BMapGL is not loaded");
       return;

components/Map/index.js

@@ -45,11 +45,14 @@ const Map = (props) => {
               <Form.Item name={latitudeProps} noStyle rules={[{ required, message: "请选择纬度" }]}>
                 <Input disabled />
               </Form.Item>
-              <Button type="primary" onClick={() => {
+              <Button
+                type="primary"
+                onClick={() => {
                   setMapVisible(true);
                   setCurrentLongitude(form.getFieldValue(longitudeProps));
                   setCurrentLatitude(form.getFieldValue(latitudeProps));
-              }}>
+                }}
+              >
                 地图定位
               </Button>
             </div>

utils/index.d.ts

@@ -332,3 +332,13 @@ export function processTreeDataForOnlyLastLevel(
 export function validatorEndTime(timeStart: string): {
   validator: (_: any, value: any) => Promise<void | string>;
 };
+
+/**
+ * 动态加载js资源
+ */
+export function dynamicLoadJs(url: string): Promise<void>;
+
+/**
+ * 动态加载css资源
+ */
+export function dynamicLoadCss(url: string): Promise<void>;

utils/index.js

@@ -523,6 +523,35 @@ export const validatorEndTime = (timeStart) => {
   }
 }
 
+/**
+ * 动态加载js资源
+ */
+export function dynamicLoadJs(url) {
+  return new Promise((resolve, reject) => {
+    const script = document.createElement("script");
+    script.type = "text/javascript";
+    script.src = url;
+    script.onload = resolve;
+    script.onerror = reject;
+    document.body.appendChild(script);
+  });
+}
+
+/**
+ * 动态加载css资源
+ */
+export function dynamicLoadCss(url) {
+  return new Promise((resolve, reject) => {
+    const link = document.createElement("link");
+    link.rel = "stylesheet";
+    link.type = "text/css";
+    link.href = url;
+    link.onload = resolve;
+    link.onerror = reject;
+    document.head.appendChild(link);
+  });
+}
+
 /**
  * 获取文件url
  */