chore: initialize frontend miniapp repository

This commit is contained in:
lyf
2026-06-09 21:08:45 +08:00
commit a90f63cef0
107 changed files with 60454 additions and 0 deletions

87
docs/TENCENT_MAP_GUIDE.md Normal file
View File

@@ -0,0 +1,87 @@
# 腾讯地图集成说明
## 配置步骤
### 1. 获取腾讯地图 Key
1. 访问 [腾讯位置服务](https://lbs.qq.com/)
2. 注册并登录账号
3. 进入控制台 -> 应用管理 -> 我的应用
4. 创建应用并添加 Key
5. 选择产品类型:
- **H5**: WebServiceAPI
- **微信小程序**: 微信小程序
- **App**: 移动应用
### 2. 配置 Key
`src/manifest.json` 中配置:
```json
{
"h5": {
"sdkConfigs": {
"maps": {
"qqmap": {
"key": "YOUR_TENCENT_MAP_KEY"
}
}
}
},
"mp-weixin": {
"permission": {
"scope.userLocation": {
"desc": "您的位置信息将用于地图导航"
}
}
}
}
```
### 3. 微信小程序额外配置
在微信小程序后台配置:
1. 设置 -> 开发设置 -> 服务器域名
2. 添加 request 合法域名:`https://apis.map.qq.com`
## 使用说明
uni-app 已内置地图组件,无需额外安装插件。直接使用 `<map>` 组件即可。
### 基本用法
```vue
<template>
<map
:latitude="latitude"
:longitude="longitude"
:markers="markers"
@markertap="handleMarkerTap"
/>
</template>
```
## 功能特性
- ✅ 地图显示(腾讯地图)
- ✅ 标记点(展厅、展品、设施、当前位置)
- ✅ 点击标记点跳转详情
- ✅ 楼层切换
- ✅ 定位功能
- ✅ 地图缩放
- ✅ 地图拖拽
## 图标资源清单
需要准备以下图标(建议 PNG 格式,透明背景):
- `/static/icons/marker-location.png` - 当前位置30x30px
- `/static/icons/marker-hall.png` - 展厅25x25px
- `/static/icons/marker-exhibit.png` - 展品25x25px
- `/static/icons/marker-facility.png` - 设施25x25px
- `/static/icons/location.png` - 定位按钮图标24x24px
## 参考文档
- [腾讯位置服务官网](https://lbs.qq.com/)
- [uni-app 地图组件文档](https://uniapp.dcloud.net.cn/component/map.html)