场站映射

src/components/SystemSetting/StationManage.tsx

@@ -12,6 +12,7 @@ import {
 	getStationRegions, saveRegion, deleteRegion
 } from '../../api/stationManage';
 import { getOrgList } from '../../api/organization';
+import { fetchPublishedLayers } from '../../lib/geoServer';
 import { useSelector } from 'react-redux';
 import { RootState } from '../../store';
 import { useTranslation } from 'react-i18next';
@@ -26,6 +27,9 @@ export default function StationManage() {
 
 	// 组织列表
 	const [orgList, setOrgList] = useState([]);
+	// 发布图层列表（来自 GeoServer WMS）
+	const [layerList, setLayerList] = useState<{ name: string; title: string }[]>([]);
+	const [layerLoading, setLayerLoading] = useState(false);
 	// 🔥 选中的组织ID（用于筛选）
 	const [selectedOrgId, setSelectedOrgId] = useState<number | undefined>(undefined);
 
@@ -71,6 +75,15 @@ export default function StationManage() {
 		});
 	};
 
+	// ====================== 获取发布图层列表 ======================
+	const getLayerData = () => {
+		setLayerLoading(true);
+		fetchPublishedLayers()
+			.then(layers => setLayerList(layers || []))
+			.catch(() => setLayerList([]))
+			.finally(() => setLayerLoading(false));
+	};
+
 	// ====================== 获取场站列表 ======================
 	const getStationData = () => {
 		const params = {
@@ -131,6 +144,7 @@ export default function StationManage() {
 
 	// ====================== 新增 / 编辑 场站 ======================
 	const handleAdd = () => {
+		getLayerData();
 		form.resetFields();
 		setEditRecord(null);
 		// 默认全部推送关闭
@@ -145,6 +159,7 @@ export default function StationManage() {
 	};
 
 	const handleEdit = (record) => {
+		getLayerData();
 		setEditRecord(record);
 		// 后端数字转布尔给Switch
 		form.setFieldsValue({
@@ -246,6 +261,15 @@ export default function StationManage() {
 	// ====================== 表格列 ======================
 	const columns = [
 		{ title: t('systemSetting.siteName'), dataIndex: 'siteName' },
+		{
+			title: t('systemSetting.mappingLayer'),
+			dataIndex: 'site_map_name',
+			render: (value) => value ? (
+				<Tag color="blue">{value}</Tag>
+			) : (
+				<span style={{ color: '#86909C' }}>—</span>
+			)
+		},
 		{
 			title: t('systemSetting.belongingOrg'),
 			dataIndex: 'orgId',
@@ -363,6 +387,23 @@ export default function StationManage() {
 						<Input placeholder={t('systemSetting.s14')} />
 					</Form.Item>
 
+					<Form.Item name="site_map_name" label={t('systemSetting.mappingLayer')}>
+						<Select
+							placeholder={t('systemSetting.mappingLayerPlaceholder')}
+							loading={layerLoading}
+							allowClear
+							showSearch
+							optionFilterProp="label"
+						>
+							{layerList.map(item => (
+								<Option key={item.name} value={item.name} label={item.title}>
+									<span style={{ display: 'inline-block', verticalAlign: 'middle' }}>{item.title}</span>
+									<span style={{ color: '#999', fontSize: 12 }}>（{item.name}）</span>
+								</Option>
+							))}
+						</Select>
+					</Form.Item>
+
 					<Divider orientation="left">{t('systemSetting.s3')}</Divider>
 
 					<Row gutter={16}>

src/lib/geoServer.ts

@@ -0,0 +1,35 @@
+import envConfig from '../../env';
+
+// 获取发布图层列表
+// 通过 GetCapabilities 解析 WMS 发布的所有图层（workspace:layer）
+export function fetchPublishedLayers(): Promise<{ name: string; title: string }[]> {
+	const baseUrl = envConfig.geoserver_url;
+	const getCapabilitiesUrl = `${baseUrl}/wms?service=WMS&version=1.1.1&request=GetCapabilities`;
+
+	return fetch(getCapabilitiesUrl)
+		.then(response => response.text())
+		.then(xmlText => {
+			const parser = new DOMParser();
+			const xmlDoc = parser.parseFromString(xmlText, 'text/xml');
+			const layerElements = xmlDoc.getElementsByTagName('Layer');
+			const uniqueLayerNames = new Set();
+			const publishedLayers: { name: string; title: string }[] = [];
+
+			for (let i = 0; i < layerElements.length; i++) {
+				const layer = layerElements[i];
+				const nameElement = layer.getElementsByTagName('Name')[0];
+				const titleElement = layer.getElementsByTagName('Title')[0];
+				if (nameElement && nameElement.textContent) {
+					const layerName = nameElement.textContent;
+					if (layerName.includes(':') && !uniqueLayerNames.has(layerName)) {
+						uniqueLayerNames.add(layerName);
+						publishedLayers.push({
+							name: layerName,
+							title: titleElement ? titleElement.textContent : layerName
+						});
+					}
+				}
+			}
+			return publishedLayers;
+		});
+}

src/locales/en/index.ts

@@ -3069,6 +3069,8 @@ const en = {
 		s412: 'Auto Backup',
 
 		s110: 'Boundary Drawing',
+		mappingLayer: 'Mapped Layer',
+		mappingLayerPlaceholder: 'Select a published layer to map',
 
 		fixed2Camera2: 'Total Cameras',
 

src/locales/zh/index.ts

@@ -3104,6 +3104,8 @@ const zh = {
 		s412: '自动备份',
 
 		s110: '边界绘制',
+		mappingLayer: '映射图层',
+		mappingLayerPlaceholder: '请选择要映射的发布图层',
 
 		fixed2Camera2: '摄像头总数',