From 2c86a8bd60deed0dd0e044bad6fb83f75d19a332 Mon Sep 17 00:00:00 2001
From: wlzboy <66905212@qq.com>
Date: 星期日, 26 十月 2025 15:05:50 +0800
Subject: [PATCH] Merge branch 'feature-task'
---
app/components/map-selector.vue | 743 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 743 insertions(+), 0 deletions(-)
diff --git a/app/components/map-selector.vue b/app/components/map-selector.vue
new file mode 100644
index 0000000..7203b61
--- /dev/null
+++ b/app/components/map-selector.vue
@@ -0,0 +1,743 @@
+<template>
+ <view class="map-selector-container">
+ <view class="search-bar">
+ <input
+ class="search-input"
+ placeholder="璇疯緭鍏ュ湴鍧�"
+ v-model="searchKeyword"
+ @focus="onSearchFocus"
+ />
+ <button class="search-btn" @click="searchAddress">鎼滅储</button>
+ <button class="location-btn" @click="getCurrentLocation" :disabled="isGettingLocation">
+ <uni-icons v-if="!isGettingLocation" type="location" size="18" color="white"></uni-icons>
+ <uni-icons v-else type="spinner-cycle" size="18" color="white"></uni-icons>
+ </button>
+ </view>
+
+ <!-- 閫変腑鍦板潃鐣岄潰 - 鏄剧ず鍦ㄥ垪琛ㄤ笂鏂� -->
+ <view class="selected-address" v-if="selectedAddress">
+ <view class="selected-header">
+ <uni-icons type="checkmarkempty" size="20" color="#007AFF"></uni-icons>
+ <text class="address-title">宸查�変腑鍦板潃</text>
+ <view class="cancel-btn" @click="cancelSelection">
+ <uni-icons type="closeempty" size="16" color="#999"></uni-icons>
+ </view>
+ </view>
+ <view class="address-info">
+ <view class="address-name">{{ selectedAddress.title }}</view>
+ <view class="address-detail">{{ selectedAddress.address }}</view>
+ </view>
+ <button class="confirm-btn" @click="confirmAddress">
+ <uni-icons type="checkmarkempty" size="18" color="white"></uni-icons>
+ <text>纭閫夋嫨姝ゅ湴鍧�</text>
+ </button>
+ </view>
+
+ <!-- 鍦板潃鎼滅储缁撴灉鍒楄〃 -->
+ <view class="address-list" v-if="showSearchResults && searchResults.length > 0">
+ <view
+ class="address-item"
+ v-for="(item, index) in searchResults"
+ :key="index"
+ @click="selectAddress(item)"
+ >
+ <!-- 纭繚浣跨敤鎻掑�艰娉� -->
+ <view class="address-title">{{ item.title }}</view>
+ <view class="address-detail">{{ item.address }}</view>
+ </view>
+ </view>
+
+ <!-- 鎼滅储鏃犵粨鏋滄彁绀� -->
+ <view class="no-results" v-if="showSearchResults && searchResults.length === 0 && searchCompleted">
+ <text>鏈壘鍒扮浉鍏冲湴鍧�</text>
+ </view>
+
+ <!-- UniApp鍘熺敓鍦板浘缁勪欢锛屾敮鎸佸骞冲彴 -->
+ <view class="map-container" id="mapContainer">
+ <!-- 鎵�鏈夊钩鍙扮粺涓�浣跨敤uniapp鍘熺敓map缁勪欢 -->
+ <map
+ id="map"
+ :longitude="longitude"
+ :latitude="latitude"
+ :markers="markers"
+ :polyline="polyline"
+ :circles="circles"
+ :controls="controls"
+ :include-points="includePoints"
+ :show-location="true"
+ :enable-3D="false"
+ :show-compass="false"
+ :enable-overlooking="false"
+ :enable-zoom="true"
+ :enable-scroll="true"
+ :enable-rotate="false"
+ :enable-satellite="false"
+ :enable-traffic="false"
+ @markertap="onMarkerTap"
+ @callouttap="onCalloutTap"
+ @controltap="onControlTap"
+ @regionchange="onRegionChange"
+ @tap="onMapTap"
+ class="map-webview"
+ ></map>
+
+ <view class="map-placeholder" v-if="!isMapLoaded">
+ <text>鍦板浘鍔犺浇涓�...</text>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ import { searchAddress, reverseGeocoder } from '@/api/map'
+
+ export default {
+ name: 'MapSelector',
+ props: {
+ // 鍒濆鍦板潃
+ initialAddress: {
+ type: String,
+ default: ''
+ }
+ },
+ data() {
+ return {
+ searchKeyword: '',
+ searchResults: [], // 纭繚杩欐槸鍝嶅簲寮忔暟鎹�
+ selectedAddress: null,
+ isMapLoaded: false,
+ showSearchResults: false, // 鎺у埗鏄惁鏄剧ず鎼滅储缁撴灉
+ searchCompleted: false, // 鏍囪鎼滅储鏄惁瀹屾垚
+ showDebug: true, // 璋冭瘯寮�鍏�
+ // 鍦板浘鐩稿叧
+ longitude: 113.324520,
+ latitude: 23.099994,
+ markers: [],
+ polyline: [],
+ circles: [],
+ controls: [],
+ includePoints: [],
+ isGettingLocation: false, // 鏄惁姝ｅ湪鑾峰彇浣嶇疆
+ // 闃叉鑷姩鑱氱劍鐨勬爣蹇�
+ shouldPreventAutoFocus: true
+ }
+ },
+ mounted() {
+ console.log('鍦板浘閫夋嫨鍣ㄧ粍浠跺凡鎸傝浇');
+
+ // 妫�鏌PI Key鏄惁宸查厤缃�
+ if (!this.isTencentMapKeyConfigured()) {
+ console.error('[system] Map key not configured.')
+ this.$modal.showToast('鍦板浘API Key鏈厤缃紝璇疯仈绯荤鐞嗗憳')
+ return
+ }
+
+ // 鍒濆鍖栧湴鍥�
+ this.initMap()
+
+ // 寤惰繜澶勭悊鍒濆鍦板潃锛岄伩鍏嶈法鍩熼棶棰�
+ if (this.initialAddress) {
+ this.searchKeyword = this.initialAddress
+ // 涓嶅啀灏濊瘯鑷姩鑱氱劍锛岄伩鍏嶈法鍩熼棶棰�
+ // 鐢ㄦ埛闇�瑕佹墜鍔ㄧ偣鍑昏緭鍏ユ鎵嶈兘鑱氱劍
+ }
+
+ // 寤惰繜涓�娈垫椂闂村悗鍏佽鑷姩鎿嶄綔锛堝鏋滈渶瑕佺殑璇濓級
+ setTimeout(() => {
+ this.shouldPreventAutoFocus = false
+ }, 1000)
+ },
+ methods: {
+ // 妫�鏌ヨ吘璁湴鍥続PI Key鏄惁宸查厤缃�
+ isTencentMapKeyConfigured() {
+ // 瀵逛簬鍚庣浠ｇ悊鏂瑰紡锛屽墠绔笉鍐嶉渶瑕佹鏌ey閰嶇疆
+ return true
+ },
+
+ // 鎼滅储妗嗚幏寰楃劍鐐逛簨浠�
+ onSearchFocus() {
+ // 鐢ㄦ埛涓诲姩鑱氱劍锛屼笉浼氳Е鍙戣法鍩熼棶棰�
+ console.log('鎼滅储妗嗚幏寰楃劍鐐�')
+ // 閲嶇疆闃茶仛鐒︽爣蹇�
+ this.shouldPreventAutoFocus = false
+ },
+
+ // 鑾峰彇褰撳墠浣嶇疆
+ getCurrentLocation() {
+ if (this.isGettingLocation) {
+ return
+ }
+
+ this.isGettingLocation = true
+ this.$modal.showToast('姝ｅ湪鑾峰彇褰撳墠浣嶇疆...')
+
+ uni.getLocation({
+ type: 'gcj02',
+ success: (res) => {
+ console.log('鑾峰彇浣嶇疆鎴愬姛:', res)
+ this.handleLocationSuccess(res.longitude, res.latitude)
+ this.isGettingLocation = false
+ },
+ fail: (error) => {
+ console.error('鑾峰彇浣嶇疆澶辫触:', error)
+ this.$modal.showToast('鑾峰彇浣嶇疆澶辫触锛岃妫�鏌ュ畾浣嶆潈闄�')
+ this.isGettingLocation = false
+ }
+ })
+ },
+
+ // 澶勭悊浣嶇疆鑾峰彇鎴愬姛
+ handleLocationSuccess(longitude, latitude) {
+ // 鍙傛暟楠岃瘉
+ if (longitude === undefined || longitude === null || latitude === undefined || latitude === null) {
+ console.error('浣嶇疆鑾峰彇澶辫触锛屽弬鏁颁笉瀹屾暣', { longitude, latitude });
+ this.$modal.showToast('浣嶇疆鑾峰彇澶辫触');
+ return;
+ }
+
+ // 妫�鏌ュ弬鏁版湁鏁堟��
+ if (isNaN(longitude) || isNaN(latitude)) {
+ console.error('浣嶇疆鑾峰彇澶辫触锛屽潗鏍囧寘鍚潪娉曞��', { longitude, latitude });
+ this.$modal.showToast('浣嶇疆鑾峰彇澶辫触锛屽潗鏍囨棤鏁�');
+ return;
+ }
+
+ this.longitude = longitude
+ this.latitude = latitude
+
+ // 璁剧疆鏍囪
+ this.markers = [{
+ id: Date.now(),
+ longitude: longitude,
+ latitude: latitude,
+ title: '褰撳墠浣嶇疆',
+ iconPath: '/static/icons/location.png',
+ width: 30,
+ height: 30
+ }]
+
+ // 閫嗗湴鍧�瑙ｆ瀽
+ this.reverseGeocode(latitude, longitude, true)
+
+ this.$modal.showToast('宸插畾浣嶅埌褰撳墠浣嶇疆')
+ this.isMapLoaded = true
+ },
+
+ // 鍒濆鍖栧湴鍥�
+ initMap() {
+ // 鑾峰彇鐢ㄦ埛浣嶇疆
+ uni.getLocation({
+ type: 'gcj02',
+ success: (res) => {
+ // 鍙傛暟楠岃瘉
+ if (res.longitude === undefined || res.longitude === null ||
+ res.latitude === undefined || res.latitude === null) {
+ console.error('鍒濆鍖栧湴鍥炬椂浣嶇疆鑾峰彇澶辫触锛屽弬鏁颁笉瀹屾暣', res);
+ this.$modal.showToast('浣嶇疆鑾峰彇澶辫触');
+ this.isMapLoaded = true;
+ return;
+ }
+
+ // 妫�鏌ュ弬鏁版湁鏁堟��
+ if (isNaN(res.longitude) || isNaN(res.latitude)) {
+ console.error('鍒濆鍖栧湴鍥炬椂浣嶇疆鑾峰彇澶辫触锛屽潗鏍囧寘鍚潪娉曞��', res);
+ this.$modal.showToast('浣嶇疆鑾峰彇澶辫触锛屽潗鏍囨棤鏁�');
+ this.isMapLoaded = true;
+ return;
+ }
+
+ this.longitude = res.longitude
+ this.latitude = res.latitude
+
+ // 璁剧疆榛樿鏍囪
+ this.markers = [{
+ id: 0,
+ longitude: this.longitude,
+ latitude: this.latitude,
+ title: '褰撳墠浣嶇疆',
+ iconPath: '/static/icons/location.png',
+ width: 30,
+ height: 30
+ }]
+
+ // 璁剧疆鍔犺浇鐘舵��
+ this.isMapLoaded = true
+ },
+ fail: () => {
+ // 璁剧疆鍔犺浇鐘舵��
+ this.isMapLoaded = true
+ this.$modal.showToast('鑾峰彇浣嶇疆澶辫触')
+ }
+ })
+ },
+
+ // 鍦板浘鐐瑰嚮浜嬩欢
+ onMapTap(e) {
+ // 鍦ㄧ偣鍑讳綅缃坊鍔犳爣璁�
+ const { longitude, latitude } = e.detail
+
+ // 鍙傛暟楠岃瘉
+ if (longitude === undefined || longitude === null || latitude === undefined || latitude === null) {
+ console.error('鍦板浘鐐瑰嚮浜嬩欢鍙傛暟涓嶅畬鏁�', { longitude, latitude });
+ this.$modal.showToast('浣嶇疆淇℃伅鑾峰彇澶辫触');
+ return;
+ }
+
+ this.markers = [{
+ id: Date.now(),
+ longitude,
+ latitude,
+ title: '閫変腑浣嶇疆',
+ iconPath: '/static/icons/location-selected.png',
+ width: 30,
+ height: 30
+ }]
+
+ // 閫嗗湴鍧�瑙ｆ瀽鑾峰彇鍦板潃淇℃伅
+ this.reverseGeocode(latitude, longitude)
+ },
+
+ // 閫嗗湴鍧�瑙ｆ瀽
+ reverseGeocode(lat, lng, isCurrentLocation = false) {
+ // 鍙傛暟楠岃瘉
+ if (lat === undefined || lat === null || lng === undefined || lng === null) {
+ console.error('閫嗗湴鍧�瑙ｆ瀽鍙傛暟涓嶅畬鏁达紝缂哄皯缁忕含搴﹀潗鏍�', { lat, lng });
+ this.$modal.showToast('鍙傛暟閿欒锛氱己灏戠粡绾害鍧愭爣');
+ return;
+ }
+
+ // 妫�鏌ュ弬鏁版湁鏁堟��
+ if (isNaN(lat) || isNaN(lng)) {
+ console.error('閫嗗湴鍧�瑙ｆ瀽鍙傛暟鏃犳晥锛屽潗鏍囧寘鍚潪娉曞��', { lat, lng });
+ this.$modal.showToast('鍙傛暟閿欒锛氬潗鏍囨牸寮忔棤鏁�');
+ return;
+ }
+
+ // 浣跨敤鍚庣浠ｇ悊鎺ュ彛杩涜閫嗗湴鍧�瑙ｆ瀽
+ reverseGeocoder(lat, lng).then(res => {
+ if (res.code === 200) {
+ // 瑙ｆ瀽鍚庣杩斿洖鐨勮吘璁湴鍥続PI鍝嶅簲
+ const responseData = typeof res.data === 'string' ? JSON.parse(res.data) : res.data;
+ if (responseData && responseData.status === 0 && responseData.result) {
+ const result = responseData.result
+ this.selectedAddress = {
+ title: isCurrentLocation ? '褰撳墠浣嶇疆' : (result.address || '閫変腑浣嶇疆'),
+ address: result.address || `缁忕含搴�: ${lat.toFixed(6)}, ${lng.toFixed(6)}`,
+ lat: lat,
+ lng: lng
+ }
+ } else {
+ this.selectedAddress = {
+ title: isCurrentLocation ? '褰撳墠浣嶇疆' : '閫変腑浣嶇疆',
+ address: `缁忕含搴�: ${lat.toFixed(6)}, ${lng.toFixed(6)}`,
+ lat: lat,
+ lng: lng
+ }
+ }
+ } else {
+ this.selectedAddress = {
+ title: isCurrentLocation ? '褰撳墠浣嶇疆' : '閫変腑浣嶇疆',
+ address: `缁忕含搴�: ${lat.toFixed(6)}, ${lng.toFixed(6)}`,
+ lat: lat,
+ lng: lng
+ }
+ }
+ }).catch(error => {
+ console.error('閫嗗湴鍧�瑙ｆ瀽澶辫触:', error)
+ this.$modal.showToast('鍦板潃瑙ｆ瀽澶辫触锛�' + (error.message || '璇风◢鍚庨噸璇�'))
+ this.selectedAddress = {
+ title: isCurrentLocation ? '褰撳墠浣嶇疆' : '閫変腑浣嶇疆',
+ address: `缁忕含搴�: ${lat.toFixed(6)}, ${lng.toFixed(6)}`,
+ lat: lat,
+ lng: lng
+ }
+ })
+ },
+
+ // 鎼滅储鍦板潃 - 鍙湪鐐瑰嚮鎼滅储鎸夐挳鏃惰皟鐢�
+ searchAddress() {
+ console.log('鎵ц鎼滅储锛屽叧閿瘝:', this.searchKeyword);
+ if (!this.searchKeyword) {
+ this.$modal.showToast('璇疯緭鍏ュ湴鍧�')
+ return
+ }
+
+ // 浣跨敤鍚庣浠ｇ悊鎺ュ彛杩涜鍦板潃鎼滅储
+ this.searchAddressViaBackend()
+ },
+
+ // 閫氳繃鍚庣浠ｇ悊鎼滅储鍦板潃
+ searchAddressViaBackend() {
+ // 鏄剧ず鎼滅储缁撴灉鍖哄煙
+ this.showSearchResults = true;
+ this.searchCompleted = false;
+
+ console.log('寮�濮嬫悳绱㈠湴鍧�:', this.searchKeyword);
+
+ searchAddress(this.searchKeyword, '骞垮窞').then(res => {
+ console.log('鍦板潃鎼滅储杩斿洖缁撴灉:', res);
+ // 纭繚姝ｇ‘鏇存柊鎼滅储缁撴灉
+ this.searchResults = [];
+
+ if (res.code === 200) {
+ // 瑙ｆ瀽鍚庣杩斿洖鐨勮吘璁湴鍥続PI鍝嶅簲
+ const responseData = typeof res.data === 'string' ? JSON.parse(res.data) : res.data;
+ console.log('瑙ｆ瀽鍚庣殑鍝嶅簲鏁版嵁:', responseData);
+
+ if (responseData && responseData.status === 0 && responseData.data && responseData.data.length > 0) {
+ // 鐩存帴璧嬪�兼暟缁勶紝纭繚鍝嶅簲寮忔洿鏂�
+ this.searchResults = responseData.data.map(item => ({
+ title: item.title,
+ address: item.address,
+ lat: item.location.lat,
+ lng: item.location.lng
+ }));
+ console.log('澶勭悊鍚庣殑鎼滅储缁撴灉:', this.searchResults);
+
+ // 娣诲姞璋冭瘯淇℃伅
+ console.log('鎼滅储缁撴灉鏁伴噺:', this.searchResults.length);
+ console.log('showSearchResults:', this.showSearchResults);
+ console.log('v-if鏉′欢缁撴灉:', this.showSearchResults && this.searchResults.length > 0);
+ } else {
+ console.log('鏈壘鍒扮浉鍏冲湴鍧�');
+ // 鍗充娇娌℃湁鏁版嵁涔熻鏄剧ず"鏈壘鍒扮浉鍏冲湴鍧�"
+ this.searchCompleted = true;
+ }
+ } else {
+ console.log('鎼滅储澶辫触锛岄敊璇唬鐮�:', res.code);
+ this.$modal.showToast('鎼滅储澶辫触锛岃閲嶈瘯')
+ }
+
+ // 鏍囪鎼滅储瀹屾垚
+ this.searchCompleted = true;
+ }).catch(error => {
+ console.error('鎼滅储澶辫触:', error)
+ this.$modal.showToast('鎼滅储澶辫触锛岃閲嶈瘯')
+ // 鏍囪鎼滅储瀹屾垚
+ this.searchCompleted = true;
+ })
+ },
+
+ // 閫夋嫨鍦板潃
+ selectAddress(item) {
+ this.selectedAddress = item
+ this.markLocation(item.lat, item.lng)
+
+ // 閫変腑鍦板潃鍚庯紝淇濇寔鎼滅储缁撴灉鍒楄〃鏄剧ず
+ console.log('鍦板潃宸查�変腑:', item);
+ },
+
+ // 鍦ㄥ湴鍥句笂鏍囪浣嶇疆
+ markLocation(lat, lng) {
+ this.longitude = lng
+ this.latitude = lat
+ this.markers = [{
+ id: Date.now(),
+ longitude: lng,
+ latitude: lat,
+ title: this.selectedAddress?.title || '閫変腑浣嶇疆',
+ iconPath: '/static/icons/location-selected.png',
+ width: 30,
+ height: 30
+ }]
+ },
+
+ // 纭閫夋嫨鍦板潃
+ confirmAddress() {
+ if (!this.selectedAddress) {
+ this.$modal.showToast('璇峰厛閫夋嫨鍦板潃')
+ return
+ }
+
+ // 鏄剧ず纭鎻愮ず
+ this.$modal.showToast('鍦板潃閫夋嫨鎴愬姛')
+
+ // 瑙﹀彂浜嬩欢锛屽皢閫変腑鐨勫湴鍧�浼犻�掔粰鐖剁粍浠�
+ this.$emit('addressSelected', {
+ title: this.selectedAddress.title,
+ address: this.selectedAddress.address,
+ lat: this.selectedAddress.lat,
+ lng: this.selectedAddress.lng
+ })
+
+ // 纭鍚庨殣钘忔悳绱㈢粨鏋滃拰閫変腑鍦板潃鐣岄潰
+ setTimeout(() => {
+ this.selectedAddress = null
+ this.showSearchResults = false
+ this.searchResults = []
+ }, 1000)
+ },
+
+ // 鍙栨秷閫夋嫨鍦板潃
+ cancelSelection() {
+ this.selectedAddress = null
+ // 鍙竻绌洪�変腑鍦板潃锛屼笉娓呯┖鎼滅储缁撴灉
+ // this.showSearchResults = false
+ // this.searchResults = []
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ .map-selector-container {
+ width: 100%;
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+
+ .search-bar {
+ display: flex;
+ padding: 15rpx 20rpx;
+ background-color: white;
+ flex-shrink: 0;
+ position: relative;
+ z-index: 100; /* 鎻愰珮灞傜骇 */
+
+ .search-input {
+ flex: 1;
+ height: 70rpx;
+ padding: 0 20rpx;
+ border: 1rpx solid #eee;
+ border-radius: 10rpx;
+ font-size: 28rpx;
+ }
+
+ .search-btn {
+ width: 120rpx;
+ height: 70rpx;
+ margin-left: 20rpx;
+ background-color: #007AFF;
+ color: white;
+ border-radius: 10rpx;
+ font-size: 28rpx;
+ }
+
+ .location-btn {
+ width: 70rpx;
+ height: 70rpx;
+ margin-left: 10rpx;
+ background-color: #1AAD19;
+ color: white;
+ border-radius: 10rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ &:active {
+ background-color: #179B16;
+ }
+
+ &[disabled] {
+ background-color: #ccc;
+ opacity: 0.6;
+ }
+ }
+ }
+
+ .debug-panel {
+ padding: 15rpx 20rpx;
+ background-color: #fff3cd;
+ border: 1rpx solid #ffeaa7;
+ z-index: 100; /* 鎻愰珮灞傜骇 */
+ position: relative;
+
+ .debug-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 10rpx;
+
+ .debug-title {
+ font-weight: bold;
+ color: #856404;
+ }
+
+ .debug-toggle {
+ font-size: 24rpx;
+ padding: 5rpx 10rpx;
+ background-color: #ffc107;
+ border: none;
+ border-radius: 5rpx;
+ }
+ }
+
+ .debug-content {
+ font-size: 24rpx;
+ color: #856404;
+
+ text {
+ display: block;
+ margin-bottom: 5rpx;
+ word-break: break-all;
+ }
+ }
+ }
+
+ /* 鍦板潃鎼滅储缁撴灉鍒楄〃 - 璋冩暣浣嶇疆 */
+ .address-list {
+ max-height: 40vh;
+ min-height: 200rpx;
+ overflow-y: auto;
+ background-color: white;
+ position: absolute;
+ top: 300rpx; /* 鍦ㄩ�変腑鍦板潃鐣岄潰涓嬫柟鏄剧ず */
+ left: 0;
+ right: 0;
+ z-index: 90; /* 纭繚鍦ㄥ湴鍥句笂鏂� */
+ box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
+
+ .address-item {
+ padding: 25rpx 30rpx;
+ border-bottom: 1rpx solid #f0f0f0;
+ min-height: 100rpx;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+
+ .address-title {
+ font-size: 32rpx;
+ font-weight: bold;
+ margin-bottom: 8rpx;
+ color: #333;
+ line-height: 1.3;
+ }
+
+ .address-detail {
+ font-size: 28rpx;
+ color: #666;
+ line-height: 1.4;
+ }
+ }
+ }
+
+ /* 鏃犵粨鏋滄彁绀� - 璋冩暣浣嶇疆 */
+ .no-results {
+ padding: 30rpx;
+ text-align: center;
+ background-color: white;
+ color: #999;
+ font-size: 28rpx;
+ position: absolute;
+ top: 150rpx; /* 璋冩暣浣嶇疆 */
+ left: 0;
+ right: 0;
+ z-index: 90; /* 纭繚鍦ㄥ湴鍥句笂鏂� */
+ box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
+ min-height: 200rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .map-container {
+ flex: 1;
+ min-height: 50vh;
+ max-height: 70vh;
+ position: relative;
+
+ .map-webview {
+ width: 100%;
+ height: 100%;
+ }
+
+ // 鍦板浘鏍峰紡
+ map {
+ width: 100%;
+ height: 100%;
+ }
+
+ .map-placeholder {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ background-color: #f5f5f5;
+ font-size: 28rpx;
+ color: #999;
+ }
+ }
+
+ .selected-address {
+ padding: 20rpx 30rpx;
+ background-color: white;
+ border-top: 1rpx solid #f0f0f0;
+ flex-shrink: 0;
+ position: absolute;
+ top: 150rpx; /* 鍦ㄦ悳绱㈡爮涓嬫柟鏄剧ず */
+ left: 0;
+ right: 0;
+ z-index: 95; /* 纭繚鍦ㄥ湴鍥句笂鏂� */
+ box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
+
+ .selected-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 15rpx;
+
+ .address-title {
+ font-size: 28rpx;
+ font-weight: bold;
+ color: #007AFF;
+ margin-left: 10rpx;
+ }
+
+ .cancel-btn {
+ width: 40rpx;
+ height: 40rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 50%;
+ background-color: #f5f5f5;
+
+ &:active {
+ background-color: #e0e0e0;
+ }
+ }
+ }
+
+ .address-info {
+ background-color: #f8f9fa;
+ padding: 25rpx;
+ border-radius: 12rpx;
+ margin-bottom: 20rpx;
+
+ .address-name {
+ font-size: 32rpx;
+ font-weight: bold;
+ color: #333;
+ margin-bottom: 10rpx;
+ line-height: 1.3;
+ }
+
+ .address-detail {
+ font-size: 28rpx;
+ color: #666;
+ line-height: 1.5;
+ }
+ }
+
+ .confirm-btn {
+ width: 100%;
+ height: 80rpx;
+ background-color: #007AFF;
+ color: white;
+ border-radius: 10rpx;
+ font-size: 32rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ text {
+ margin-left: 10rpx;
+ }
+
+ &:active {
+ background-color: #0056CC;
+ }
+ }
+ }
+ }
+</style>
\ No newline at end of file
--
Gitblit v1.9.1