478 lines
22 KiB
Text
478 lines
22 KiB
Text
|
<!--地图页面 - 高德地图集成版本-->
|
|||
|
|
<view class="map-container" style="height: {{windowHeight}}px;">
|
|||
|
|
|
|||
|
|
<!-- 地图组件 - 腾讯地图实现 -->
|
|||
|
|
<map
|
|||
|
|
wx:if="{{latitude && longitude && amapReady}}"
|
|||
|
|
id="main-map"
|
|||
|
|
class="map"
|
|||
|
|
latitude="{{latitude}}"
|
|||
|
|
longitude="{{longitude}}"
|
|||
|
|
scale="{{scale}}"
|
|||
|
|
markers="{{markers}}"
|
|||
|
|
show-location="false"
|
|||
|
|
show-scale="false"
|
|||
|
|
show-compass="false"
|
|||
|
|
enable-zoom="true"
|
|||
|
|
enable-scroll="true"
|
|||
|
|
enable-rotate="false"
|
|||
|
|
enable-3D="false"
|
|||
|
|
enable-overlooking="false"
|
|||
|
|
enable-traffic="false"
|
|||
|
|
enable-satellite="{{enableSatellite}}"
|
|||
|
|
enable-cluster="true"
|
|||
|
|
bindmarkertap="onMarkerTap"
|
|||
|
|
bindcallouttap="onMarkerTap"
|
|||
|
|
bindregionchange="onMapRegionChange"
|
|||
|
|
bindlongtap="onMapLongTap"
|
|||
|
|
bindtap="onMapTap"
|
|||
|
|
bindpoitap="onPoiTap"
|
|||
|
|
circles="{{circles}}"
|
|||
|
|
>
|
|||
|
|
<cover-view slot="callout">
|
|||
|
|
<block wx:for="{{markers}}" wx:key="*this">
|
|||
|
|
<cover-view class="customCallout" marker-id="{{item.id}}">
|
|||
|
|
<!-- 用户标注（好友/自己） -->
|
|||
|
|
<block wx:if="{{item.type == 'friend' || item.type == 'mine'}}">
|
|||
|
|
<cover-view class="callout-nickname">{{item.nickName}}</cover-view>
|
|||
|
|
<cover-image class="callout-avatar" src="{{item.avatarUrl}}"></cover-image>
|
|||
|
|
<cover-view class="callout-battery">{{item.battery}}%</cover-view>
|
|||
|
|
</block>
|
|||
|
|
<!-- 商家标注 -->
|
|||
|
|
<block wx:elif="{{item.type == 'merchant'}}">
|
|||
|
|
<cover-view class="callout-nickname">{{item.nickName}}</cover-view>
|
|||
|
|
<cover-image class="callout-merchant-icon" src="/images/map/marker_{{item.merchantType}}.png"></cover-image>
|
|||
|
|
</block>
|
|||
|
|
</cover-view>
|
|||
|
|
</block>
|
|||
|
|
</cover-view>
|
|||
|
|
</map>
|
|||
|
|
|
|||
|
|
<!-- 定位中占位图 -->
|
|||
|
|
<view wx:elif="{{!amapReady || (!latitude && !longitude)}}" class="location-placeholder">
|
|||
|
|
<view class="placeholder-content">
|
|||
|
|
<view class="location-icon">📍</view>
|
|||
|
|
<text class="placeholder-title">正在获取您的位置</text>
|
|||
|
|
<text class="placeholder-subtitle">首次定位可能需要几秒钟...</text>
|
|||
|
|
<view class="location-progress">
|
|||
|
|
<view class="progress-bar">
|
|||
|
|
<view class="progress-fill"></view>
|
|||
|
|
</view>
|
|||
|
|
<text class="progress-text">{{loadingText}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 左上角区域信息 - 完全透明 -->
|
|||
|
|
<view class="location-info-minimal" wx:if="{{latitude && longitude && amapReady}}"
|
|||
|
|
style="top: {{statusBarHeight + 12}}px; left: 16px;">
|
|||
|
|
<text class="district-text-minimal">{{currentDistrict || '定位中...'}}</text>
|
|||
|
|
<text class="city-text-minimal" wx:if="{{currentCity}}">{{currentCity}}</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 天气信息 - 紧贴用户头像下方 -->
|
|||
|
|
<view class="weather-info-minimal" wx:if="{{latitude && longitude && amapReady && weatherInfo}}"
|
|||
|
|
style="top: {{statusBarHeight + 60}}px; right: 16px;">
|
|||
|
|
<text class="weather-icon-minimal {{weatherInfo.isCloudIcon ? 'cloud-icon' : ''}}">{{weatherInfo.icon || '☀️'}}</text>
|
|||
|
|
<text class="weather-temp-minimal">{{weatherInfo.temperature}}°</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 用户头像 - 避开胶囊按钮，点击进入个人页面 -->
|
|||
|
|
<view class="user-avatar" wx:if="{{latitude && longitude && amapReady}}"
|
|||
|
|
style="top: {{statusBarHeight + 16}}px; right: {{16}}px;"
|
|||
|
|
bindtap="openProfile">
|
|||
|
|
<view class="avatar-container">
|
|||
|
|
<text class="avatar-text">{{userInfo.nickname ? userInfo.nickname.charAt(0) : 'U'}}</text>
|
|||
|
|
<view class="online-dot"></view>
|
|||
|
|
<!-- 添加未读消息和好友请求的小红点 -->
|
|||
|
|
<view class="notification-dot" wx:if="{{unreadMessageCount > 0 || friendRequestCount > 0}}"></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 右侧功能按钮组 -->
|
|||
|
|
<view class="right-controls" wx:if="{{latitude && longitude && amapReady}}"
|
|||
|
|
style="top: calc({{statusBarHeight + navBarHeight + 20}}px); right: 16px;">
|
|||
|
|
|
|||
|
|
<!-- 刷新按钮 -->
|
|||
|
|
<view class="control-btn refresh-btn" bindtap="onRefresh">
|
|||
|
|
<view class="btn-icon refresh-icon">🔄</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 图层切换按钮 -->
|
|||
|
|
<view class="control-btn layer-btn" bindtap="toggleMapLayer">
|
|||
|
|
<view class="btn-icon layer-icon">
|
|||
|
|
<text wx:if="{{currentMapType === 'satellite'}}">🛰️</text>
|
|||
|
|
<text wx:else>🗺️</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 附近的人按钮 -->
|
|||
|
|
<view class="control-btn nearby-btn" bindtap="showNearbyPeople">
|
|||
|
|
<view class="btn-icon nearby-icon">👀</view>
|
|||
|
|
<view class="nearby-count" wx:if="{{nearbyCount > 0}}">{{nearbyCount}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 底部中间定位按钮 - 回到当前位置 -->
|
|||
|
|
<view class="location-btn" wx:if="{{latitude && longitude && amapReady}}"
|
|||
|
|
style="bottom: {{safeAreaBottom + 120}}px;"
|
|||
|
|
bindtap="centerToUserLocation">
|
|||
|
|
<view class="location-btn-inner">
|
|||
|
|
<view class="location-icon">📍</view>
|
|||
|
|
<view class="location-ripple"></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 用户详情卡片 - 修复数据绑定 -->
|
|||
|
|
<view class="user-card {{selectedUser ? 'show' : ''}}" wx:if="{{selectedUser}}"
|
|||
|
|
style="bottom: {{safeAreaBottom + 40}}px;">
|
|||
|
|
<view class="card-backdrop"></view>
|
|||
|
|
<view class="card-content">
|
|||
|
|
<view class="card-header">
|
|||
|
|
<view class="card-avatar">
|
|||
|
|
<text class="card-avatar-text">{{selectedUser.nickname ? selectedUser.nickname.charAt(0) : 'U'}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-info">
|
|||
|
|
<text class="card-name">{{selectedUser.nickname || '用户'}}</text>
|
|||
|
|
<text class="card-distance" wx:if="{{selectedUser.distance}}">距离 {{selectedUser.distance}}米</text>
|
|||
|
|
<text class="card-distance" wx:else>位置信息</text>
|
|||
|
|
<view class="card-status">
|
|||
|
|
<view class="status-dot online"></view>
|
|||
|
|
<text class="status-text">在线</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-close" bindtap="closeUserCard">
|
|||
|
|
<text class="close-icon">✕</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="card-actions">
|
|||
|
|
<view class="action-btn chat-btn" bindtap="startChat" data-userid="{{selectedUser.userId}}">
|
|||
|
|
<view class="action-icon">💬</view>
|
|||
|
|
<text class="action-text">聊天</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="action-btn add-btn" bindtap="addFriend" data-userid="{{selectedUser.userId}}" wx:if="{{!selectedUser.isFriend}}">
|
|||
|
|
<view class="action-icon">➕</view>
|
|||
|
|
<text class="action-text">加好友</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="action-btn profile-btn" bindtap="viewProfile" data-userid="{{selectedUser.userId}}">
|
|||
|
|
<view class="action-icon">👤</view>
|
|||
|
|
<text class="action-text">资料</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 加载提示 - 优化设计 -->
|
|||
|
|
<view class="loading-overlay" wx:if="{{!amapReady || (!latitude && !longitude)}}">
|
|||
|
|
<view class="loading-content">
|
|||
|
|
<view class="loading-spinner">
|
|||
|
|
<view class="spinner-ring"></view>
|
|||
|
|
<view class="spinner-ring"></view>
|
|||
|
|
<view class="spinner-ring"></view>
|
|||
|
|
</view>
|
|||
|
|
<text class="loading-text">{{loadingText}}</text>
|
|||
|
|
<text class="loading-subtitle">正在连接位置服务...</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 🔥 底部浮动按钮组 - 好友和消息 -->
|
|||
|
|
<view class="floating-buttons" style="bottom: {{safeAreaBottom + 40}}px;">
|
|||
|
|
<!-- 好友按钮 -->
|
|||
|
|
<view class="floating-btn friends-btn" bindtap="openFriends">
|
|||
|
|
<view class="btn-icon">
|
|||
|
|
<text class="icon-emoji">👥</text>
|
|||
|
|
<view class="icon-glow"></view>
|
|||
|
|
</view>
|
|||
|
|
<text class="btn-label">好友</text>
|
|||
|
|
<view class="notification-badge" wx:if="{{friendRequestCount > 0}}">
|
|||
|
|
<text class="badge-text">{{friendRequestCount > 99 ? '99+' : friendRequestCount}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 消息按钮 -->
|
|||
|
|
<view class="floating-btn messages-btn" bindtap="openMessages">
|
|||
|
|
<view class="btn-icon">
|
|||
|
|
<text class="icon-emoji">💬</text>
|
|||
|
|
<view class="icon-glow"></view>
|
|||
|
|
</view>
|
|||
|
|
<text class="btn-label">消息</text>
|
|||
|
|
<view class="notification-badge" wx:if="{{unreadMessageCount > 0}}">
|
|||
|
|
<text class="badge-text">{{unreadMessageCount > 99 ? '99+' : unreadMessageCount}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 地点标记 -->
|
|||
|
|
<view class="floating-btn messages-btn" bindtap="onOpenLocationMarkModal">
|
|||
|
|
<view class="btn-icon">
|
|||
|
|
<text class="icon-emoji">🏠</text>
|
|||
|
|
<view class="icon-glow"></view>
|
|||
|
|
</view>
|
|||
|
|
<text class="btn-label">地点</text>
|
|||
|
|
<view class="notification-badge" wx:if="{{unreadMessageCount > 0}}">
|
|||
|
|
<text class="badge-text">{{unreadMessageCount > 99 ? '99+' : unreadMessageCount}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- POI详情卡片（最上层） -->
|
|||
|
|
<view class="user-card {{poiDetail ? 'show' : ''}}" wx:if="{{poiDetail}}" style="bottom: {{safeAreaBottom + 60}}px; z-index:9999;">
|
|||
|
|
<view class="card-backdrop"></view>
|
|||
|
|
<view class="card-content">
|
|||
|
|
<view class="card-header">
|
|||
|
|
<view class="card-avatar">
|
|||
|
|
<text class="card-avatar-text">POI</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-info">
|
|||
|
|
<text class="card-name">{{poiDetail.name || 'POI'}}</text>
|
|||
|
|
<text class="card-distance">{{poiDetail.address || '详细地址未知'}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-close" bindtap="closePoiCard">
|
|||
|
|
<text class="close-icon">✕</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-actions">
|
|||
|
|
<view class="action-btn" bindtap="onPoiFavorite">
|
|||
|
|
<view class="action-icon">⭐</view>
|
|||
|
|
<text class="action-text">收藏</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="action-btn" bindtap="onPoiNavigate">
|
|||
|
|
<view class="action-icon">🧭</view>
|
|||
|
|
<text class="action-text">导航</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="action-btn" bindtap="onPoiRemind">
|
|||
|
|
<view class="action-icon">⏰</view>
|
|||
|
|
<text class="action-text">提醒</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- POI提醒操作弹窗 -->
|
|||
|
|
<view class="user-card show" wx:if="{{showPoiRemindModal}}" style="bottom: {{safeAreaBottom + 60}}px; z-index:10000;">
|
|||
|
|
<view class="card-backdrop"></view>
|
|||
|
|
<view class="card-content">
|
|||
|
|
<view class="remind-title-block">
|
|||
|
|
<text class="remind-title">地点设置</text>
|
|||
|
|
<text class="remind-subtitle">到达或离开该地点时提醒你和好友</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-header">
|
|||
|
|
<view class="card-avatar">
|
|||
|
|
<text class="card-avatar-text">POI</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-info">
|
|||
|
|
<!-- 名称可编辑 -->
|
|||
|
|
<view class="card-name-editable">
|
|||
|
|
<input class="card-name-input" value="{{lastPoiForRemind.name}}" placeholder="请输入地点名称" bindinput="onPoiRemindNameInput" />
|
|||
|
|
<view class="card-name-tip">可点击编辑名称</view>
|
|||
|
|
</view>
|
|||
|
|
<text class="card-distance">{{lastPoiForRemind.address || '详细地址未知'}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-actions-right">
|
|||
|
|
<button class="remind-save-btn" size="mini" type="primary" bindtap="onSavePoiRemind">保存</button>
|
|||
|
|
<view class="card-close" bindtap="closePoiRemindModal">
|
|||
|
|
<text class="close-icon">✕</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 好友选择与提醒模式 -->
|
|||
|
|
<view class="remind-friends-mode-row">
|
|||
|
|
<view class="remind-friends-block">
|
|||
|
|
<button class="friend-select-btn" size="mini" type="primary" bindtap="onOpenFriendSelectModal">选择好友</button>
|
|||
|
|
<view class="remind-friends-avatars">
|
|||
|
|
<block wx:for="{{[0,1,2,3,4]}}" wx:key="index">
|
|||
|
|
<view class="friend-avatar-mini">
|
|||
|
|
<image wx:if="{{poiRemindSelectedFriends[index] && poiRemindSelectedFriends[index].avatarUrl}}" src="{{poiRemindSelectedFriends[index].avatarUrl}}" class="avatar-img-mini" />
|
|||
|
|
<text wx:elif="{{poiRemindSelectedFriends[index]}}" class="avatar-txt-mini">{{poiRemindSelectedFriends[index].nickname ? poiRemindSelectedFriends[index].nickname.charAt(0) : 'U'}}</text>
|
|||
|
|
<text wx:else class="avatar-txt-mini avatar-placeholder">+</text>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="remind-mode-block">
|
|||
|
|
<checkbox-group class="remind-mode-checkbox" bindchange="onPoiRemindModeChange" value="{{poiRemindMode}}">
|
|||
|
|
<label class="remind-mode-label">
|
|||
|
|
<checkbox value="arrive" name="arrive" />到达
|
|||
|
|
</label>
|
|||
|
|
<label class="remind-mode-label">
|
|||
|
|
<checkbox value="leave" name="leave" />离开
|
|||
|
|
</label>
|
|||
|
|
</checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="remind-slider-block" style="flex-direction: column; align-items: stretch; gap: 8px;">
|
|||
|
|
<view style="display: flex; align-items: center; justify-content: space-between;">
|
|||
|
|
<text class="remind-label">提醒范围</text>
|
|||
|
|
<text class="remind-value highlight">{{poiRemindRadius}} 米</text>
|
|||
|
|
</view>
|
|||
|
|
<slider min="100" max="1000" step="10" value="{{poiRemindRadius}}" show-value="false" bindchange="onPoiRemindRadiusChange" />
|
|||
|
|
</view>
|
|||
|
|
<view class="remind-desc">拖动滑块，地图上圆圈范围会实时变化</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 好友选择弹窗 -->
|
|||
|
|
<view class="friend-select-modal" wx:if="{{showFriendSelectModal}}">
|
|||
|
|
<view class="friend-select-content">
|
|||
|
|
<view class="friend-select-header">
|
|||
|
|
<view class="friend-select-title">选择好友（最多3个）</view>
|
|||
|
|
<view class="friend-select-close" bindtap="onCloseFriendSelect">✕</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 已选好友横向展示 -->
|
|||
|
|
<view class="friend-selected-row">
|
|||
|
|
<block wx:for="{{[0,1,2]}}" wx:key="index">
|
|||
|
|
<view class="friend-selected-avatar" wx:if="{{poiRemindSelectedFriends[index]}}" bindtap="onRemoveSelectedFriend" data-userid="{{poiRemindSelectedFriends[index].userId}}">
|
|||
|
|
<image wx:if="{{poiRemindSelectedFriends[index].avatarUrl}}" src="{{poiRemindSelectedFriends[index].avatarUrl}}" class="avatar-img-mini" />
|
|||
|
|
<text wx:else class="avatar-txt-mini">{{poiRemindSelectedFriends[index].nickname ? poiRemindSelectedFriends[index].nickname.charAt(0) : 'U'}}</text>
|
|||
|
|
<view class="friend-selected-remove">✕</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="friend-selected-avatar friend-selected-placeholder" wx:else>+</view>
|
|||
|
|
</block>
|
|||
|
|
</view>
|
|||
|
|
<!-- 搜索框 -->
|
|||
|
|
<input class="friend-search-input" placeholder="搜索昵称" value="{{friendSearchText}}" bindinput="onFriendSearchInput" />
|
|||
|
|
<scroll-view scroll-y="true" class="friend-list-scroll">
|
|||
|
|
<block wx:for="{{filteredFriendsList}}" wx:for-item="item" wx:key="userId">
|
|||
|
|
<view class="friend-item {{item.selected ? 'selected' : ''}} {{poiRemindSelectedFriends.length>=3 && !item.selected ? 'disabled' : ''}}" bindtap="onToggleFriendSelect" data-userid="{{item.userId}}">
|
|||
|
|
<image wx:if="{{item.avatarUrl}}" src="{{item.avatarUrl}}" class="friend-avatar" />
|
|||
|
|
<view wx:else class="friend-avatar friend-avatar-txt">{{item.nickname ? item.nickname.charAt(0) : 'U'}}</view>
|
|||
|
|
<text class="friend-nickname">{{item.nickname}}</text>
|
|||
|
|
<view class="friend-check" wx:if="{{item.selected}}">✔</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
</scroll-view>
|
|||
|
|
<button class="friend-select-done" type="primary" size="mini" bindtap="onFriendSelectDone" disabled="{{poiRemindSelectedFriends.length===0}}">完成</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 地点标记弹窗（底部卡片） -->
|
|||
|
|
<view class="location-mark-modal" wx:if="{{showLocationMarkModal}}">
|
|||
|
|
<!-- 遮罩层，点击关闭 -->
|
|||
|
|
<view class="location-mark-mask" bindtap="onCloseLocationMarkModal"></view>
|
|||
|
|
<!-- 底部弹出卡片 -->
|
|||
|
|
<view class="location-mark-sheet location-mark-sheet-animate">
|
|||
|
|
<!-- 顶部手柄和关闭按钮 -->
|
|||
|
|
<view class="location-mark-sheet-handle-row">
|
|||
|
|
<view class="location-mark-sheet-handle"></view>
|
|||
|
|
<view class="location-mark-sheet-close" bindtap="onCloseLocationMarkModal">✕</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 标题 -->
|
|||
|
|
<view class="location-mark-sheet-title">地点标记</view>
|
|||
|
|
<!-- 搜索框 -->
|
|||
|
|
<view class="location-mark-search-row">
|
|||
|
|
<text class="iconfont search-icon">🔍</text>
|
|||
|
|
<input class="location-mark-search" placeholder="搜索收藏地址" value="{{locationMarkSearchText}}" bindinput="onLocationMarkSearchInput" />
|
|||
|
|
<text wx:if="{{locationMarkSearchText}}" class="iconfont clear-icon" bindtap="onClearLocationMarkSearch">✕</text>
|
|||
|
|
</view>
|
|||
|
|
<!-- 地址列表 -->
|
|||
|
|
<scroll-view scroll-y class="location-mark-list-sheet">
|
|||
|
|
<block wx:for="{{filteredLocationMarkList}}" wx:for-item="item" wx:key="id">
|
|||
|
|
<view class="location-mark-item-card" bindtap="onLocationMarkItemTap" data-item="{{item}}">
|
|||
|
|
<view class="location-mark-item-main-opt">
|
|||
|
|
<!-- 左侧主信息 -->
|
|||
|
|
<view class="location-mark-item-info-opt">
|
|||
|
|
<view class="location-mark-name-opt">{{item.name}}</view>
|
|||
|
|
<view class="location-mark-coord-opt">{{item.lat}}, {{item.lng}}</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 右上操作按钮 -->
|
|||
|
|
<view class="location-mark-actions-opt">
|
|||
|
|
<!-- 左侧主信息
|
|||
|
|
<button class="location-mark-edit-btn-opt" size="mini" bindtap="onEditLocationMarkName" data-id="{{item.id}}">
|
|||
|
|
<text class="iconfont">✏️</text> 修改
|
|||
|
|
</button>
|
|||
|
|
-->
|
|||
|
|
<button class="location-mark-del-btn-opt" size="mini" bindtap="onDeleteLocationMark" data-id="{{item.id}}" catchtap="onDeleteLocationMark">
|
|||
|
|
<text class="iconfont">🗑️</text> 删除
|
|||
|
|
</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 下方提醒好友和类型 -->
|
|||
|
|
<view class="location-mark-meta-opt">
|
|||
|
|
<view class="location-mark-friends-opt">
|
|||
|
|
<block wx:for="{{item.remindFriends}}" wx:for-item="f" wx:key="userId">
|
|||
|
|
<view class="location-mark-friend-avatar-opt">
|
|||
|
|
<image wx:if="{{f.avatarUrl}}" src="{{f.avatarUrl}}" />
|
|||
|
|
<text wx:else>{{f.nickname ? f.nickname.charAt(0) : 'U'}}</text>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
<view class="location-mark-friend-btn-opt" bindtap="onSetRemindFriends" data-id="{{item.id}}" catchtap="onSetRemindFriends">+</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="location-mark-type-tag-opt {{item.remindType}}" bindtap="onToggleRemindType" data-id="{{item.id}}" catchtap="onToggleRemindType">
|
|||
|
|
{{item.remindType == 'arrive' ? '到达' : '离开'}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
<view wx:if="{{filteredLocationMarkList.length === 0}}" class="location-mark-empty">
|
|||
|
|
<text class="iconfont empty-icon">📍</text>
|
|||
|
|
<text>暂无收藏地址</text>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
<!-- 加号浮动按钮 -->
|
|||
|
|
<view class="location-mark-fab" bindtap="onAddLocationPlace">
|
|||
|
|
<text class="location-mark-fab-icon">+</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- POI周边列表弹窗 -->
|
|||
|
|
<view class="poi-around-modal" wx:if="{{showPoiAroundModal}}">
|
|||
|
|
<view class="poi-around-mask" bindtap="onClosePoiAroundModal"></view>
|
|||
|
|
<view class="poi-around-sheet">
|
|||
|
|
<!-- 右上角关闭按钮 -->
|
|||
|
|
<view class="poi-around-close-x" bindtap="onClosePoiAroundModal">✕</view>
|
|||
|
|
<view class="poi-around-title">附近地点</view>
|
|||
|
|
<scroll-view scroll-y class="poi-around-list">
|
|||
|
|
<block wx:for="{{poiAroundList}}" wx:for-item="item" wx:key="id">
|
|||
|
|
<view class="poi-around-item" bindtap="onPoiAroundItemTap" data-item="{{item}}">
|
|||
|
|
<view class="poi-around-name">{{item.name}}</view>
|
|||
|
|
<view class="poi-around-address">{{item.address}}</view>
|
|||
|
|
<view class="poi-around-distance">{{item.distanceStr}}</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
<view wx:if="{{poiAroundList.length === 0}}" class="poi-around-empty">暂无数据</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
<view class="poi-around-close-btn" bindtap="onClosePoiAroundModal">关闭</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 商家信息弹窗 -->
|
|||
|
|
<view wx:if="{{merchantInfoModalVisible}}" class="merchant-info-modal">
|
|||
|
|
<view class="merchant-info-card">
|
|||
|
|
<button class="close-btn-abs" bindtap="closeMerchantInfo" aria-label="关闭">
|
|||
|
|
<text class="close-icon">×</text>
|
|||
|
|
</button>
|
|||
|
|
<view class="merchant-info-header">
|
|||
|
|
<text class="merchant-name">{{selectedMerchant.name}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="merchant-info-row">
|
|||
|
|
<text class="merchant-address">{{selectedMerchant.address}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="merchant-info-row merchant-info-meta">
|
|||
|
|
<text>距离：{{formatDistance(selectedMerchant.distance)}}</text>
|
|||
|
|
<text>经纬度：{{selectedMerchant.latitude}}, {{selectedMerchant.longitude}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="merchant-packages">
|
|||
|
|
<block wx:for="{{selectedMerchant.packages}}" wx:key="title">
|
|||
|
|
<view class="package-card">
|
|||
|
|
<view class="package-card-header">
|
|||
|
|
<text class="package-title">{{item.title}}</text>
|
|||
|
|
<text class="package-price">{{item.price}}</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="package-desc">{{item.desc}}</text>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
</view>
|
|||
|
|
<view class="merchant-actions">
|
|||
|
|
<button class="action-btn action-fav" bindtap="onFavoriteMerchant">
|
|||
|
|
<text wx:if="{{selectedMerchant.isFavorited}}">★ 已收藏</text>
|
|||
|
|
<text wx:else>☆ 收藏</text>
|
|||
|
|
</button>
|
|||
|
|
<button class="action-btn action-nav" bindtap="onNavigateMerchant">去这里</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 🔧 开发调试按钮 - WebSocket测试 -->
|
|||
|
|
<view class="debug-button" style="top: {{statusBarHeight + 60}}px; right: 16px;" bindtap="openWebSocketTest">
|
|||
|
|
<text class="debug-icon">🔧</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|