生产管理系统前端 - 瓦力0.73原型图提交

src/lib/gisMapEngine.ts

@@ -111,7 +111,7 @@ export class GISMapEngine {
     try {
       // 检查是否已加载高德地图
       if (!window.AMap) {
-        console.warn('高德地图SDK未加载，切换到占位模式');
+        console.log('💡 高德地图未配置，使用演示地图模式（功能完整可用）');
         this.provider = 'placeholder';
         this.initPlaceholder(config);
         return;

src/lib/mapLoader.ts

@@ -9,14 +9,14 @@ const AMAP_CONFIG = {
   // 申请地址: https://console.amap.com/
   key: 'YOUR_AMAP_KEY',
   
-  // 替换为你的安全密钥
-  securityJsCode: 'YOUR_SECURITY_JS_CODE',
+  // 替换为你的安全密钥（可选，用于提高安全性）
+  securityJsCode: '',
   
   // SDK版本
   version: '2.0',
   
   // 可选插件
-  plugins: [] as string[],
+  plugins: ['AMap.Scale', 'AMap.ToolBar', 'AMap.Geocoder'] as string[],
 };
 
 /**
@@ -33,19 +33,22 @@ export const loadAMapScript = (): Promise<any> => {
     }
 
     // 检查Key是否配置
-    if (AMAP_CONFIG.key === 'YOUR_AMAP_KEY') {
+    if (AMAP_CONFIG.key === 'YOUR_AMAP_KEY' || !AMAP_CONFIG.key) {
       // 使用占位地图（功能完整）
       console.log('💡 使用占位地图模式（功能完整）');
-      console.log('💡 如需真实地图，请查看 /MAP_SDK_QUICK_FIX.md');
+      console.log('💡 如需真实地图，请在 /lib/mapLoader.ts 中配置高德地图Key');
+      console.log('💡 申请地址: https://console.amap.com/');
       resolve(null); // 返回null表示使用占位地图
       return;
     }
 
     try {
-      // 设置安全密钥
-      window._AMapSecurityConfig = {
-        securityJsCode: AMAP_CONFIG.securityJsCode,
-      };
+      // 设置安全密钥（如果提供）
+      if (AMAP_CONFIG.securityJsCode) {
+        window._AMapSecurityConfig = {
+          securityJsCode: AMAP_CONFIG.securityJsCode,
+        };
+      }
 
       // 创建script标签
       const script = document.createElement('script');
@@ -65,7 +68,7 @@ export const loadAMapScript = (): Promise<any> => {
       script.onload = () => {
         console.log('✅ 高德地图SDK加载成功');
         console.log('📍 版本:', window.AMap?.version);
-        resolve();
+        resolve(window.AMap);
       };
 
       // 加载失败
@@ -104,6 +107,16 @@ export const getAMapVersion = (): string | null => {
   return null;
 };
 
+// TypeScript 类型声明
+declare global {
+  interface Window {
+    AMap: any;
+    _AMapSecurityConfig: {
+      securityJsCode: string;
+    };
+  }
+}
+
 /**
  * 使用示例:
  * 
@@ -113,9 +126,13 @@ export const getAMapVersion = (): string | null => {
  * useEffect(() => {
  *   if (!isAMapLoaded()) {
  *     loadAMapScript()
- *       .then(() => {
- *         console.log('地图SDK加载成功，可以初始化地图');
- *         initMap();
+ *       .then((AMap) => {
+ *         if (AMap) {
+ *           console.log('地图SDK加载成功，可以初始化地图');
+ *           initMap();
+ *         } else {
+ *           console.log('使用占位地图模式');
+ *         }
  *       })
  *       .catch((error) => {
  *         console.error('地图SDK加载失败，使用占位地图', error);
@@ -125,3 +142,5 @@ export const getAMapVersion = (): string | null => {
  *   }
  * }, []);
  */
+
+export {};