diff --git a/addons/address/bootstrap.js b/addons/address/bootstrap.js index 655162d..727c612 100644 --- a/addons/address/bootstrap.js +++ b/addons/address/bootstrap.js @@ -11,8 +11,19 @@ require([], function () { var lat = lat_id ? $("#" + lat_id).val() : ''; var lng = lng_id ? $("#" + lng_id).val() : ''; var zoom = zoom_id ? $("#" + zoom_id).val() : ''; - var url = "/addons/address/index/select"; - url += (lat && lng) ? '?lat=' + lat + '&lng=' + lng + (input_id ? "&address=" + $("#" + input_id).val() : "") + (zoom ? "&zoom=" + zoom : "") : ''; + var address = input_id ? $("#" + input_id).val() : ($(that).data("address") || ''); + var query = []; + if (lat && lng) { + query.push('lat=' + encodeURIComponent(lat)); + query.push('lng=' + encodeURIComponent(lng)); + } + if (address) { + query.push('address=' + encodeURIComponent(address)); + } + if (zoom) { + query.push('zoom=' + encodeURIComponent(zoom)); + } + var url = "/addons/address/index/select" + (query.length ? '?' + query.join('&') : ''); Fast.api.open(url, '位置选择', { callback: function (res) { input_id && $("#" + input_id).val(res.address).trigger("change"); diff --git a/addons/address/view/index/tencent.html b/addons/address/view/index/tencent.html index 89df386..58ba97a 100644 --- a/addons/address/view/index/tencent.html +++ b/addons/address/view/index/tencent.html @@ -9,6 +9,7 @@ body { margin: 0; padding: 0; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif; } #container { @@ -19,72 +20,173 @@ bottom: 0; } - .confirm { - position: absolute; - bottom: 30px; - right: 4%; - z-index: 99; - height: 50px; - width: 50px; - line-height: 50px; - font-size: 15px; - text-align: center; - background-color: white; - background: #1ABC9C; - color: white; - border: none; - cursor: pointer; - border-radius: 50%; - } - .search { position: absolute; - width: 400px; - top: 0; + width: 440px; + max-width: 92%; + top: 12px; left: 50%; - padding: 5px; - margin-left: -200px; + transform: translateX(-50%); + z-index: 100; + background: #fff; + border-radius: 8px; + box-shadow: 0 4px 16px rgba(15, 23, 42, 0.14); + padding: 4px; + } + + .search .form-control { + border: none; + box-shadow: none; + height: 36px; + font-size: 13px; + } + + .search .btn-success { + background: #00d26a; + border-color: #00d26a; + height: 36px; + border-radius: 6px !important; + padding: 0 14px; + } + + .search .btn-success:hover { + background: #00a854; + border-color: #00a854; + } + + .map-tip-banner { + position: absolute; + top: 64px; + left: 50%; + transform: translateX(-50%); + z-index: 90; + background: rgba(15, 23, 42, 0.75); + color: #fff; + font-size: 12px; + padding: 5px 14px; + border-radius: 20px; + pointer-events: none; + white-space: nowrap; + } + + .selected-panel { + position: absolute; + left: 16px; + right: 16px; + bottom: 16px; + z-index: 99; + background: #ffffff; + border-radius: 10px; + box-shadow: 0 6px 24px rgba(15, 23, 42, 0.16); + padding: 12px 16px; + display: flex; + align-items: center; + justify-content: space-between; + gap: 14px; + } + + .selected-panel__info { + flex: 1; + min-width: 0; + } + + .selected-panel__addr { + font-size: 14px; + font-weight: 600; + color: #1e293b; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + margin-bottom: 3px; + } + + .selected-panel__coord { + font-size: 12px; + color: #64748b; + } + + .confirm { + flex-shrink: 0; + height: 38px; + padding: 0 22px; + line-height: 38px; + font-size: 14px; + font-weight: 600; + text-align: center; + background: linear-gradient(135deg, #00e070, #00a854); + color: #ffffff; + border: none; + cursor: pointer; + border-radius: 8px; + box-shadow: 0 4px 12px rgba(0, 210, 106, 0.28); + transition: filter 0.15s ease; + } + + .confirm:hover { + filter: brightness(0.96); } .autocomplete-search { text-align: left; cursor: default; background: #fff; - border-radius: 2px; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - background-clip: padding-box; + border-radius: 8px; + box-shadow: 0 8px 24px rgba(15, 23, 42, 0.16); position: absolute; display: none; z-index: 1036; - max-height: 254px; + max-height: 280px; overflow: hidden; overflow-y: auto; box-sizing: border-box; + margin-top: 4px; } .autocomplete-search .autocomplete-suggestion { - padding: 5px; + padding: 8px 12px; + font-size: 13px; + color: #1e293b; + border-bottom: 1px solid #f1f5f9; + cursor: pointer; } - .autocomplete-search .autocomplete-suggestion:hover { - background: #f0f0f0; + .autocomplete-search .autocomplete-suggestion:last-child { + border-bottom: none; + } + + .autocomplete-search .autocomplete-suggestion:hover, + .autocomplete-search .autocomplete-suggestion.selected { + background: #f2fef7; + color: #00a854; + } + + .autocomplete-suggestion__sub { + display: block; + font-size: 11px; + color: #94a3b8; + margin-top: 2px; } -
确定
+
直接点击地图任意位置或拖动红标即可选点
+
+
+
点击地图选择位置...
+
坐标:--
+
+ +
@@ -94,72 +196,274 @@