From 317f910f3cc4fbf29810d5deaf090ea379280a7c Mon Sep 17 00:00:00 2001
From: jacy <18049821889@163.com>
Date: Mon, 27 Jul 2026 23:19:40 +0800
Subject: [PATCH] feat(admin,partner): Tencent map location picker and expose
 LBS key

Store create/edit on HQ and partner can pick coords via Tencent locpicker; client-config exposes TENCENT_LBS_KEY; seed empty system settings from env.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 .../src/components/TencentLocPickerModal.tsx  | 115 +++++++++++++++
 apps/admin-web/src/lib/tencentLocPicker.ts    |  60 ++++++++
 apps/admin-web/src/pages/StoresPage.tsx       |  86 ++++++-----
 .../components/TencentLocPickerOverlay.tsx    | 133 ++++++++++++++++++
 apps/h5-partner/src/lib/tencentLocPicker.ts   |  59 ++++++++
 apps/h5-partner/src/pages/StoreCreatePage.tsx |  31 +++-
 apps/h5-partner/src/pages/StoreDetailPage.tsx |  28 ++++
 .../src/pages/store-detail/index.tsx          |  81 +++++++++--
 apps/mini-user/src/styles/store-detail.css    |  21 +++
 packages/shared-types/src/wechat.ts           |   2 +
 server/dukang-api/.env.example                |   3 +-
 .../system-config/system-config.registry.ts   |   2 +-
 .../common/client-config.controller.ts        |   2 +
 13 files changed, 571 insertions(+), 52 deletions(-)
 create mode 100644 apps/admin-web/src/components/TencentLocPickerModal.tsx
 create mode 100644 apps/admin-web/src/lib/tencentLocPicker.ts
 create mode 100644 apps/h5-partner/src/components/TencentLocPickerOverlay.tsx
 create mode 100644 apps/h5-partner/src/lib/tencentLocPicker.ts

diff --git a/apps/admin-web/src/components/TencentLocPickerModal.tsx b/apps/admin-web/src/components/TencentLocPickerModal.tsx
new file mode 100644
index 0000000..ad05635
--- /dev/null
+++ b/apps/admin-web/src/components/TencentLocPickerModal.tsx
@@ -0,0 +1,115 @@
+import { useEffect, useMemo, useState } from 'react';
+import { Modal, Spin, Typography, message } from 'antd';
+import type { ClientRuntimeConfig } from '@dukang/shared-types';
+import { request } from '../lib/api';
+import {
+  buildTencentLocPickerUrl,
+  parseTencentLocPickerMessage,
+  type TencentPickedLocation,
+} from '../lib/tencentLocPicker';
+
+type Props = {
+  open: boolean;
+  onClose: () => void;
+  onPick: (loc: TencentPickedLocation) => void;
+  latitude?: number | null;
+  longitude?: number | null;
+};
+
+let cachedKey: string | null | undefined;
+
+async function loadTencentLbsKey(): Promise<string> {
+  if (cachedKey) return cachedKey;
+  const cfg = await request<ClientRuntimeConfig>('/common/client-config');
+  const key = (cfg.tencentLbsKey || '').trim();
+  if (!key) {
+    throw new Error('未配置腾讯位置服务 Key，请在系统设置中填写 TENCENT_LBS_KEY');
+  }
+  cachedKey = key;
+  return key;
+}
+
+export default function TencentLocPickerModal({
+  open,
+  onClose,
+  onPick,
+  latitude,
+  longitude,
+}: Props) {
+  const [key, setKey] = useState<string | null>(cachedKey ?? null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    if (!open) return;
+    let cancelled = false;
+    setError('');
+    if (key) return;
+    setLoading(true);
+    void loadTencentLbsKey()
+      .then((k) => {
+        if (!cancelled) setKey(k);
+      })
+      .catch((e) => {
+        if (!cancelled) {
+          const msg = e instanceof Error ? e.message : '加载地图配置失败';
+          setError(msg);
+          message.error(msg);
+        }
+      })
+      .finally(() => {
+        if (!cancelled) setLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [open, key]);
+
+  useEffect(() => {
+    if (!open) return;
+    function onMessage(event: MessageEvent) {
+      const picked = parseTencentLocPickerMessage(event.data);
+      if (!picked) return;
+      onPick(picked);
+      onClose();
+    }
+    window.addEventListener('message', onMessage);
+    return () => window.removeEventListener('message', onMessage);
+  }, [open, onPick, onClose]);
+
+  const src = useMemo(() => {
+    if (!key) return '';
+    return buildTencentLocPickerUrl(key, {
+      latitude: latitude != null ? Number(latitude) : undefined,
+      longitude: longitude != null ? Number(longitude) : undefined,
+    });
+  }, [key, latitude, longitude]);
+
+  return (
+    <Modal
+      title="腾讯地图选点"
+      open={open}
+      onCancel={onClose}
+      footer={null}
+      width={720}
+      destroyOnClose
+      styles={{ body: { padding: 0, height: 560 } }}
+    >
+      {loading ? (
+        <div style={{ height: 560, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+          <Spin tip="加载地图…" />
+        </div>
+      ) : error ? (
+        <div style={{ padding: 24 }}>
+          <Typography.Text type="danger">{error}</Typography.Text>
+        </div>
+      ) : src ? (
+        <iframe
+          title="腾讯地图选点"
+          src={src}
+          style={{ width: '100%', height: 560, border: 0, display: 'block' }}
+        />
+      ) : null}
+    </Modal>
+  );
+}
diff --git a/apps/admin-web/src/lib/tencentLocPicker.ts b/apps/admin-web/src/lib/tencentLocPicker.ts
new file mode 100644
index 0000000..c6e06f1
--- /dev/null
+++ b/apps/admin-web/src/lib/tencentLocPicker.ts
@@ -0,0 +1,60 @@
+export type TencentPickedLocation = {
+  latitude: number;
+  longitude: number;
+  address?: string;
+  name?: string;
+  cityname?: string;
+};
+
+type LocPickerMessage = {
+  module?: string;
+  latlng?: { lat?: number; lng?: number };
+  poiaddress?: string;
+  poiname?: string;
+  cityname?: string;
+};
+
+const REFERER = 'dukang-haoke';
+
+export function buildTencentLocPickerUrl(
+  key: string,
+  options?: { latitude?: number; longitude?: number },
+): string {
+  const params = new URLSearchParams({
+    search: '1',
+    type: '1',
+    key,
+    referer: REFERER,
+    policy: '1',
+  });
+  const lat = options?.latitude;
+  const lng = options?.longitude;
+  if (
+    lat != null &&
+    lng != null &&
+    Number.isFinite(lat) &&
+    Number.isFinite(lng) &&
+    !(lat === 0 && lng === 0)
+  ) {
+    params.set('coord', `${lat},${lng}`);
+    params.set('coordtype', '5');
+  }
+  return `https://apis.map.qq.com/tools/locpicker?${params.toString()}`;
+}
+
+export function parseTencentLocPickerMessage(data: unknown): TencentPickedLocation | null {
+  const loc = data as LocPickerMessage;
+  if (!loc || loc.module !== 'locationPicker') return null;
+  const lat = Number(loc.latlng?.lat);
+  const lng = Number(loc.latlng?.lng);
+  if (!Number.isFinite(lat) || !Number.isFinite(lng)) return null;
+  // 列表滑动过程中偶发空 POI，忽略无名称且无地址的噪声
+  if (!loc.poiname && !loc.poiaddress) return null;
+  return {
+    latitude: lat,
+    longitude: lng,
+    address: loc.poiaddress?.trim() || undefined,
+    name: loc.poiname?.trim() || undefined,
+    cityname: loc.cityname?.trim() || undefined,
+  };
+}
diff --git a/apps/admin-web/src/pages/StoresPage.tsx b/apps/admin-web/src/pages/StoresPage.tsx
index 88ed95f..697951f 100644
--- a/apps/admin-web/src/pages/StoresPage.tsx
+++ b/apps/admin-web/src/pages/StoresPage.tsx
@@ -19,7 +19,7 @@ import {
   message,
 } from 'antd';
 import type { ColumnsType } from 'antd/es/table';
-import { FilePdfOutlined, LinkOutlined } from '@ant-design/icons';
+import { FilePdfOutlined, LinkOutlined, EnvironmentOutlined } from '@ant-design/icons';
 import { request, type Paginated } from '../lib/api';
 import {
   ADMIN_OPTIONS_PAGE_SIZE,
@@ -37,6 +37,7 @@ import { useAdminList } from '../lib/useAdminList';
 import { resolveRegionBinding } from '../lib/china-region';
 import ChinaRegionCascader from '../components/ChinaRegionCascader';
 import OssUpload from '../components/OssUpload';
+import TencentLocPickerModal from '../components/TencentLocPickerModal';
 
 const CREATE_STEPS = [
   { title: '基本信息' },
@@ -44,17 +45,6 @@ const CREATE_STEPS = [
   { title: '结算资质' },
 ];
 
-/** 用店名 + 地址打开百度地图搜索，便于人工核对经纬度 */
-function openBaiduMapSearch(parts: Array<string | null | undefined>) {
-  const query = parts.map((p) => String(p || '').trim()).filter(Boolean).join(' ');
-  if (!query) {
-    message.warning('请先填写门店名称和地址');
-    return;
-  }
-  const url = `https://map.baidu.com/search/${encodeURIComponent(query)}/@0,0,12z?querytype=s&da_src=shareurl&wd=${encodeURIComponent(query)}`;
-  window.open(url, '_blank', 'noopener,noreferrer');
-}
-
 function fillGeolocation(
   setCoords: (lat: number, lng: number) => void,
   setLoading: (v: boolean) => void,
@@ -356,6 +346,8 @@ export default function StoresPage() {
   const [createStep, setCreateStep] = useState(0);
   const [createError, setCreateError] = useState('');
   const [locating, setLocating] = useState(false);
+  const [mapPickerOpen, setMapPickerOpen] = useState(false);
+  const [mapPickerTarget, setMapPickerTarget] = useState<'create' | 'edit'>('create');
   const [partners, setPartners] = useState<PartnerOption[]>([]);
   const [cities, setCities] = useState<CityOption[]>([]);
   const [categoryTree, setCategoryTree] = useState<CategoryNode[]>([]);
@@ -839,24 +831,16 @@ export default function StoresPage() {
                   获取当前位置
                 </Button>
                 <Button
-                  icon={<LinkOutlined />}
+                  icon={<EnvironmentOutlined />}
                   onClick={() => {
-                    const name = String(editForm.getFieldValue('name') || detail.name || '');
-                    const district = String(editForm.getFieldValue('district') || detail.district || '');
-                    const address = String(editForm.getFieldValue('address') || detail.address || '');
-                    openBaiduMapSearch([
-                      String(detail.province || ''),
-                      String(detail.cityName || ''),
-                      district,
-                      address,
-                      name,
-                    ]);
+                    setMapPickerTarget('edit');
+                    setMapPickerOpen(true);
                   }}
                 >
-                  百度地图查询
+                  腾讯地图选点
                 </Button>
                 <Typography.Text type="secondary">
-                  打开百度地图核对位置后，将坐标填回上方经纬度
+                  搜索或拖图确认位置后自动填入经纬度
                 </Typography.Text>
               </Space>
               <Form.Item name="avgPrice" label="人均费用（选填）">
@@ -1013,22 +997,16 @@ export default function StoresPage() {
                   获取当前位置
                 </Button>
                 <Button
-                  icon={<LinkOutlined />}
+                  icon={<EnvironmentOutlined />}
                   onClick={() => {
-                    const v = createForm.getFieldsValue();
-                    openBaiduMapSearch([
-                      v.province,
-                      v.city,
-                      v.district,
-                      v.address,
-                      v.name,
-                    ]);
+                    setMapPickerTarget('create');
+                    setMapPickerOpen(true);
                   }}
                 >
-                  百度地图查询
+                  腾讯地图选点
                 </Button>
                 <Typography.Text type="secondary">
-                  可手动填写 / 定位 / 百度地图核对后填入坐标
+                  可手动填写 / 定位 / 腾讯地图选点填入坐标
                 </Typography.Text>
               </Space>
               <Space wrap style={{ width: '100%' }}>
@@ -1132,6 +1110,42 @@ export default function StoresPage() {
           onChange={(e) => setRejectReason(e.target.value)}
         />
       </Modal>
+      <TencentLocPickerModal
+        open={mapPickerOpen}
+        onClose={() => setMapPickerOpen(false)}
+        latitude={
+          mapPickerTarget === 'edit'
+            ? Number(editForm.getFieldValue('latitude') ?? detail?.latitude)
+            : Number(createForm.getFieldValue('latitude'))
+        }
+        longitude={
+          mapPickerTarget === 'edit'
+            ? Number(editForm.getFieldValue('longitude') ?? detail?.longitude)
+            : Number(createForm.getFieldValue('longitude'))
+        }
+        onPick={(loc) => {
+          if (mapPickerTarget === 'edit') {
+            editForm.setFieldsValue({
+              latitude: loc.latitude,
+              longitude: loc.longitude,
+              ...(loc.address && !editForm.getFieldValue('address')
+                ? { address: loc.address }
+                : {}),
+            });
+          } else {
+            createForm.setFieldsValue({
+              latitude: loc.latitude,
+              longitude: loc.longitude,
+              ...(loc.address && !createForm.getFieldValue('address')
+                ? { address: loc.address }
+                : {}),
+            });
+          }
+          message.success(
+            `已选点 ${loc.latitude.toFixed(6)}, ${loc.longitude.toFixed(6)}${loc.name ? `（${loc.name}）` : ''}`,
+          );
+        }}
+      />
     </div>
   );
 }
diff --git a/apps/h5-partner/src/components/TencentLocPickerOverlay.tsx b/apps/h5-partner/src/components/TencentLocPickerOverlay.tsx
new file mode 100644
index 0000000..ef362e3
--- /dev/null
+++ b/apps/h5-partner/src/components/TencentLocPickerOverlay.tsx
@@ -0,0 +1,133 @@
+import { useEffect, useMemo, useState } from 'react';
+import type { ClientRuntimeConfig } from '@dukang/shared-types';
+import { request } from '../lib/api';
+import {
+  buildTencentLocPickerUrl,
+  parseTencentLocPickerMessage,
+  type TencentPickedLocation,
+} from '../lib/tencentLocPicker';
+
+type Props = {
+  open: boolean;
+  onClose: () => void;
+  onPick: (loc: TencentPickedLocation) => void;
+  latitude?: number | null;
+  longitude?: number | null;
+};
+
+let cachedKey: string | null | undefined;
+
+async function loadTencentLbsKey(): Promise<string> {
+  if (cachedKey) return cachedKey;
+  const cfg = await request<ClientRuntimeConfig>('PARTNER_H5', '/common/client-config', {
+    silent: true,
+  });
+  const key = (cfg.tencentLbsKey || '').trim();
+  if (!key) {
+    throw new Error('未配置腾讯位置服务 Key，请联系管理员在系统设置中配置');
+  }
+  cachedKey = key;
+  return key;
+}
+
+export default function TencentLocPickerOverlay({
+  open,
+  onClose,
+  onPick,
+  latitude,
+  longitude,
+}: Props) {
+  const [key, setKey] = useState<string | null>(cachedKey ?? null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    if (!open) return;
+    let cancelled = false;
+    setError('');
+    if (key) return;
+    setLoading(true);
+    void loadTencentLbsKey()
+      .then((k) => {
+        if (!cancelled) setKey(k);
+      })
+      .catch((e) => {
+        if (!cancelled) setError(e instanceof Error ? e.message : '加载地图配置失败');
+      })
+      .finally(() => {
+        if (!cancelled) setLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [open, key]);
+
+  useEffect(() => {
+    if (!open) return;
+    function onMessage(event: MessageEvent) {
+      const picked = parseTencentLocPickerMessage(event.data);
+      if (!picked) return;
+      onPick(picked);
+      onClose();
+    }
+    window.addEventListener('message', onMessage);
+    return () => window.removeEventListener('message', onMessage);
+  }, [open, onPick, onClose]);
+
+  const src = useMemo(() => {
+    if (!key) return '';
+    return buildTencentLocPickerUrl(key, {
+      latitude: latitude != null ? Number(latitude) : undefined,
+      longitude: longitude != null ? Number(longitude) : undefined,
+    });
+  }, [key, latitude, longitude]);
+
+  if (!open) return null;
+
+  return (
+    <div
+      style={{
+        position: 'fixed',
+        inset: 0,
+        zIndex: 1000,
+        background: '#fff',
+        display: 'flex',
+        flexDirection: 'column',
+      }}
+    >
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'space-between',
+          padding: '12px 16px',
+          borderBottom: '1px solid rgba(0,0,0,0.06)',
+          flexShrink: 0,
+        }}
+      >
+        <button type="button" className="partner-btn-outline" style={{ padding: '6px 12px' }} onClick={onClose}>
+          关闭
+        </button>
+        <span style={{ fontWeight: 600 }}>地图选点</span>
+        <span style={{ width: 52 }} />
+      </div>
+      <div style={{ flex: 1, minHeight: 0, position: 'relative' }}>
+        {loading ? (
+          <p className="label-md text-muted" style={{ padding: 24, textAlign: 'center' }}>
+            加载地图…
+          </p>
+        ) : error ? (
+          <p className="label-md" style={{ padding: 24, color: 'var(--color-heritage-red, #a61d24)' }}>
+            {error}
+          </p>
+        ) : src ? (
+          <iframe
+            title="腾讯地图选点"
+            src={src}
+            style={{ width: '100%', height: '100%', border: 0, display: 'block' }}
+          />
+        ) : null}
+      </div>
+    </div>
+  );
+}
diff --git a/apps/h5-partner/src/lib/tencentLocPicker.ts b/apps/h5-partner/src/lib/tencentLocPicker.ts
new file mode 100644
index 0000000..884fc7c
--- /dev/null
+++ b/apps/h5-partner/src/lib/tencentLocPicker.ts
@@ -0,0 +1,59 @@
+export type TencentPickedLocation = {
+  latitude: number;
+  longitude: number;
+  address?: string;
+  name?: string;
+  cityname?: string;
+};
+
+type LocPickerMessage = {
+  module?: string;
+  latlng?: { lat?: number; lng?: number };
+  poiaddress?: string;
+  poiname?: string;
+  cityname?: string;
+};
+
+const REFERER = 'dukang-haoke';
+
+export function buildTencentLocPickerUrl(
+  key: string,
+  options?: { latitude?: number; longitude?: number },
+): string {
+  const params = new URLSearchParams({
+    search: '1',
+    type: '1',
+    key,
+    referer: REFERER,
+    policy: '1',
+  });
+  const lat = options?.latitude;
+  const lng = options?.longitude;
+  if (
+    lat != null &&
+    lng != null &&
+    Number.isFinite(lat) &&
+    Number.isFinite(lng) &&
+    !(lat === 0 && lng === 0)
+  ) {
+    params.set('coord', `${lat},${lng}`);
+    params.set('coordtype', '5');
+  }
+  return `https://apis.map.qq.com/tools/locpicker?${params.toString()}`;
+}
+
+export function parseTencentLocPickerMessage(data: unknown): TencentPickedLocation | null {
+  const loc = data as LocPickerMessage;
+  if (!loc || loc.module !== 'locationPicker') return null;
+  const lat = Number(loc.latlng?.lat);
+  const lng = Number(loc.latlng?.lng);
+  if (!Number.isFinite(lat) || !Number.isFinite(lng)) return null;
+  if (!loc.poiname && !loc.poiaddress) return null;
+  return {
+    latitude: lat,
+    longitude: lng,
+    address: loc.poiaddress?.trim() || undefined,
+    name: loc.poiname?.trim() || undefined,
+    cityname: loc.cityname?.trim() || undefined,
+  };
+}
diff --git a/apps/h5-partner/src/pages/StoreCreatePage.tsx b/apps/h5-partner/src/pages/StoreCreatePage.tsx
index 6e626c7..b639ffd 100644
--- a/apps/h5-partner/src/pages/StoreCreatePage.tsx
+++ b/apps/h5-partner/src/pages/StoreCreatePage.tsx
@@ -19,6 +19,8 @@ import { fetchPartnerCities, type OpenCityOption } from '../lib/upload';
 
 import { usePartnerSession } from '../contexts/PartnerSessionContext';
 
+import TencentLocPickerOverlay from '../components/TencentLocPickerOverlay';
+
 import {
 
   clearAllStoreDrafts,
@@ -106,6 +108,8 @@ export default function StoreCreatePage() {
 
   const [locating, setLocating] = useState(false);
 
+  const [mapPickerOpen, setMapPickerOpen] = useState(false);
+
   const draftSaveDisabledRef = useRef(false);
 
   function reportFormError(message: string) {
@@ -777,10 +781,18 @@ export default function StoreCreatePage() {
                 >
                   {locating ? '定位中…' : '获取当前位置'}
                 </button>
+                <button
+                  type="button"
+                  className="partner-btn-outline"
+                  style={{ padding: '8px 12px', fontSize: 13 }}
+                  onClick={() => setMapPickerOpen(true)}
+                >
+                  地图选点
+                </button>
                 <span className="label-md text-muted">
                   {formatStoreCoords(form.latitude, form.longitude)
                     ? `坐标：${formatStoreCoords(form.latitude, form.longitude)}`
-                    : '未定位（提交后可按地址自动解析）'}
+                    : '未定位（可定位或地图选点）'}
                 </span>
               </div>
 
@@ -1278,6 +1290,23 @@ export default function StoreCreatePage() {
 
       </footer>
 
+      <TencentLocPickerOverlay
+        open={mapPickerOpen}
+        onClose={() => setMapPickerOpen(false)}
+        latitude={form.latitude ? Number(form.latitude) : undefined}
+        longitude={form.longitude ? Number(form.longitude) : undefined}
+        onPick={(loc) => {
+          patchForm({
+            latitude: String(loc.latitude),
+            longitude: String(loc.longitude),
+            ...(loc.address && !form.address.trim() ? { address: loc.address } : {}),
+          });
+          toastSuccess(
+            `已选点 ${loc.latitude.toFixed(6)}, ${loc.longitude.toFixed(6)}${loc.name ? `（${loc.name}）` : ''}`,
+          );
+        }}
+      />
+
     </div>
 
   );
diff --git a/apps/h5-partner/src/pages/StoreDetailPage.tsx b/apps/h5-partner/src/pages/StoreDetailPage.tsx
index 2a71622..5477446 100644
--- a/apps/h5-partner/src/pages/StoreDetailPage.tsx
+++ b/apps/h5-partner/src/pages/StoreDetailPage.tsx
@@ -8,6 +8,7 @@ import { canManagePartnerStore } from '../lib/partnerAccess';
 import { normalizeStringArray, patchEnvPhotoAt } from '../lib/storeDraft';
 import { formatStoreCoords, locateStorePosition } from '../lib/storeLocate';
 import OssUploadField from '../components/OssUploadField';
+import TencentLocPickerOverlay from '../components/TencentLocPickerOverlay';
 import {
   canPartnerOpenStore,
   storeAuditLabel,
@@ -54,6 +55,7 @@ export default function StoreDetailPage() {
   const [saving, setSaving] = useState(false);
   const [mediaSaving, setMediaSaving] = useState(false);
   const [locating, setLocating] = useState(false);
+  const [mapPickerOpen, setMapPickerOpen] = useState(false);
   const [actionError, setActionError] = useState('');
   const [closeConfirmOpen, setCloseConfirmOpen] = useState(false);
 
@@ -367,6 +369,14 @@ export default function StoreDetailPage() {
                 >
                   {locating ? '定位中…' : '获取当前位置'}
                 </button>
+                <button
+                  type="button"
+                  className="partner-btn-outline"
+                  style={{ padding: '8px 12px', fontSize: 13 }}
+                  onClick={() => setMapPickerOpen(true)}
+                >
+                  地图选点
+                </button>
                 <span className="label-md text-muted">
                   {formatStoreCoords(form.latitude, form.longitude)
                     ? `坐标：${formatStoreCoords(form.latitude, form.longitude)}`
@@ -480,6 +490,24 @@ export default function StoreDetailPage() {
           </div>
         </div>
       )}
+
+      <TencentLocPickerOverlay
+        open={mapPickerOpen}
+        onClose={() => setMapPickerOpen(false)}
+        latitude={form.latitude ? Number(form.latitude) : undefined}
+        longitude={form.longitude ? Number(form.longitude) : undefined}
+        onPick={(loc) => {
+          setForm((prev) => ({
+            ...prev,
+            latitude: String(loc.latitude),
+            longitude: String(loc.longitude),
+            ...(loc.address && !prev.address.trim() ? { address: loc.address } : {}),
+          }));
+          toastSuccess(
+            `已选点 ${loc.latitude.toFixed(6)}, ${loc.longitude.toFixed(6)}${loc.name ? `（${loc.name}）` : ''}`,
+          );
+        }}
+      />
     </div>
   );
 }
diff --git a/apps/mini-user/src/pages/store-detail/index.tsx b/apps/mini-user/src/pages/store-detail/index.tsx
index fa35b19..789b6a5 100644
--- a/apps/mini-user/src/pages/store-detail/index.tsx
+++ b/apps/mini-user/src/pages/store-detail/index.tsx
@@ -1,5 +1,5 @@
 import { useEffect, useMemo, useState } from 'react';
-import { View, Text } from '@tarojs/components';
+import { View, Text, Image } from '@tarojs/components';
 import Taro, { usePageScroll, useRouter, useShareAppMessage, useShareTimeline } from '@tarojs/taro';
 import PageShell from '../../components/PageShell';
 import PageNavBar from '../../components/PageNavBar';
@@ -13,6 +13,12 @@ import {
   toWeappShareMessage,
 } from '../../lib/wechat-share';
 
+type StoreMedia = {
+  url?: string | null;
+  bizType?: string | null;
+  mediaType?: string | null;
+};
+
 type Store = {
   id: string;
   name: string;
@@ -25,6 +31,7 @@ type Store = {
   intro?: string | null;
   coverUrl?: string | null;
   carouselUrls?: string[] | null;
+  media?: StoreMedia[] | null;
   openTime?: string | null;
   closeTime?: string | null;
   openTime2?: string | null;
@@ -35,6 +42,26 @@ type Store = {
   category?: { name: string } | null;
 };
 
+function uniqueUrls(urls: Array<string | null | undefined>) {
+  const seen = new Set<string>();
+  const out: string[] = [];
+  for (const raw of urls) {
+    const url = String(raw || '').trim();
+    if (!url || seen.has(url)) continue;
+    seen.add(url);
+    out.push(url);
+  }
+  return out;
+}
+
+function envPhotoUrls(store: Store) {
+  return uniqueUrls(
+    (store.media || [])
+      .filter((m) => !m.bizType || m.bizType === 'ENV')
+      .map((m) => m.url),
+  );
+}
+
 function fullAddress(store: Store) {
   const city = store.cityName || store.city || '';
   return `${store.province || ''}${city}${store.district || ''}${store.address || ''}`.trim();
@@ -66,12 +93,15 @@ export default function StoreDetailPage() {
   }, [storeId]);
 
   const sharePayload = useMemo(
-    () => ({
-      title: store?.name || DEFAULT_SHARE_TITLE,
-      desc: store?.intro?.trim() || store?.address || DEFAULT_SHARE_DESC,
-      path: `/pages/store-detail/index?id=${storeId}`,
-      imgUrl: store?.coverUrl || store?.carouselUrls?.[0] || undefined,
-    }),
+    () => {
+      const envFirst = store ? envPhotoUrls(store)[0] : undefined;
+      return {
+        title: store?.name || DEFAULT_SHARE_TITLE,
+        desc: store?.intro?.trim() || store?.address || DEFAULT_SHARE_DESC,
+        path: `/pages/store-detail/index?id=${storeId}`,
+        imgUrl: store?.coverUrl || envFirst || store?.carouselUrls?.[0] || undefined,
+      };
+    },
     [store, storeId],
   );
 
@@ -135,15 +165,23 @@ export default function StoreDetailPage() {
     );
   }
 
-  const images =
-    (store.carouselUrls && store.carouselUrls.length > 0
-      ? store.carouselUrls
-      : store.coverUrl
-        ? [store.coverUrl]
-        : []) as string[];
+  const envPhotos = envPhotoUrls(store);
+  const images = uniqueUrls([
+    store.coverUrl,
+    ...(store.carouselUrls || []),
+    ...envPhotos,
+  ]);
 
   const intro = store.intro?.trim() || '';
 
+  function previewEnv(index: number) {
+    if (!envPhotos.length) return;
+    Taro.previewImage({
+      current: envPhotos[index],
+      urls: envPhotos,
+    }).catch(() => toast('无法预览图片'));
+  }
+
   return (
     <PageShell variant="scroll" className="store-detail-page" hasFixedFooter>
       <WechatShareReady payload={sharePayload} />
@@ -210,6 +248,23 @@ export default function StoreDetailPage() {
         </View>
       ) : null}
 
+      {envPhotos.length > 0 ? (
+        <View className="store-detail-section">
+          <Text className="store-detail-section-title">店内环境</Text>
+          <View className="store-detail-env-grid">
+            {envPhotos.map((url, index) => (
+              <View
+                key={`${url}-${index}`}
+                className="store-detail-env-item"
+                onClick={() => previewEnv(index)}
+              >
+                <Image className="store-detail-env-img" src={url} mode="aspectFill" />
+              </View>
+            ))}
+          </View>
+        </View>
+      ) : null}
+
       <View className="store-detail-bar">
         <View
           className="u-btn u-btn--block"
diff --git a/apps/mini-user/src/styles/store-detail.css b/apps/mini-user/src/styles/store-detail.css
index ffeb2fa..1320dff 100644
--- a/apps/mini-user/src/styles/store-detail.css
+++ b/apps/mini-user/src/styles/store-detail.css
@@ -144,6 +144,27 @@
   color: var(--color-on-surface);
 }
 
+.store-detail-env-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 8px;
+}
+
+.store-detail-env-item {
+  position: relative;
+  width: 100%;
+  aspect-ratio: 1;
+  border-radius: var(--radius-md, 8px);
+  overflow: hidden;
+  background: var(--color-surface-container);
+}
+
+.store-detail-env-img {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
 .store-detail-bar {
   position: fixed;
   bottom: 0;
diff --git a/packages/shared-types/src/wechat.ts b/packages/shared-types/src/wechat.ts
index 3321cda..f305983 100644
--- a/packages/shared-types/src/wechat.ts
+++ b/packages/shared-types/src/wechat.ts
@@ -31,6 +31,8 @@ export type ClientRuntimeConfig = {
   mockWechat?: boolean;
   /** false 时三端跳过微信 SDK OAuth 授权（由 MOCK_WECHAT 或真实凭证推导） */
   wxAuthorize?: boolean;
+  /** 腾讯位置服务 Key（地图选点组件，可按域名限制） */
+  tencentLbsKey?: string;
   /** 小程序首页轮播 / 底部图 */
   miniHome?: {
     banners: string[];
diff --git a/server/dukang-api/.env.example b/server/dukang-api/.env.example
index d9b620c..80a1a3d 100644
--- a/server/dukang-api/.env.example
+++ b/server/dukang-api/.env.example
@@ -59,7 +59,8 @@ WX_PAY_NOTIFY_URL=https://api.dukanghaoke.com/api/v1/callbacks/wechat/pay
 # 企业微信智能机器人总开关（Bot 实例在 HQ「企微机器人」模块创建）
 WECOM_AIBOT_ENABLED=false
 
-# 腾讯位置服务（逆地理编码，微信定位展示城市）
+# 腾讯位置服务（地理编码 / 逆地理 / 地图选点组件）
+# 地图选点需在控制台为 Key 配置域名白名单，并允许组件域名 apis.map.qq.com
 TENCENT_LBS_KEY=
 
 # 阿里云 OSS（ali-oss@6.x；凭证齐全时直传，缺失则服务端报错）
diff --git a/server/dukang-api/src/common/system-config/system-config.registry.ts b/server/dukang-api/src/common/system-config/system-config.registry.ts
index 61f7135..1907dec 100644
--- a/server/dukang-api/src/common/system-config/system-config.registry.ts
+++ b/server/dukang-api/src/common/system-config/system-config.registry.ts
@@ -107,7 +107,7 @@ export const SYSTEM_CONFIG_FIELDS: SystemConfigFieldMeta[] = [
   { key: 'OSS_MAX_UPLOAD_BYTES', label: '单文件上限(字节)', group: G.oss, type: 'number', requiresRestart: false },
 
   { key: 'USER_H5_URL', label: 'C 端 H5 落地页', group: G.app, type: 'string', requiresRestart: false },
-  { key: 'TENCENT_LBS_KEY', label: '腾讯位置服务 Key', group: G.app, type: 'password', secret: true, requiresRestart: false },
+  { key: 'TENCENT_LBS_KEY', label: '腾讯位置服务 Key（地理编码 / 地图选点）', group: G.app, type: 'password', secret: true, requiresRestart: false },
 
   { key: 'DEPLOY_WEBHOOK_URL', label: '发布 Webhook URL', group: G.deploy, type: 'string', requiresRestart: false },
   { key: 'DEPLOY_WEBHOOK_SECRET', label: '发布 Webhook Secret', group: G.deploy, type: 'password', secret: true, requiresRestart: false },
diff --git a/server/dukang-api/src/modules/common/client-config.controller.ts b/server/dukang-api/src/modules/common/client-config.controller.ts
index 0e76896..9db1104 100644
--- a/server/dukang-api/src/modules/common/client-config.controller.ts
+++ b/server/dukang-api/src/modules/common/client-config.controller.ts
@@ -17,6 +17,8 @@ export class ClientConfigController {
       mockSms: cfg.mockSms,
       mockWechat: cfg.mockWechat,
       wxAuthorize: cfg.wxAuthorize,
+      /** 浏览器地图选点用；建议在腾讯控制台按域名限制 Key */
+      tencentLbsKey: cfg.tencentLbsKey || undefined,
       miniHome: {
         banners: parseMiniHomeBanners(env.MINI_HOME_BANNERS),
         footerUrl: footer || null,