react-base-client 1.0.151 → 1.1.0

package/src/components/XAMap/index.tsx

@@ -0,0 +1,167 @@
+import { Popup, Button } from 'antd-mobile';
+import React, { useState } from 'react';
+import AMapComponent from '../AMap';
+import { AMapType } from '../AMap/typing.d';
+
+export type XAMapProps = {
+  value?: any;
+  onChange?: (value: any) => void;
+  placeholder?: string;
+  mapStyle?: React.CSSProperties;
+  rowData?: Array<AMapType.RowData>;
+  dragMapSetting?: AMapType.dragMapSettingType;
+  wmsJSON?: any;
+  mapLayers?: any;
+  showLayersPanel?: boolean;
+  realTime?: number;
+  mapId?: string;
+  onWmsFeatureClick?: (featureProps: any) => void;
+};
+
+const XAMap: React.FC<XAMapProps> = (props) => {
+  const {
+    value,
+    onChange,
+    placeholder = '点击查看地图',
+    mapStyle = { height: '400px' },
+    rowData = [],
+    dragMapSetting,
+    wmsJSON,
+    mapLayers,
+    showLayersPanel = false,
+    realTime,
+    mapId,
+    onWmsFeatureClick,
+  } = props;
+
+  const [visible, setVisible] = useState(false);
+  const [selectedFeature, setSelectedFeature] = useState<any>(undefined);
+  const [geometry, setGeometry] = useState<any>(undefined);
+
+  const handleMapClick = () => {
+    setVisible(true);
+  };
+
+  const handleClose = () => {
+    setVisible(false);
+  };
+
+  const handleWmsFeatureClick = (featureProps: any, geometry: any) => {
+    console.log('>>>> aMap - handleWmsFeatureClick', geometry);
+    onChange?.(featureProps);
+    onWmsFeatureClick?.(featureProps);
+    setSelectedFeature(featureProps);
+    setGeometry(geometry);
+    console.log('选中的WMS设备属性:', featureProps);
+  };
+
+  return (
+    <>
+      <div
+        onClick={handleMapClick}
+        style={{
+          padding: '12px',
+          border: '1px solid #d9d9d9',
+          borderRadius: '6px',
+          backgroundColor: '#fafafa',
+          cursor: 'pointer',
+          minHeight: '40px',
+          display: 'flex',
+          alignItems: 'center',
+          color: value ? '#000' : '#999'
+        }}
+      >
+        {value ? '点击查看地图' : placeholder}
+      </div>
+
+      <Popup
+        visible={visible}
+        position="right"
+        bodyStyle={{ width: '100vw', height: '100vh' }}
+        onClose={handleClose}
+      >
+        <div style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
+          <div style={{
+            padding: '10px',
+            borderBottom: '1px solid #eee',
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center'
+          }}>
+            <span style={{ fontSize: '16px', fontWeight: 'bold' }}>地图</span>
+            <button
+              onClick={handleClose}
+              style={{
+                border: 'none',
+                background: 'none',
+                fontSize: '18px',
+                cursor: 'pointer',
+                color: '#666'
+              }}
+            >
+              ✕
+            </button>
+          </div>
+
+          <div style={{ flex: 1 }}>
+            <AMapComponent
+              mapId={mapId}
+              mapLayers={mapLayers}
+              rowData={rowData}
+              dragMapSetting={dragMapSetting}
+              wmsJSON={wmsJSON}
+              showLayersPanel={showLayersPanel}
+              realTime={realTime}
+              mapStyle={mapStyle}
+              onWmsFeatureClick={handleWmsFeatureClick}
+            />
+          </div>
+          <div style={{
+            padding: '16px',
+            borderTop: '1px solid #eee',
+            background: '#fafbfc',
+            minHeight: '120px',
+            maxHeight: '200px',
+            overflow: 'auto',
+            fontSize: '14px',
+            color: '#333',
+          }}>
+            <div style={{ fontWeight: 'bold', marginBottom: 8 }}>选中设备属性：</div>
+            {selectedFeature ? (
+              <div>
+                <div>设备类型：{selectedFeature['附属设施'] || '-'}</div>
+                <div>地址：{selectedFeature['address'] || '-'}</div>
+                <div>设备编号：{selectedFeature['sid'] || '-'}</div>
+                <div>坐标: {geometry?.coordinates || '-'}</div>
+              </div>
+            ) : (
+              <span style={{ color: '#aaa' }}>请点击地图上的设备进行选择</span>
+            )}
+            <Button
+              block
+              color="primary"
+              disabled={!selectedFeature}
+              style={{ marginTop: 12 }}
+              onClick={() => {
+                if (selectedFeature) {
+                  const result = {
+                    设备类型: selectedFeature['附属设施'],
+                    地址: selectedFeature['address'],
+                    设备编号: selectedFeature['sid'],
+                    geometry: geometry
+                  };
+                  onChange?.(result);
+                  setVisible(false);
+                }
+              }}
+            >
+              确认
+            </Button>
+          </div>
+        </div>
+      </Popup>
+    </>
+  );
+};
+
+export default XAMap; 

package/tsconfig.json

@@ -1,29 +0,0 @@
-{
-  "compilerOptions": {
-    "outDir": "build/dist",
-    "module": "esnext",
-    "target": "esnext",
-    "lib": ["esnext", "dom"],
-    "sourceMap": true,
-    "baseUrl": ".",
-    "jsx": "react",
-    "resolveJsonModule": true,
-    "allowSyntheticDefaultImports": true,
-    "moduleResolution": "node",
-    "forceConsistentCasingInFileNames": false,
-    "noImplicitReturns": true,
-    "noUnusedLocals": true,
-    "allowJs": true,
-    "skipLibCheck": true,
-    "experimentalDecorators": true,
-    "strict": true,
-    "paths": {
-      "@af-react-mobile-base-client/*": ["./src/*"],
-      "@@/*": ["./src/.umi/*"],
-      "@umijs/max": ["./node_modules/umi"],
-      "@umijs/max/typings": ["./src/.umi/typings"],
-      "@af-react-mobile-base-client-config/*": ["./config/*"]
-    }
-  },
-  "include": ["mock/**/*", "src/**/*", "config/**/*"]
-}